//GLOBAL VARS
path = "/kitofparts/assets/images/panel/";
pattern = ['','','','',''];
reversed = ['','','','',''];
wallpaper = [];
nature = [];
city = [];
colorway = 'Grayscale';

sample_id = ['','','','',''];

sample_ids = [];

sample_ids['NatureStripeSamoa'] = 'NTT-7-6220';
sample_ids['NatureStripeSequoia'] = 'NTS-7-6221';
sample_ids['NatureStripeOlympic'] = 'NTS-7-6222';
sample_ids['NatureStripeYellowstone'] = 'NTS-7-6223';
sample_ids['NatureStripeAmazon'] = 'NTS-7-6224';
sample_ids['NatureStripeCanyon'] = 'NTS-7-6225';
sample_ids['NatureStripeSherwood'] = 'NTS-7-6226';
sample_ids['NatureStripeEverglade'] = 'NTS-7-6227';
sample_ids['NatureStripeAcadia'] = 'NTS-7-6228';
sample_ids['NatureStripeRedwood'] = 'NTS-7-6229';

sample_ids['NatureBlossomSamoa'] = 'NTS-7-6240';
sample_ids['NatureBlossomSequoia'] = 'NTS-7-6241';
sample_ids['NatureBlossomOlympic'] = 'NTS-7-6242';
sample_ids['NatureBlossomYellowstone'] = 'NTS-7-6243';
sample_ids['NatureBlossomAmazon'] = 'NTS-7-6244';
sample_ids['NatureBlossomCanyon'] = 'NTS-7-6245';
sample_ids['NatureBlossomSherwood'] = 'NTS-7-6246';
sample_ids['NatureBlossomEverglade'] = 'NTS-7-6247';
sample_ids['NatureBlossomAcadia'] = 'NTS-7-6248';
sample_ids['NatureBlossomRedwood'] = 'NTS-7-6249';

sample_ids['NatureTreeSamoa'] = 'NTT-7-6260';
sample_ids['NatureTreeSequoia'] = 'NTS-7-6261';
sample_ids['NatureTreeOlympic'] = 'NTS-7-6262';
sample_ids['NatureTreeYellowstone'] = 'NTS-7-6263';
sample_ids['NatureTreeAmazon'] = 'NTS-7-6264';
sample_ids['NatureTreeCanyon'] = 'NTS-7-6265';
sample_ids['NatureTreeSherwood'] = 'NTS-7-6266';
sample_ids['NatureTreeEverglade'] = 'NTS-7-6267';
sample_ids['NatureTreeAcadia'] = 'NTS-7-6268';
sample_ids['NatureTreeRedwood'] = 'NTS-7-6269';


sample_ids['CityLightsAurora'] = 'CIL-7-6125';
sample_ids['CityLightsDusk'] = 'CIL-7-6126';
sample_ids['CityLightsStardust'] = 'CIL-7-6127';
sample_ids['CityLightsAmber'] = 'CIL-7-6128';
sample_ids['CityLightsMorning'] = 'CIL-7-6129';
sample_ids['CityLightsCelestial'] = 'CIL-7-6130';
sample_ids['CityLightsFog'] = 'CIL-7-6131';
sample_ids['CityLightsHaze'] = 'CIL-7-6132';
sample_ids['CityLightsSkylight'] = 'CIL-7-6133';
sample_ids['CityLightsSunset'] = 'CIL-7-6134';

sample_ids['CityLightscapeAurora'] = 'LSP-7-6100';
sample_ids['CityLightscapeDusk'] = 'LSP-7-6101';
sample_ids['CityLightscapeStardust'] = 'LSP-7-6102';
sample_ids['CityLightscapeAmber'] = 'LSP-7-6103';
sample_ids['CityLightscapeMorning'] = 'LSP-7-6104';
sample_ids['CityLightscapeCelestial'] = 'LSP-7-6105';
sample_ids['CityLightscapeFog'] = 'LSP-7-6106';
sample_ids['CityLightscapeHaze'] = 'LSP-7-6107';
sample_ids['CityLightscapeSkylight'] = 'LSP-7-6108';
sample_ids['CityLightscapeSunset'] = 'LSP-7-6109';



patternopts = [];
//for (i = 0; i < patternopts.length; ++ i){patternopts [i] = [];}



	function canWeSubmit(form){
	
		$('#'+form+' .required').each(function(e){
			if ($(this).val() == '' || $(this).val() == $(this).attr('title')) {
				$(this).addClass('warning');
			}
		});
		
		if ($('.warning').length > 0){
		
			return false;
	
		} else {
		
			return true;
	
		}
	}


