Backlogのウォッチした課題のコメントをデスクトップ通知でお知らせするChrome拡張機能

BacklogWatch

何するものなの

気になる課題をウォッチ¹するとコメントがついた時にChromeのデスクトップ通知を出してくれる良い感じの奴です。

ウォッチの方法は各課題のブラウザウィンドウ右下にfixedでがいるのでクリックでウォッチ完了です。（通知出したい場合はAPI Keyの発行とOption設定を忘れずに）

ちなみにウォッチした課題はchrome.storage.syncに保存されるためGoogleアカウントで同期設定をしていれば他のPCでログインした際もウォッチは引き継げます。
他にも以下の機能もオマケ程度にあります。

• ダッシュボードにお気に入りのプロジェクトを固定表示します。
• ダッシュボードにウォッチ中の課題を固定表示します。

経緯

Backlogでは課題にコメントを追加する際に「コメントをお知らせしたいユーザ」という機能があって、プロジェクトに参加しているユーザを選択するとそのユーザ宛にメールが飛んできたりダッシュボードに通知アイコンが出たりするのですが、そのお知らせをするかしないかはコメントする人の手に委ねられるので「俺は監視したいのにコメントが追えない、かといってメール全チェックは馬鹿らしい…」というジレンマがありました。RedmineからBacklogに移った方はより顕著にそう感じる人もいると思います。
そして色々検討した結果、「Chromeのデスクトップ通知でコメントを飛ばせば冒頭の数行しか表示されないにしろ何となくは何の話なのか掴めるし時間指定で勝手に通知を閉じる事も出来るしうざくないし良いかも」と思いその問題を解決する一つの手段としてChromeの拡張機能で作る事にしました。
以前からBacklogのAPI一覧を眺めては色々弄ってみたい想いを募らせていたので丁度良かったです。

技術的な事

最新のコメントの取捨選択は以下のAPIから取得しています。

• 課題情報の取得
• 課題コメントの取得

通知作成処理の流れ

• ウォッチした際に課題キーをchrome.storageに保存する
• チェック間隔(1分)毎にstorageにアクセスし課題キーから課題コメントの取得を行う

取得した課題コメントのjson

[
    {
        "id": 6586,
        "content": "テスト",
        "changeLog": null,
        "createdUser": {
            "id": 1,
            "userId": "admin",
            "name": "admin",
            "roleType": 1,
            "lang": "ja",
            "mailAddress": "[e-mail]"
        },
        "created": "2013-08-05T06:15:06Z",
        "updated": "2013-08-05T06:15:06Z",
        "stars": [],
        "notifications": []
    },
    ...
]

• 初回取得時に一番最後に投稿されたコメントのid（配列では0番目に位置する）を取得しこれもstorageに保存。
• 次回チェック時にGETする際にクエリパラメータにminIdを付与し前回取得したコメントのidを指定する。
  • minIdを指定していると指定したidの数値以上のidしかオブジェクトを返さない。
  • この際に0番目のコメントのidが保存していたidと同一のものだったりするとjsonは空の配列を返す。（サーバにかかる負担少ないように感じて気持ち嬉しい）
• idが新しいもののコメントをchrome.notificationsで通知を作成する。

本当はFirefoxでも使える拡張機能にしようと考えていたのですが以下のような都合上、全てChrome APIで賄ったほうが楽だなって事で断念しました。

• background pageで常に動作するのはコメントチェックの都合上、Chromeが重くなりかねないのでevent pageにした。
• event pageではsetTimeout()が使えないのでchrome.alarmsを使う事にした。
• それに合わせてindexedDBで実装していたものを途中でchrome.storageに切り替えた。
  • indexedDBはデバッグで苦労させられたのも乗り換えた理由の一つです。
• それに合わせてWeb Notifications APIではなくchrome.notificationsを使う事にした。
• 気付いたらChrome APIばかりになっていた（さようならFirefox）

他

GitHubにリポジトリがあるのでソースコードは読めますが去年の秋ぐらいからデスクトップ通知以外の部分を割と自由気ままにのんびりと作ってたのでjsによってちぐはぐな部分が多々有りますがご容赦を…
ピッチをあげたのはnulabが本家本元でウォッチ機能を実装しやがったからです。
コメントでウォッチ機能のAPI開発中、とあるのでもう少し待ってたら本家本元のウォッチ機能を使いつつ、もっと楽に開発出来るようになってたんでしょうね…

あとnulab側で進行中のBacklogの新UIに関する対応はダッシュボードのデザインがβより更に変わるみたいなので、それ待ちです。

少しでもBacklogのAPIを利用したChrome拡張機能を作成する助けになれば嬉しいです。
バグを見つけたり、機能要望とかあればGitHubのIssuesに頂けると喜びます！

---

1. 本記事で言葉にする「ウォッチ」は所謂Backlog標準で実装されているウォッチ機能ではなく、本拡張機能における課題を通知させるための総称。 ↩