var COLOURS_STATIC_IMAGES_URL = '/static/images/';

$(function (){
    if ($('body').hasClass('colours')){
        colours.activateColoursTabs();

        if ($('body').hasClass('landcruiser-70-series')){
            colours.activateColourSwatches();
			colours.activateColoursTracking();
        } else {
	        if ($('body').hasClass('fj-cruiser')){
	            if ($('body').hasClass('range')){
	                colours.activateRangeColours();
	            } else {
            		colours.activateColourVehicles();
				}
	        } else {
            	colours.activateColourVehicles();
			}
        } 
		
		if ($('body').hasClass('yaris') || $('body').hasClass('prado')) {
            colours.activateTrimGallery();
        }
		
		//colours.activateInteriorSlideshow();
		if ($('body').hasClass('camry')) {
            colours.activateAdvancedInteriorSlideshow();
        } else {
			colours.activateInteriorSlideshow();
		}
    }
});

var colours = {
	activateColoursTabs: function (){
		colours.activateDeepLinking();
		colours.activateAllLink();
		colours.activateChart();

		$('.page-header ul.tabs li').click(function (){
			var oCurrentTab = $(this);
			colours.openTab(oCurrentTab);
			return false;
		});
	},
	changePageUrl: function (sItemId){
		var sCurrentUrl = location.href;
		var aCurrentUrl = sCurrentUrl.split('#');

		switch (sItemId){
			case 'exterior':
				tracking.event.activate('trackingevent', { EventClass: "ColoursDemos", Action: "Click", Section: "Exterior", Vehicle: VEHICLE_ABBR });
			break;
			case 'interior':
				tracking.event.activate('trackingevent', { EventClass: "ColoursDemos", Action: "Click", Section: "Interior", Vehicle: VEHICLE_ABBR });
			break;
			case 'chart':
				tracking.event.activate('trackingevent', { EventClass: "ColoursDemos", Action: "Click", Section: "Exterior and Interior Chart", Vehicle: VEHICLE_ABBR });
			break;
			case 'demos':
				tracking.event.activate('trackingevent', { EventClass: "ColoursDemos", Action: "Click", Section: "Demos and tours", Vehicle: VEHICLE_ABBR });
			break;
			default:
			break;
		}

		location.href = aCurrentUrl[0] + '#block-' + sItemId;
	},
	activateDeepLinking: function (){
		var sCurrentUrl = location.href;
		var aCurrentUrl = sCurrentUrl.split('#');

		if (aCurrentUrl[1] != null){
			var oSelectedTab = $('#tab-' + aCurrentUrl[1].replace("block-", ""));
			if (oSelectedTab[0] != null){
				colours.openTab(oSelectedTab);
			} else{
				colours.disclaimersSwitch($('.page-header ul.tabs li.current'));
			}
		} else{
			colours.disclaimersSwitch($('.page-header ul.tabs li.current'));
		}
	},
	activateAllLink: function (){
		$('#content').find('.all-link').click(function (){
			dcsMultiTrack('WT.ac', 'VH_' + VEHICLE_ABBR + '_ColourPickerExterior_SeeAllExtColourOption', 'WT.cg_n', '', 'WT.cg_s', '');
			colours.openTab($('#tab-chart'));
			return false;
		});
	},
	switchToChart: function (){
		colours.openTab($('#tab-chart'));
	},
	disclaimersSwitch: function (oCurrentSection){
		if (oCurrentSection.hasClass('nodisclaimers')){
			$('#section-b').find('.disclaimer').hide();
		} else {
			$('#section-b').find('.disclaimer').show();
		}
	},
	openTab: function (oCurrentTab){
		var sCurrentTab = oCurrentTab.attr('id').split('-')[1];
		var oCurrentPage = $('#' + sCurrentTab);

		oCurrentTab.parents('.page-header').find('ul.tabs li').removeClass('current');
		oCurrentTab.addClass('current');

		$('.page').hide();
		oCurrentPage.show();

		colours.disclaimersSwitch(oCurrentTab);
		colours.changePageUrl(sCurrentTab);
		
		if ($('body').hasClass('camry')){
			if (bHTMLPanorama != null && bPanoramaInserted == false){
				if(oPanorama.filter(':visible')[0] != null){
					panorama.insertHTMLPanorama();
				}
			}
		}

		$.scrollTo($('body'));
			
	},
	activateInteriorSlideshow: function (){	
		$('#interior').find('.slideshow-controls ul li').live('click', function (){
			var oThumbnail = $(this);
			var sThumbnailId = oThumbnail.attr('id').replace("thumb-", '');

			oThumbnail.parents('.media-box').find('.slideshow-controls ul li').removeClass('current');
			oThumbnail.addClass('current');

			oThumbnail.parents('.media-box').find('.slideshow img').removeClass('current');
			$('#' + sThumbnailId).addClass('current');

			return false;
		});
	},
	activateAdvancedInteriorSlideshow: function (){	
		$('#interior').find('.slideshow-controls ul li').live('click', function (){
			colours.clickAdvancedInteriorSlideshow($(this));
			return false;
		});
	},
	removeAdvancedInteriorSlideshowSlide: function (oThumbnail){
		var oSlideshowControls = oThumbnail.parents('.media-box').find('.slideshow-controls ul');
		oThumbnail.remove();
		colours.clickAdvancedInteriorSlideshow(oSlideshowControls.find('li:first'));
	},
	clickAdvancedInteriorSlideshow: function (oThumbnail){	
		var sThumbnailId = oThumbnail.attr('id').replace("thumb-", '');

		oThumbnail.parents('.media-box').find('.slideshow-controls ul li').removeClass('current');
		oThumbnail.addClass('current');

		oThumbnail.parents('.media-box').find('.slideshow').find('.slideshow-item').removeClass('current');
		$('#' + sThumbnailId).addClass('current');
	},
	activateTrimGallery: function (){
		$('#interior').find('.vehicle-selection ul.tabs li').click(function (){
			var oItem = $(this);
			var oTrimGallery = $('#interior-' + oItem.attr('id').replace('tab-', ''));

			oItem.parents('ul.tabs').find('li').removeClass('current');
			oItem.addClass('current');

			oTrimGallery.parents('.viewer').find('.media-box').hide();
			oTrimGallery.show();

			return false;
		});
	},
	activateChart: function (){
		$('#chart').find('.info').mouseover(function (){
			$(this).css('position', 'relative');
			$(this).find('.trim').show();
		}).mouseout(function (){
			$(this).find('.trim').hide();
			$(this).css('position', '');
		});

		$('#chart .trim > p a').each(function (i, n){
			var href = $(n).attr('href');
			$(n).attr('href', href + '&WT.ac=VH_' + VEHICLE_ABBR + '_ColourDemo_PM');
		});
	},
	activateColourSwatches: function (){
		if (imagesInfo == null) return false;
		var sVehicleName = $('.colour-selection ul.colours').attr('id').replace("vehicle-", "");
		$('.colour-selection ul.colours li.active').unbind('click').click(function (){
			var oColour = $(this);
			colours.openColourSwatch(sVehicleName, oColour);

			//trigger custom event for activateColoursTracking
			$(this).trigger('singleClick');

			return false;
		});
		
		if ($('.colour-selection ul.colours li.current.active')[0] == null){
			colours.openColourSwatch(sVehicleName, $('.colour-selection ul.colours li.active:first'));
		} else {
			colours.openColourSwatch(sVehicleName, $('.colour-selection ul.colours li.current.active'));
		}
	},
	openColourSwatch: function (sVehicleName, oColour){
		var sColour = oColour.attr('id').replace("colours-", "");
		var sImageURL = COLOURS_STATIC_IMAGES_URL + imagesInfo[sVehicleName].colours[sColour] + '-' + sVehicleName + '-' + sColour + '-749x422.png';

		$('.colour-selection ul.colours li').removeClass('current');

		oColour.addClass('current');

		if ($(".loading").length < 1){
			// Create loading box for first load
			oColour.parents('.gallery').find('.media-box img').before('<div class="loading" style="display:none"></div>');
		}
		else{
			// fade out FauxPNG replacement 
			oColour.parents('.gallery').find('.media-box .imgClass').fadeOut("fast");

			// Do the fancy switching 
			oColour.parents('.gallery').find('.media-box img').fadeOut("fast", function (){
				oColour.parents('.gallery').find('.media-box img').attr('src', sImageURL);
				$(".loading").show().delay(600).fadeOut("normal", function (){
					oColour.parents('.gallery').find('.media-box img').fadeIn();

					// re-apply PNG fix
					$('#exterior').find(".media-box img[src$=.png]").pngFix({
						blankgif: '/static/global/images/navigation-image-overlay.gif',
						//noDoublesIn: "#exterior",
						imageClass: "imgClass"
					});
				});

			});
		}
		$('#vehicle-image-colour').html(oColour.find('p').html());
	},
	openColourVehicle: function (oVehicle){

		var sVehicleName = oVehicle.attr('id');
		var oColoursBlock = $('.colour-selection ul.colours');

		$('.vehicle-selection ul.tabs li').removeClass('current');
		oVehicle.addClass('current');
		oColoursBlock.attr('id', 'vehicle-' + sVehicleName);
		oColoursBlock.find('li').hide().removeClass('active');

		$.each(imagesInfo[sVehicleName].colours, function (colourName, vehicleID)
		{
			oColoursBlock.find('#colours-' + colourName).show().addClass('active');
		});

		colours.activateColourSwatches();

		$('#vehicle-image-grade').html(oVehicle.find('span a').html());
		if($('#clarifying-description')[0] != null){
			if (oVehicle.find('span.clarifying-description')[0] != null) {
				$('#clarifying-description').html(oVehicle.find('span.clarifying-description').html());
			} else {
				$('#clarifying-description').html('');
			}
		}
	},
	activateColourVehicles: function (){
		if ((imagesInfo == null) || ( $('#exterior.gallery .viewer').length < 1) ) return false;
		
		colours.activateColoursTracking();
		
		$('.vehicle-selection ul.tabs li').click(function (){
			var oVehicle = $(this);
			colours.openColourVehicle(oVehicle);
			return false;
		});

		if ($('.vehicle-selection ul.tabs li.current')[0] == null){
			colours.openColourVehicle($('.vehicle-selection ul.tabs li:first'));
		} else{
			colours.openColourVehicle($('.vehicle-selection ul.tabs li.current'));
		}
		
		colours.activateBodyTypeSubmenu();
	},
	activateBodyTypeSubmenu: function (){	
		if($('.menuTabs li')[0] != null){
			var oMenuItems = $('.menuTabs li');
			$(oMenuItems).click(function (){
				var oItem= $(this);
				var sItem = oItem.find("a").attr("href").valueOf();
				var oColourSwatches = $(sItem);
				oMenuItems.removeClass("active");
				oItem.addClass("active");
				$(".menuActive").addClass('menuDeactive').removeClass('menuActive')
				oColourSwatches.addClass('menuActive').removeClass('menuDeactive');
				
				colours.openColourVehicle(oColourSwatches.find('ul.tabs li:first'));			
				
				return false;
			});
		}
	},
	activateRangeColours: function (){
		if (imagesInfo == null) return false;

		$('#body-colour-selection').find('ul.colours li').click(function (){
			var oColour = $(this);
			var sColour = oColour.attr('id').replace("colours-", "");

			$('#body-colour-selection').find('ul.colours li').removeClass('current');
			oColour.addClass('current');

			$('#body-colour-selection').find('h2 span.colour').html(oColour.find('p').html());
			oColour.parents('.gallery').find('.media-box img').attr('src', COLOURS_STATIC_IMAGES_URL + imagesInfo[sColour] + '-' + oColour.parents('ul').attr('id') + '-' + sColour + '-620x349.jpg');

			return false;
		}).hover(
			function () { $(this).addClass('hover'); },
			function () { $(this).removeClass('hover'); }
		);
	},
	activateColoursTracking: function (){
		//First Interaction
		var firstInt = true;

		$('.colour-selection .colours div, .vehicle-selection ul.tabs li').click(function (){
			if (firstInt){
				hh_WT.trackEvent({ 'WT.ac': FIRSTINTERACTION }, true);
				firstInt = false;
			}
		});

		//Body Type
		$('.vehicle-selection ul.tabs li').click(function (){
			var sVehicle = $(this).attr("id");
			hh_WT.trackEvent({ 'WT.ac': imagesInfo[sVehicle].tracking.bodyType }, true);
			colours.activateColoursTracking.colourInteraction = true;
			return false;
		});

		// Custom event called on click
		$('.colour-selection .colours li').bind('singleClick', function ()
		{
			var sVehicle = $(this).parent().attr("id");
			sVehicle = sVehicle.replace('vehicle-', '');

			if (colours.activateColoursTracking.colourInteraction || colours.activateColoursTracking.colourInteraction == undefined)
			{
				hh_WT.trackEvent({ 'WT.ac': imagesInfo[sVehicle].tracking.colourType }, true);
				colours.activateColoursTracking.colourInteraction = false;
			}

		});
	}
}
