window.onload= function() {
    var W= 1200;
    var H= 240;
    var LINKS= [
        '/jss/downloads',
        '/jss/ssoplugin',
        '/jss/quotes'
    ]
    var TEXTPOSITIONS= [
        [ [0, 0, 129, 80, 0, 12], [0, 84, 178, 94, 0, 60], [0, 196, 168, 119, 0, 104], [0, 329, 406, 27, 162, 206] ],
        [ [180, 0, 120, 80, 0, 12], [180, 84, 143, 94, 40, 60], [180, 196, 246, 95, 0, 122], [0, 356, 375, 27, 240, 204] ],
        [ [428, 0, 139, 80, 0, 12], [428, 84, 124, 109, -40, 54], [428, 196, 100, 127, 0, 92], [0, 383, 315, 27, 96, 204] ]
    ];
    var WOBBLEPX= 110;
    var WOBBLEGAMMA= 0.7;
    var MAXVEL= 0.2;
    var FRAME= 32;
    var SCENEPERIOD= 8000;
    var SCROLLPERIOD= 10000;
    var SCROLLPX= -160;
    var SCENEN= 3;
    var SCENEFADE= 700;
    var TEXTAPPEAR= [1000, 2400, 3800, 5200];
    var TEXTREVEAL= 1500;
    var TEXTFLY= [[250, 500, 120], [900, 600, 150], [50, 400, 180], [50, 400, 180]];

    var home= id('mast-home');
    var fadein= id('mast-fadein');
    var ieclick= id('mast-ieclick');
    var texts= [id('mast-text1'), id('mast-text2'), id('mast-text3'), id('mast-text4')];

    var currentwobble= 0, targetwobble= 0;
    var mouseisover= false;

    var scenei,  scenestage, scenebegin, oldscenebegin;
    scenei=scenestage= 0;
    scenebegin=oldscenebegin= new Date().getTime()-SCENEFADE;
    ieclick.style.visibility= 'hidden';
    
    fadein.onmousemove= function(e) {
        setWobble((e || window.event).clientX - document.documentElement.scrollLeft);
    };
    fadein.onmouseover= function(e) {
        setWobble((e || window.event).clientX - document.documentElement.scrollLeft);
        mouseisover= true;
    };
    fadein.onmouseout= function(e) {
        setWobble((e || window.event).clientX - document.documentElement.scrollLeft);
        mouseisover= false;
        targetwobble= 0;
    };
    function setWobble(x) {
        var mousepx= (x/fadein.offsetWidth)*2-1;
        targetwobble= mousepx<-1? -1 : mousepx>1? 1 : Math.pow(Math.abs(mousepx), WOBBLEGAMMA)*(mousepx<0? -1 : 1);
    };

    setInterval(function() {
        var now= new Date().getTime();
        var t= now-scenebegin;

        // Scene events
        //
        if (t>SCENEPERIOD && !mouseisover) {
            scenei= (scenei+1)%SCENEN;
            oldscenebegin= scenebegin;
            scenebegin= now;
            scenestage= 0;
            t= 0;
        }
        if (t<SCENEFADE) {
            setOpacity(fadein.style, t/SCENEFADE);
        } else if (scenestage<1) {
            scenestage= 1;
            oldscenei= scenei;
            for (var i= 0; i<texts.length; i++) {
                var s= texts[i].style;
                setOpacity(s, 0);
                var tp= TEXTPOSITIONS[scenei][i];
                s.backgroundPosition= (-tp[0])+'px '+(-tp[1])+'px';
                s.width= tp[2]+'px';
                s.height= tp[3]+'px';
                s.top= tp[5]+'px';
            }
            fadein.href= LINKS[scenei];
            setOpacity(fadein.style, 0);
            if (scenei===2)
                ieclick.style.visibility= 'hidden';
        } else if (scenei==1) {
            var im= (
                t<2500? 0 :
                t<3000? 1 :
                t<3400? 0 :
                2
            );
            ieclick.style.visibility= im===0? 'hidden' : 'visible';
            ieclick.style.backgroundPosition= im===2? '0 -128px' : '0 0';
        }

        var oldt= now-oldscenebegin;
        var oldscenei= (scenei+SCENEN-1)%SCENEN;

        // Add parallax wobble
        //
        var dpx= targetwobble-currentwobble*0.8;
        dpx= Math.abs(dpx)>MAXVEL? (dpx<0? -MAXVEL : MAXVEL) : dpx;
        currentwobble+= dpx;
        var x0= fadein.offsetWidth/2-W/2;

        var sc= 1/SCROLLPERIOD*Math.PI/2;
        var dt= t>SCROLLPERIOD? 1 : Math.sin(t*sc)*2-1;
        var xb= x0-WOBBLEPX*currentwobble+dt*SCROLLPX;
        if (scenestage<1) {
            var olddt= oldt>SCROLLPERIOD? 1 : Math.sin(oldt*sc)*2-1;
            var oldxb= x0-WOBBLEPX*currentwobble+olddt*SCROLLPX;
            home.style.backgroundPosition= oldxb+'px '+oldscenei*-H+'px';
            fadein.style.backgroundPosition= xb+'px '+scenei*-H+'px';
            ieclick.style.left= oldxb+786+'px';
        } else {
            home.style.backgroundPosition= xb+'px '+scenei*-H+'px';
            ieclick.style.left= xb+786+'px';
        }

        // Fly text
        //
        var tt= (scenestage<1)? oldt : t;
        var dtt= (scenestage<1)? olddt : dt;
        var sceneit= (scenestage<1)? oldscenei : scenei;
        for (var i= texts.length; i-->0;) {
            var f= (tt-TEXTAPPEAR[i])/TEXTREVEAL;
            var s= texts[i].style;
            setOpacity(s, f<0? 0 : f>1? 1 : f);
            var dx= TEXTFLY[i][1]*dtt+TEXTFLY[i][0]*(1-dtt)
            s.left= x0+dx-TEXTFLY[i][2]*currentwobble+TEXTPOSITIONS[sceneit][i][4]+'px';
        }
    }, FRAME);

    var oldie= !('opacity' in document.body.style);
    function setOpacity(style, opacity) {
        if (oldie) style.filter= 'alpha(opacity='+Math.round(opacity*100)+')';
        else style.opacity= opacity;
    }
};