// home.js


var home = ({
	carouselContent: [],
	itemList: [],
	init: function(){
		jQuery(document).ready(function() {
			$("#home-carousel").css('opacity',0);
			
			// fetch JSON object for promo descriptions and itemlist and set it as home.carouselContent[]
			$.getJSON('/promos/promo0.jsf' + (isPreview ? '?preview=true' : ''),function(data, textStatus){
				home.carouselContent = data.promotions.promo;
			});

			$.getJSON('/promos/home-itemlist.jsf' + (isPreview ? '?preview=true' : ''),function(data){
				home.itemList = data.itemlist.item;

				// init carousel 
			    jQuery('#home-carousel').jcarousel({
			    	start: 1,
					scroll: 1,
					wrap: 'circular',
					itemVisibleInCallback: {onBeforeAnimation: home.itemVisibleInCallback},
			        itemVisibleOutCallback: {onBeforeAnimation: home.carouselCB, onAfterAnimation: home.itemVisibleOutCallback},
					initCallback: function(){
						$("#home-carousel").css('opacity',1);
					}
			    });
				home.initCallback();

			});

			home.lifestyle();

		});
		
	},
	initCallback: function(carousel, state){
		var sides = $('.jcarousel-item-1 img, .jcarousel-item-3 img');
		var firstEl = $('.jcarousel-item-1 a');
		var lastEl = $('.jcarousel-item-3 a');
		var self = carousel;
		
		sides.animate({
			width: '86px',
			height: '71px',
			left: '13px',
			top: '5px',
			opacity: 0.5
		});
		
		firstEl.bind("click",function(e){
			e.preventDefault();
			$(".jcarousel-prev").trigger("click");
		});
		
		lastEl.bind("click",function(e){
			e.preventDefault();
			$(".jcarousel-next").trigger("click");
		});

		//$("#home-carousel").show();
		
	},
	carouselCB: function(carousel, item, i, state, evt, e){
		var first = (carousel.first == null) ? 1 : parseFloat(carousel.first);
		var last = (carousel.last == null) ? 3 : parseFloat(carousel.last);
		var selected = first + 1;
		var self = carousel;
		
		var sides = $('.jcarousel-item-'+first+' img, .jcarousel-item-'+last+' img');
		var midEl = $('.jcarousel-item-'+(first+1)+' img');
		var firstEl = $('.jcarousel-item-'+first+' a');
		var lastEl = $('.jcarousel-item-'+last+' a');
		var midA = $('.jcarousel-item-'+(first+1)+' a');
		
		firstEl.unbind("click");
		lastEl.unbind("click");
		midA.unbind("click");
		
		sides.animate({
			width: '86px',
			height: '71px',
			left: '13px',
			top: '5px',
			opacity: 0.5
			});
			
		midEl.animate({
			width: '110px',
			height: '90px',
			left: '0px',
			top: '0px',
			opacity: 1.0
		});
		
		firstEl.bind("click",function(e){
			e.preventDefault();
			$(".jcarousel-prev").trigger("click");
		});
		
		lastEl.bind("click",function(e){
			e.preventDefault();
			$(".jcarousel-next").trigger("click");
		});
		
		// fetch promo and update top
		
		var jCItems = $('.jcarousel-item');
		var cIndex = 0;
		var jcIndex = ( (first + (home.carouselContent.length * (Math.abs(Math.round(first / home.carouselContent.length)) + 1 ) )) % home.carouselContent.length );

		var promosLength = home.carouselContent.length;
		var newContent = home.carouselContent[jcIndex];
		
		var headline = $("#carousel-headline");
		var count = $("#carousel-count");
		var leader = $("#carousel-leader");
		var copy = $("#carousel-copy");
		var link = $("#carousel-link");
		
		var newPos = jcIndex == 0 ? promosLength : jcIndex;
		
		var countString = parseFloat(newPos) + " of " + promosLength;
		
		// replace escaped ampersands
		if(newContent.head.indexOf("&") != -1){
			newContent.head = newContent.head.replace("&","&");
		}
						
		headline.text(newContent.head);
		count.text(countString);
		leader.text(newContent.leader);
		copy.text(newContent.copy);
		link.text(newContent.linkcopy);
		link.attr('href',newContent.link);
		
		
	},
	itemVisibleInCallback: function(carousel, item, i, state, evt){
	    // The index() method calculates the index from a
	    // given index who is out of the actual item range.
	    var idx = carousel.index(i, home.itemList.length);
	    carousel.add(i, home.getItemHTML(home.itemList[idx - 1]));
	},

	itemVisibleOutCallback: function(carousel, item, i, state, evt){
	    carousel.remove(i);
	},
	getItemHTML: function(item){
	    return '<a href="' + item.href + '"><img src="' + item.url + '" alt="' + item.title + '" /></a>';
	},
	lifestyle: function(){


			thumbState = function(){
					var links = $("#feature-nav a");
					
					var features = $(".feature");
					var showing;
					
					features.each(function(){
							if($(this).css("opacity") == 1){
								showing = parseFloat($(this).attr("id").split("feature")[1]);
							}
					});
					
					links.each(function(i){
							if(i == showing){
								$(this).css({
										'border-color' : '#ffffff',
										'opacity' : 1
								});
							}else{
								$(this).css({
										'border-color' : '#000000',
										'opacity' : 0.6
								});
							}
							
					});
			}		
				
				
			if ( $('#feature-container').length > 1){
				$('#feature-container').cycle.defaults = { 
					fx:           		'fade', // one of: fade, shuffle, zoom, scrollLeft, etc 
					timeout:       		10000,  // milliseconds between slide transitions (0 to disable auto advance) 
					continuous:    		0,     // true to start next transition immediately after current one completes 
					speed:         		1200,  // speed of the transition (any valid fx speed value) 
					after:				thumbState,
					startingSlide: 		0,     // zero-based index of the first slide to be displayed 
					sync:          		1,     // true if in/out transitions should occur simultaneously 
					autostop:      		0,     // true to end slideshow after X transitions (where X == slide count) 
					cleartype:     		0,     // true if clearType corrections should be applied (for IE) 
					nowrap:        		0,      // true to prevent slideshow from wrapping 
					pause: 				1,		// enables pause on hover,
					delay:				-2000
				};
				
				var $container = $('#feature-container').cycle('fade');
		
			
			$("#feature-nav a").each(function(index){
					$(this).bind("click",function(e){
							e.preventDefault();
							$container.cycle(index);
							thumbState();
					});
			});
			
		}
		
	}
	
});