window.addEvent('domready', function(){

// set the properties for the floating tabs

	$('highlight_oten').setStyle('background-color','#990000');
	$('highlight_oten').setStyle('opacity',.9);

	$('highlight_symo').setStyle('background-color','#104331');
	$('highlight_symo').setStyle('opacity',.9);

	$('highlight_econ').setStyle('background-color','#1E2678');
	$('highlight_econ').setStyle('opacity',.9);

	$('highlight_dara').setStyle('background-color','#b14700');
	$('highlight_dara').setStyle('opacity',.9);
	
	$('highlight_prop').setStyle('background-color','#1b587f');
	$('highlight_prop').setStyle('opacity',.9);
	
	$('highlight_prss').setStyle('background-color','#b14700');
	$('highlight_prss').setStyle('opacity',.9);
	
	$('highlight_stpo').setStyle('background-color','#141c78');
	$('highlight_stpo').setStyle('opacity',.9);
	
	$('highlight_inst').setStyle('background-color','#990000');
	$('highlight_inst').setStyle('opacity',.9);
	
	imViewing = 'home';

// like a reset functions used in all categories

muteAll = function() {

	$('oten').setStyle('background-image','url(images/div_bg.jpg)');
	$('symo').setStyle('background-image','url(images/div_bg.jpg)');
	$('econ').setStyle('background-image','url(images/div_bg.jpg)');
	$('dara').setStyle('background-image','url(images/div_bg.jpg)');
	$('prop').setStyle('background-image','url(images/div_bg.jpg)');
	$('prss').setStyle('background-image','url(images/div_bg.jpg)');
	$('stpo').setStyle('background-image','url(images/div_bg.jpg)');
	$('inst').setStyle('background-image','url(images/div_bg.jpg)');

	//moving text Anim
	$('highlight_oten').set('tween', {}).tween('height', '0px');
	$('highlight_symo').set('tween', {}).tween('height', '0px');
	$('highlight_econ').set('tween', {}).tween('height', '0px');
	$('highlight_dara').set('tween', {}).tween('height', '0px');
	$('highlight_prop').set('tween', {}).tween('height', '0px');			
	$('highlight_prss').set('tween', {}).tween('height', '0px');	
	$('highlight_stpo').set('tween', {}).tween('height', '0px');			
	$('highlight_inst').set('tween', {}).tween('height', '0px');	
};

// home Active

homeActive = function() {
	imViewing = 'home';
	muteAll();
	$('main').setStyle('background-image', 'url(images/main.jpg)');

	// not related to animation
	$('imagine-future').setStyle('display', '');

};


// accepts a string value so pass which categorie you want to make active

var elemActive = function(elem) {

	muteAll();
	imViewing = elem;
	mainImg = 'images/main_'+elem+'_2.jpg';
	mainBg  = 'images/div_bg_'+elem+'.jpg';
	$('main').setStyle('background-image', 'url('+mainImg+')');
	$('main').setStyle('height', '444px');

$(elem).setStyle('background-image', 'url('+mainBg+')');

	$('highlight_'+elem).set('tween', {
			duration: 1800,
			transition: Fx.Transitions.Quad.easeOut // This could have been also 'bounce:out'
		}).tween('height', '172px');
	
	// not related to animation
	$('imagine-future').setStyle('display', 'none');
	$('future').setStyle('display','none');
};



	$('oten').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('oten');
		},
		'mouseleave':function(){
			$('highlight_oten').set('tween',{}).tween('height','172px');
		}
	});										 

	$('symo').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('symo');
		},
		'mouseleave':function(){
			$('highlight_symo').set('tween',{}).tween('height','172px');			
		}
	});

	$('econ').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('econ');
		},
		'mouseleave':function(){
			$('highlight_econ').set('tween',{}).tween('height','172px');			
		}
	});

	$('dara').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('dara');
		},
		'mouseleave':function(){
			$('highlight_dara').set('tween',{}).tween('height','172px');			
		}
	});

	$('prop').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('prop');
		},
		'mouseleave':function(){
			$('highlight_prop').set('tween',{}).tween('height','172px');			
		}
	});
	
$('prss').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('prss');
		},
		'mouseleave':function(){
			$('highlight_prss').set('tween',{}).tween('height','172px');			
		}
	});
$('stpo').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('stpo');
		},
		'mouseleave':function(){
			$('highlight_stpo').set('tween',{}).tween('height','172px');			
		}
	});
	
