Post Now browsing to Twitterで設定画面が開かないバグ修正
Post Now browsing to Twitterで設定画面がうまく開かない現象が起きていたみたいで、以前はGM_configというGUI用のライブラリを使っていたのですが、今回usconfigに移行しました。
なので、今まで設定画面が開かないなどの現象が起きていた人はインストールしなおしてください。
(おかしいときは ツール→Greasemonkey(もしくはステータスバーの猿アイコン)→ユーザースクリプトの管理→Post Now browsing to Twitterを選択→✓関連付けられた設定も削除にチェック→アンインストール → インストール)
こっからはGM_configからUSConfigへ移行方法について。
GM_configは前から少し不安定な感じがあったので、同種のライブラリであるUSConfigに変えました。
GM_configとUSConfigの違いを簡単に挙げてみると(移行するに当たっての変更点)
まずはGUIの書き方が別物なので、そこはすべて書き直す必要があります。
GM_configの場合
GM_config.init('Configuration for Post Now browsing to Twitter', {
'defaultTag': {
'label': 'Prefix:',
'type': 'text',
'default':'Now browsing: '
},
'isSelection': {
'label': 'Use selectionQuote',
'type': 'checkbox',
'default':true
},
'ShortURL': {
'label': 'Short URL',
'type': 'select',
'options': {
'bit.ly': 'bit.ly',
'j.mp': 'j.mp',
'goo.gl': 'goo.gl',
'is.gd': 'is.gd',
'tinyurl.com': 'tinyurl.com'
},
'default':'bit.ly'
},
'ShortCutKey': {
'label': 'ShortcutKey:',
'type': 'text',
'default':'CS-Enter'
},
'PostWithCtrl': {
'label': 'Post with Ctrl+Enter:',
'type': 'checkbox',
'default': false
}
}, configStyle , {
open: function () {
// ショートカットの入力補助
var iframe = document.getElementById("GM_config");
var iframeDoc = iframe.contentDocument;
iframeDoc.getElementById("field_ShortCutKey").addEventListener('keydown', function (evt) {
evt.preventDefault();
this.value = shortcut.get(evt);
}, false);
// OAuth Setting
if (TWOauth.isAuthorize()) {
TWOauth.injectToConfig();
} else {
XHRloading.createText(iframeDoc);
TWOauth.getRequestToken(TWOauth.injectToConfig);
}
},
save: function () {
} // reload the page when configuration was changed
});
USConfigの場合
Config.define('usc_basic', function() {
with (this.builder) {
var shortURL_opt = [
'bit.ly',
'j.mp',
'goo.gl',
'is.gd',
'tinyurl.com'
]
dialog(
"Post Now browsing to Twitter Settings",
{ width: 600, height: 700 },
section(
"OAuth Authorization",
"Sign in with Twitter"
)
);
}
}, {
saveKey: 'GM_config',
aftersave: function() {
},
afteropen : function() {
// ショートカットの入力補助
var iframeDoc = this.frame.contentDocument;
iframeDoc.getElementById("control_ShortCutKey").addEventListener('keydown', function (evt) {
evt.preventDefault();
this.value = shortcut.get(evt);
}, false);
// OAuth Setting
if (TWOauth.isAuthorize()) {
TWOauth.injectToConfig();
} else {
XHRloading.createText(iframeDoc);
TWOauth.getRequestToken(TWOauth.injectToConfig);
}
}
});
二つを見比べると、GM_configはオブジェクトを定義する感じだけど、USConfigはその都度関数を呼び出す感じになってる。レイアウトの自由度はUSConfigの方が上ですが、ちょっとインデント管理が大変で書きにくい。
またUSConfigではselectに連想配列っぽいオブジェクトを使えないので、配列に直す必要があります。
後、Text() のデフォルトサイズが少し小さいので第4引数で属性にsizeを追加してます。
最後の空sectionはafteropen時に書き換えるようにしてるので、本質とはあんまり関係ないです。
USConfigの方がConfig.define()でのコールバック(afteropenなど)が豊富なので、細かい制御がしやすいと思います。
そのコードバックで設定画面のiframeをとるにはthis.frameとすればよいみたいです。
次に設定情報の取り出し方
GM_configがそのつど、keyを指定してvalueを取り出す感じだったのが(GreasemonkeyのGM_getvalueに近い)
GM_config.get(key);// value
USConfigでは設定全部をまとめたオブジェクトを最初にロードする感じになっています
var settings = Config.load(); settings.key;// value
また、設定を保存するキーの初期値はGM_configと違うのでそのまま移行させるためにはsaveKeyを’GM_config’にします。
Config.define('dialog_name', function() { with (this.builder) {
dialog(...);
}}, {
saveKey: 'GM_config',
aftersave: function() {...},
});
後はGM_config.*()がConfig.*()など細かい違いあるので、それを手直しすれば移行できました。
(GM_config.close()がConfig.remove()だったのが少しはまった)
お知らせ欄
JavaScript Primerの書籍版がAmazonで購入できます。
JavaScriptに関する最新情報は週一でJSer.infoを更新しています。
GitHub Sponsorsでの支援を募集しています。