$(document).ready(function() {
	//hide everything on ready.
	//make the palettes display a not ready message, until a pattern is chosen.
	
$('.justification button').attr('disabled',true);
$('.justification button').addClass("disableflipping");


$('#order_sample_submit input, #order_sample_submit textarea').each(function(){							
	$(this).val($(this).attr('title')).css('color','#777');
});


$('#order_sample_submit input, #order_sample_submit textarea').focus(function(){
if ($(this).val() == $(this).attr('title')){
$(this).val('').css('color','#000');
}
});


$('#order_sample_submit input, #order_sample_submit textarea').blur(function(){
if ($(this).val() == ''){
$(this).val($(this).attr('title')).css('color','#777');
}
});





$('#sendInfo input, #sendInfo textarea').each(function(){
										
$(this).val($(this).attr('title')).css('color','#777');

});


$('#sendInfo input, #sendInfo textarea').focus(function(){
if ($(this).val() == $(this).attr('title')){
$(this).val('').css('color','#000');
}
});


$('#sendInfo input, #sendInfo textarea').blur(function(){
if ($(this).val() == ''){
$(this).val($(this).attr('title')).css('color','#777');
}
});




$('#sendInfo fieldset input, #sendInfo textarea').keyup(function(){
	$(this).removeClass('warning');
	
	var i = 0;
	$('#sendInfo fieldset .required').each(function(){
		if ($(this).val() != '' && $(this).val() != $(this).attr('title')) {
			i++;
			
			if (i == $('#sendInfo .required').length){
			
				$('#submit_measurement').css('background-position','0 0');
				$('#submit_measurement').removeAttr('disabled');
				
			} else {
				$('#submit_measurement').attr('disabled',true);
				$('#submit_measurement').css('background-position','0 -31px');
			
			}
			
		}
	});
});


$('#sendInfo').submit(function(){
	if (canWeSubmit('sendInfo')){
		
		
		
		var params = $('#sendInfo').serialize();
		
	
		
		var orderInfo = '';
		for (x=1;x<5;x++){
		
			orderInfo += '&order[]='+style+' '+pattern[x]+'|||'+colorway+'|||'+sample_id[x]+'|||'+reversed[x];
 		}
	
		
		//alert(orderInfo);
	
		
		$.ajax({
			url: "/kitofparts/designlab/email.php",
			type: "POST",
			data: params + orderInfo+'&checked=false',
			dataType: "html",
			success: function(data){
			
				//alert(data);
				
				$("#wolfy").fadeIn('slow').animate({opacity:'1'},2000).fadeOut('slow');
				$('#optionButtons').slideUp('fast');
				$('#emailMeasurements').css('background-position','0 -88px');
				
			}, error: function(data){
			
			alert(data.status);
				
			}
		});
		
		
		
	}
	return false;
});












	
	//click a pattern
	$('.designlab_option li').livequery('click', function(){
	
		column = $(this).parent().attr('id').substr(3);
		
		var patternSplit = [];
	
		
		if ($(this).children('a').text() == 'Lightscape'){
			patternSplit[1] = 'Lightscape';
		} else {
			patternSplit = $(this).children('a').text().split(' ');
		} 
		
		
		pattern[column] = patternSplit[1];
	
		if (pattern[column] == 'Tree') {
			$('#flip'+column).addClass("disableflipping");
			$('#flip'+column).attr('disabled',true);
		} else {
			$('#flip'+column).removeAttr('disabled');
			$('#flip'+column).removeClass('disableflipping');
		}
		
		//alert('col'+column+"\n"+path+"\n"+reversed[column]+"\n"+style+"\n"+pattern[column]+"\n"+colorway);
		//alert(path+reversed[column] + style+ "_" + pattern[column] + "_" + colorway + ".jpg");
		
		$('.wall'+column).attr("src", path + reversed[column] + style + "_" + pattern[column] + "_" + colorway + ".jpg");
		
		$('.wall'+column).attr("src", path + reversed[column] + style + "_" + pattern[column] + "_" + colorway + ".jpg");
		
		
	
		if (pattern[1] != '' && pattern[2] != '' && pattern[3] != '' && pattern[4] != ''){
			$('#ontoColor').css('background-position','0 -31px');
			$('#ontoColor').removeAttr('disabled');
		
		}
	
	
		$('#colorBuds').css('visibility','hidden');
		
		for (var x=0; x<pattern.length; x++){
			if (pattern[x] == 'Tree'){
				$('#colorBuds').css('visibility','visible');
			}
		}
		
	});
	
	//click button on to color!
	$('#ontoColor').click(function(){
		
		if ($('#wp_build-container-inner').is(':visible')){
		
			$("#style_chosen-header").html(style+' Series');
			$("#style_chosen-header_under").html('<img src="/kitofparts/assets/images/step2.gif" /><span>Select a Colorway</span>');
			
			$('#wp_build-container-inner').animate({opacity: 'hide'}, 'fast', function(){
				$('#addColorways').fadeIn('fast');
				
				
				if (colorway == 'Grayscale'){
					$('#ontoColor').css('background-position','0px 0px');
					$('#ontoColor').attr('disabled','true');
				}
				
				
				$('#backtoPattern').fadeIn('fast');
			});
		} else { //we have a color lets show everything else
			
			
			$("#style_chosen-header").html(style+' Series');
			$("#style_chosen-header_under").html('<img src="/kitofparts/assets/images/step3.gif" /><span>I\'m Done!</span>');
			
			
			$(this).fadeOut('fast');
			
			
			//set our id values
			sample_id[1] = sample_ids[style+pattern[1]+colorway];
			sample_id[2] = sample_ids[style+pattern[2]+colorway];
			sample_id[3] = sample_ids[style+pattern[3]+colorway];
			sample_id[4] = sample_ids[style+pattern[4]+colorway];
			
			
			$('#addColorways').animate({opacity: 'hide'}, 'fast', function(){
				$('#moreOptions').fadeIn('fast');
				$('#backtoPattern').fadeOut('fast');
			});
			
			
			$("#wallpaper_view").append('<img id="yourCreation" src="/kitofparts/designlab/design_image.php?s=0&w1='+ reversed[1] + style + '_' + pattern[1] + '_' + colorway + '&w2='+ reversed[2] + style + '_' + pattern[2] + '_' + colorway + '&w3='+reversed[3] + style + '_' + pattern[3] + '_' + colorway + '&w4=' + reversed[4] + style + '_' + pattern[4] + '_' + colorway+'" />');
		
		}
	});
	
	
	
	$('#backtoPattern').click(function(){
		$('#addColorways').animate({opacity: 'hide'}, 'fast', function(){
				$('#wp_build-container-inner').fadeIn('fast');
				$('#ontoColor').css('background-position','0px -31px');
				$('#ontoColor').removeAttr('disabled');
				
				
				$("#style_chosen-header").html(style+' Series');
				$("#style_chosen-header_under").html('<img src="/kitofparts/assets/images/step1.gif" /><span>Select a Pattern, then Click &ldquo;Continue&rdquo; to Select a Colorway.</span>');
				
				
				
				$('.wall1').attr("src", path + reversed[1] + style + "_" + pattern[1] + "_" + colorway + ".jpg");
				$('.wall2').attr("src", path + reversed[2] + style + "_" + pattern[2] + "_" + colorway + ".jpg");
				$('.wall3').attr("src", path + reversed[3] + style + "_" + pattern[3] + "_" + colorway + ".jpg");
				$('.wall4').attr("src", path + reversed[4] + style + "_" + pattern[4] + "_" + colorway + ".jpg");
			});
	});
	
	

	
	$("#saveWallpaper").click(function(){window.open('../designlab/design_image.php?s=1&w1='+ reversed[1] + style + '_' + pattern[1] + '_' + colorway + '&w2='+ reversed[2] + style + '_' + pattern[2] + '_' + colorway + '&w3='+reversed[3] + style + '_' + pattern[3] + '_' + colorway + '&w4='+ reversed[4] + style + '_' + pattern[4] + '_' + colorway,'saveImg');});
	
	
	$("#printWallpaper").click(function(){
	
		window.print();
	
	
	});
	
	
	
	
	
	
	$('.justification button').hover(function(e){
		column = $(this).attr('id').substr(4);
		
			if (reversed[column] == ''){
			
				$('#flip'+column).removeClass('perm');
			}
		},function(e){
		
		});
		
	$('.justification button').click(function(){
	
		column = $(this).attr('id').substr(4);
		
		if (reversed[column] == 'reverse/') {
			reversed[column] = '';
			$('#flip'+column).removeClass('flipped');
			
			$('#flip'+column).addClass('perm');
			
			
			
		} else {
			reversed[column] = 'reverse/';
			$('#flip'+column).addClass('flipped');
		}
		
		//alert(path+reversed[column] + style+ "_" + pattern[column] + "_" + colorway + ".jpg");
		
		$('.wall'+column).attr("src", path + reversed[column] + style + "_" + pattern[column] + "_" + colorway + ".jpg");
	
	});
	
	
	
	
	$('.colorways li').livequery('click',function(){
		
		colorway = $(this).attr('id');
		
		
		for (var column=1; column<pattern.length; column++){
			$('.wall'+column).attr("src", path + reversed[column] + style + "_" + pattern[column] + "_" + colorway + ".jpg");
		}
		
		$('#ontoColor').css('background-position','0 -31px');
		$('#ontoColor').removeAttr('disabled');
		
		var sample_id_sel = sample_ids[style+pattern[1]+colorway];
			
		$('#selectedColor').text(colorway);
		$('#selectedID').text(sample_id_sel);
		$('#colorYouSelected').fadeIn('slow');
		
		
	});
	
	
	
	
	$('#moreOptions #emailMeasurements').click(function(){
		$(this).css('background-position','0 -126px');
		$('#optionButtons').slideDown('fast');
	});
	
	
	
	
	
	
	
	$("#nowwhat-send-ecard-form-container").hide();
	$("#wp_build-container").hide();
	
	$(document).pngFix();


	$('#ecardmessage').focus(function(){
		//remove default text
		if ($('#ecardmessage').val() == 'Insert a personal message here.'){
			$('#ecardmessage').val('');
			}
		});
	
	
	$('#ecardmessage').blur(function(){	
		//replace default text
		if ($('#ecardmessage').val() == '') {
			$('#ecardmessage').val('Insert a personal message here.');
			} 
		});
});