$('inst').addEvents({
		'mouseover':function(){
			stopAll();
			elemActive('inst');
		},
		'mouseleave':function(){
			$('highlight_inst').set('tween',{}).tween('height','172px');			
		}
	});

delayDuration = 7000;

callOnLoad = function() {

	theDelay9 = homeActive.delay(1,this);
	theDelay1 = elemActive.delay(delayDuration*1,this,'oten');
	theDelay2 = elemActive.delay(delayDuration*2,this,'symo');
	theDelay3 = elemActive.delay(delayDuration*3,this,'econ');
	theDelay4 = elemActive.delay(delayDuration*4,this,'dara');
	theDelay5 = elemActive.delay(delayDuration*5,this,'prop');
	theDelay6 = elemActive.delay(delayDuration*6,this,'prss');
	theDelay7 = elemActive.delay(delayDuration*7,this,'stpo');
	theDelay8 = elemActive.delay(delayDuration*8,this,'inst');
	//	theDelay9 = homeActive.delay(delayDuration*8,this);	
};


callAfterLoad = function() {

	theDelay1 = elemActive.delay(1,this,'oten');
	theDelay2 = elemActive.delay(delayDuration*1,this,'symo');
	theDelay3 = elemActive.delay(delayDuration*2,this,'econ');
	theDelay4 = elemActive.delay(delayDuration*3,this,'dara');
	theDelay5 = elemActive.delay(delayDuration*4,this,'prop');
	theDelay6 = elemActive.delay(delayDuration*5,this,'prss');
	theDelay7 = elemActive.delay(delayDuration*6,this,'stpo');
	theDelay8 = elemActive.delay(delayDuration*7,this,'inst');
	theDelay9 = homeActive.delay(delayDuration*8,this);	
};

callAfterLoadPeriodically = function() {
	callAfterLoad();
	thePeridocial = callAfterLoad.periodical(delayDuration*7,this);
};

callOnLoadPeriodically = function() {
	callOnLoad();
	thePeridocial = callOnLoad.periodical(delayDuration*7,this);
};

//  theTimer = callOnLoadPeriodically.delay(6000,this);
 theTimer = callOnLoadPeriodically();

stopAll = function() {

	$('btnStop').setStyle('display','none');
	$('btnResume').setStyle('display','');
	
	$clear(theDelay1);
	$clear(theDelay2);
	$clear(theDelay3);
	$clear(theDelay4);
	$clear(theDelay5);
	$clear(theDelay6);
	$clear(theDelay7);
	$clear(theDelay8);
	$clear(theDelay9);
	$clear(thePeridocial);
	$clear(theTimer);
// 	homeActive();
};

	$('btnStop').addEvent('click',function() {
		stopAll();
		homeActive();
		this.setStyle('display','none');
		$('btnResume').setStyle('display','');
	}); // btnStop
	
	$('btnResume').addEvent('click',function() {
		theTimer = callAfterLoadPeriodically();
		this.setStyle('display','none');
		$('btnStop').setStyle('display','');
												 
	});

goNext = function() {
	if(imViewing == 'home') {
		elemActive('oten');	
	} else if(imViewing == 'oten') {
		elemActive('symo');
	} else if(imViewing == 'symo') {
		elemActive('econ');
	} else if(imViewing == 'econ') {
		elemActive('dara');
	} else if(imViewing == 'dara') {
		elemActive('prop');
	} else if(imViewing == 'prop') {
		elemActive('prss');
	} else if(imViewing == 'prss') {
		elemActive('stpo');
	} else if(imViewing == 'stpo') {
		elemActive('inst');
	} else if(imViewing == 'inst') {
		homeActive();	
	}				  
};

goPrevious = function() {
	if(imViewing == 'home') {
		elemActive('inst');
	} else if(imViewing == 'inst') {
		elemActive('stpo');
	} else if(imViewing == 'stpo') {
	elemActive('prss');
	} else if(imViewing == 'prss') {
		elemActive('prop');
	} else if(imViewing == 'prop') {		
		elemActive('dara');
	} else if(imViewing == 'dara') {
		elemActive('econ');
	} else if(imViewing == 'econ') {
		elemActive('symo');
	} else if(imViewing == 'symo') {
		elemActive('oten');
	} else if(imViewing == 'oten') {
		homeActive();
	}
	
};


	$('btnNext').addEvent('click',function() {
		stopAll();
		goNext();
	});

	$('btnPrevious').addEvent('click',function() {
		stopAll();
		goPrevious();
	});

}); // DOM