var hoverButton = {
	init : function() {		
		arrButtons = $$('.hover_button');
		
		for (var i=0; i<arrButtons.length; i++) {
			arrButtons[i].addEvent('mouseover', hoverButton.setOver);	
			arrButtons[i].addEvent('mouseout', hoverButton.setOff);
		}
		
	},
	setOver : function() {
		buttonImageSource = this.src;
		this.src = buttonImageSource.replace('_off.', '_hover.');
	}, 
	setOff : function() {
		buttonImageSource = this.src;
		if (buttonImageSource.indexOf('_hover.') != -1) {
			this.src = buttonImageSource.replace('_hover.', '_off.');
		}
	}
}

window.addEvent('domready', hoverButton.init);



var screenshots = {
	numScreens : 0,
	currScreen : 0,
	screenContainerAnimation : null,
	screenFadeSpeed : 200,
	animating : false,
	initialized: false,		
	
	init : function() {
		var arrScreens = $$('#screen_container .screenshot');
		screenshots.numScreens = arrScreens.length;
		
		screenshots.screenContainerAnimation = new Fx.Tween('screen_container', {
			duration: 300,
			transition: Fx.Transitions.Quad.easeInOut
		});
		
		var indicatorMold = $('indicatorMold');
		
		for(i=0; i<arrScreens.length; i++) { 
			
			var screenShot = arrScreens[i];
			screenShot.id = 'screenshot' + (i+1);
			
			var screenIndicator = indicatorMold.clone();
			screenIndicator.id = 'indicator' + (i+1);
			screenIndicator.inject('screen_indicators');
			screenIndicator.href = 'javascript: screenshots.setActiveScreen('+ (i+1)*1 +')';			
			
			screenShot.removeClass('hidden');				
			
			if (i==0) {
				var initialScreenHeight = screenShot.getCoordinates().height;
				$('screen_container').setStyle('height', initialScreenHeight);
				screenshots.currScreen = 1;
				screenIndicator.addClass('active');
			}
			else {
				screenShot.setStyle('opacity',0);
				screenShot.setStyle('display','none');
			}			
			
		} // loop
		
		screenshots.initialized = true;
	},
	
	next : function() {
		if (screenshots.initialized) {
			var nextNum = screenshots.currScreen + 1;
				
			if (nextNum > screenshots.numScreens) {
				nextNum = 1;
			}
			
			screenshots.setActiveScreen(nextNum);
		}
		
		return false;
	},
	
	previous : function() {
		if (screenshots.initialized) {
			var prevNum = screenshots.currScreen - 1;
			
			if (prevNum < 1) {
				prevNum = screenshots.numScreens;
			}
			
			screenshots.setActiveScreen(prevNum);
		}
		
		return false;
	},
	
	setActiveScreen : function(screenNum) {
		if(screenshots.animating == false) {
			screenshots.animating = true;
			var currScreen = $('screenshot' + screenshots.currScreen);
			var currIndicator = $('indicator' + screenshots.currScreen);
			var newScreen = $('screenshot' + screenNum);
			var newIndicator = $('indicator' + screenNum);
						
			currScreen.set('tween', {
				duration: screenshots.screenFadeSpeed,
				transition: Fx.Transitions.Quad.easeInOut,
				onComplete: function() { 
					currIndicator.removeClass('active');
					currScreen.setStyle('display','none') ;
				}
			});	
			currScreen.tween('opacity', 0);	
			
			function resizeScreen() {		
				newScreen.setStyle('display','block');
				var newScreenSize = newScreen.getCoordinates().height;
				screenshots.screenContainerAnimation.start('height', newScreenSize);
			}
			
			function fadeInNewScreen() {
								
				newScreen.set('tween', {
					duration: screenshots.screenFadeSpeed,
					transition: Fx.Transitions.Quad.easeInOut,
					onComplete: function() { 
						newIndicator.addClass('active'); 
						screenshots.animating = false;  
					}
				});
				newScreen.tween('opacity', 1);
			}
			
			resizeScreen.delay(screenshots.screenFadeSpeed);
			fadeInNewScreen.delay(screenshots.screenFadeSpeed + 400);
			
			screenshots.currScreen = screenNum;
		}
	}
}