//STYLE is CHOSEN ===============================================
function style_is_chosen(styleImport) {
	style = styleImport;
	if (style == "City"){
			//cities
			
			
		$('#wp_build-container-inner').addClass('city');
		
		$('#colorwayGrid').addClass('city');
		
		wallpaper[1] = 'Aurora';
		wallpaper[2] = 'Dusk';
		wallpaper[3] = 'Stardust';
		wallpaper[4] = 'Amber';
		wallpaper[5] = 'Morning';
		wallpaper[6] = 'Celestial';
		wallpaper[7] = 'Fog';
		wallpaper[8] = 'Haze';
		wallpaper[9] = 'Skylight';
		wallpaper[10] = 'Sunset';
		
		patternopts [1] = 'Lightscape';
		patternopts [2] = 'Lights';
		
	//	numberoftimes = 3;
		
	} else {
	//nature
	$('#wp_build-container-inner').removeClass('city');	
	$('#colorwayGrid').removeClass('city');
	
		wallpaper[1] = 'Samoa';
		wallpaper[2] = 'Sequoia';
		wallpaper[3] = 'Olympic';
		wallpaper[4] = 'Yellowstone';
		wallpaper[5] = 'Amazon';
		wallpaper[6] = 'Canyon';
		wallpaper[7] = 'Sherwood';
		wallpaper[8] = 'Everglade';
		wallpaper[9] = 'Acadia';
		wallpaper[10] = 'Redwood';
		
		patternopts [1] = 'Stripe';
		patternopts [2] = 'Blossom';
		patternopts [3] = 'Tree';
		
		//numberoftimes = 4;
		
	}


	//hide style selection page / show building stage.
	
	$("#intro_container").fadeOut('fast', function(){$("#wp_build-container").fadeIn('slow');});
	
	//write style name to page
	$("#style_chosen-header").html(style+' Series');
	$("#style_chosen-header_under").html('<img src="/kitofparts/assets/images/step1.gif" /></span>Select a Pattern, then Click &ldquo;Continue&rdquo; to Select a Colorway.</span>');
	

	for (var x=1; x<5; x++) { //print out pattern options
	
	//add ul info
		for (var i=1; i<patternopts.length; i++) {
			
			var displayStyle = '';
			
			if (patternopts[i] == 'Lightscape'){displayStyle = '';} else {displayStyle = style;}
		
			$("#col"+x).append('<li><a href="javascript:void(0)">'+displayStyle+' '+patternopts[i]+'</a></li>');
		}
	}


	for (var i=1; i<wallpaper.length; i++){
		$(".colorways").append('<li id="'+wallpaper[i]+'"><img src="/kitofparts/assets/images/colorway/'+wallpaper[i]+'.jpg" /></li>');
	}
}