4

SDK を使用して新しいバージョンのアドオン (Gmail を対象とする) を開発していますが、ユーザーのためにいくつかのブール値の設定を保存する必要があります。そのために、新しい「simple-prefs」API を試してみたいと思います。Mozilla のドキュメントとこのStackoverflow の質問に基づいて、何かを得ましたが、次の問題に直面しています。

1) 設定の変更をデータ内の外部スクリプトに適切に渡すことができません。変更を適用するには、アドオンを無効にしてから再度有効にする必要があります。

2) Gmail を開いたタブに設定が直接適用されるようにする方法。

これが私のpackage.jsonです：

{
"name": "Demo", 
"license": "MPL 1.1/GPL 2.0/LGPL 2.1", 
"author": "me", 
...

"preferences": [{
    "type": "bool",
    "name": "option1",
    "value": true,
    "title": "Description Option1"
},
    {
    "type": "bool",
    "name": "option2",
    "value": true,
    "title": "Description Option2"
  }]
}

私のmain.js：

const pageMod = require("page-mod");
const data    = require("self").data;
const prefSet = require("simple-prefs");

// Get the values for options
var option1 = prefSet.prefs.option1;
var option2 = prefSet.prefs.option2;

// Listen for changes
function onPrefChange(prefName) {  prefSet.prefs[prefName];  }

prefSet.on("option1", onPrefChange);
prefSet.on("option2", onPrefChange);

exports.main = function() {
  pageMod.PageMod({ 
  include: ["https://mail.google.com/*","http://mail.google.com/*"],
  contentScriptWhen: 'ready',
  contentScriptFile: [data.url("jquery.js"),data.url("script.js")],
  onAttach: function(worker)
    {
      worker.postMessage(option1);
      worker.postMessage(option2);
     }
 });
}

私のscript.js（データ内）：

(function(){

// Option 1
self.on("message", function(option1)    { 
  if( option1 == true ) {  
           // Do this
                          }});

// Option 2
self.on("message", function(option2)    { 
  if( option2 == true ) {  
           // Do this
                          }});
})();

私の main.js ファイルで postMessage プロトコルを使用し、それを私の script.js ファイルで呼び出すためのより適切な方法が確かにあります... アイデアや提案を自由に提案してください!

4

2 に答える 2

3

prefSet グローバルおよび特定のページのワーカー インスタンスにアクセスできるコード内の唯一の場所であるため、 onAttach ハンドラーでpref 変更ハンドラーを設定する必要があります。このパターンは私にとってはうまくいきます：

const pageMod = require("page-mod");
const data    = require("self").data;
const prefSet = require("simple-prefs");

// Listen for changes
exports.main = function() {
    pageMod.PageMod({ 
        include: ["*"],
        contentScriptWhen: 'end',
        contentScript: 'self.port.on("prefchange", function(data) { console.log(JSON.stringify(data,null,"  ")); })',
        onAttach: function(worker) {
            function onPrefChange(prefName) {
                worker.port.emit('prefchange', [prefName, prefSet.prefs[prefName]]);
            }

            prefSet.on("option1", onPrefChange);
            prefSet.on("option2", onPrefChange);
        }
    });
}

実際の例については、この github リポジトリを参照してください: https://github.com/canuckistani/Pref-changes

于 2012-04-16T04:01:33.797 に答える
2

OK、これは私が欲しかったものの実用的なバージョンですが、かなり醜いです。ですから、それを達成するためのより良い方法があれば、お気軽に共有してください!

私のpackage.json：

{
"name": "Demo", 
"license": "MPL 1.1/GPL 2.0/LGPL 2.1", 
"author": "me", 
...

"preferences": [{
    "type": "bool",
    "name": "option1",
    "value": true,
    "title": "Description Option1"
},
    {
    "type": "bool",
    "name": "option2",
    "value": true,
    "title": "Description Option2"
  }]
}

私のmain.js :

const pageMod = require("page-mod");
const data    = require("self").data;
const prefSet = require("simple-prefs");

exports.main = function() {
    pageMod.PageMod({ 
    include: ["*//example.com/*"],
    contentScriptWhen: 'end',
    contentScriptFile: [data.url("jquery.js"),data.url("script.js")],
        onAttach: function(worker) {

            // Persistent values
            var option1 = prefSet.prefs.option1;
            var option2 = prefSet.prefs.option2;

            worker.port.emit('get-prefs', [ option1, option2 ]); // sender1

            // Listen for changes
            function onPrefChange(prefName) {
                let payload = [prefName, prefSet.prefs[prefName]];
                worker.port.emit('prefchange', payload); // sender2
            }

            prefSet.on("option1", onPrefChange);
            prefSet.on("option2", onPrefChange);


        }
    });
}

そして私のscript.js（データ内）：

(function(){

// Persistent Values
self.port.on("get-prefs", function(prefs) {

// onPrefchange Values
self.port.on("prefchange", function(data) { 

    $(document).ready(function() {

    var option1     = prefs[0];
    var option2     = prefs[1];
    var option      = data[0];
    var value       = data[1];

    var css;

        if(option1 == true || option == "option1" && value == true){
            css = "body {background-color:red !important}";
                }


        if(option2 == true || option == "option2" && value == true){
            css = "body {background-color:blue !important}";

                }


///////////////////////////////// CSS Activation
$('head').append('<style type="text/css">' + css + '</style>');
//////////////////////////////// #CSS Activation

    });//end jQuery ready
 });
 });

})();
于 2012-04-19T13:56:32.220 に答える