プラグイン作成をはじめてみよう

ここでは、BEITELの活用方法と言うことで、BEITELプラグインの作成方法について
不定期連載していきたいと思います。

実際に中の人が作って利用しているプラグインなども例に説明していきながら、
プラグインを使ったBEITELの強化・活用方法をお見せできれば・・・と考えています。
ぜひお付き合いください。



さて、今回は第一弾として、非常に簡単なプラグインを作り、
BEITELで動かしてみたいと思います。
BEITELでのプラグインの作成は非常に簡単です。
簡単なJavaScriptの知識さえあれば、プラグインを作成、動作させることができます。

今回は、手始めということで、右クリックメニューへのメニュー項目の追加、
メッセージボックスの表示を試してみましょう。
具体的には、こんなイメージです。(作業前のメモそのままですが。)


... 右クリックメニューに区切り線と[テスト！]という項目を追加する。


... [テスト！]をクリックすると、選択されているノードの文字列がメッセージボックスで表示される。


では、プラグインを作っていきましょう。BEITELをダウンロードし、インストールを
すませたら、下の手順にしたがってプラグインを記述してみてください。

1. プラグインのソースコードを記述します。ここではtest.jsとしましょう。
   特に日本語を含める場合、文字エンコーディングはUTF-8で保存してください。
   
   

   window.popup.appendChild(window.popup.createSeparator());
   
   var comp = window.popup.createMenuItem("テスト！", function(ev){
           alert("クリックされました:\n[" + ev.currentTarget.text + "]");
       });
   window.popup.appendChild(comp);
   

   
   見ての通り、シンプルなJavaScriptのコードです。
   
   まず、window.popupオブジェクトに対してwindow.popup.createSeparator()で生成した区切り線を追加し、
   次に、createMenuItem(...)で生成したメニュー項目を追加しています。
   メニュー項目生成の際に、メニュー名、クリック時の処理を指定しています。
   
   BEITELは、ウィンドウを開く際にこのコードを実行し、その内容に応じてメニューへの項目追加を行います。
   使用可能なAPIに関する詳細は、ヘルプを参照してください。


2. プラグインをBEITELにインポートします。(beitelのフォルダ)/extの直下にtest.jsをコピーします。


3. BEITELを起動します。もしすでにBEITELを起動しているのなら、[ファイル]メニューの[ウィンドウの再オープン]を実行してみてください。

これで、以下のように右クリックメニューに[テスト！]項目があらわれれば成功です。



クリックしてみると、こんなメッセージボックスが表示されます。





今回はメッセージボックスを表示するだけの単純な例でしたが、今後、HTML形式で出力する、テキスト形式で出力するなどの具体例を説明していきたいと思います。

BEITELはアウトラインエディタですが、プラグイン機構を利用することで、
アウトライン文書から別の形式のドキュメントを生成したり、
他の情報ソースをアウトライン文書として取り込んだり、
アウトライン文書に対して任意の変換を加えたりすることができるようになります。
ぜひ活用してみてください。