var theTimer = null;
var theElem  = null;
var tetaS;

isIE = !(document.addEventListener);

function show(){
	if(tetaS >= 1){
		clearInterval(theTimer);
		return;
	}
	
	if(!isIE){
		theElem.style.opacity = Math.sin(tetaS);
	}
	else {
		
		theElem.style.filter = "alpha(opacity="+parseInt(Math.sin(tetaS)*100)+")";
	}
	tetaS += 5*(Math.PI/180);
}

function startTimer(evt){
	if(theTimer == null){
		if(isIE){
			theElem = window.event.srcElement;
		} else {
			theElem = evt.target;	
		}
		tetaS = 0;
		if(!isIE) {
			theElem.style.opacity = "0";
		}
		else {
			theElem.style.filter = "alpha(opacity=0)";
		}
		
		theTimer = setInterval(show, 100);
	}
}

function clearTimer(evt){
	if(!isIE){
		theElem.style.opacity = "0";
	}
	else {
		theElem.style.filter  = "alpha(opacity=0)";
	}
	//theElem = null;
	tetaS = 0;
	clearInterval(theTimer);
	theTimer = null;
}

function setMeteo() {
	document.getElementById("meteo").src = "http://www.csrl.qc.ca/mgrsevigny/meteo/marinalive.html";
}

function registerEvents(){
	if(!isIE){
		document.getElementById("btnAcc").addEventListener("mouseover", startTimer, false);
		document.getElementById("btnHist").addEventListener("mouseover", startTimer, false);
		document.getElementById("btnPic").addEventListener("mouseover", startTimer, false);
		document.getElementById("btnCont").addEventListener("mouseover", startTimer, false);
		document.getElementById("btnAct").addEventListener("mouseover", startTimer, false);

		document.getElementById("btnPic").addEventListener("mouseout", clearTimer, false);
		document.getElementById("btnCont").addEventListener("mouseout", clearTimer, false);
		document.getElementById("btnHist").addEventListener("mouseout", clearTimer, false);
		document.getElementById("btnAcc").addEventListener("mouseout", clearTimer, false);
		document.getElementById("btnAct").addEventListener("mouseout", clearTimer, false);
	} else {
		document.getElementById("btnAcc").attachEvent("onmouseover", startTimer);
		document.getElementById("btnHist").attachEvent("onmouseover", startTimer);
		document.getElementById("btnPic").attachEvent("onmouseover", startTimer);
		document.getElementById("btnCont").attachEvent("onmouseover", startTimer);
		document.getElementById("btnAct").attachEvent("onmouseover", startTimer);

		document.getElementById("btnPic").attachEvent("onmouseout", clearTimer);
		document.getElementById("btnCont").attachEvent("onmouseout", clearTimer);
		document.getElementById("btnHist").attachEvent("onmouseout", clearTimer);
		document.getElementById("btnAcc").attachEvent("onmouseout", clearTimer);
		document.getElementById("btnAct").attachEvent("onmouseout", clearTimer);
	}

	// Delay loading the weather thingy
	window.setTimeout(setMeteo, 5000);

} 
window.onload = registerEvents;