var category_id;
var order_type;

LoadJs();

$(document).ready(function(){
						   
order_type = $("#order_type").attr("value")*1;

if( $("#banners")!=null ) {
	$('#banners').cycle({
		fx: 'fade',
		speed:  'slow',
        timeout: 6000
	});
}
						   
if( $('#order') ) {
	$('#order').accordion({
		autoheight: false,
		header: 'a.header'
		});
	$("#form").validate();
	
	var prod_imgs = $('.product_image');
	prod_imgs.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
	
		if( $(".category_image") ) {
		var cat_img =$(".category_image");  
		
		cat_img.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
	}
	
}

if( $('#faq') ) {
	jQuery('#faq').accordion({
		autoheight: false
	});
}

if( ('#contactForm') ) {
	$("#contactForm").validate();	
}
});

function LoadJs() {
document.write('<script type="text/javascript" src="js/chili-1.7.pack.js"></script>');
document.write('<script type="text/javascript" src="js/jquery.easing.js"></script>');	
document.write('<script type="text/javascript" src="js/jquery.dimensions.js"></script>');
document.write('<script type="text/javascript" src="js/jquery.accordion.js"></script>');
document.write('<script type="text/javascript" src="js/jquery.validate.js"></script>');
document.write('<script type="text/javascript" src="js/jquery.fancybox.js"></script>');
document.write('<script type="text/javascript" src="js/jquery.cycle.js"></script>');
}

function PickCeramic() {
	
var url = '/~sparklec/includes/request.php';
var id = $("#ceramic_item").attr("value");
var params = "id=" + id + "&action=get_designs";

var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	$("#ceramic_designs").html(html);
	$('#order').accordion("activate", 2);
	
	if( $(".category_image") ) {
		var cat_img =$(".category_image");  
		
		cat_img.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
	}
}});
return false;
}

function PickItem(num, general_price) {
var ceramic_items = $("#select_product > span");
ceramic_items.each(function(){
	if($(this).attr("id") == "ceramic_"+num) {
	$(this).fadeTo("fast", 0.5);
	}
	else {
	$(this).fadeTo("fast", 1);
	}
});

var url = '/~sparklec/includes/request.php';
var params = "prod_id=" + num + "&action=get_prod_description";
var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){	
	$("#ceramic_item").attr("value", num);
	
	$("#total_price").attr("value", general_price);	
	
	OrderDetails(false);
	
	var html = html;
	
	if(order_type==1) {
	html+= '<p><a href="#" class="back" onClick="return Step(1);"></a></p><br /><a href="#" class="continue" onClick="return Continue();"></a>';
	}
	else {
	html+= '<br /><a href="#" class="continue" onClick="return PickCeramic();"></a><p><a href="#" class="back" onClick="return Step(0);"></a></p>';	
	}
	
	$("#user_help").html(html);
	
	if(order_type==1) {
	$('#order').accordion("activate", 2);
	}
	else {
	$('#order').accordion("activate", 1);	
	}
}});
return false;
}

function PickDesignCategory( design_id, design_name ) {
	var design_items = $("#design_cats > span");
	design_items.each(function(){
		if($(this).attr("id") == "design_"+design_id) {
		$(this).fadeTo("fast", 0.5);
		}
		else {
		$(this).fadeTo("fast", 1);
		}
		
	$("#selected_design").attr("value", design_id);
	$("#selected_design_name").attr("value", design_name);
	
	var url = '/~sparklec/includes/request.php';
	var id = design_id;
	var params = "id=" + id + "&action=get_category_products";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	var cnt = '<p>Select your design from the following.</p>';
	cnt += html;
	cnt += '<p><a href="#" class="back" onClick="return Back(\'design_cats_details\', \'design_cats\');"></a></p>';
	
	$("#design_cats_details").html(cnt);
	
	$("#design_cats_details").css("display", "block");
	$("#design_cats").css("display", "none");
	
	var design_img = $(".category_item_image");  
		
		design_img.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
		
	OrderDetails(false);
	}});
		
	});
return false;
}

