まだまだテスト段階のJetpackですが、折角なので遊ぶだけでなく、何か役に立つものを作りたいなと思いやってみました。
使ったのは、v.2から実装されたスライドバー。ここに、現在表示中のページに付けられているブックマークを表示します。
「このページ、どのくらい注目されてるのかな？」と思った時に、割と手っ取り早く分かって便利なんじゃないかと。
現時点で対応しているのは「はてなブックマーク」と「livedoorクリップ」だけです。
概要
Mozillaが開発中のFirefoxプラグイン、Jetpackを用いて作ってみたブックマーク表示ツールです。
左側に開いているのグレーのエリアが、今回作ったFeature。ここに、現在のページのブックマーク数が表示されます。
自由に開け閉めできますが、開きっぱなしにもできます。タブの移動やページ遷移でもチェックに行くので、鬱陶しかったら閉じてしまうのが良いかと。
インストール方法
まず、なにはともあれJetpackをインストールしてください。
次に、Social-Screwをインストールします。
上記リンクを辿った先のページにFirefoxでアクセスすると、ページ上部にインストールを促すバーが表示されます。ここで”Install…”ボタンを押すだけです。
しかし何分非公式のサイトなので、非常に危なそうな警告ページが表示されてしまいます。しかしここは気にせず、ページ下部の”I know what I’m doing. Install it!”をクリックしてください。
これで完了のはずです。
プラグインの設定やタブの表示位置によって若干異なるのですが、概ね左上あたりに青い矢印が表示されているでしょうか？これがスライドバーの開閉スイッチになっています。
マウスを近づけるかクリックすると、左端が少し開いてネジの頭が表示されると思います。(先ほどのスナップショットでも見えます)
これをクリックすると、表示領域が開きます。閉じるには、先ほどの青い矢印をもう一度クリックします。
コード
githubにホスティングしておいたので、興味のある人は見てみてください。
試行錯誤しながらだったので綺麗なコードとは言いがたいですが、100行ちょっとの短いコードです。
Jetpack APIリファレンスやjQuery日本語リファレンスなどと併せて見れば、簡単に読めると思います。
今後の展開
本当はtomblooのような、ここから投稿まで出来るツールを作りたかったのですが、ID/PWDをセキュアに保存する良い方法が無かったので、断念しました。
自分個人用ならjetpack.storage.simpleで保存してしまっても良いのですが、公開するとなるとさすがに…
それこそtomblooのようにAPIを認証させて使うのではなくPostをエミュレートするような形で実装するのが良いのかもしれませんが、そこまでやるパワーは無く。
結局、単純にブックマーク数を表示するだけのものですが、これはこれでと思います。
# これを作ってみて、世の中変な人が多いことに気づきました :-p
本当はdeliciousを入れたかったのですが、URLをJavascriptでMD5にするのがメンドウで、今回はパスしました。Y!は基本的にはAPI公開してないし。もし要望があれば考えます。
注意事項
冒頭でも書きましたが、Jetpackは未だ実験段階の機能です。
動作の怪しい部分は多々ありますので、導入する場合はあくまで自己責任でお願いいたします。
Related posts:
- [Jetpack] v.2リリース：スライドバー搭載
- [Jetpack] インストールと開発環境構築準備
- [Jetpack] Screw!ボタンをつけてみる
