» Jetpack (休止)

Jetpack Tips

自分の Jetpack Feature の変更をすばやく反映させる方法

まず、自分の Feature をローカルファイルとしてインストールします。(Feature インストール html ファイルをドラッグ&ドロップすれば良いです。)次に about:jetpack ページの Installed Features を開いてください。該当する Feature の横に refresh というリンクがあります。Feature Javascript を変更したあとこのボタンを押せば、その変更が反映されます。ただし、この機能が有効なのは、該当 Feature をローカルからインストールした場合に限ります( URLが file: でスタート)。

alert を出したい

jetpack 名前空間内には  alert 関数はありません。そこで、以下のように、現在表示中の contentWindow の alert を利用します。

jetpack.tabs.focused.contentWindow.alert("何か");

jetpack.storage.simple の実体のありか

profileディレクトリ/jetpack/xxxxxxxxxxxx/storage/simple.json がそれです。
※xxxxxxxxxxxx は、各 Jetpack Feature のユニークな識別子です。

Jetpack とは

Jetpack ホームページ : https://jetpack.mozillalabs.com/

Firefox の拡張機能の開発と導入の敷居を下げる新しい拡張機能プラットフォームです。今までの拡張機能の開発には、XUL による UI の定義、ソースコードの作成、それらのパッケージングなどを必要としていました。Jetpack では主立った機能や UI へのアクセスを API として提供することで、 JavaScript によるソースコードのみで拡張の開発ができるようになりました。この仕組みは同時に、Firefox のバージョンアップによって拡張が動かなくなってしまうことや、開発者が互換の違いを埋めるためだけの開発をしなくてはならなかった問題を解決する一つとなり得ます。バージョンアップによる互換の違いを API が吸収し、また API で提供されているものは互換性を担保することでこれを実現しようとしているからです。これによりユーザにとってはお気に入りの拡張をいつまでも使うことができ、 開発者にとっては拡張のコンセプトや機能の強化、ブラッシュアップなどに、より注力できることが期待できます。

また導入においても簡単化がはかられています。今まで、拡張機能を取り入れるにはインストール後に Firefox の再起動が必要でした。Jetpack では再起動を必要とせずに拡張( Jetpack では Feature と呼ぶようです ) を導入することが可能になり、”まず試してみる” までがとても簡単になりました。

Jetpack の導入

すみませんけれども、Jetpack 自体はまだ拡張機能なのです。お手数おかけしますが https://jetpack.mozillalabs.com/install.html から導入してくださいませ。

Jetpack を試す

導入がすみましたら、早速試してみましょう。ロケーションバーに about:jetpack を入れ、ページを開いてください。同ページ上の Develop を開いてください。テキストエリアが表示されると思います。そこに以下のコードをコピペしてください。

jetpack.statusBar.append({
 html: "Boom<i>!</i>"
});

その後、同テキストエリア左下にある “try out this code” をクリックしこのソースコードを実行します。すると、あら、ステータスバーの右下に Boom! の文字が表示されます。実はこれは ステータスバー jetpack.statusBar に “Boom<i>!</i>” という html を 追加 append するというJetpack のソースコードなのでした。このような簡単なソースコードにも関わらずステータスバーに独自の要素を追加することができます。

Jetpack Feature をインストールする

すでにパワフルな Jetpack Feature が作成、公開されています。

この中からどれでもいいのですが、今回は “Copy-on-Select Jetpack” というものをインストールしてみましょう。この Jetpack Feature はウェブページ上で文字列を選択すると文字列が自動的にクリップボードに送られるもので、コピペが簡単になります。しかもたった5行ほど!のプログラムでこの機能が実装できています。

では、http://jbalogh.github.com/jetpacks/copy-on-select/を開いてください。ページの上部がのようになっていると思います。このバーは、このページが Jetpack Feature を含んでいることを表しています。そしてバーの右側 「install」 ボタンをクリックすればインストールが開始されます。

次に、この Jetpack Feature を本当にインストールしてもよいかを判断します。表示中のソースコードを良く読み、この Jetpack Feature が行うことを理解し問題が無ければ、「I know what I’m doing. Install it!」をクリックしインストールを進めてください。「Installation Successful」というページになれば、インストールの完了です。どこか違うページにて、テキストを選択し、テキストエリアにペーストしてみてください。選択された文字列がペーストされるはずです。

Jetpack Feature をアンインストールする

ロケーションバーに about:jetpack と入力し、ページを開いてください。その中の Installed Features を選びます。ここでは現在導入されている Jetpack Feature の一覧を見ることができます。アンインストールしたい Feature わきにある uninstall リンクを押下すれば、アンインストールすることができます。

参考資料