Operaの備忘録のぺえじ

■ [Extension]DOM構築が完了したら実行するよ

Opera extensionのincludesフォルダ内のスクリプトはDOMContentLoadedイベントより後に実行されることもあるようなので、「既にDOMが構築されていた場合はJSファイルの末尾で実行、構築されていなかった場合はDOMContentLoadedイベントを待つ」という仕組みを作りたい。

// http://orera.g.hatena.ne.jp/misttrap/20110709/p1
// fired when the page's DOM is ready
// this text must be placed on EOF
function ready(fn) {
    return function() {
        var me = this, xs = arguments;
        ready._listeners instanceof Array || (ready._listeners = new Array);
        ready._listeners.push(function() { fn.apply(me, xs); });
        return me;
    };
}
ready._listeners instanceof Array && function(ev) {
    var fn = arguments.callee;
    if (ev)
        window.opera.removeEventListener(ev.type, fn, false);
    else if (document.readyState === 'loading') {
        window.opera.addEventListener('BeforeEvent.DOMContentLoaded', fn, false);
        return;
    }
    ready._listeners.forEach(fn.call, fn.call);
    delete ready._listeners;
}();

このコードをJSファイルの末尾に載せる。今のところこれで行けてます。

関数から関数を返すくだりなんかは要はパクりなんですが、まあ良いものはどんどん使いましょうね、ということで。

追記(2012-02-10)

一部書き方を改めた(動作は変わってないです)ついでに、簡単な使い方を載せてみます。前述のパクり元をご存知の方には余計なお世話かもしれません。

// 最も基本的な使い方です
var onready = function() {
    opera.postError('hello');
};
ready(onready)();

イベントタイプの性質上取り消す機会も少ないので、キャンセル用のメソッドなどは用意していません。また、これだけだと関数の実行を無駄に一回多くやっているわけですが、二回目の実行でthis値と引数を与えることが出来るので、以下のような書き方が可能になります。

var Hoge = function(v) {
    // this.onreadyがthis値を返しているので
    // メソッドチェーン的な書き方が出来ます
    this.onready(v).say('hello');
};
Hoge.prototype.onready = ready(function(v) {
    this.say(v);
});
Hoge.prototype.say = function(v) {
    opera.postError(v);
};

new Hoge('good-bye'); // "hello" => "good-bye" の順番で実行されます

■ [UserJS]maximize-image.jsを更新しました

• maximize-image.js

垂直方向を基準にしてフィットしたときにホイールスクロールをすると、画面が左右にスクロールされるようにしました。あと、水平と垂直のどちらか短い方にのみフィットする設定を新しく設けました(Uキー押下)。この設定は、スクロールが1方向以内という条件下でなるべく大きく画像を表示するので、前述の横スクロールと組み合わせると良い感じで閲覧できる可能性があります。

■ [UserJS]maximize-image.jsを更新しました

• maximize-image.js

最大化とキー入力の仕様を大幅に改めました。あと、最大化の仕様変更に伴って、ホイール上下による背景色変更の機能を削除しています。自分としてはどこかのキーにこの機能も割り当てたかったんですけど、上手いキーアサインが思いつかなかったんですよね。

追記(2010-09-13)

最大化周りの不具合を思いつくだけ改善してみました。出来るだけ簡素なCSS処理でまとめたいのですが、力及ばずこのような形になっています。というか、まだ瑕疵の無い動作が出来ているという自信は無いんですけれども。

追記(2010-09-16)

画像ロード時の処理などの細かい修正のみで、最大化周りは特に変わっていないです。あと、上記の紹介ページを書き直したので、良かったら読んでみて下さい。