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での支援を募集しています。