$(document).ready(function(){

	var previous_selected_swatch = '';
	
	var set_check_preview = function() {
		// Determine what to preview (check, back of check, or security features)
		view_feature = $(".check-preview-option-selected").attr("id");

		// Determine which check to preview
		check_layout = $(".check-format-frame-hover").attr("id");
		if (check_layout == undefined) {
			check_layout = $(".check-format-frame-selected").attr("id");
		}
		if (check_layout != undefined) {
			check_layout = check_layout.substring(13);
		}
		
		pattern_color = $(".color-swatch-hover").attr("id");
		if (pattern_color == undefined) {
			pattern_color = $(".color-swatch-selected").attr("id");
		}
		
		if ((check_layout == undefined) && (pattern_color == undefined)) {
			// Reset to blank
			$(".check-preview-title").html("");
			$(".check-preview-subtitle").html("Select a check layout and color pattern");
			$(".check-preview-selected").removeClass("check-preview-selected");
			return false;
		}


		if (check_layout == undefined) {
			check_layout = 't';
			$("#check-format-" + check_layout).addClass("check-format-frame-hover");
		}
		if (pattern_color == undefined) {
			pattern_color = 'z-br';
			$("#" + pattern_color).addClass("color-swatch-hover");
		}
		
		preview_check = check_layout + '-' + pattern_color;
		
		switch (pattern_color.substr(0,1)) {
			case 'z':
			case 'd':
			case 'm':
				back_design = 'd';
				break;
			case 'n':
				back_design = 'n';
				break;
			case 'w':
				back_design = 'w';
				break;
		}
		
		
		// Show/Hide non-applicable swatches
		if (check_layout == 'p') {
			$("#pattern-standard").css("display","none");
			$("#pattern-ultimate").css("display","none");
			$("#pattern-executive h3 span.pattern-price").html("");
		} else {
			$("#pattern-standard").css("display","block");
			$("#pattern-ultimate").css("display","block");
			$("#pattern-executive h3 span.pattern-price").html(" (+$5)");
		}
		
		
		var preview_title = $('#' + preview_check + ' > img').attr("alt").split("-");
		$(".check-preview-title").html(preview_title[0] + " - ");
		$(".check-preview-subtitle").html(preview_title[1] + ' - ' + preview_title[2]);

		switch (view_feature) {
			case 'check-preview-front':
				// Update the check preview title
				var zoom_link = $('#' + preview_check).attr("href");
				
				// Show the check preview
				$(".check-preview-selected").removeClass("check-preview-selected");
				$('#' + preview_check).addClass("check-preview-selected");
				
				// Link the zoom icon
				$("#zoom-icon").css("display", "block");
				$("#zoom-icon").attr("href", zoom_link);
				$("#zoom-icon > img").attr("alt",  preview_title);
				$("#zoom-icon").fancybox({
					imageScale		: false,
					centerOnScroll	: false,
					padding			: 0
				});
				
				break;
				
			case 'check-preview-back':
				back_preview_id = check_layout + '-' + back_design + 'b';
				
				// Update the check preview title
				//var preview_title = $('#' + back_preview_id + ' > img').attr("alt").split("-");
				//$(".check-preview-title").html(preview_title[0] + " - ");
				//$(".check-preview-subtitle").html(preview_title[1] + ' - ' + preview_title[2]);
				var zoom_link = $('#' + back_preview_id).attr("href");
				
				// Show the check preview
				$(".check-preview-selected").removeClass("check-preview-selected");
				$('#' + back_preview_id).addClass("check-preview-selected");
				
				// Link the zoom icon
				$("#zoom-icon").css("display", "block");
				$("#zoom-icon").attr("href", zoom_link);
				$("#zoom-icon > img").attr("alt",  preview_title);
				$("#zoom-icon").fancybox({
					imageScale		: false,
					centerOnScroll	: false,
					padding			: 0
				});

				break;
				
			case 'check-preview-features':
				// Update the check preview title
				//var preview_title = $('#' + preview_check + ' > img').attr("alt").split("-");
				//$(".check-preview-title").html("Security Features - ");
				//$(".check-preview-subtitle").html(preview_title[1] + ' - ' + preview_title[2]);

				sec_id = back_design + '-sec';
				
				// Show the security features preview
				$(".check-preview-selected").removeClass("check-preview-selected");
				$('#' + sec_id).addClass("check-preview-selected");
				
				$("#zoom-icon").css("display", "none");
				break;
				
		}
		
		// Set the buy now link
		var buy_link="order.htm";
		switch (check_layout) {
			case "t":
				buy_link="CheckTop.htm";
				break;
			case "m":
				buy_link="CheckMiddle.htm";
				break;
			case "b":
				buy_link="CheckBottom.htm";
				break;
			case "z":
				buy_link="ThreeCheck.htm";
				break;
			case "p":
				buy_link="PersonalWallet1.htm";
				break;
		}
		$(".order-button-link").attr("href", buy_link);

		// Show the appropriate software compatibilty section
		$(".check-software-body-frame").removeClass("check-software-body-frame-selected");
		$("#" + check_layout + "-sw").addClass("check-software-body-frame-selected");

		// Show the appropriate pricing
		$(".check-pricing").removeClass("check-pricing-selected");
		switch (check_layout) {
			case "t":
			case "m":
			case "b":
				$("#check-pricing-1check").addClass("check-pricing-selected");
				break;
			case "z":
			case "p":
				$("#check-pricing-3check").addClass("check-pricing-selected");
				break;
		}

	};

	// Setup the Zoom Plugin
	$(".check-preview-frame a").fancybox({
		imageScale		: false,
		centerOnScroll	: false,
		padding			: 0
	});
	
	// Fix PNGs for IE6
	$('.color-swatch > img').ifixpng(); 
	$('#zoom-icon > img').ifixpng(); 
	$('.check-format-tooltip').ifixpng(); 
	$('.color-swatch-tooltip').ifixpng(); 
	$('.btn-live > img').ifixpng(); 
	// If the swatches weren't loaded when the png fix was applied, they received incorrect dimensions and are override with css here
	$('.color-swatch > img').css('width','64'); 
	$('.color-swatch > img').css('height','23'); 

	// Set the page defaults
	$("#check-preview-front").addClass("check-preview-option-selected");
	
	var hrf = window.location.pathname;
	var ref = document.referrer;
	var lay = 't';
	swt = 'z-br';
	if (hrf.match(/newcolorspulp/i)) {
		if (ref.match(/CheckTop/i)) {
			lay = 't';
		} else if (ref.match(/CheckMiddle/i)) {
			lay = 'm';
		} else if (ref.match(/CheckBottom/i)) {
			lay = 'b';
		} else if (ref.match(/ThreeCheck/i)) {
			lay = 'z';
		} else if (ref.match(/PersonalWallet/i)) {
			lay = 'p';
			swt = 'n-bl';
		}
	}
	$("#check-format-" + lay).addClass("check-format-frame-selected");
	$("#" + swt).addClass("color-swatch-selected");
	set_check_preview();
	
	// Set table striping
	$('table.check-pricing-table tbody tr:odd').addClass('odd');
	$('table.check-pricing-table tbody tr:even').addClass('even');
	
	// Set row hover
	$(".check-pricing-table tbody tr").hover(
		function() {
			$(this).addClass("highlight");
		},
		function() {
			$(this).removeClass("highlight");
		}
	);
	
	// Set click event for the preview options
	$(".check-preview-option").click(function() {
		if ($(this) != $(".check-preview-option-selected")) {
			// get rid of previous selection by removing the class
			$(".check-preview-option").removeClass("check-preview-option-selected");
	
			// add the class to the specific selection
			$(this).addClass("check-preview-option-selected");
		}
		
		// Determine which check to preview
		set_check_preview();
		
		return false;
	});

	// Setup hover for the Check Formats
	$(".check-format-frame").hover(
		// Over
		function() {
			if ($(this) != $(".check-format-frame-selected")) {
				// get rid of previous selection by removing the class
				$(".check-format-frame-hover").removeClass("check-format-frame-hover");
		
				// add the class to the specific selection
				$(this).addClass("check-format-frame-hover");
			}

			// Show tooltip
			$(".check-format-tooltip", this).fadeIn(0);
			
			// If the swatch is nolonger valid for this format, pick a new one
			if ($(this).attr("id") == "check-format-p") {
				previous_selected_swatch = $(".color-swatch-selected").attr("id");
				switch (previous_selected_swatch) {
					case "n-bl":
					case "n-gr":
					case "n-pl":
					case "n-go":
					case "n-bu":
					case "n-sb":
						break;
					default:
						$(".color-swatch-selected").removeClass("color-swatch-selected");
						$("#n-bl").addClass("color-swatch-selected");	
				}
			}

			// Determine which check to preview
			set_check_preview();
		},

		// Out
		function() {
			// get rid of previous selection by removing the class
			$(".check-format-frame-hover").removeClass("check-format-frame-hover");

			// Hide the tooltip
			$(".check-format-tooltip", this).fadeOut(0);

			// If had to pick a new swatch because the previous one was nolonger valid for this format, restore the previous one
			if (($(this).attr("id") == "check-format-p") && (previous_selected_swatch != '')) {
				$(".color-swatch-selected").removeClass("color-swatch-selected");
				$("#" + previous_selected_swatch).addClass("color-swatch-selected");	
				previous_selected_swatch = '';
			}

			// Determine which check to preview
			set_check_preview();
		}
	);
	
	// Setup click for the Check Formats
	$(".check-format-frame").click(function() {
		// get rid of previous selection by removing the class
		$(".check-format-frame-selected").removeClass("check-format-frame-selected");

		// add the class to the specific selection
		$(this).addClass("check-format-frame-selected");

		// Determine which check to preview
		set_check_preview();
	});
	


	// Setup hover for the Check Color Patterns
	$(".color-swatch").hover(
		// Over
		function() {
			if ($(this) != $(".color-swatch-selected")) {
				// get rid of previous selection by removing the class
				$(".color-swatch-hover").removeClass("color-swatch-hover");
		
				// add the class to the specific selection
				$(this).addClass("color-swatch-hover");
			}
			
			// Show tooltip
			$(".color-swatch-tooltip", this).fadeIn(0);
			
			// Determine which check to preview
			set_check_preview();
		},
	
		// Out
		function() {
			// get rid of previous selection by removing the class
			$(".color-swatch-hover").removeClass("color-swatch-hover");
	
			// Hide tooltip
			$(".color-swatch-tooltip", this).fadeOut(0);

			// Determine which check to preview
			set_check_preview();
		}
	);

	// Setup click for the Check Color Patterns
	$(".color-swatch").click(function() {
		// get rid of previous selection by removing the class
		$(".color-swatch-selected").removeClass("color-swatch-selected");

		// add the class to the specific selection
		$(this).addClass("color-swatch-selected");

		// Determine which check to preview
		set_check_preview();
	});
	

});