window.addEvent('load', screenshots.init)	;
 




/********************************************************************

	POP LAYER
	------------------------------------------------------------------------
	This controls the popup layer with the faded background (full page fade)
	
********************************************************************/

var PopLayer = new Class({
	initialize : function(options) {
		this.options = options;
		
		this.popContent = this.options.popContent;
		
		this.useShadow = this.options.useShadow;
	},
	openPop : function() {		
		this.resizeFade();
		$('popLayerFade').setStyle('visibility','visible');
		
		this.openPopContent();					
	},
	openPopContent : function() {
		if(this.useShadow) {
			this.resizeShadow();
			$('popLayerShadow').setStyles({
				'visibility':'visible'
			});
		}
		
		this.recenterElement(this.popContent);
		
		this.popContent.setStyles({
			'visibility':'visible'
		});	
	},
	closePop : function() {
		this.popContent.setStyles({
			'visibility':'hidden',
			'top': -100000000
		});	
		
		if(this.useShadow) {
			$('popLayerShadow').setStyles({
				'visibility':'hidden'
			});
		}
		
		$('popLayerFade').setStyle('visibility','hidden');
	},
	resizeShadow : function() {	
		var shadowInnerWidth = this.popContent.getCoordinates().width;
		var shadowInnerHeight = this.popContent.getCoordinates().height;
		var shadowCornerWidth = $$('#popLayerShadow .corner')[0].getCoordinates().width;
		var shadowCornerHeight = $$('#popLayerShadow .corner')[0].getCoordinates().height;
		var shadowWidth = shadowInnerWidth + (shadowCornerWidth * 2);
		var shadowHeight = shadowInnerHeight + (shadowCornerHeight * 2);
		
		$$('#popLayerShadow .topbottom').each(function(element){
			element.setStyle('width', (shadowInnerWidth-5));
		});
		
		$$('#popLayerShadow .side').each(function(element){
			element.setStyle('height', (shadowInnerHeight-5));
		});
		
		$$('#popLayerShadow .center')[0].setStyles({
			'height' : shadowInnerHeight,
			'width' : shadowInnerWidth
		});
		
		$('popLayerShadow').setStyles({
			'height' : shadowHeight,
			'width' : shadowWidth
		});
		
		this.recenterElement($('popLayerShadow'));
	},
	recenterElement : function(element) {
		elementWidth = element.getCoordinates().width;
		elementHeight = element.getCoordinates().height;
		windowWidth = window.getSize().x;
		windowHeight = window.getSize().y;
		scrollPos = window.getScroll().y;
		
		newElementLeftPos = (windowWidth / 2) - (elementWidth / 2);
		newElementTopPos = ((windowHeight / 2) + scrollPos) - (elementHeight / 2);
		
		if (newElementLeftPos < 0) {
			newElementLeftPos = 0;
		}
		
		if (newElementTopPos < 0) {
			newElementTopPos = 0;
		}
		
		element.setStyles({
			'left': newElementLeftPos,
			'top': newElementTopPos
		});
	},
	resizeFade : function() {
		var scrollWidth = window.getScrollWidth();
		var scrollHeight = window.getScrollHeight();
		
		$('popLayerFade').setStyles({
			'width' : scrollWidth,
			'height' : scrollHeight
		});
	}
});


/********************************************************************

	CASE STUDY VIDEO
	-----------------------------------------------------------
	This controls the popup video player on the casestudy page.
	
********************************************************************/	
var caseStudyVideo = {
	
	showVideo : function(filePath) {
		videoPopUp.openPop();
		playFlashVideo(filePath);
	},
	
				
	hideVideo : function() {
		closeVideo();
		videoPopUp.closePop();			
	}
	
}