はてブでNGフィルタリングするFirefoxのaddon作った
download: Axfc UpLoader -3631979.xpi-
試作。多分動く。新しめのFirefoxじゃないと動かないかも。
ダウンロードしたxpiをFirefoxにドラッグ&ドロップでインストール。
設定画面が文字化けしてたので修正した。
機能
- NG URL
- NGタイトル
- NGドメイン
いずれも対象ワードを含んだら非表示する。完全一致でも正規表現でもない。
必要な気がしてNGドメインも対応したけど、NG URLだけで済むし不要だったな。ドメインはエントリのセルの下側の奴。
目的から外れるので広告はそのまま表示。
例
ツールバーのボタンを押すと設定画面が出る。
ここに非表示にしたいものをスペース区切りで並べて決定ボタンを押す。
そうすると下の画像のようにNGが含まれるエントリのセルが削除される。
ここでは背景色が赤くなってるだけだが、これはNGがちゃんと動作してるかのチェック用の機能。こうしないと、もともと無いのかNGで消えたのか分からない。
アドオン設定画面でこのチェックボックスが外れていればそのまま削除、チェックを付ければチェック用に背景色変更。
Fxのアドオンについて
最近のFxのアドオンはjavascriptで作れる。
ページの書き換えは、Addon sdkのpage-modでNG処理スクリプトをページに結びつけることで出来る。ここは簡単。jQueryも使える。
面倒なのは設定画面。最初はsimple-prefsだけで済ませようとしたが日本語入力が出来なかった。仕方なくpanelとpreference/serviceを使って自前で設定画面を作った。jQueryとbootstrap3を使えたのでやり方が分かれば難しくはない。ただやり方が分かりにくい。こういうことはみんなやってそうなのに情報が全然ない。
設定画面の流れとしては、
- 画面作成(html)
- 上記を使ってPanel作成
- jsで画面と
main.jsでデータ受け渡し- 現在の設定を表示
- 設定の更新
設定の読み込みと保存で使うのがpreference/service。操作はgetとsetだけで済むので簡単。High-level APIだけでどうにかしたかったが仕方ない。
設定画面が使いやすいアドオン作ってる人って凄いと思った。どうやってるんだろ。
やり方さえ分かっていればこの程度のアドオンは1日あれば出来る。ただそのやり方を理解するのに時間がかかった。日本語の情報はあまりないし、だからといって英語ならあるのかと言うとそうとも限らない。あっても最新とは限らない。そもそもチュートリアル通りやって動かないという。
もうちょっとやったら作り方まとめよう。
