$(function() { 

	// sub image switching, products..
	
	$('.sub-image').click(function() {
		var s = $(".main-image").attr("src");
		$(".main-image").attr("src", $(this).attr("src"));
		$(this).attr("src", s);
	});
	
	// font replacement
	$.pir.options.php="/pir";
	$(".pir").pir({font: "pointy.ttf", wrap: false});

	$("#search").focus(function() {
		$(this).css('color', '#000');
		if($(this).val() == "Type and hit enter...") 
		{
			$(this).val('');
		}
	});
	
	// newsletter overlay
	$("#mailing-list").overlay({
		expose: { 
	        color: '#EEE', 
	        loadSpeed: 200, 
	        opacity: 0.8
	    },
	    api: true
    });
	
	// newsletter submission
	$("#sub-form").submit(function() {
		$.ajax({
			url: '/shop/subscribe',
			type: 'POST',
			data: 'member_name=' + $("#name").val() + "&member_email=" + $("#email").val(),
			success: function(data, message) {
				if(data == "success")
				{
					$("#subscribe").empty().append("<p>You're subscribed, thanks!</p>")
					$("#control").show(1500, function() { $("#mailing-list").overlay().close(); $("#control").hide(1); $("#subscribe").empty().append('<p>Sign up to our newsletter!</p><form id="sub-form"><input type="text" id="name" value="Your name" onfocus="if(this.value == \'Your name\') this.value = \'\'; "/><input type="text" id="email" value="Your email" onfocus="if(this.value == \'Your email\') this.value = \'\'; " /><button type="submit">Sign up!</button></form>'); });
				}
				else
				{
					$("#subscribe").empty().append("<p>There was an error, please try again!</p>")
					$("#control").show(1500, function() { $("#mailing-list").overlay().close(); $("#control").hide(1); $("#subscribe").empty().append('<p>Sign up to our newsletter!</p><form id="sub-form"><input type="text" id="name" value="Your name" onfocus="if(this.value == \'Your name\') this.value = \'\'; "/><input type="text" id="email" value="Your email" onfocus="if(this.value == \'Your email\') this.value = \'\'; " /><button type="submit">Sign up!</button></form>'); });
				}
			}
		});
		
		return false;
	});
	
	// add product to cart.
	$("#buy-this").click(
		function() { 
			// add an ajax call to the cart!
			$.ajax({
				url: '/cart/ajax_add/' + $(this).attr('rel'),
				success: function(data, status) {
					data = JSON.parse(data);
					if(data.success == true)
					{
						$("#buy-this").hide(500);
						$(".description").append("<h2>Great! It's been added to your cart.</h2>");
					}
					else
					{
						alert(data.message);
					}
				}
			});
			return false;
		}
	); 
	
	// load shopping cart into sidebar
	$("#shopping-cart").click(
		function() {
			showCart();
			return false;
		}
	)
	
	// check footer links for a click.
	$("a[rel='footer']").click(
		function() {
			var t = $(this).parent().attr('id');
			$.ajax({
				url: '/index/load_' + t,
				success: function(data, status) {
					data = JSON.parse(data);
					$("#sidebar").empty().append(data); 
				}
			});
			return false;
		}
	);
	
	
	// item is the nth div that is in the center of the view.
	var item = 0, count = '';
	
	// check if there are more than 3, if there are, duplicate last and prepend it, then scroll the div and set item to one. This is so it scrolls...
	if($('#scroll').children().size() > 3) {
		count = ($('#scroll').children().size() - 1);
		var t = $("#scroll div:eq(" + count + ")").html(); // get last item's html
		// basically, if there's 4 items we need to duplicate them all and add them neatly, or it won't work.
		// Like this: | [0] [1] [2] | [3]   =>   [2] [3] | [0] [1] [2] | [3] [0] [1]
		
		var center = {height: '350px', width: '220px', marginLeft: '0px', marginRight: '0px', marginTop: '-5px', top: 0, left: 0};
		var offcenter = {height: '318px', width: '200px', marginLeft: '4px', marginRight: '4px', marginTop: '10px', top: 0, left: 0};

		if($('#scroll').children().size() == 4)
		{
			$('#scroll').prepend("<div>" + t + "</div>"); // add it to the beginning			
			var t = $("#scroll div:eq(" + (count) + ")").html();
			$('#scroll').prepend("<div>" + t + "</div>");
			t = $("#scroll div:eq(2)").html();
			$('#scroll').append("<div>" + t + "</div>");
			t = $("#scroll div:eq(3)").html();
			$('#scroll').append("<div>" + t + "</div>");
			var a = $('#item').attr("scrollLeft") + 480;
			t = 3;
			item = 2;
		} 
		else
		{
			$('#scroll').prepend("<div>" + t + "</div>"); // add it to the beginning.
			$("#scroll div:eq(" + (count + 1) + ")").remove(); // remove it.
			var a = $('#item').attr("scrollLeft") + 237;
			item = 1;	// the left most item is now item 1 instead of item 0, so redefine the counter.
			t = 2;	
		}

		$("#item").attr("scrollLeft", $("#scroll div:eq(" + item + ")").attr("offsetLeft")); // but now the last item is now visible as the first one. scroll it onwards a bit..
		
		
		$("#scroll-right").show(1);
		$("#scroll-left").show(1);
		$('#scroll').css('width', ($('#scroll').children().size() * 242 + 252));
	}

	count = ($('#scroll').children().size() - 1);
	
	$("#scroll-right").click(function() {
	
		// take one off the left-most side and add it to the right-most side 
			
		var left = $("#scroll div:eq(0)").html();
		$("#scroll div:eq(0)").remove();
		$('#scroll').append("<div>" + left + "</div>");
		$('#scroll').prepend("<span class='spacer' />");
		$("#scroll span").hide(500, function() { $(this).remove(); });
		return false;
	});
	
	$("#scroll-left").click(function() {
		var right = $("#scroll div:eq(" + count + ")").html();
		$("#scroll div:eq(" + count + ")").remove();
		$('#scroll').prepend("<div style='display: none'>" + right + "</div>");
		$("#scroll div:eq(0)").show(500);
		return false;
	});
});

