9/24/2010

Javascript ファイルから設定画面の情報を読み込む [Safari Extensions を作ってみる:第七回]

Safari Extensions ではメニューの「Safari -> 環境設定...」画面の「機能拡張」タブをクリックすることで現れる画面に、「機能拡張ビルダー」内の「機能拡張の設定」で指定した各種設定を表示させることができる。これの設定をどうやったら読み込めるのかを、これまたひとしきり悩んだ。公式のドキュメントである Safari Extensions Development Guide: Settings and Local Storage を見てもやり方が判らない。色々と検索した挙げ句、Safari Extension Questions - Stack Overflow でなんとか解決した。以下にやり方を書いてみたいと思う。

まず、設定を読み込むには、safari.extension.settings.getItem("xxx") で取り込めばいいんだけど、これは「機能拡張ビルダー」内の「取り込んだ機能拡張の内容」の「スクリプトを開始 or 終了」のところに入れた Javascript ファイルに記述しても機能しない。その少し上の「機能拡張グローバルページ」で指定した html ファイル内で記述しないと能力を発揮しない。先程の「スクリプトを開始 or 終了」とグローバルページとの応答でようやく取得することができる。

ついでに設定画面で変更された時にも値を Javascript に渡すようにする。ユーザーが変更した際は change event が発行される。

★「グローバルページ」で指定した html 内の Javascript
<!doctype html>
<html lang="en">
<head>
  <script type="text/javascript">
// 問い合わせ or 設定変更時に呼び出される
    function respondSetting(evt) {
// 設定の「キー」項目である「xxx」という値を変数 zzz に代入
      var zzz = safari.extension.settings.getItem("xxx");
// Javascript への返答
      safari.application.activeBrowserWindow.activeTab.page.dispatchMessage("answer", zzz);
    }

// Javascript からの問い合わせを受信
    safari.application.addEventListener("message", respondSetting, false);
// 設定が変えられた時に発行
    safari.extension.settings.addEventListener("change", respondSetting, false);
  </script>
</head>
<body></body>
</html>

★「スクリプトを終了」で指定した Javascript
// グローバルページからの返答時に呼び出される
function getMessage(evt) {
// 返答された設定画面の値を変数 sValue に代入
  var sValue = evt.message;
}
// グローバルページに設定画面の値を問い合わせを送信
safari.self.tab.dispatchMessage("settingValue", "xxx");
// グローバルページからの返答を受信
safari.self.addEventListener("message", getMessage, false);

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.