読者です 読者をやめる 読者になる 読者になる

mkmkmkmkmk

うぇるかむねこまねき

はてブでNGフィルタリングするFirefoxのaddon作った

download: Axfc UpLoader -3631979.xpi-

試作。多分動く。新しめのFirefoxじゃないと動かないかも。

ダウンロードしたxpiをFirefoxにドラッグ&ドロップでインストール。

設定画面が文字化けしてたので修正した。

機能

  1. NG URL
  2. NGタイトル
  3. NGドメイン

いずれも対象ワードを含んだら非表示する。完全一致でも正規表現でもない。

必要な気がしてNGドメインも対応したけど、NG URLだけで済むし不要だったな。ドメインはエントリのセルの下側の奴。

目的から外れるので広告はそのまま表示。

ツールバーのボタンを押すと設定画面が出る。
f:id:kirte:20160309031215j:plain

ここに非表示にしたいものをスペース区切りで並べて決定ボタンを押す。

そうすると下の画像のようにNGが含まれるエントリのセルが削除される。

f:id:kirte:20160309032710j:plain

ここでは背景色が赤くなってるだけだが、これはNGがちゃんと動作してるかのチェック用の機能。こうしないと、もともと無いのかNGで消えたのか分からない。
f:id:kirte:20160309033034j:plain
アドオン設定画面でこのチェックボックスが外れていればそのまま削除、チェックを付ければチェック用に背景色変更。

今後の予定

  1. 設定画面の改良
  2. ブコメのNG対応
  3. スター連打の掃除
  4. アドオンのアイコン変える
  5. 適当

この辺やったらAdd-ons for Firefoxで公開しよう。

Fxのアドオンについて

最近のFxのアドオンはjavascriptで作れる。

ページの書き換えは、Addon sdkpage-modでNG処理スクリプトをページに結びつけることで出来る。ここは簡単。jQueryも使える。

面倒なのは設定画面。最初はsimple-prefsだけで済ませようとしたが日本語入力が出来なかった。仕方なくpanelpreference/serviceを使って自前で設定画面を作った。jQueryとbootstrap3を使えたのでやり方が分かれば難しくはない。ただやり方が分かりにくい。こういうことはみんなやってそうなのに情報が全然ない。
設定画面の流れとしては、

  1. 画面作成(html)
  2. 上記を使ってPanel作成
  3. jsで画面とmain.jsでデータ受け渡し
    1. 現在の設定を表示
    2. 設定の更新

設定の読み込みと保存で使うのがpreference/service。操作はgetとsetだけで済むので簡単。High-level APIだけでどうにかしたかったが仕方ない。

設定画面が使いやすいアドオン作ってる人って凄いと思った。どうやってるんだろ。

やり方さえ分かっていればこの程度のアドオンは1日あれば出来る。ただそのやり方を理解するのに時間がかかった。日本語の情報はあまりないし、だからといって英語ならあるのかと言うとそうとも限らない。あっても最新とは限らない。そもそもチュートリアル通りやって動かないという。

もうちょっとやったら作り方まとめよう。