function checkoutCart(obj)
{
	$(obj).hide(0);
	window.location = "/cart/checkout";
	$("#sidebar").append("<p style='text-align: center; margin-top: 50px; font-weight: bold'>Checking out...</p>");

}

function removeFromCart(link)
{

	$.ajax({
		url: '/cart/ajax_remove/' + $(link).attr('rel'),
		success: function(data, status) {
			data = JSON.parse(data);
			if(data.success == true)
			{
				$(link).parent().hide(500, function() { showCart(); });
			}
		}
	});
	return false;	

}

function addVoucherCode(code)
{
	$.ajax({
		url: '/cart/ajax_add_voucher/',
		type: 'post',
		data: 'code=' + code,
		success: function(data, status) {
			if(data == false)
				data = "<h2>Your cart</h2><p>Your cart is currently empty.</p>";
			else
				data = data + "<br class='clear' /><input type='submit' value='Checkout' style='width: 100px; display: block; margin: 50px auto 0 auto;' onClick='checkoutCart(this); return false;'/>";
				
			$("#sidebar").empty().append(data);
		}
	});
}

function showCart()
{
	$.ajax({
		url: '/cart/ajax_show_cart/',
		success: function(data, status) {
			if(data == false)
				data = "<h2>Your cart</h2><p>Your cart is currently empty.</p>";
			else
				data = data + "<br class='clear' /><input type='submit' value='Checkout' style='width: 100px; display: block; margin: 50px auto 0 auto;' onClick='checkoutCart(this); return false;'/>";
				
			$("#sidebar").empty().append(data);
			
		}
	});
}

function updateDelivery(select)
{
	$.ajax({
		url: '/cart/update_shipping/' + $(select).val(),
		success: function(data, status) {
			if(data == false)
				data = "<p style='text-align: center; font-weight: bold; margin: 20px 0 0 0; padding: 0 0;'>Your cart is currently empty!</p>";
			else
				data = data + "<br class='clear' /><input type='submit' value='Checkout' style='width: 100px; display: block; margin: 50px auto 0 auto;' onClick='checkoutCart(this); return false;'/>";
				
			$("#sidebar").empty().append(data);
			
		}
	});
	
}