function PickDesign( design_id, design_name ) {
	var design_items = $("#design_cats_details > span");
	design_items.each(function(){
		if($(this).attr("id") == "design_item_"+design_id) {
		$(this).fadeTo("fast", 0.5);
		}
		else {
		$(this).fadeTo("fast", 1);
		}
		
	$("#selected_design_item").attr("value", design_id);
	$("#selected_design_item_name").attr("value", design_name);
	
	var url = '/~sparklec/includes/request.php';
	var id = design_id;
	var params = "id=" + id + "&action=get_design_desc";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	var cnt = html;
	
	if(order_type == 1) {
	cnt += '<p style="margin:5px;">Enter any design alterations here. You can include colour changes using the colours shown <a class="iframe" style="color:#EC86B5;" id="colour_iframe" href="includes/request.php?act=get_colours">here</a><br /><br /><textarea name="ceramic_design_details" id="ceramic_design_details" cols="50" rows="8"></textarea><br /><br /><a href="#" class="continue" style="margin-left:0;" onClick="return Continue4();"></a><br /><a href="#" class="back" style="margin-left:0;" onClick="return Back(\'design_extra_details\', \'design_cats_details\');"></a></p>';
	}
	else {
	cnt += '<p style="margin:5px;">Enter any design alterations here. You can include colour changes using the colours shown <a class="iframe" style="color:#EC86B5;" id="colour_iframe" href="includes/request.php?act=get_colours">here</a><br /><br /><textarea name="ceramic_design_details" id="ceramic_design_details" cols="50" rows="8"></textarea><br /><br /><a href="#" class="continue" style="margin-left:0;" onClick="return Continue();"></a><br /><a href="#" class="back" style="margin-left:0;" onClick="return Back(\'design_extra_details\', \'design_cats_details\');"></a></p>';		
	}
	
	$("#design_extra_details").html(cnt);
	
	$("#design_extra_details").css("display", "block");
	$("#design_cats_details").css("display", "none");
	
	$("a#colour_iframe").fancybox({'frameWidth' : 900, 'frameHeight' : 500});
	
	OrderDetails(false);
	}});
		
	});
return false;
}

function PickSupDesign( design_id, design_name ) {
var design_items = $("#sup_designs_cnt > span");
	design_items.each(function(){
		if($(this).attr("id") == "supdesign_"+design_id) {
		$(this).fadeTo("fast", 0.5);
		}
		else {
		$(this).fadeTo("fast", 1);
		}
		
	$("#selected_supdesign").attr("value", design_id);
	$("#selected_supdesign_name").attr("value", design_name);
	
	var url = '/~sparklec/includes/request.php';
	var id = design_id;
	var params = "id=" + id + "&action=get_supdesign_desc";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	var cnt = html;
	cnt += '<p>Enter any supplementary design alterations<br /><br /><textarea name="ceramic_supdesign_details" id="ceramic_supdesign_details" cols="50" rows="8"></textarea><br /><br /><a href="#" class="continue" style="margin-left:0;" onClick="return Continue1();"></a><br /><a href="#" class="back" style="margin-left:0;" onClick="return Back(\'sup_design_details\', \'sup_designs_cnt\');"></a></p>';
	
	$("#sup_design_details").html(cnt);
	
	$("#sup_design_details").css("display", "block");
	$("#sup_designs_cnt").css("display", "none");
	
	OrderDetails(false);
	}});
		
	});

return false;
}

function OrderDetails(step_activate) {
	var url = '/~sparklec/includes/request.php';
	var total_price = $("#total_price").attr("value");
	var prod_id = $("#ceramic_item").attr("value");
	var design_id = $("#selected_design_item").attr("value");
	var selected_category_id = $("#selected_category").attr("value");
	var selected_supdesign_id = $("#selected_supdesign").attr("value");
	var ceramic_supdesign = $("#ceramic_supdesign_details").attr("value");
	var main_design_details = $("#ceramic_design_details").attr("value");
	var font_details = $("#font_details").attr("value");
	var font_colour_details = $("#font_colour_details").attr("value");
	var extra_det = $("#comments").attr("value");
		
	var params = "total_price=" + total_price + "&prod_id=" + prod_id + "&design_id=" + design_id + "&extra_det=" + extra_det + "&selected_category_id=" + selected_category_id + "&selected_supdesign_id=" + selected_supdesign_id + "&font_details=" + font_details + "&font_colour_details=" + font_colour_details + "&main_design_details=" + main_design_details + "&ceramic_supdesign=" + ceramic_supdesign + "&action=get_summary";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	$("#order_details").html(html);
	
	$(".summary_img").fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
	});
	
	if(step_activate) {
	$('#order').accordion("activate", 6);
	}
	}});

return false;	
}

function CopyAddress(state) {
	if(state == true) {
	var b_country = $("#b_country")[0];
	var s_country = $("#s_country")[0];
	
	var selected_country = b_country.options[b_country.selectedIndex].value
	
	for(var i=0; i<s_country.options.length; i++) {
		if(s_country.options[i].value == selected_country ) {
		s_country.options[i].selected = true;	
		}
	}
	
	$("#s_address_1").attr("value", $("#b_address_1").attr("value"));
	$("#s_address_2").attr("value", $("#b_address_2").attr("value"));
	$("#s_address_3").attr("value", $("#b_address_3").attr("value"));
	$("#s_postcode").attr("value", $("#b_postcode").attr("value"));
	$("#s_county").attr("value", $("#b_county").attr("value"))
	}
	checkShippingCosts();
}

