var counter = 0;
var tiempo = 5000;
var timeout=0;
var timerid=0;
var state=1;
function playpause(){
	if(state==0){
		//alert(state);
		state=1;
		document.getElementById('bp').innerHTML = "<img src=\"http://www.upf.tv/NewMOST/images/pause.png\">";
		clearTimeout(timeout);
		rotator(timerid);
	}
	else{
		//alert(state);
		state=0;
		document.getElementById('bp').innerHTML = "<img src=\"http://www.upf.tv/NewMOST/images/play.png\">";
		clearTimeout(timeout);
	}
	//document.getElementById('pause').innerHTML = state+'\n'+timeout;
}
function rotator(counter){
	if(state!=0){
		//alert('rotator: '+counter+'\nstate: '+state);
		switch(counter){
			case 1:		document.getElementById('b1').className = 'buttonred';
						document.getElementById('b2').className = 'buttonwhite';
						document.getElementById('b3').className = 'buttonwhite';
						document.getElementById('b4').className = 'buttonwhite';
						document.getElementById('b5').className = 'buttonwhite';
						document.getElementById('b6').className = 'buttonwhite';
						document.getElementById('b7').className = 'buttonwhite';
						document.getElementById('myElement1p').className = 'showme';
						document.getElementById('myElement1t').className = 'showme';
						$('myElement1t').fade(1);
						$('myElement1p').fade(1);
						$('myElement2t').fade(0);
						$('myElement2p').fade(0);
						$('myElement3t').fade(0);
						$('myElement3p').fade(0);
						$('myElement4t').fade(0);
						$('myElement4p').fade(0);
						$('myElement5t').fade(0);
						$('myElement5p').fade(0);
						$('myElement6t').fade(0);
						$('myElement6p').fade(0);
						$('myElement7t').fade(0);					
						$('myElement7p').fade(0);					
						document.getElementById('myElement2p').className = 'hideme';
						document.getElementById('myElement2t').className = 'hideme';
						document.getElementById('myElement3p').className = 'hideme';
						document.getElementById('myElement3t').className = 'hideme';
						document.getElementById('myElement4p').className = 'hideme';
						document.getElementById('myElement4t').className = 'hideme';
						document.getElementById('myElement5p').className = 'hideme';
						document.getElementById('myElement5t').className = 'hideme';
						document.getElementById('myElement6p').className = 'hideme';
						document.getElementById('myElement6t').className = 'hideme';
						document.getElementById('myElement7p').className = 'hideme';
						document.getElementById('myElement7t').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 1;
						timeout = setTimeout("rotator(2)", tiempo);
						break;
			case 2:		document.getElementById('b2').className = 'buttonred';
						document.getElementById('b1').className = 'buttonwhite';
						document.getElementById('b3').className = 'buttonwhite';
						document.getElementById('b4').className = 'buttonwhite';
						document.getElementById('b5').className = 'buttonwhite';
						document.getElementById('b6').className = 'buttonwhite';
						document.getElementById('b7').className = 'buttonwhite';
						document.getElementById('myElement2t').className = 'showme';
						document.getElementById('myElement2p').className = 'showme';
						$('myElement2t').fade(1);
						$('myElement2p').fade(1);
						$('myElement1t').fade(0);
						$('myElement1p').fade(0);
						$('myElement3t').fade(0);
						$('myElement3p').fade(0);
						$('myElement4t').fade(0);
						$('myElement4p').fade(0);
						$('myElement5t').fade(0);
						$('myElement5p').fade(0);
						$('myElement6t').fade(0);
						$('myElement6p').fade(0);
						$('myElement7t').fade(0);					
						$('myElement7p').fade(0);					
						document.getElementById('myElement1t').className = 'hideme';
						document.getElementById('myElement1p').className = 'hideme';
						document.getElementById('myElement3t').className = 'hideme';
						document.getElementById('myElement3p').className = 'hideme';
						document.getElementById('myElement4t').className = 'hideme';
						document.getElementById('myElement4p').className = 'hideme';
						document.getElementById('myElement5t').className = 'hideme';
						document.getElementById('myElement5p').className = 'hideme';
						document.getElementById('myElement6t').className = 'hideme';
						document.getElementById('myElement6p').className = 'hideme';
						document.getElementById('myElement7t').className = 'hideme';
						document.getElementById('myElement7p').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 2;
						timeout = setTimeout("rotator(3)", tiempo);
						break;
			case 3:		document.getElementById('b3').className = 'buttonred';
						document.getElementById('b2').className = 'buttonwhite';
						document.getElementById('b1').className = 'buttonwhite';
						document.getElementById('b4').className = 'buttonwhite';
						document.getElementById('b5').className = 'buttonwhite';
						document.getElementById('b6').className = 'buttonwhite';
						document.getElementById('b7').className = 'buttonwhite';
						document.getElementById('myElement3t').className = 'showme';
						document.getElementById('myElement3p').className = 'showme';
						$('myElement3t').fade(1);
						$('myElement3p').fade(1);
						$('myElement1t').fade(0);
						$('myElement1p').fade(0);
						$('myElement2t').fade(0);
						$('myElement2p').fade(0);
						$('myElement4t').fade(0);
						$('myElement4p').fade(0);
						$('myElement5t').fade(0);
						$('myElement5p').fade(0);
						$('myElement6t').fade(0);
						$('myElement6p').fade(0);
						$('myElement7t').fade(0);					
						$('myElement7p').fade(0);					
						document.getElementById('myElement1t').className = 'hideme';
						document.getElementById('myElement1p').className = 'hideme';
						document.getElementById('myElement2t').className = 'hideme';
						document.getElementById('myElement2p').className = 'hideme';
						document.getElementById('myElement4t').className = 'hideme';
						document.getElementById('myElement4p').className = 'hideme';
						document.getElementById('myElement5t').className = 'hideme';
						document.getElementById('myElement5p').className = 'hideme';
						document.getElementById('myElement6t').className = 'hideme';
						document.getElementById('myElement6p').className = 'hideme';
						document.getElementById('myElement7t').className = 'hideme';
						document.getElementById('myElement7p').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 3;
						timeout = setTimeout("rotator(4)", tiempo);
						break;
			case 4:		document.getElementById('b4').className = 'buttonred';
						document.getElementById('b2').className = 'buttonwhite';
						document.getElementById('b3').className = 'buttonwhite';
						document.getElementById('b1').className = 'buttonwhite';
						document.getElementById('b5').className = 'buttonwhite';
						document.getElementById('b6').className = 'buttonwhite';
						document.getElementById('b7').className = 'buttonwhite';
						document.getElementById('myElement4p').className = 'showme';
						document.getElementById('myElement4t').className = 'showme';
						$('myElement4p').fade(1);
						$('myElement4t').fade(1);
						$('myElement1p').fade(0);
						$('myElement1t').fade(0);
						$('myElement2p').fade(0);
						$('myElement2t').fade(0);
						$('myElement3p').fade(0);
						$('myElement3t').fade(0);
						$('myElement5p').fade(0);
						$('myElement5t').fade(0);
						$('myElement6p').fade(0);
						$('myElement6t').fade(0);
						$('myElement7p').fade(0);					
						$('myElement7t').fade(0);					
						document.getElementById('myElement1p').className = 'hideme';
						document.getElementById('myElement1t').className = 'hideme';
						document.getElementById('myElement2p').className = 'hideme';
						document.getElementById('myElement2t').className = 'hideme';
						document.getElementById('myElement3p').className = 'hideme';
						document.getElementById('myElement3t').className = 'hideme';
						document.getElementById('myElement5p').className = 'hideme';
						document.getElementById('myElement5t').className = 'hideme';
						document.getElementById('myElement6p').className = 'hideme';
						document.getElementById('myElement6t').className = 'hideme';
						document.getElementById('myElement7p').className = 'hideme';
						document.getElementById('myElement7t').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 4;
						timeout = setTimeout("rotator(5)", tiempo);
						break;
			case 5:		document.getElementById('b5').className = 'buttonred';
						document.getElementById('b2').className = 'buttonwhite';
						document.getElementById('b3').className = 'buttonwhite';
						document.getElementById('b4').className = 'buttonwhite';
						document.getElementById('b1').className = 'buttonwhite';
						document.getElementById('b6').className = 'buttonwhite';
						document.getElementById('b7').className = 'buttonwhite';
						document.getElementById('myElement5p').className = 'showme';
						document.getElementById('myElement5t').className = 'showme';
						$('myElement5p').fade(1);
						$('myElement5t').fade(1);
						$('myElement1p').fade(0);
						$('myElement1t').fade(0);
						$('myElement2p').fade(0);
						$('myElement2t').fade(0);
						$('myElement3p').fade(0);
						$('myElement3t').fade(0);
						$('myElement4p').fade(0);
						$('myElement4t').fade(0);
						$('myElement6p').fade(0);
						$('myElement6t').fade(0);
						$('myElement7p').fade(0);					
						$('myElement7t').fade(0);					
						document.getElementById('myElement1p').className = 'hideme';
						document.getElementById('myElement1t').className = 'hideme';
						document.getElementById('myElement2p').className = 'hideme';
						document.getElementById('myElement2t').className = 'hideme';
						document.getElementById('myElement3p').className = 'hideme';
						document.getElementById('myElement3t').className = 'hideme';
						document.getElementById('myElement4p').className = 'hideme';
						document.getElementById('myElement4t').className = 'hideme';
						document.getElementById('myElement6p').className = 'hideme';
						document.getElementById('myElement6t').className = 'hideme';
						document.getElementById('myElement7p').className = 'hideme';
						document.getElementById('myElement7t').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 5;
						timeout = setTimeout("rotator(6)", tiempo);
						break;
			case 6:		document.getElementById('b6').className = 'buttonred';
						document.getElementById('b2').className = 'buttonwhite';
						document.getElementById('b3').className = 'buttonwhite';
						document.getElementById('b4').className = 'buttonwhite';
						document.getElementById('b5').className = 'buttonwhite';
						document.getElementById('b1').className = 'buttonwhite';
						document.getElementById('b7').className = 'buttonwhite';
						document.getElementById('myElement6t').className = 'showme';
						document.getElementById('myElement6p').className = 'showme';
						$('myElement6t').fade(1);
						$('myElement6p').fade(1);
						$('myElement1t').fade(0);
						$('myElement1p').fade(0);
						$('myElement2t').fade(0);
						$('myElement2p').fade(0);
						$('myElement3t').fade(0);
						$('myElement3p').fade(0);
						$('myElement4t').fade(0);
						$('myElement4p').fade(0);
						$('myElement5t').fade(0);
						$('myElement5p').fade(0);
						$('myElement7t').fade(0);					
						$('myElement7p').fade(0);					
						document.getElementById('myElement1t').className = 'hideme';
						document.getElementById('myElement1p').className = 'hideme';
						document.getElementById('myElement2t').className = 'hideme';
						document.getElementById('myElement2p').className = 'hideme';
						document.getElementById('myElement3t').className = 'hideme';
						document.getElementById('myElement3p').className = 'hideme';
						document.getElementById('myElement4t').className = 'hideme';
						document.getElementById('myElement4p').className = 'hideme';
						document.getElementById('myElement5t').className = 'hideme';
						document.getElementById('myElement5p').className = 'hideme';
						document.getElementById('myElement7t').className = 'hideme';
						document.getElementById('myElement7p').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 6;
						timeout = setTimeout("rotator(7)", tiempo);
						break;
			case 7:		document.getElementById('b7').className = 'buttonred';
						document.getElementById('b2').className = 'buttonwhite';
						document.getElementById('b3').className = 'buttonwhite';
						document.getElementById('b4').className = 'buttonwhite';
						document.getElementById('b5').className = 'buttonwhite';
						document.getElementById('b6').className = 'buttonwhite';
						document.getElementById('b1').className = 'buttonwhite';
						document.getElementById('myElement7t').className = 'showme';
						document.getElementById('myElement7p').className = 'showme';
						$('myElement7t').fade(1);
						$('myElement7p').fade(1);
						$('myElement1t').fade(0);
						$('myElement1p').fade(0);
						$('myElement2t').fade(0);
						$('myElement2p').fade(0);
						$('myElement3t').fade(0);
						$('myElement3p').fade(0);
						$('myElement4t').fade(0);
						$('myElement4p').fade(0);
						$('myElement5t').fade(0);
						$('myElement5p').fade(0);
						$('myElement6t').fade(0);					
						$('myElement6p').fade(0);
						document.getElementById('myElement1p').className = 'hideme';
						document.getElementById('myElement1t').className = 'hideme';
						document.getElementById('myElement2p').className = 'hideme';
						document.getElementById('myElement2t').className = 'hideme';
						document.getElementById('myElement3p').className = 'hideme';
						document.getElementById('myElement3t').className = 'hideme';
						document.getElementById('myElement4p').className = 'hideme';
						document.getElementById('myElement4t').className = 'hideme';
						document.getElementById('myElement5p').className = 'hideme';
						document.getElementById('myElement5t').className = 'hideme';
						document.getElementById('myElement6p').className = 'hideme';
						document.getElementById('myElement6t').className = 'hideme';
						document.getElementById('myElement8p').className = 'hideme';
						timerid = 7;
						timeout = setTimeout("rotator(1)", tiempo);
						break;
		}	
	}
}
function videoPlayer(){
	document.getElementById('myElement1p').className = 'hideme';
	document.getElementById('myElement1t').className = 'hideme';
	document.getElementById('myElement2p').className = 'hideme';
	document.getElementById('myElement2t').className = 'hideme';
	document.getElementById('myElement3p').className = 'hideme';
	document.getElementById('myElement3t').className = 'hideme';
	document.getElementById('myElement4p').className = 'hideme';
	document.getElementById('myElement4t').className = 'hideme';
	document.getElementById('myElement5p').className = 'hideme';
	document.getElementById('myElement5t').className = 'hideme';
	document.getElementById('myElement6p').className = 'hideme';
	document.getElementById('myElement6t').className = 'hideme';
	document.getElementById('buttons').className = 'hideme';
	document.getElementById('myElement8p').className = 'showme';	
}
function comeBack(){
	document.getElementById('buttons').className = 'showme';
}