/* BEGIN ONLOAD SCRIPT */

var loaded=false;
functions=[];
functionOnLoad=function() {
    if(loaded)
        return;
    loaded=true;
    for(var i=0,j=functions.length;i<j;i++)
        functions[i]();
};
voerUitOnLoad=function(theFunction) {
    if(loaded)
        theFunction();
    else
        functions.push(theFunction);
};

//the idea for this onload script is from http://dean.edwards.name/
if(document.addEventListener)
    document.addEventListener("DOMContentLoaded", functionOnLoad, false);
/*@cc_on @*/
/*@if (@_win32)
document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
var script=document.getElementById("__ie_onload");
script.onreadystatechange = function() {
    if(this.readyState=="complete")
        functionOnLoad();
};
/*@end @*/
if(/WebKit/i.test(navigator.userAgent))
    var _timer=setInterval(function() {
        if(loaded)
            clearInterval(_timer);
        if(/loaded|complete/.test(document.readyState)) {
            clearInterval(_timer);
            functionOnLoad();
        }
    },50);

window.onload=functionOnLoad;

/* END ONLOAD SCRIPT */

var interval=[];
var imgIDs=["youngbits","linkvive","spudu","future"];
fadeIn=function(id) {
    var image=document.getElementById(id);
    //make sure the other Intervals don't interfere
    clearInterval(interval[id]);
    //auto detect opacity
    var i=Math.round(getOpacity(image)*20);
    //you never know
    if(i==NaN)
        i=0;
    else if(i < 0)
        i=0;
    else if(i > 20)
        i=20;
    interval[id]=setInterval(function() {
        //increase opacity by 1/20
        i+=1;
        //set opacity
        setOpacity(image,i/20);
        //stop if opacity level is 20/20
        if(i >= 20) {
            clearInterval(interval[id]);
        }
    },50);
};
fadeOut=function(id) {
    var image=document.getElementById(id);
    //make sure the other Intervals don't interfere
    clearInterval(interval[id]);
    //auto detect opacity
    var i=Math.round(getOpacity(image)*20);
    //you never know
    if(i==NaN)
        i=20;
    else if(i < 0)
        i=0;
    else if(i > 20)
        i=20;
    interval[id]=setInterval(function() {
        //decrease opacity by 1/20
        i-=1;
        //set opacity
        setOpacity(image,i/20);
        //stop if opacity level is 0/20
        if(i <= 0) {
            clearInterval(interval[id]);
        }
    },50);
};
functions.push(function() {
    //define setOpacity if it can be set on an arbitrary element (the body)
    if("opacity" in document.body.style) {
        setOpacity=function(el,o) {
            el.style.opacity=o;
        };
        getOpacity=function(el) {
            return el.style.opacity;
        };
    }
    else if("-moz-opacity" in document.body.style) {
        setOpacity=function(el,o) {
            el.style.MozOpacity=o;
        };
        getOpacity=function(el) {
            return el.style.MozOpacity;
        };
    }
    else if("-khtml-opacity" in document.body.style) {
        setOpacity=function(el,o) {
            el.style.KhtmlOpacity=o;
        };
        getOpacity=function(el) {
            return el.style.KhtmlOpacity;
        };
    }
    else if("filter" in document.body.style) {
        setOpacity=function(el,o) {
            el.style.filter="alpha(opacity="+Math.round(o*100)+")";
        };
        getOpacity=function(el) {
            //sloppy
            return parseInt(el.style.filter.substr(14),10)/100;
        };
    }
    //alternative: no fade, only coloring onmouseover
    else {
        setOpacity=function(el,o) {
            el.style.visibility=o>0?"visible":"hidden";
        };
        getOpacity=function(el) {
            return el.style.visibility=="visibile"?1:0;
        };
    }
    var imgEl,imgElHolder;
    for(var i=0;i<imgIDs.length;i++) {
        var ID=imgIDs[i];
        imgEl=document.getElementById(ID);
        imgElHolder=document.getElementById(ID+"-holder");
        setOpacity(imgEl,0);
        eval("imgElHolder.onmouseover=function(){fadeIn(\""+ID+"\");};");
        eval("imgElHolder.onmouseout=function(){fadeOut(\""+ID+"\");};");
    }
});