//plantCareGuide.js

var SuperHero = function(container) {
	var self = this;
	var timer = null;
	this.panels = new Array();
	this.currentIndex = 0;
	var flashPlayerVersion = swfobject.getFlashPlayerVersion();
	this.hasFlash = (flashPlayerVersion && flashPlayerVersion.major >= 8 ? true : false);

	this.init = function() {
		$('.panel', container).each(function(i) {
			var duration = Number($(this).attr('data-duration'));
			var imgDuration = Number($(this).attr('data-img-duration'));
			var swfDuration = Number($(this).attr('data-swf-duration'));
			var imgSrc = $(this).attr('data-img');
			var imgHeight = $(this).attr('img-height');
			var imgWidth = $(this).attr('img-width');
			var swfSrc = $(this).attr('data-swf');
			var type = 'image';
			var altText = $('a', this).text();
			var date = new Date();
			var id = 'hero' + i + date.getTime();
			$('a', this).attr('id', id).css('background-image', 'url(' + imgSrc + ')');
			/*$('a', this).attr('id', id).html('<img src="' + imgSrc + '" width="'+imgHeight+'" height="'+imgHeight+'" border="0" alt="' + altText + '" />');*/
			if (swfSrc) {
				if (self.hasFlash) {
					type = 'flash';
					var flashvars = {};
					var autoplay = (i == 0 ? 'true' : 'false' );
					var params = {wmode: 'opaque', play: autoplay, allowScriptAccess: 'always'};
					var attributes = {id: id, name: id};
					swfobject.embedSWF(swfSrc, id, imgWidth, imgHeight, '9', '', flashvars, params, attributes);
					duration = swfDuration;
				} else {
					duration = imgDuration;
				}
			}
			self.panels.push({elem: this, duration: duration, type: type, id: id});
		}).eq(0).addClass('show');
		
		self.buildControls();
		self.play();
		container.removeClass('loading');
	}
	
	this.buildControls = function() {
		var controls = $('<div class="controls"><a class="button btnPause" href="#">Play/Pause</a><div class="pagination"></div></div>');
		for (var i = 0; i < self.panels.length; i++) {
			$('<a href="#" class="p'+(i+1)+'">' + (i+1) + '</a>').appendTo($('.pagination', controls));
		}
		$('.pagination a', controls).eq(0).addClass('selected');
		
		
		$('.button', controls).click(function() {
			if ($(this).hasClass('btnPlay')) {
				self.play();
			}
			else if ($(this).hasClass('btnPause')) {
				self.pause();
			}
			return false;
		});
		
		$('.pagination a', controls).click(function() {
			var index = Number($(this).text()) - 1;
			self.pause();
			self.gotoIndex(index);
			return false;
		});
		
		container.append(controls);
	}	
	

	this.next = function() {
		var nextIndex = self.currentIndex + 1;
		if (self.currentIndex == (self.panels.length - 1)) nextIndex = 0;
		self.gotoIndex(nextIndex);
		var duration = self.panels[nextIndex].duration * 1000;
		self.timer = setTimeout(self.next, duration);
	}
	
	this.gotoIndex = function(nextIndex) {
		if (self.currentIndex == nextIndex) return false;
		
		var currentPanel = self.panels[self.currentIndex ].elem;
		var nextPanel = self.panels[nextIndex].elem;
		
		if (self.panels[self.currentIndex].type == 'flash') {
			var id = self.panels[self.currentIndex].id;
			document.getElementById(id).StopPlay();
			document.getElementById(id).Rewind();
		}
		$(currentPanel).fadeOut().removeClass('show');
		$(nextPanel).fadeIn(500, function() {
			$(this).addClass('show');
			if (self.panels[nextIndex].type == 'flash') {
				var id = self.panels[nextIndex].id;	
				document.getElementById(id).Play();
			}
		});
		self.currentIndex = nextIndex;
		$('.pagination a', container).removeClass('selected').eq(nextIndex).addClass('selected');
	}
	
	this.play = function() {
		var currentPanel = self.panels[self.currentIndex];
		var duration = currentPanel.duration * 1000;
		self.timer = setTimeout(self.next, duration);
		$('.controls .button', container).removeClass('btnPlay').addClass('btnPause');
	}
	
	this.pause = function() { 
		clearTimeout(self.timer);
		$('.controls .button', container).removeClass('btnPause').addClass('btnPlay');
	}
	
	this.init();
}



