$(function(){
	jQuery.event.add(window, "load", resizeFrame);
	jQuery.event.add(window, "resize", resizeFrame);
	jQuery.event.add(window, "unload", resizeFrame);
	
	function resizeFrame() 
	{
		var wWidth = $(window).width();
		var wHeight = $(window).height();
		
		var widthh = $(".body-main").width();
		$(".footer").css("width", widthh);
		
		$(".s-request").css({
			"left": (wWidth/2 - (260))+"px",
			"top": (wHeight/2 - (140))+"px"
		});
		
		var nw = $(".s-pop").width();
		var nh = $(".s-pop").height();
		$(".s-pop").css({
			"left": (wWidth/2 - (nw/2))+"px",
			"top": (wHeight/2 - (nh/2))+"px"
		});
	}
	
	$("a").css({
		"cursor": "pointer"
	});
	
	$("input[type='button'], input[type='submit'], input[type='text'], input[type='password'], input[type='reset'], select, textarea").css({
		"overflow": "visible",
		"outline": "none",
		"vertical-align": "middle",
		"font-size": "1em"
	});
	
	$("input[type='button'], input[type='submit'], input[type='reset']").css({
		"cursor": "pointer"
	});
	
	//size function
	$(".detail input[name='price']").click(function(){
		var height = $(this).attr('pheight');
		var width = $(this).attr('pwidth');
		var price = $(this).attr('pprice');
		
		_change_info(width, height, price);
		_change_photo(height-((height*55)/100), width-((width*55)/100));
		_change_label(width, height);
		
		_set_wrap();
	});
	
	function _change_photo(toheight, towidth)
	{
		var toheight = toheight * 2.54;
		var towidth = towidth * 2.54;
		var toheight = toheight.toFixed(0);
		var towidth = towidth.toFixed(0);
		
		$("div[id='photo']").animate({
			left: (388/2)-((towidth)/2)+(29-52),
			top: (258/2)-((toheight)-50)
			}, 240, function() {
			//animate complete
		});
		
		$("div[id='photo'] img").animate({
			width: towidth,
			height: toheight
			}, 240, function() {
			//animate complete
		});
	}
	
	function _change_label(width, height)
	{
		$(".widthg strong").html(width+' cm');
		$(".heightg strong").html(height+'<br>cm');
	}
	
	function _change_info(width, height, price)
	{
		$("span[id='height']").html(height);
		$("span[id='width']").html(width);
		$("span[id='price']").html(price);
		$("input[rel='custom']").attr("value", price);
	}
	
	function _set_wrap()
	{
		$("input[name='setwrap']:checked").each(function () {
        	var wrap = $(this).attr('rel');
			var price = $(this).attr('price');
			var width = $("span[id=width]").html();
			var height = $("span[id=height]").html();
			
			var total = $("span[id=price]").html();
			var totall = parseFloat(total)+parseFloat(price);
			$("span[id=tprice]").html(totall);
			
			var win = width*2.54;
			var win = win.toFixed(0);
			var hin = height*2.54;
			var hin = hin.toFixed(0);
			
			var inside = ' - '+wrap+' Height '+height+' x Width '+width+' inches ('+hin+' x '+win+' cm) |||'+price;
			$("input[name=option1cost]").attr('value', inside);
        });
	}
	
	$("select[name='cheight']").change(function(){
		$("select[name='cheight'] option:selected").each(function () {
        	var str = $(this).attr('rel');
			
			$("select[name='cwidth'] option[rel="+str+"]").attr('selected', 'selected');
			
			var height = $(this).attr('value');
			var width = $("select[name='cwidth'] option[rel="+str+"]").attr('value');
			var price = $("select[name='cwidth'] option[rel="+str+"]").attr('price');
			
			$("input[rel='custom']").attr('checked', 'checked');
			
			_change_info(width, height, price);
			_change_photo(height-((height*55)/100), width-((width*55)/100));
			_change_label(width, height);
			
			_set_wrap();
        });
	});
	
	$("select[name='cwidth']").change(function () {
		$("select[name='cwidth'] option:selected").each(function () {
        	var str = $(this).attr('rel');
			
			$("select[name='cheight'] option[rel="+str+"]").attr('selected', 'selected');
			
			var width = $(this).attr('value');
			var height = $("select[name='cheight'] option[rel="+str+"]").attr('value');
			var price = $("select[name='cheight'] option[rel="+str+"]").attr('price');
			
			$("input[rel='custom']").attr('checked', 'checked');
			
			_change_info(width, height, price);			
			_change_photo(height-((height*55)/100), width-((width*55)/100));
			_change_label(width, height);
			
			_set_wrap();
        });
	});
	
	$("input[rel='custom']").click(function(){
		$("select[name='cwidth'] option[rel=0]").attr('selected', 'selected');
		$("select[name='cheight'] option[rel=0]").attr('selected', 'selected');
		
		var width = $(this).attr('pwidth');
		var height = $(this).attr('pheight');
		_change_label(width, height);
		
		_set_wrap();
	});
	
	$("input[name='setwrap']").click(function(){
		var rel = $(this).attr("rel");
		var price = $(this).attr("price");
			
		$("span[id='option']").html(rel+' + $'+price);
			
		_set_wrap();
	});
	
	$("a[rel=wrapdemo]").hover(function(){
		$(".wrapdemo").css("display", "block");
	}, function(){
		$(".wrapdemo").css("display", "none");		
	});
	//size function
	
	$(".question").hover(function(){
		$(".show-quest").show();
	}, function(){
		$(".show-quest").hide();
	});
	
	$("a[action='call-us']").hover(function(){
		$(".show-call").show();
	}, function(){
		$(".show-call .close").click(function(){
			$(this).parent().hide();
		});
	});
	
	$("a[action=send-link]").click(function(){
		resizeFrame();
		var url = $(this).attr("url");
		var fid = $(this).attr("fid");
		$(".s-pop").show();
		$(".s-pop").load(url+"?fid="+fid, function() {
			resizeFrame();
		});
	});
	
	$("a[action=send-card]").click(function(){
		resizeFrame();
		var url = $(this).attr("url");
		var fid = $(this).attr("fid");
		$(".s-pop").show();
		$(".s-pop").load(url+"?fid="+fid, function() {
			resizeFrame();
		});
	});
	
	$("a[action=send-request]").click(function(){
		resizeFrame();
		var url = $(this).attr("url");
		$(".s-pop").show();
		$(".s-pop").load(url, function() {
			resizeFrame();
		});
	});
	
	$("input[name='q']").click(function(){
		$(this).attr("value", "");
	});
	
	//$(".s-pop a[action=closepop]").click(function(){
		//$(".s-pop").html("");
		//$(".s-pop").hide();
	//});
	
	//Control CSS Style
	$(".popular ul li:nth-child(5n+5)").css("margin-right", "0px");
	$(".content .inside .four-list li:nth-child(4n+4)").css("margin-right", "0px");
	$(".content .inside .four-list-item li:nth-child(4n+4)").css("margin-right", "0px");
	$(".content .inside .two-list li:nth-child(2n+2)").css("margin-right", "0px");
	//END-Control CSS Style
});