$(document).ready(function(){
	
	init_options();
	$(document).pngFix(); // Fix PNG files
	init_images();
	unique_load(1);

	
	// setup onclick handler for options
	$(".option").click(function(){
		$("#grand_total").queue("fx", []);
		curr_value = $("#grand_total").html();
		curr_value = curr_value.replace(",", "").replace("$", "");
		curr_value = parseFloat(curr_value);
		option_value = parseFloat(this.value);
		if(this.checked) final_value = curr_value += option_value;
		else final_value = curr_value -= option_value;
		$("#grand_total").html(formatCurrency(final_value));
		$("#grand_total").animate({backgroundColor:"yellow"}, 100, 'linear', function(){
			$("#grand_total").animate({backgroundColor:"none"}, 1500, 'linear');
		});
	})
	
});

function init_options(){
	$(".option").attr("checked", "checked");
}

function init_images(){
// Load in the first image
	var el = $("#image_display");
	el.css("backgroundImage", "url(../../images/products/" + arr_images[0][0] + "_s2.jpg)");
	el.title = arr_images[0][1]
	
	
	// Create thumbnails
	for(i=0;i<arr_images.length;i++){
		
		var el = document.createElement("div");
		if(i==0){
			el.className = "image_thumb_hover";
		}else{
			el.className = "image_thumb";
		}
		el.style.backgroundImage = "url(../../images/products/" + arr_images[i][0] + "_s4.jpg)"
		el.setAttribute("zoom", arr_images[i][0]);
		el.title = arr_images[i][1];
		
		// Append to the thumb container
		document.getElementById("image_thumbs").appendChild(el);
		
		// Create on roll over fnctionality
		el.onmouseover=function(){
			
			// clear out
			$kids = $("#image_thumbs").children();
			$kids.removeClass("image_thumb_hover");
			$kids.addClass("image_thumb");
			
			this.className = "image_thumb_hover";
			zoom = this.getAttribute("zoom");
			
			el = document.getElementById("image_display");
			el.title = this.title;
			el.style.backgroundImage = "url(../../images/products/" + zoom + "_s2.jpg)";
			el.setAttribute("zoom", zoom);
			el.onclick=function(){
				tb_show(this.title, "../../images/products/" + this.getAttribute("zoom") + "_s1.jpg", false);
			}
			
		}
		
		// Fire thickbox on click
		el.onclick=function(){
			tb_show(this.title, "../../images/products/" + this.getAttribute("zoom") + "_s1.jpg", false);
		}	
		
	}
}

// Use AJAX to load in unique sections
function unique_load(section){
	$('#unique_content').attr("innerHTML", "<table width=\"100%\" height=\"100%\"><tr><td align=\"center\" valign=\"middle\"><img src=\"../../images/loader.gif\" /></td></tr></table>");
	$('#unique_content').load('unique.html', {s:section});
	$('#unique_nav div div.image img').each(
		function(){
			if($(this).attr("id") == "unique_button_" + section){
				$(this).toggleClass("selected");
			}else{
				$(this).removeClass("selected");
			}
		});
}

function formatCurrency(strValue){
	
	strValue = strValue.toString().replace(/\$|\,/g,'');
	dblValue = parseFloat(strValue);

	blnSign = (dblValue == (dblValue = Math.abs(dblValue)));
	dblValue = Math.floor(dblValue*100+0.50000000001);
	intCents = dblValue%100;
	strCents = intCents.toString();
	dblValue = Math.floor(dblValue/100).toString();
	if(intCents<10)
		strCents = "0" + strCents;
	for (var i = 0; i < Math.floor((dblValue.length-(1+i))/3); i++)
		dblValue = dblValue.substring(0,dblValue.length-(4*i+3))+','+
		dblValue.substring(dblValue.length-(4*i+3));
	return (((blnSign)?'':'-') + '$' + dblValue + '.' + strCents);
}