オブジェクト

1999/12/25
s=====================================================[ No.02 1999/12/25 ]==

                Dreamweaver Programming < オブジェクト >

                                                            [ BACK NUMBER ]
                                 http://www.game3rd.com/
===========================================================================

◆Dreamweaver3日本語版も
===========================================================================
 マクロメディアの日本サイトでも発表したようです。アップグレードすると
Fireworks3もついてくるのでかなりお得です。Fireworksと連携して使うのが
当たり前になるんでしょうね。

http://www.macromedia.com/jp/software/dreamweaver/studio/


◆オブジェクト
===========================================================================
 オブジェクトはダイアログ開きパラメータを入力し、そのパラメータを元にタグ
を自動生成しページにコンテンツを挿入します。ページ作成には欠かせない存在で
す。

日本サイトだとあまり見かけないんですが(^^;、サイトでオブジェクトやビヘイビ
アを公開しているサイトが海外だとよく見かけます。(*1)ここでダウンロードして
使う方法を紹介します。

まずファイルをダウンロードして下さい。
http://www.game3rd.com/object.zip (Windows)
http://www.game3rd.com/object.sit (Mac)

中に二つのファイルが入っています。
FSで子ウインドウ.htm
FSで子ウインドウ.gif

 HTMLファイルはオブジェクトの挿入のための記述をしています。また、GIFファイ
ルは18x18のサイズでオブジェクトウィンドウに表示されるアイコンになります。
インストール先は、Configuration/Objectsの下のフォルダ内にインストールしま
す。インストールする場所は以下のようにおく場所が決まっているので、今回のオ
ブジェクトは不可視のものなので、Invisiblesにインストールします。

()はDreamweaver2での名前です。()がないのは3から追加されたフォルダです。

Objects
	|
	+ Characters
	|	記号を挿入する ©など
	+ Common(一般)
	|	画像やテーブル、レイヤーなどよく使うオブジェクト
	+ Forms(フォーム)
	|	フォームのフィールド項目
	+ Frames
	|	フレーム
	+ Head(ヘッド)
	|	ヘッダ
	+ Invisibles(不可視)
	|	コメントなど、表示する必要のないオブジェクト

InvisiblesにコピーしてDreamweaverを起動すると不可視のオブジェクトにアイコ
ンが追加されているのがわかると思います。

 このオブジェクトの使い方ですが、これはFlashムービーからFSCommandを使って
固定サイズのウィンドウを開くためのスクリプトを挿入するオブジェクトです。使
うためにはFlashムービーを配置している必要があります。配置していない場合は
警告がでます。どのムービーから呼び出すか、ウィンドウの高さと幅、ウィンドウ
を開く条件を入力してOKを押すとスクリプトが追加されています。

インストールして使うのは簡単だというのわかったと思います。このように自分で
はなかなかできないことが、簡単にできてしまうのがDreamweaverのカスタマイズ
です。次にオブジェクトの作成方法を説明します。

今回説明したオブジェクトはJavaScriptとフォームを使ったオブジェクトです。
これを実際どうやって作成しているか紹介します。

中のファイルはこんな感じです。

<html>
<head>
<title></title>
<script language="JavaScript">

function objectTag()

function InitSelect()

</script>
</head>
<body onLoad="InitSelect()">
<form name="theForm">

</form>
</body>
</html>

パラメータを入力する必要があるので、入力フォームがあります。
(<form name=の部分です。)また、呼び出し時にFlashムービーの存在を調べる
ためにbodyのonload時にInitSelect関数を呼んでます。

InitSelect()関数では

embedtagArray = getObjectTags( "document", "embed" );
objtagArray = getObjectTags( "document", "object" );

を最初に呼び出し、getObjectTags(*2)を使い、document内のembedとobjectの
すべてのリストを取得しています。次に名前とIDの属性のついたFlashムービーを
調べ、リストボックスに追加しています。

var objname = getParam( objtagArray[ i ],"id" );
if( objname == name )
	document.theForm.shockObj.options[ i ]= new Option( name );
else
	document.theForm.shockObj.options[ i ]= new Option( "名前の定義が不正
です!" );

両方に名前が付いてない場合は名前の定義が不正と処理してます。

こうやって、Onloadイベントで、あらかじめオブジェクトの設定を行っておくよう
にします。よく使う手でビヘイビア、コマンドでも使われてます。

次にOKボタンを押したときの処理です。オブジェクトの終了時にはobjectTag()関
数が呼ばれるようになっています。この戻り値が挿入される文字列となります。

function objectTag()
{
	var command = document.theForm.Comm.value;
	var args = document.theForm.Args.value;
	var OpenFile = document.theForm.openfile.value;
	var wWidth = document.theForm.wWidth.value;
	var wHeight = document.theForm.wHeight.value;

この部分では、フォームに入力された値を変数に代入しています。
そして、この値を使って文字列を作成しています。

var str;

str = "<script language=\"VBScript\">\n"
+ "sub " + FlashObj + "_FSCommand(ByVal command, ByVal args)\n"
+ "  call " + FlashObj + "_DoFSCommand(command, args)\n"
+ "end sub\n"
+ "<\/script>"
+ "<script language=\"JavaScript\">\n\n"
+ "function " + FlashObj + "_DoFSCommand(command, args)\n"
+ "{\n"
+ "\tif(command==\"" + command + "\"&&args==\"" + args + "\")\n"
+ "\t\twindow.open(\"" + OpenFile + "\",\"_blank\",\"width="
+ wWidth+",height=" + wHeight + "\");\n"
+ "}\n\n"
+ "<\/script>\n";

最後に文字列を戻り値として返します。

return str;

パラメータ入力が必要のない場合は、<form>を用意せず、objectTag()を用意する
だけで挿入できます。<br>,<hr>のファイルを見てもらえばそうなっているのが
わかると思います。

または

<nobr>

と実際に挿入するタグを書いただけのファイルでもかまいません。
フォーム入力がない場合はこうするのが簡単だと思います。

これで、オブジェクトの説明は終わりです。次回は10日としたいのですが、
お正月休みということで(^^;、15日に発行しようと思います。

(*1) Dreamweaver Ring
http://www.webring.org/cgi-bin/webring?ring=dreamweaverring;list
海外の主要Dreamweaverサイトが登録されています。
僕のサイトも登録されてます。(^^;

(*2)getObjectTags()

解説

指定された複数のタグのインスタンス、もしくはタグが指定されないならドキュメ
ントにあるすべてのタグを指定したドキュメントから走査する。この機能は 
getElementsByTagNameを呼び出して、次に nodelist でそれぞれの要素に対して 
outerHTML を取得するのと等しい。
 
引数 sourceDoc*,tag1,tag2,...,tagN

 ▼第1引数は "document","document","parent","parent.frames[number]",
"parent.frames['frameName']", もしくはURLでなけれなならない。ドキュメント
がフォーカスを持ち、現在の選択された部分を 含んでいるドキュメントを指定
する。parent が親のframeset(現在選択されたドキュメントがフレームである) 
の場合は現在のドキュメントを含んでいるframesetの中で特定なフレームにある
parent.frame [number]と parent.frames['frameName']のドキュメントを指定す
る。引数が相対的なURLの場合、 それは拡張ファイルと 比較したものとなる。 

 ▼第2とそれに続く引数はタグ(例えば、"IMG","FORM","HR")の名前を与える。 
 
戻り値 

文字列の配列、指定されたドキュメントで指定されたブラウザにあったそれぞれ
要求したタグで 名前の付いたインスタンス。

 ▼もしタグの引数の中でLAYERであるなら、関数はすべてのレイヤとILAYER タグ
と絶対位置で置いたすべてのDIVとSPANタグを返す。 

 ▼タグ引数がINPUTなら、関数はすべてのフォームエレメントを返す。特定の
フォームエレメントを取得するなら、INPUT/TYPEとする。TYPEはbutton,text,
radio,checkbox,password,textarea,select,hidden,reset,とsubmitである。 

引数の同じリストが getObjectRefs() に手渡される時、2つの関数は同じ長さ
持っている配列を返す。 


◆おまけ
===========================================================================
 メルマガエディタで、XML書き出しできたと思って喜んでたのに、Dreamweaver2で
読み込ませたら文章が切断されてしまいました。(/_;) Dreamweaver2のバグのよう
です。3で直ってるのを祈ります。

http://www2s.biglobe.ne.jp/~tomoChan/mmx/


===========================================================================

                        Dreamweaver Programming

    発行、編集: 植木 友浩 
    登録、解除: http://www.game3rd.com/

          注意: 記載された情報は各人の責任においてご利用ください。
                 この記事により生じるいかなる損害についても責任は
                 負いかねますのでご了承ください。

                     Copyright(C) 1999. Tomohiro Ueki. All rights reserved.
===============================================[ Magazine ID: 0000021775 ]=

                                                                 Thank you!
---------------------------------------------------------------------------
このメールマガジンは、インターネットの本屋さん『まぐまぐ』を利用して
発行しています。( http://www.mag2.com/ )
---------------------------------------------------------------------------


TOP > Dreamweaver> メールマガジン > オブジェクト