/*
   (c) Timo Doerr 2009
   licensed unter GNU GPL v2
*/
	// global vars
	var selectedHorizAttribute = null;
	var selectedVertAttribute = null;
	var productMatrix = null;
/* vars declared in the template
	productID;
*/

/// Attribute chooser logic, display logic
	// display/hides Highslide like window for Horiz Attrib
	// i.e. hair color
	function showHorizChooser(){
		setDisplay("bgHighslide", true, false);
		// main highslide box
		// TODO effect makes trouble just adjust it
		setDisplay("horizChooser", true, true);
	}
	function showVertChooser(){
		setDisplay("bgHighslide", true, false);
		// main highslide box
		// TODO effect makes trouble just adjust it
		setDisplay("vertChooser", true, true);
	}	
	// show/hide a div given by id (length of hair i.e.)
	function setDisplay(divname, doDisplay, withEffect){
		togglediv = document.getElementById(divname);
		if(doDisplay){
			togglediv.style.visibility = "visible";
			if(withEffect == true){
				togglediv.style.display = "none";
				Effect.toggle(togglediv,"appear", { duration: 0.7 });
			}
			else {
				togglediv.style.display = "block";
			}	
		}	
		else{
			if(withEffect == true)
				Effect.toggle(togglediv,"appear",{ duration: 0.7 });
			else
				togglediv.style.display = "none";
		}
	}
	// main function to display horiz chooser 
	// handles all the logic
	function getHorizAttribute(){
		// reset already chosen attribute if any
		selectedHorizAttribute = null;
		// display horiz chooser
		showHorizChooser();
		// vertChooser is toggled in the onClick Method of the hair-color img links
	}
	// vert attribute
	function getVertAttribute(){
		// reset already chosen attribute if any
		selectedVertAttribute = null;
		showVertChooser();
	}
	
	function selectHorizAttribute(attributeID, attributeName, filePath){
		selectedHorizAttribute = attributeID;
		setDisplay("horizChooser", false, true);
		setDisplay("bgHighslide", false, false);
		// refresh preview image
		fileExtension = extractFileExtension(filePath);
		document.getElementById("imgHorizAttribute").src = "/images/attribute_images/" +
			horizOptionID + "_"  + selectedHorizAttribute + "." + fileExtension;
		// display the name of the attribute
		document.getElementById("horizAttributeText").innerHTML = attributeName;
		// only display when no default src for image is set
		// setDisplay("imgHorizAttribute", true);
		// set hidden input to chosen id for basket action
		document.getElementById("horizOptionID").value = selectedHorizAttribute;
		onProductComplete();
	}
	function selectVertAttribute(attributeID,attributeName){
		selectedVertAttribute = attributeID;
		setDisplay("vertChooser", false, true);
		setDisplay("bgHighslide", false, false);
		// refresh preview image
		document.getElementById("imgVertAttribute").src = "/images/attribute_images/" +
			vertOptionID + "_"  + selectedVertAttribute + ".jpg";
		// currently we dont use image for vert attribute, instead use text	
		//setDisplay("imgVertAttribute", true);
		// text is set in the onClick method in the template!	
		// set hidden input to chosen id for basket action
		document.getElementById("vertAttributeText").value= attributeName;
		document.getElementById("vertOptionID").value = selectedVertAttribute;
		onProductComplete();
	}

	function extractFileExtension(path)
	{
		arr = path.split(".");
		return arr[1];
	}

	// we call this everytime both attribtues are set or a single one is changed
	// and the product is exactly defined by customer-chosen attributes
	function onProductComplete()
	{
		if(selectedHorizAttribute == null || selectedVertAttribute == null)
			return;

		// get priceinfo, shippingtime etc. from jsongateway
		requesturl = "jsongateway.php?action=product_price_info&pID=" + productID
		 + "&horizAttribute="+selectedHorizAttribute+"&vertAttribute="+selectedVertAttribute;
		new Ajax.Request(requesturl, { method: 'get', 
			onComplete: function(request){
				updateProductInfo(request.responseText);
			}
		});

	}
	// retrieve json encoded matrix as string for a product
	// HINT: only use if neccessary since json-encoded matrix can be quite huge
	// depending on number of attributes
	function getProductMatrix(pID){
		requesturl = "jsongateway.php?action=product_matrix_info&pID=" + pID;
		new Ajax.Request(requesturl, { method: 'get', 
			onComplete: function(request){
			}
		});
	}

	// upon ajax request complete, transform json into object
	// and store the matrix 
	function updateProductInfo(response){
		//alert(response);	
		prodinfo = eval('(' + response + ')');
		document.getElementById("productPrice").innerHTML = prodinfo.Price;
	}