// JavaScript Document

var basket;
var basketContent;
var subtotal;
var subtotalValue;
var itemsSpan;
var totalSpan;
var displayTimeOut;

addOnload(createBasketOb);
addOnload(getAddToBasketForm);
addOnload(getChangeQty);
addOnload(getDeleteQty);

function createBasketOb() {
	basket = document.getElementById('basket');
	basketContent = document.getElementById('basketContent');
	subtotal = document.getElementById('basketSubtotal');
	subtotalValue = parseFloat(document.getElementById('basketSubtotal').innerHTML);
	itemsSpan  = document.getElementById('numberOfItems');
	totalSpan = document.getElementById('totalValue');

	var currentSearchBoxPos = findPos(document.getElementById('searchBox'));
	basket.style.top = currentSearchBoxPos[1] + "px";
	basket.style.left = currentSearchBoxPos[0] + "px";
	//opacity(basket.id, 100, 0, 0);
}


function displayBasket(customSet) {
	if ((customSet=="hidden") || (customSet=="visible"))
		if (customSet=="visible") showBasket(); else hideBasket();
	else
		if (basket.style.visibility == "visible") hideBasket(customSet); else showBasket(customSet);
	return false;
}

function showBasket(customSet) {
	if (basket.style.display != "block") basket.style.display = "block";
	if (basket.style.visibility != "visible") basket.style.visibility = "visible";
	clearTimeout(displayTimeOut);
	//if (basket.style.opacity == 0) opacity(basket.id, 0, 100, 0);
	//scroll(0,0);
	if (customSet != "still") displayTimeOut = setTimeout('hideBasket()',6000);
}

function hideBasket() {
	if (basket.style.display == "block") basket.style.display = "none";
	if (basket.style.visibility == "visible") basket.style.visibility = "hidden";
	//opacity(basket.id, 100, 0, 50);
}

function getAddToBasketForm() {
	var allBaskets = document.getElementsByClassName("form","addToBasket");
	for (i=0; i<allBaskets.length; i++) allBaskets[i].onsubmit = addProductToBasket;
}

function addProductToBasket() {
	var ob = this;
	var productValue = parseFloat(this.scPrice.value);
	var requestURL = "/shop/basket.ajax.php";
	var params ="scProductId=" + this.scProductId.value + "&scTitle=" + this.scTitle.value + "&scPrice=" + this.scPrice.value + "&scDelivery=" + this.scDelivery.value + "&scOther=" + this.scOther.value;
	xmlhttp.open("POST", requestURL);
	xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlhttp.setRequestHeader("Content-length", params.length);
	xmlhttp.setRequestHeader("Connection", "close");
	xmlhttp.onreadystatechange = function() {
		if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
			var responseData = xmlhttp.responseText.split(",");
			var newItem = createBasketItem(ob.scImage.value,ob.scTitle.value,"Price: \u00A3" + ob.scPrice.value, ob.scQty.value, responseData[2]);
			basketContent.appendChild(newItem);
			basketContent.scrollTop = basketContent.scrollHeight;
			subtotalValue = parseFloat(subtotalValue + productValue);
			subtotal.innerHTML = subtotalValue.toFixed(2);
			itemsSpan.innerHTML = responseData[1];
			totalSpan.innerHTML = subtotalValue.toFixed(2);
			displayBasket("visible");
		}
	}
	xmlhttp.send(params);
	return false;
}

function createBasketItem(im,title,price,qty,id) {
	var newProduct = document.createElement("div");
		newProduct.className = "product";
	var productImage = document.createElement("div");
		productImage.className = "productImage";
		productImage.style.backgroundImage = "url('" + im + "')";
	var productTitle = document.createElement("div");
		productTitle.className = "title";
		var productTitleContent = document.createTextNode(title);
			productTitle.appendChild(productTitleContent);
	var productPrice = document.createElement("div");
		productPrice.className = "price";
		var productPriceContent = document.createTextNode(price);
			productPrice.appendChild(productPriceContent);
	var productQty = document.createElement("div");
		productQty.className = "qty";
		var productQtyContent = document.createTextNode("Quantity:");
			productQty.appendChild(productQtyContent);
		var productQtyBreak = document.createElement("br");
			productQty.appendChild(productQtyBreak);
		var productQtyField = document.createElement("input");
			productQtyField.id = "prQty_" + id;
			productQtyField.setAttribute('value',qty);
			productQty.appendChild(productQtyField);
		var productQtyRefresh = document.createElement("img");
			productQtyRefresh.className = "updateQty " + id;
			productQtyRefresh.onclick = updateQty;
			productQtyRefresh.setAttribute('src','/shop/images/refreshWhite.png');
			productQty.appendChild(productQtyRefresh);
	var productRemove = document.createElement("div");
		productRemove.className = "delete";
		var productRemoveImage = document.createElement("img");
			productRemoveImage.className = "deleteProduct " + id;
			productRemoveImage.onclick = deleteProduct;
			productRemoveImage.setAttribute('src','/shop/images/deleteFromCard.png');
			productRemove.appendChild(productRemoveImage);
	
	newProduct.appendChild(productImage);
	newProduct.appendChild(productTitle);
	newProduct.appendChild(productPrice);
	newProduct.appendChild(productQty);
	newProduct.appendChild(productRemove);
	
	return newProduct;
}

function getChangeQty() {
	allQtys = document.getElementsByClassName("img", "updateQty");
	for (i=0; i<allQtys.length; i++) allQtys[i].onclick = updateQty;
}

function updateQty() {
	var ob = this;
	var theId = ob.className.split(" ")[1];
	var newQty = document.getElementById("prQty_" + theId).value;
	var requestURL = "/shop/basket.ajax.php";
	var params ="update=" + theId + "&qty=" + newQty;
	xmlhttp.open("POST", requestURL);
	xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlhttp.setRequestHeader("Content-length", params.length);
	xmlhttp.setRequestHeader("Connection", "close");
	xmlhttp.onreadystatechange = function() {
		if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
			var responseData = xmlhttp.responseText.split(",");
			subtotalValue = parseFloat(responseData[0]);
			subtotal.innerHTML = subtotalValue.toFixed(2);
			itemsSpan.innerHTML = responseData[1];
			totalSpan.innerHTML = subtotalValue.toFixed(2);
			if (newQty == 0) ob.parentNode.parentNode.parentNode.removeChild(ob.parentNode.parentNode);
			displayBasket("visible");
		}
	}
	xmlhttp.send(params);
}

function getDeleteQty() {
	var allDeletes = document.getElementsByClassName("img","deleteProduct");
	for (i=0; i<allDeletes.length; i++) allDeletes[i].onclick = deleteProduct;
}

function deleteProduct() {
	var ob = this;
	var theId = ob.className.split(" ")[1];
	var requestURL = "/shop/basket.ajax.php";
	var params ="remove=" + theId;
	xmlhttp.open("POST", requestURL);
	xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlhttp.setRequestHeader("Content-length", params.length);
	xmlhttp.setRequestHeader("Connection", "close");
	xmlhttp.onreadystatechange = function() {
		if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
			var responseData = xmlhttp.responseText.split(",");
			subtotalValue = parseFloat(responseData[0]);
			subtotal.innerHTML = subtotalValue.toFixed(2);
			itemsSpan.innerHTML = responseData[1];
			totalSpan.innerHTML = subtotalValue.toFixed(2);
			ob.parentNode.parentNode.parentNode.removeChild(ob.parentNode.parentNode);
			displayBasket("visible");
		}
	}
	xmlhttp.send(params);
}