読者です 読者をやめる 読者になる 読者になる

まめ畑

ゆるゆると書いていきます

jetpackでグリモンみたいに動作をするFeatureを作るには

Jetpack javascript

つい先日Version0.3がリリースされたと思ったら、今日0.4がリリースされました。
nativeWrapper関連の削除とJEPから機能の取り込みが行われています。
secure関連の機能が追加されたようです。

今回JEP17として登録されていた、PageModsが取り込まれました、これを使う事でJetpack Featureでグリモンの様な動作をさせることが出来ます。
Jetpackをグリモンみたいに使うには - まめ畑でPageModsを使わない方法を書きましたが、PageModsを使うことで簡単に指定のページを開いた時に動作するFeatureを作る事が可能になります。
しかし、この機能が実行されるタイミングはDOMContentLoadedイベントが実行された時なのですが、若干それよりも遅い感じがしました。


使い方は簡単なので超簡単なソースをのっけておきます
これは、はてだPlus利用者に表示されるPLUSアイコンを消すものです

//インポート
jetpack.future.import("pageMods");

//実行する動作を記述したコールバック関数を用意
//引数でパターンにマッチしたページのDocumentが渡される
var callback = function(doc){
   $(doc).find("img.icon-plus").css("display", "none");
};

//実行するサイトのアドレスを記述
//matchesプロパティにセット
var pages = {};
pages.matches = ["http://d.hatena.ne.jp/*"];

//コールバック関数とアドレス情報を渡す
jetpack.pageMods.add(callback, pages);


アドレスの情報は以下の様に複数指定する事も出来ます

pages.matches = ["http://*.hoge.com/", "http:/www.fuga.com/*", "・・・"];


PageModsの処理を実行する箇所はmoduleディレクトリ内の「page-modification.js」に書かれています

    this.jetpack.tabs.onReady(function() {
      for (var i=0; i < scope.patterns.length; i++){
        if(scope.patterns[i].pattern.doMatch(this.contentDocument.location)){
          scope.patterns[i].callback(this.contentDocument);
        }
        else {
          // match failure, noop
        }
      }
    });

の様に書かれています。
各タブで表示が完了すると登録されているマッチパターンを全て走査して、登録されている関数を実行しています。


アドレスをトリガーにしたFeatureを簡単に作成出来るようになりましたね。