function getLoader(){
	
	var loadingHTML = '<div class="Loading">Loading...</div>';
	return loadingHTML;

}

function getStates(){
	
	$('BillingStateSelector').update('<label><span class="Req">*</span>State/Province:</label>' + getLoader());
	ajax("getStates", { countryid:$('BillingCountryId').value }, resultStates);
	
}

function resultStates(r){
	
	$('BillingStateSelector').update(r.html);
	
}

function getShippingStates(){
	
	$('DeliveryStateSelector').update('<label><span class="Req">*</span>State/Province:</label>' + getLoader());
	ajax("getShippingStates", { countryid:$('DeliveryCountryId').value }, resultShippingStates);
	
}

function resultShippingStates(r){
	
	$('DeliveryStateSelector').update(r.html);
	
}

function getProductColour(productId,colourId){
	
	$('ProductImage' + productId).update('');
	//$('ColourName' + productId).update('');
	ajax("getProductColour", { productId:productId, colourId:colourId }, resultProductColour);
	
}

function resultProductColour(r){

	var productId = r.productId;
	var productImageTemplate = new Template('<img src="#{productImage}" alt="" />');
	$('ColourId' + productId).value = r.colourId;
	$('ProductImage' + productId).update(productImageTemplate.evaluate({ productImage:r.objImages[0][2] }));
	$('Size' + productId).update(r.sizeOptions);
	$('StyleNumber' + productId).update(r.styleNumber);
	//$('ColourName' + productId).update(r.colourName);
	
	thumbnailViewsString = "";
	
	if(r.objImages.length > 1){
		
		// Loop over images array
		for(i=0; i<r.objImages.length; i++){
			imagename = r.objImages[i][0];
			thumbnail = r.objImages[i][1];
			image = r.objImages[i][2];
			large = r.objImages[i][3];
			className = 'Left';
			
			if((i % 2)){
				className = '';
			}
			
			// Add to string
			thumbnailString = '<div class=" ' + className + '"><a href="javascript:changeImage(\'ProductImage' + productId + '\',\'' + imagename +'\',\'' + image + '\',\'' + large + '\');"><img src="' + thumbnail + '" style="width:86px;"></a><h3>' + imagename + '</h3></div>';
			thumbnailViewsString = thumbnailViewsString + thumbnailString;
	
		}
	
		// Update Container
		thumbnailViewsString = thumbnailViewsString + '<div class="Clear"></div>';
		
		// Set Container Height
		ProductImageViewsHeight = Math.round((r.objImages.length / 2)) * 180;
		$('ProductImageViews').setStyle({ height:ProductImageViewsHeight + 'px' });
	}
	
	$('ProductImageViews').update(thumbnailViewsString);
	
	
}

function addToCart(productId){
	
	var colourId = 0;
	var sizeId = 0;
	if($('ColourId' + productId)) colourId = $F('ColourId' + productId);
	if($('SizeId' + productId)) sizeId = $F('SizeId' + productId);
	$('AddToCart').hide();
	ajax("addToCart", { productid:productId, colourid:colourId, sizeId:sizeId }, resultAddtoCart);
	
}

function resultAddtoCart(r){

	$('AddToCart').show();

	if(r.isStock){
		if(r.basketTotalQty > 0) {
			
			strBasketTotalQty = r.basketTotalQty + " item";
			
			if(r.basketTotalQty > 1){
				strBasketTotalQty = strBasketTotalQty + "s";
			}
	
			$('BasketTotalQty').update(strBasketTotalQty);
			
			isCheckout = confirm("'OK' to checkout, 'Cancel' to continue shopping.");
			
			if(isCheckout){
				document.location.href = $('BasketURL').value;
			}

		}
	}
	else {
		alert('Out of stock.');	
	}
	
}

function setIsDeliverySame(obj){
	
	if(obj.checked){
		$('DeliveryCountryId').value = $('BillingCountryId').value;
		$('DeliveryStateSelector').update('<label><span class="Req">*</span>State/Province</label>' + getLoader());
		ajax("getShippingStates", { countryid:$('DeliveryCountryId').value }, resultSetIsDeliverySame);
	}
	
}

function resultSetIsDeliverySame(r){
	
	$('DeliveryStateSelector').update(r.html);
	
	$('DeliveryFirstName').value = $('FirstName').value;
	$('DeliverySurname').value = $('Surname').value;
	$('DeliveryEmail').value = $('Email').value;
	
	objEls = new Array();
	objEls = ["State","StateId","Postcode","Suburb","Address1","Address2","Phone"];
	
	for(i=0; i<objEls.length; i++){
		if($('Delivery'+objEls[i]))
			$('Delivery'+objEls[i]).value = $('Billing'+objEls[i]).value;
	}
	
}


function getEntertainerType(){
	
	$('EntertainerTypeSelector').update('<label><span class="Req">*</span> Entertainment:</label>' + getLoader());
	ajax("getEntertainerType", { genderid:$('GenderId').value }, resultEntertainerType);
	
}

function resultEntertainerType(r){
	
	$('EntertainerTypeSelector').update(r.html);
	
}