Spry and Dreamweaver CS3

Hi Spry:fans,

So finally, Dreamweaver CS3 is out the door and users are getting their first glimpse into the Spry support we build it. I thought I would take some time to talk about it and reply to some comments that have come in.

You may have noticed that Spry is prominently featured in this new release. Each leg of Spry is included in Dreamweaver: Effects, Widgets and Data, along with some features that are more subtle.

Spry Effects can be added through the Behaviors panel. Look for the Effects Menu in the Behaviors list. We made changes to DW and Spry to ensure that it will work with the new Spry 1.5 method of calling effects.

Widgets are a great example of the benefits of using Design View for editing widgets. The widgets like Accordion render as they would in a browser, collapsed correctly (notice the rendering difference from earlier versions of DW, where all the panels would be displayed open.) Using the eye icon, you can switch between panel for easy access to the panel content. Default panels can be set in the widget Property Inspectors. The validation widgets allow you to preview and set all the error messages in Design View.

Spry Data support allows users to create XML data sets and can see the data references in the Bindings panel. It’s a great way to preview the data set and allows you to drag and drop data references into Design View. Some common patterns are pre-built for you: Spry lists and tables can easily be added, as well as regions and repeat regions can be added to design view. More subtle are things like: A data reference will be translated (turns blue) when it is inside a spry:region. If the reference is not blue, it serves as a warning that the reference is not within a region. Data set names will be added and removed from the region as data references are added and removed from the region and DW knows when to use the shorthand version and the more formal version. In the tag selector, spry:regions will be noted by a light orange background color.

My favorite enhancements is the code hinting. We made some excellent improvements in this area. Within a tag, type ‘sp’ and you will see the spry attributes hinted. We have introduced dynamic code hinting. DW knows about the data sets and will hint them if you add spry:region=”. In a spry:region, type { and the available data references will be hinted. If 2 data sets are bound to the region, both sets of references will be hinted. Very nice! We also hint for writing data sets and widgets manually, including options. Code coloring makes it easy to see your Spry elements in the code.

Another subtle enhancement is in the way that we define these code hints. Now for the first time, all the Spry hints are contained in a single, extensible XML file. In previous versions, these hints would have had to be added to many files on a per tag basis. Now that they are contained in a single file, we can easily update this file to keep up with the latest Spry code. Users can edit this file as well, if desired.
DWApplication\configuration\CodeHints\SpryCodeHints.xml.

A few have asked about the version of Spry used in DW and how we will update in the future.

The version of Spry in DW CS3 is 1.4 plus a couple forward looking enhancements. As mentioned above, we made sure the effects will work with the 1.5 changes. We also fixed a couple bugs that we found between the release of 1.4 and when we finished DW.

We are working on a mechanism to update the Spry files via an extension or some other method. If you want to manually update the Spry js files that DW copies to the site, they are kept in Dreamweaver application\configuration\Shared\Spry\. BTW, the mechanism that copies the files to the local root folder is also a subtle new feature. There is also an option in the Site Definition that allows you to choose where the Spry files go in the site.

I will discuss other Spry features in more detail in the future.
Hope you like the new version of DW. Spry 1.5 is a few weeks away…

Thanks,
Don

P.S. After I posted this initially, I found this new video that shows many of the features I just discussed.
http://www.adobe.com/designcenter/video_workshop/?id=vid0167

12 Responses to Spry and Dreamweaver CS3

  1. Billy says:

    Adobe has does very well to build CSS and now Ajax into Dreamweaver. Dreamweaver continually evolves and stays up to date with latest Web trends – I can’t see any company knocking Dreamweaver off its perch for quite some time.

  2. jonny b says:

    Great software, but very poor service! 🙁

  3. Paul says:

    Ordering in about 5 minutes, great work team, I am looking forward to this jump in technology.

  4. Mike Rapp says:

    Adobe: One area that you really need to ramp up support on is using Spry/AJAX in templates and library items. There is almost no Q&A on the tricky requirements for placing javascript and styling of Spry items.

  5. Lee Booth says:

    Hi, I am trying to create a menubar but one of the items has 60 subheading so how can I add a scroll bar to the subheadings so it doesn’t drop off the page?If anybody could help I would appericate it.Kind RegardsLee

  6. Donald Booth says:

    It’s not pretty but this works for me:Add this style to the UL of the submenu:That should give you a good starting point.

  7. Caroline says:

    Am new to Dreamweaver CS3 & Spry/Ajax features. I purchased Adobe’s Classroom in a Book for Dreamweaver CS3 and, surprisingly, find it very poorly written — the lessons can not be completed due to errors and omissions in the book. Where do I go for better instruction on integrating Ajax with Spry?Many thanks,Caroline

  8. jack says:

    I found several bugs in DW CS3, when adobe will update DW CS3 ?thanks

  9. bleu says:

    spry widgets for menus is strange, it looks one way in IE and another in Firefox. whats up with that!

  10. ysvry says:

    great inovation, the bugs will get ironed out eventualy, I like the new possibilitys this offers. great work!

  11. jarekman says:

    Hi. – First – Sorry – but my English is not quite wellI have Adobe Creative Suite 3 Web Standard – legal of course – there is a 1,4 ver Spry. I’m a web designer. I make www sites to my clients (personal and commercial www sites) Please tell me Can I use 1,4 spry on commercial site for my clients? Can I use 1,5 ver. Spry with Dreamveaver? I dont/t understand quite well spry license (my Engish is bad). Are Spry free for commercial use? Free to use on commercial web site? and Ajax free too for commercial sites to my clients?If Spry is free – What can I do to legal use Spry 1,5 in www pages for my comercial clients? I must write something in html code on site where I using Spry? Autors? Credits? Info about Spry? I post this here – because I think that you are OK in this theme. Please – answer me.By the way – Spry OK! 🙂

  12. mark says:

    Dreamweaver CS3 has got terrible support: limited info on spry, plus cannot get through to support in the UK, even after calling the support line for over three days!Adobe reminds me of Quark service three years ago :-(((