javascript前回の続きです。以前までの記事は以下になります。雛形の作成クリックした回数を検知して指定回数だった場合にタブを削除して通知、というだけの機能ですが一旦クリック回数は3回(トリプルクリック)固定でまずは実装してみます。拡張機能ではバックグラウンドプロセス各ページで動作するコンテントスクリプトを持つことが出来ます。バックグラウンドプロセスをブラウザで1つ、コンテントスクリプトは開かれたタブでページが読み込まれた分だけ動かします。動作としてはコンテントスクリプトがバックグラウンドプロセスと通信をしながら目的の機能を動作させていく形になります。作る拡張機能の性質によってはコンテントスクリプトが要らないケースもありますが、今回は各ページ上でのトリプルクリックを検知する必要があるので、この形になります。動作を実現させるために必要なオブジェクトを作ります。バックグラウンドプロセスとなるクラスをManager、コンテントスクリプトとなるクラスをAgentとしてsrc/libs/以下に作成します。Managerクラスは以下の通り。}}続いてAgentクラスは以下の通り。}}処理内容ほとんどコメントに何をしてるか書いてはありますが、基本的にChromeのAPIを使用して全ての動作を実現させます。エージェントはマネージャーと直接関わるわけでなく、接続を保ってメッセージを送受信することでそれぞれの役割を果たします。投げたメッセージが何の意味を持つのかをnameというプロパティで表すようにして、受けた方はnameプロパティの内容で処理を分岐する形です。(今はタブを削除する、という1つだけではありますが)あとは現在開かれている全てのタブをChromeのAPIに問い合わせて帰ってきた中からアクティブなタブを省いた右側、あるいは左側の全てのタブオブジェクトに対して削除の命令を出して、その履歴を持っておきます。その後通知を出していますが、誤って閉じてしまったときのために「元に戻す」ボタンを付けています。このボタンが押されたら、先程の履歴の最新のものを参照して復元している、という内容です。処理が実装できたら、実際にバックグラウンドプロセス、コンテントスクリプトとして動作させるために作成したクラスをラップしたファイルを作り、manifest.jsonに記述します。それぞれbackground.js、contentscript.jsとします。"default_locale":"en"}backgroundの項と、content_scriptsの項が動作させるJavaScriptに関する内容です。backgroundに関しては動作させるスクリプトのファイル名を記述しているだけです。content_scriptsに関しては以下の内容を記述しています。そのURLパターンのページでは動作させないのかあとはpermissionsで以下の許可を頂く旨を記述しています。バックグラウンドプロセスを動作させることタブにアクセスすること通知を出すこと詳しくは以下に載っています。https://developer.chrome.com/extensions/manifestここまで出来たら前回までに準備したgulpタスクを使って動作を確認してみます。gulpと打ち込みエンターを押すとdist/ディレクトリ以下に成果物がビルドされます。拡張機能と進み、デベロッパーモードをONにした状態でパッケージ化されていない拡張機能を読み込むボタンを押します。すると、ディレクトリの指定を促されるので、ビルドされたmanifest.jsonが置いてあるディレクトリ、すなわちdist/ディレクトリを指定します。これで拡張機能が読み込まれ、動作確認が出来ます。ソースコードを修正した場合はgulpがファイルの変更を自動検知して再ビルドが行われますが、Chromeの方の拡張機能も再読込しないと内容が反映されません。先程の設定画面のおそらく一番上に追加した拡張機能が表示されていますので、そこのリロードをクリックすると再読込されます。コンテントスクリプトの修正の場合は、開いているページ自体も再読込する必要があります。ここまででほぼ動作は満たせたので、次回は公開に関する部分を書いていきます。開発SocialFacebookGoogle+RSSTwitter毎日をより便利に。