TSUTAYAのポイント募金(東日本大震災緊急募金)の金額を見られるChromeエクステンション作ってみた。

どうもこんばわ~。 東日本はもう地震一色で怖いですね(;ω;`)

と思ったら、道を歩くと普通に働いてる人がたくさんいて、意外と大丈夫なのかな~と思ったり。

でもスーパーの棚は品薄なんてもんじゃない、すっからかんな状態。日常と非日常が入り乱れてますね;;

このエントリを書いている途中にも静岡で震度6強が出てたし・・・この調子だと次は中部あたりを襲ってくるのかしら?

この大震災で、各企業がいろいろな支援を表明しています。その中の一つに、TSUTAYAはポイントを使って募金を送ることを始めているようです。俺も多少なりともポイントがあったので、1ポイント残らず送ってしまいました。

そんな集まらないのかな~と思ったけど、現在9500万ポイントぐらい累積していて、そろそろ1億に届きそうなぐらいまで伸びています。みんなポイント溜めこんでたんだなぁw

そんなTSUTAYA募金をウォッチするChromeエクステンションを作ってみました。

TSUTAYA 東北地方太平洋沖地震緊急募金チェッカー(非公式)

これをインストールすると、画面右上にツタヤのアイコンが表れ、その上に常に現在集まっているポイントが表示されます。

4ケタまでしか表示できない仕様なので、単位をM(Million=100万)とかB(Billion=10億)を使ってます。

(例:100M=1億ポイント、1B=10億ポイント)

ツタヤのアイコンにカーソルを合わせると、集まったポイントを正確に表示してくれます。

そしてそのアイコンをクリックすると、募金ページが表示されます。これでポイントがたまったらすぐ募金できるね!!>< (要ログイン)

ダウンロードはこちら。

インストール方法は、以前のエントリ「kukuluの生放送リストを一発で見られるChromeエクステンション作ってみた。」に書かれているのでそちらを参照してみてください。

非公式かつ突発的に作ったので、「これはまずいよ!!」とか、「何このバグ!?」みたいな苦情や苦言などがありましたら、お手数ではございますが、このエントリのコメントか、Twitter(@nisihunabasi)まで、ご連絡をしていただけると幸いです。

俺自身も、地震によって実家が停電になったり、仕事にならなかったりと、軽微ながら苦労しました。ポイントだけでなく現金の方でも、少しばかりでもお金が余ったらどんどん募金していこうと思います。

ではでは~(*‘ω‘*)ノ

kukuluの生放送リストを一発で見られるChromeエクステンション作ってみた。

どうもこんばんわ。

前回のChrome拡張機能絡みのエントリから結構立ちましたが、ちまちまと作っていたものが出来上がったので公開してみます。

kukuluの放送中リストをChromeから一発で見られる機能で幸せになれるのか!?
「kukulu Livecast List Extension」

マビノギの実況放送を配信できるサイトkukulu(http://kukulu.erinn.biz/)にある「生放送中の配信」リストをそのまま持ってきた感じの拡張機能です。

特に変わった機能はありませんが、いつでもどこでもリストが見られるからいいかも・・・!?
「俺常時kukulu開いてるから別にいらねーし」とか聞こえてきそうですが、その辺は気にしないようにします(;ω;`)

本来なら、Chromeエクステンションギャラリーに公開できたらよかったんですが、まず初めに5ドルを払わないと公開できない仕組みになっているようなので、仕方なくブログのみでの公開になりました。
まぁkukulu視聴者の中でChromeユーザーとか、そんなにいないでしょうしね!(ぇ
とりあえず、よかったら使ってみてくださいな。

Chromeを使ってなかった人たち(特にIEer)も、これを機にChromeに乗り換えてはいかがでしょうか!

インストール方法

  1. インストールファイルをダウンロードする。←クリック
  2. 画面下部に以下のような表示が出るので、続行をクリック。

    この表示が出たら保存をクリック。
    続行を押すと幸せになれます。
  3. 次に出てくるウインドウの「インストール」を押すと完了になります。

    僕と契約(インストール)して魔法少女(?)になってよ!

chrome.browserAction.onClicked.addListenerとpopupが共存してくれない件。

かなり行き詰ったポイントなので、メモ代わりに書き込み。

最近、Google Chromeの拡張機能(Extension)の制作をしてます。実装言語はJS+HTMLで、Webページを作るような(?)感覚で出来上がるので簡単にできます。
・・・・・と思ったのが1か月程前。やってみると独自のメソッドがよー分からんかったり、日本語で書かれてるめぼしいドキュメントがあまりなかったりと、かなり苦労しました。英語がスラスラ読めるようになりたいっ><
あ、ちなみにExtensionのリファレンスの非公式日本語訳のページはあります。しかし、俺がそれを発見したのは苦労して原文リファレンスを読み切った後でしたorz

そして、本題である開発中にハマった部分についてのメモ。
ブラウザーアクション(browserAction)で、右上に出るバッジをクリックするとポップアップメニューを出すように設定してあると、バッジをクリックしたときのイベントを受け取るリスナー chrome.browserAction.onClicked.addListener(function(tab)) が発動しなくなるんですね。

実例を出してみます。ここで取り上げているソースは、Chrome Extensionの公式リファレンスのSamplesにある、「A browser action which changes its icon when clicked.」からの引用です。
まず、manifest.jsonを見てみます。

そして、background.htmlがこちら。

バッジをクリックするたびにバッジの色が変わる、という動きしかない分かりやすいソースです。background.htmlにクリックイベントを受け取るリスナーが登録されていて正常に動くのですが、manifest.jsonにこんな風に書き加えると、とたんに動かなくなります。

もちろん、popup.htmlはあるものとして書いてあります。
このように書き加えると、chrome.browserAction.onClicked.addListener(updateIcon);は反応してくれなくなるんですよね。
まぁクリックしたときの処理はpopup.html内に書き込めってことかもしれませんが、それだと処理が各所に分散しちゃいますね。popupにはロジックをあまり書き込みたくないです。
でもgetBackgroundPage()を使えば、popupからバックグラウンドのファイルの中を見れるので分散は防げますね。それでも余計な呼び出しがpopupに残るので納得行きませんが・・・!

バッジをクリックしたときに、XmlHttpRequestで別のページを非同期的に読み込む処理をbackground.htmlで行って、取得したデータをpopup.html内に組み込もうとしたのですが、popupとonClickedのリスナーが同時に使えないとなると、他に使えるかもしれないのはsendMessageとonRequestイベントでの通信ですかね・・・ まだ試してないので明日トライしてみますorz