window.mccain = window.mccain || {};

(function(_) {
	
	// abort if class(es) are already defined
	if (_.PromoCarousel) return;
	
	/*******************************************************************************
	PromoCarousel class
	This class represents the promo carusel component on the home page.
	
	Usage:
	
	//default usage
	//The second parameter is optional and will set the amount of time in seconds the carousel will wait in between
	//auto rotating promos. The default value is five seconds.
	$(document).ready(function() {
		var carousel = new mccain.PromoCarousel('.promo-carousel', 5);
		
		//select item by index
		//This would manually select the first promo-cta
		carousel.selectByIndex(0);
		
		//select item by id
		//This is assuming there is an <li> element in the promo-cta <ul> that has an id="mypromo"
		//NOTE: you must include the pound symbol(#) for ids and the period(.) for classes
		carousel.selectBySelector('#mypromo');
	});
	
	*******************************************************************************/
	
	_.PromoCarousel = new function() {
		return {
			carusel: null,
			elements: {},
			rotate: 5000,  //how long between promo rotations
			timer: null,
			selected: null,
			initialized: false,
			init: function ($element, $rotate) {
				if(this.initialized) return;
				this.initialized = true;
				
				if($rotate)
					this.rotate = ($rotate*1000);
				
				this.carousel 			= $($element);
				this.elements.tabs		= $('.promo-ctas li', this.carousel);
				this.elements.promos	= $('.promos-container', this.carousel);
				
				//set mouse move listener on promos
				$('.promo', this.elements.promos).bind('mousemove', {}, $.proxy(this._onPromoMouseEvent, this));
				
				var o = this;
				$('.promo-ctas a', this.carousel).each(function($i, $e) {
					$(this).bind('click', { index: $i }, $.proxy(o._onMouseClickEvent, o));
				})
				
				this._centerText();
				
				//select the first tab by default
				this.selectByIndex(0);
			},
			/***
			* Public:
			* This can be used to manually select a promo-cta based on index.
			* The $index numbers are zero based so if you want to select the first cta you 
			* would pass in 0 and if you wanted the second cta you would pass in 1 and so on...
			*
			* If a valid cta button is not found nothing will happen.
			**/
			selectByIndex: function($index) {
				var item = $('li:eq('+$index+') a', this.carousel);
				if(item) item.trigger('click');
			},
			/***
			* Public:
			* This can be used to manually select a promo-cta based on a unique selector.
			* The $id can be either a HTML class or id attribute, but if it is a class it must be unique.
			* The attribute must be on the <li> element in promo-ctas <ul> in order to be recognized.
			*
			* If a valid cta button is not found nothing will happen.
			**/
			selectBySelector: function($id) {
				var item = $($id + ' a', this.carousel);
				if(item) item.trigger('click');
			},
			/**
			* This will reset the current auto rotation timer that is currently going.
			**/
			resetTimer: function() {
				if(this.timer) clearInterval(this.timer);
				
				this.timer = setInterval($.proxy(this._rotatePromo, this), this.rotate);
			},
			_onPromoMouseEvent: function($e) {
				this.resetTimer();
			},
			_rotatePromo: function() {
				var index = this.selected.index();
				index++;
				//if we're at last tout reset
				if(index >= this.elements.tabs.length) index = 0;
				//trigger click on new tout
				$('li:eq('+index+') a', this.carousel).trigger('click');
			},
			_centerText: function() {
				$(this.elements.tabs).each(function($i, $e) {
					var copy = $('.copy-wrapper', this);
					
					if(copy.length > 0) {
						var center = Math.round(($(this).height() - copy.height())*.5);
						if($i == 0) center--;
						copy.css({'top':center + 'px', 'visibility':'visible' });
					}
				});
			},
			_onMouseClickEvent: function($e) {
				$e.preventDefault();
				
				//assign class to selected class
				this.elements.tabs.removeClass('selected');
				this.selected = $($e.currentTarget).parent('li').addClass('selected');
				
				//show promo content
				$('.promo', this.elements.promos).hide();
				var promo = $('.promo:eq('+$e.data.index+')', this.elements.promos).show();
				//apply CSS3 pie
				if( _.usesPie ) {
					$('.pie', promo).each(function($i, $e) {
						PIE.attach($e);
					})
				}
				
				this.resetTimer();
			}
		}
	}();
	
})(window.mccain);