function checkShippingCosts() {
	var url = '/~sparklec/includes/request.php';
	var total_price = $("#total_price").attr("value");
	var shipp_country = $("#s_country")[0];
	shipp_country = shipp_country.options[shipp_country.selectedIndex].value;
	
	var params = "total_price=" + total_price + "&shipp_country=" + shipp_country + "&action=get_shipping_costs";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	$("#total_costs").html(html);
	}});

}

function PickCategory(cat_num, cat_name) {
category_id = cat_num;
var category_items = $("#select_category > span");
	category_items.each(function(){
		if($(this).attr("id") == "category_item_"+cat_num) {
		$(this).fadeTo("fast", 0.5);
		}
		else {
		$(this).fadeTo("fast", 1);
		}
	});
	var url = '/~sparklec/includes/request.php';
	
	var params = "cat_num=" + cat_num + "&action=get_ceramics";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
		
		$("#select_product").html(html);
		$("#selected_category").attr("value", cat_num);
		$("#selected_category_name").attr("value", cat_name);
		$("#select_product").css("display", "block");
		$("#select_category").css("display", "none");
		
	var desc = $('.info_box');
	desc.each(function(){
		$(this).fancybox({'frameWidth' : 900, 'frameHeight' : 500});
	});
			
	var prod_imgs = $('.product_image');
	prod_imgs.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
	
	OrderDetails(false);
	
	}});
return false;	
}

function Back(step1, step2) {
$("#"+step1).css("display", "none");
$("#"+step2).css("display", "block");

return false;
}

function Continue() {
	var url = '/~sparklec/includes/request.php';	
	var params = "action=get_sup_design";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	$("#sup_designs").html(html);
	
	var boxes = $('.category_image');
	boxes.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
	
	OrderDetails(false);
	
	$('#order').accordion("activate", 3);
	}});

return false;
}

function Continue1() {
var html = '<p>Type in your text and font name you want to use.<br />You can view all available fonts <a class="iframe" style="color:#EC86B5;" id="font_iframe" href="includes/request.php?act=get_fonts">here</a>.</p><p><textarea name="font_details" id="font_details" cols="50" rows="8"></textarea></p><p>Select your font colours and explain how each should be used.<br />You can view all available font colours <a class="iframe" style="color:#EC86B5;" id="font_colour_iframe" href="includes/request.php?act=get_colours">here</a>.</p><p><textarea name="font_colour_details" id="font_colour_details" cols="50" rows="8"></textarea></p><p><a href="#" class="back" style="margin-left:0;" onClick="return Step(3);"></a><br /></p><p><a href="#" class="continue" style="margin-left:0;" onClick="return Continue2();"></a></p>';

$("#fonts").html(html);

$("a#font_iframe").fancybox({'frameWidth' : 900, 'frameHeight' : 500});
$("a#font_colour_iframe").fancybox({'frameWidth' : 900, 'frameHeight' : 500});

OrderDetails(false);

$('#order').accordion("activate", 4);

return false;
}

function Continue2() {
	
var html = '<p><textarea name="comments" id="comments" cols="50" rows="8"></textarea></p><p><a href="#" style="margin-left:0;" class="back" onClick="return Step(4);"></a><br /><p><a href="#" class="continue" style="margin-left:0;" onClick="return Continue3();"></a></p>';

$("#extra_info").html(html);

OrderDetails(false);

$('#order').accordion("activate", 5);

return false;
}

function Continue3() {
	
OrderDetails(true);

return false;
	
}

function Continue4() {
	var url = '/~sparklec/includes/request.php';	
	var params = "action=get_categories";
	var ajax = new $.ajax({
	type: "POST",
	url: url,
	cache: false,
	data: params,
	success: function(html){
	$("#ceramic_items").html(html);
	
	var boxes = $('.category_image');
	boxes.each(function(){
		$(this).fancybox({
			'zoomSpeedIn': 550,
			'zoomSpeedOut': 550
		});
	});
	
	OrderDetails(false);
	
	$('#order').accordion("activate", 1);
	}});

return false;
}

function Step(num) {
	$('#order').accordion("activate", num);	
	return false;
}

function PickFont(name) {
	var current_txt = parent.$("#font_details").attr("value");
	parent.$("#font_details").attr("value", "[Font: "+name+"] "+current_txt);
	parent.$("#font_details").focus();
	parent.$.fn.fancybox.close();		
}
