« Emacsでの見た目そのままにソースコードをブラウザで開くコマンドを作った | メイン | 第19回HTML5とか勉強会発表資料 »

ブラウザで開いているタブが最前面かどうかを判断する

最新のブラウザの一部は、パフォーマンス向上を目的として、バックグラウンドタブのsetTimeoutとsetIntervalのタイマー間隔が最短で1000msになった。この時間差を利用すると、タブが最前面かどうかを判断することができる。以下、実証コード。
var xGround=function(listeners){
    var interval=100;
    var preTime=new Date().getTime();
    var preStatus=null;
    var timer=function(){
        var nowTime=new Date().getTime();
        var xGround=(Math.abs(nowTime-preTime-interval)<100)?"fg":"bg";
        var switchFlag=((preStatus||xGround)!==xGround);
        switch(true){
        case (xGround==="fg")&&switchFlag:
            listeners.switchForeGround&&listeners.switchForeGround();
        case (xGround==="fg"):
            listeners.foreGround&&listeners.foreGround();
            break;
        case (xGround==="bg")&&switchFlag:
            listeners.switchBackGround&&listeners.switchBackGround();
        case (xGround==="bg"):
            listeners.backGround&&listeners.backGround();
            break;
        }
        preTime=nowTime;
        preStatus=xGround;
    };
    setInterval(timer,interval);
};
var obj={
    switchForeGround:function(){console.log("switch foreground");},
    switchBackGround:function(){console.log("switch background");},
    foreGround:function(){console.log("foreground");},
    backGround:function(){console.log("background");}
};
xGround(obj);
解説は省略。

コメント (2)

Os0x [TypeKey Profile Page]:

ちなみに、まさにそういう仕様も用意されています。 http://dvcs.w3.org/hg/webperf/raw-file/tip/specs/PageVisibility/Overview.html
今のところ、Chrome開発版、IE10 Preview版で実装されています。

Kanasansoft [TypeKey Profile Page]:

情報ありがとうございます。
ホント、そのままのものですね。

コメントを投稿

(いままで、ここでコメントしたことがないときは、コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)

Google

タグ クラウド