function loadView(view, id) {	
		if (view == 'PIP' && id) {
			
			
			var plantType = $('a',$('#'+id)).attr('href').match(/planttype=([a-zA-Z0-9]+)/)[1];
			$('.topNav .selected').removeClass('selected');
			$('#'+plantType+'Nav').addClass('selected');
			$('#plantCareHero .panel.show,#plantCareHero #featuredPlants,#plantCareHero .controls' ).css({display:"none"});
			$('.mainContent').attr('id', 'PIP');
			$('.plantInfo').empty();
			var listItem = $('#'+id);
			var list = $(listItem).parent();
			var prevId = null;
			var nextId = null;
			var index = 0;
			$('li', list).each(function() {
				if ($(this).attr('id') == id)
				{
					prevId = $('li', list).eq(index-1).attr('id');
					nextId = $('li', list).eq(index+1).attr('id');
				}
				index = index + 1;
			});
			$.ajax({ url: $('a',$('#'+id)).attr('href'), 
				success: function(html){
							$('.plantInfo').html(html);					
							if (prevId != null)
								$('#prev').attr('href', $('#prev').attr('href')+'#view=PIP&id='+prevId);
							else
								$('#prev').css('visibility','hidden');
								
							if (nextId != null)
								$('#next').attr('href', $('#next').attr('href')+'#view=PIP&id='+nextId);
							else
								$('#next').css('visibility','hidden');
								
							$('a[rel=ajax]').click(function() {
								var hash = this.href.replace(/^.*#/, '');
								var langid = (this.href.match(/langId=(-[A-Z0-9]+)/))[1];
								var lang = (langid=-15) ? 'EN' : 'FR';
								var params= hash.match(/view=(.+)&id=(.*)/);
								if(params[1] == 'all' |  params[1] == 'L1'){
									id = params[1];
								}
								s_objectID='plantCare:'+lang+':'+params[2];
								$.historyLoad(hash);
								
								return false;
							});
							
				}  
			});
			
		} 
		else if (view == 'L1') {
			$('.topNav .selected').removeClass('selected');
			$('.plantType').removeClass('selected');
			$('#plantCareHero .panel.show,#plantCareHero #featuredPlants,#plantCareHero .controls' ).css({display:"block"});
			$('.mainContent').attr('id', view);
						// load L1
		} 
		else if (view == 'L2' && id) {
		
			$('.topNav .selected').removeClass('selected');
			$('#'+id+'Nav').addClass('selected');
			$('.plantType').removeClass('selected');
			$('#' + id + ' .btnViewAll').parent().addClass('selected');
			$('#plantCareHero .panel.show,#plantCareHero #featuredPlants,#plantCareHero .controls' ).css({display:"none"});
			$('.mainContent').attr('id', view);
						// load L2
		} 
		else if (view = 'all') {
						// load view all
			$('#plantCareHero .panel.show,#plantCareHero #featuredPlants,#plantCareHero .controls' ).css({display:"none"});
			$('.plantType').removeClass('selected');
			$('.mainContent').attr('id', 'L3');
		}
		return false;
	}
	
function initPCG(lang){
	$('.panel').css('display','none').css('visibility','visible');
	window.HomePageHero = new SuperHero($('#plantCareHero'));
	$('.btnPCGHome').each(function(){	
		$(this).attr('rel', 'ajax');
		this.href = this.href +'#view=L1&id=';

	});
	
	
	var anchorText = (lang== -16) ? 'Tout voir' : 'View All' ;
	$('.plantType').each(function(){
		$('.typeImg',this).wrap($('<a rel="ajax" class="btnViewAll" href="#view=L2&id='+this.id+'"></a>'));	
		$('.plants',this).before($('<a rel="ajax" class="btnViewAll" href="#view=L2&id='+this.id+'">'+anchorText+'</a>'));
	});
	
	
	$('.topNav a').click(function(event) {
		event.preventDefault();
		$('.topNav .selected').removeClass('selected');
		if (! $(this).parent().hasClass("last")){	
			$(this).parent().addClass('selected');
		}
		$('.plantType' + $(this).attr('href') + ' .btnViewAll').click();
		
	});

	$(' .plantType .plants .plant').each(function() {
		
		var plantId = $('a', this).attr('href').match(/plantid=([A-Z0-9]+)/)[1];
		$('a', this).attr( 'href', $('a',this).attr('href') +'#view=PIP&id='+plantId);
		$('a', this).attr('rel','ajax');
		
		var plantName=$('a span',this).html();
		var imgSrc = '/wcsstore/HomeDepotCanada/images/GardenCentre/PlantCareGuides/plants/thumbnail/' + plantId + 'a.jpg';
		var img = $('<img class="plantImg" alt="'+plantName+'" src="' + imgSrc + '" width="113" height="113" />');
		img.prependTo($('a',this));
	});
	
	$('#plantCareHero ul .panel a').each(function() {
		var plantId = $(this).attr('href').match(/plantid=([A-Z0-9]+)/)[1];
		$(this).attr( 'href', $(this).attr('href') +'#view=PIP&id='+plantId);
		$(this).attr('rel','ajax');
	});
	
	$('a[rel=ajax]').click(function() {
		var hash = this.href.replace(/^.*#/, '');
		var langid = (this.href.match(/langId=(-[A-Z0-9]+)/))[1];
		var lang = (langid=-15) ? 'EN' : 'FR';
		var params= hash.match(/view=(.+)&id=(.*)/);
		if(params[1] == 'all' |  params[1] == 'L1'){
			id = params[1];
		}
		s_objectID='plantCare:'+lang+':'+params[2];
		$.historyLoad(hash);
		
		return false;
	});
	
	$.historyInit(function(hash) {	
		var params = (hash.match(/view=(.+)&id=(.*)/)) ;		
		
		if(params){
			var view = params[1];	
			var id = params[2]; 	
			loadView(view, id);	
		}	
	});
	
	var view = 'L1';
	var id = '';
	
	if (hash = window.location.href.match(/view=(.+)&id=(.*)/)) {
		view = hash[1];
		id = hash[2] ;
		loadView(view, id);
		
	}
	else{
		$.historyLoad('view='+view+'&id=');
		loadView(view, id);	
	}

	
}