第2回目の今回は,
Ubiquity 0.1チュートリアル
Ubiquityコマンドを自作する場合,
コマンド定義関数
Ubiquityプロンプトでcommand-editを実行してエディタを開きリスト1を入力します。
この関数でhello-worldコマンドが作成されます。Ubiquity 0.
リスト1 hello-worldコマンドの定義例 - 短縮形式版
function cmd_hello_world() {
displayMessage( "新大陸へようこそ" );
}
リスト1は短縮形式による定義で,
コマンド名は英語に限らず日本語でも指定できます。リスト3のように指定すれば
リスト2 hello-worldコマンドの定義例 - フル形式版
CmdUtils.CreateCommand({
name: "hello-world",
execute: function() {
displayMessage( "新大陸へようこそ" );
}
})
リスト3 hello-worldコマンドの定義例 - コマンド名には日本語も使える
CmdUtils.CreateCommand({
name: "挨拶",
execute: function() {
displayMessage( "新大陸へようこそ" );
}
})
コマンドにハイフンが含まれているのは,
コマンド情報
コマンドに,
リスト4 コマンドの情報を記載した例
CmdUtils.CreateCommand({
name: "hello-world",
homepage: "http://gihyo.jp/",
icon: "http://gihyo.jp/favicon.ico",
author: { name: "Daichi GOTO" },
contributors: ["Hiroaki TOMIDA"],
license: "BSD",
description: "メッセージを表示します",
help: "メッセージを出力する以外、とくに機能はありません。",
execute: function() {
displayMessage( "新大陸へようこそ" );
}
})
ここで記載した情報は,
プレビュー
Ubiquityプロンプトの下にはコマンド補完一覧が表示される他,
プレビューはリスト5のようにpreviewにHTML文字列を指定する他,
リスト5 プレビューに文字列を表示させる例 - HTML文字列を直接指定
CmdUtils.CreateCommand({
name: "hello-world",
preview: "<cite>新大陸へようこそ</cite>",
execute: function() {
displayMessage( "新大陸へようこそ" );
}
})
リスト6 プレビューに文字列を表示させる例 - 関数を使って表示する場合
CmdUtils.CreateCommand({
name: "hello-world",
preview: function( view ) {
view.innerHTML = "<cite>新大陸へようこそ</cite>";
},
execute: function() {
displayMessage( "新大陸へようこそ" );
}
})
関数を使う場合はリスト6のように記述します。引数からアクセスできるinnerHTMLがプレビュー画面に相当しており,