新機能　Spry

DreamWeaverCS3（DW-CS3）は、スタイルシート編集機能に徹するとともに、「Ajax」※1） の編集機能「Spry」およびそのテンプレートが付属した。
その結果、HomepageBuilder（HB）との相互編集はかなり失われたようだ。

従来、DreamWeaver（DW） では MX/Ver4 の間では相互編集は何ら問題はなかった。
さらに、HomepageBuilder（HB）との間でも HB固有の「どこでも配置モード」を除きDWとの相互編集ができた。
しかし、今回DW-CS3で採用された、「Ajax」編集機能は、今のところ DW-ＣＳ3だけが対応しているので他のソフトへの互換性はない。
もちろん、「Ajax」以外の部分では互換性はあるが、FlashなどDW-ＣＳ3で編集したファイルは、自動的に「Ajax」が挿入される場合があり
この場合はSpryライブラリも転送する必要があるのでFTPに注意が必要である。

「Spry」デモおよびそのテンプレートの「Widget」の殆どは従来の JavaScript でできるし編集も既製 JavaScript を使った方が簡単である。　「Widget」は未完成で編集中のちょっとした操作ミスでしばしばフリーズ状態となる。　しかし、　従来の JavaScript では I E 以外では動作しない場合があるが「Spry」はブラウザ依存性はないようだ。

---

※1）「Ajax」：Asynchronous JavaScript XML の略。
既存技術のHTML、CSS (スタイルシート)、 JavaScriptを組合せたもので、プログラムをライブラリとしてパッケージ化し、いちいち端末で動作させずサーバーで処理して送り返すので高速化する らしいが・・・・よう分からん。
解説は下記サイト参照
http://www.openspc2.org/JavaScript/Ajax/Ajax_study/chapter01/001/
http://d.hatena.ne.jp/keyword/Ajax
http://ja.wikipedia.org/wiki/Ajax

「Spry」とは、「Ajax」※1）を視覚化して簡単に作成できるようにしたDreamWeaverCS3（DW-CS3）の機能である。　
さらに、Widget と称するいくつかの Spryのテンプレート サンプルも DW-CS 上で利用できる。
またネット上には「Spry」のデモギャラリがあり、これをダウンロードして利用できる。
http://labs.adobe.com/technologies/spry/demos/

しかし、実際に役立つサンプルはあまりない。
Spryは結局はJavaScript の応用だからネット上で篤志家が公開しているJavaScript サンプルのほうが役立つ場合が多い。

Spry の例

1）付属テンプレート（Widget）の利用

　●メニューバー(Popup メニュー)と、切替パネル３種
　●検査機能付フォーム　（ユーザが正しく入力しない場合に警告表示がでる）
　　　・テキストフィールド、テキスト領域、選択ボタン、チェックボックス、の４種
　●その他
　　　・XMLデータセット　　・領域　　・リピート　　・リピートリスト　　・テーブル　が使える。
　　　　テーブルでは Excel 表のように並び替えができるようだ。これらはXML の応用で難しく、よう分からん。(>_<)

2）Demoサンプルの応用
　●画像Effect 試作
　●Gallery　試作

3）ネット情報
　　・Adobe社 Demo　　　　・Video解説

・これら、Spryのテンプレートやデモは日本語化対応が不十分で、とても使いにくい。　設定のCSSファイルも説明は全て英文である。
僅かの操作ミスで編集不能となったり動作しなくなり、コードレベルの修正が必要となる。
・Spry 切替パネル内のコンテンツにアンカー設定しても無効になる。
・「Widget は初心者でも使える」と称しながら、ちょっとした操作ミスで「壊れました。コードを修正してください」のメッセージが表記される。　こりゃなんじゃあ！

ファイル操作の注意

Spryでは編集時にパッケージ化したライブラリのフォルダ「Scripts」や「SpryAssets」が自動的に生成する。　その結果、ファイルを別のフォルダに移動させるとライブラリとのパスが変わって動作しなくなる場合がある。　ファイルは複数のライブラリを参照する場合があるのでパス変更には注意が必要である。

またライブラリは他のファイルも共通で利用するから勝手に移動させると他のファイルの動作に影響する。　即ち最初にSpryファイルを作成する時は全く独立した別のフォルダで作成してライブラリとともに移動させるか、あるいは予定フォルダで作成する必要がある。　むやみに隣のフォルダに移動させたりフォルダ名を変更させてはならない。

Widget のオプション設定法は編集画面左下にある「カストマイズ」に説明がある。　メニューバーの背景色設定などはルートフォルダ「SpryAssets」内の ***.css ファイル　にある。

FTPの注意

DreamWeaver CS3 ではFlash のような動的ファイルの扱いが変わり、ライブラリファイル「AC_RunActiveContent.js」を使用するようになった。
そのため、DreamWeaver 旧Version、あるいは他のソフトで編集した、Flash入りファイルの場合とファイル内の記述（※1）が異なるので要注意である。
Flash のような動的ファイルを FTPする場合：

1. CS3 で編集　→　CS3内蔵FTPツールで転送：　ライブラリファイルも自動転送されるので問題ない。
2. CS3 で編集　→　他のFTPツールで転送：　ライブラリファイル「AC_RunActiveContent.js」を同時に転送する必要がある。
   このファイルを転送しないとFlashは動作しない。
3. CS3 以外で編集　→　CS3内蔵FTPツールで転送：　新形式ファイルに変換するか？　の質問が表示される。（※2）
   ここで「Yes」と応じると、CS3 で編集したと同じ記述が挿入され、1.の CS3 で編集と同じ扱いになる。
   「No」と応じれば全て従来のFlashと同じ扱いになり、この場合も特に支障はない。

広告入り無料サイトでの使用

広告入り無料サイトで使用すると、広告が画像に干渉して表示不全になる場合がある。
　　→ その例

---

※1）
ＣＳ3では、<object>の前に例えば、下記コードが挿入する。　
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0','width','600','height','200','src','gan-golf','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','gan-golf' ); //end AC code
</script><noscript>

※2）
「このページに含まれる<Object>タグはInternet Explorer で正常に機能しない可能性があります。・・・・これらのタグをDreamweaverで自動変換しますか。」 のメッセージが表示される。 ここで「Yes」を選択すると（※1）のコードが挿入される。
この場合、同時にルートパスにフォルダー「Script」とその中にライブラリファイル「AC_RunActiveContent.js」も生成する。　FTPでは、このライブラリファイルも転送する必要がある。

その他のテンプレート

CSSレイアウト

同期情報　_notes について

これ、画像に関わる編集日時などの情報らしい。　不要。　
http://www.yusk.org/memo/dreamweaver/no_notes.html
外すには各サーバーで
サイト > サイトの管理 > 編集 > リモート情報　 の「同期情報の保持」のチェックを外す。

関連ソフト

Adobe Web PremiumCS3 付属
・DreamWeaver
・Flash
・FireWorks
・Photoshop
・Illustrator
・Acdobat professional
・Acrobat distiller　（画像優先）

・Bridge：　PC内のフォルダ中身が一覧でき写真もサムネール表示される。
・Contribute：　ブログやHPが簡単に編集できるらしいが詳細不明。
・Device central：　モバイル用編集
・Extend script toolkit2：　JavaScript 編集（山本さん用）
・Extention manager：　DreamWeaver/FireWorks/Flash の拡張。詳細不明
・Livecycle designer：　アンケートフォーム作成
・Stock photo：　サイト上での写真保存（近く終了らしい）
・Flash video encoder：　Video とFlashの連携