このエントリはここまでです。このエントリでは、プログラムから Dreamweaver を操作して拡張する大まかな流れを伝えることを意図しています。ですので、プログラムや設定の内容は、後日、具体的に詳しく説明します。ということでしたので、引き続き "Objects\Text\EscapeHTML.htm" として保存した拡張機能のプログラム本体を説明します。
Dreamweaver 拡張機能は、コマンドという1つの操作を最小セットとしています。そのコマンドは、1つの HTML ファイルに対応し、その HTML ファイルの中の JavaScript を使って Dreamweaver を操作します。
<html>title 要素は、ツールバーのボタンのツールチップとして使われます。
<head>
<title>Escape HTML</title>
<script language="javascript">
// isDOMRequired
function isDOMRequired() {
return false;
}
// objectTag
function objectTag() {
var dom = dw.getDocumentDOM();
selection = dom.source.getSelection();
if (selection[0] == selection[1])
return;
var text = dom.source.getText(selection[0], selection[1]);
text = text.replace(/&/g, '&');
text = text.replace(/</g, '<');
text = text.replace(/>/g, '>');
text = text.replace(/"/g, '"');
text = text.replace(/'/g, ''');
return text;
}
</script>
</head>
<body></body>
</html>
isDOMRequired 関数は、ツールバーのボタンをクリックする前に、コードビューとデザインビューを同期するかどうかを指示するものです。編集中のコードをデザインに反映してからコマンドを実行するときは true を、反映しないときは false を返します。
今回は、コードビューを開きかつフォーカスがあるときのみ、コマンドを実行するよう制限しているので、false としています。この制限については、後日説明します。デザインビューかつその最新の編集結果を対象とするなら、true とすべきでしょう。
objectTag 関数は、ツールバーのボタンをクリックすると呼び出されます。そして、この関数から文字列を返すと、その文字列がコードビューに挿入されます。このとき、コードビューで文字列を選択しているときは、その文字列が戻り値の文字列で置換されます。文字列を選択していないときは、カーソルの位置に戻り値の文字列が挿入されます。
今回は、dom.source.getSelection 関数を使って、コードビューで選択している文字列の位置を取得し、dom.source.getText 関数を使って、その文字列を取得しています。そして、その文字列を HTML エスケープして objectTag 関数の戻り値にしています。
例外として、dom.source.getSelection 関数で取得した開始位置と終了位置が同じ(つまり、文字列が選択されていない)ときは、objectTag 関数の戻り値を省略しています。objectTag 関数の戻り値を省略すると、キャンセルとして扱われます。
拡張機能のプログラム本体の説明はおしまいです。ちょっとだけ、拡張機能のイメージを掴むためのヒントを紹介しておきます。
上の JavaScript のコードは、次のようにして、外部ファイルに追い出すこともできます。
<script language="javascript" src="EscapeHTML.js"></script>上の HTML ファイルは、何の役割も果たしていないように見えますが、拡張機能で UI を表現するときに使います。HTML フォームを記述して、ダイアログボックスとして使ったりできます。
今回はここまで。まだ続けます。
0 件のコメント:
コメントを投稿