// closes highslide window
function hs_close(){
	return parent.window.hs.close();
}

function onchangeTester(id){

    alert('this vid=' + id);

}
	   

  function updatePrice(){
  	
    if (request.readyState == 4 && request.status == 200) {
		/* get xml response from server script */
		var xmlDoc = request.responseXML;  

		// get the current selected img_id and updated basket total from xml
		var priceobj 	    = xmlDoc.getElementsByTagName('bprice')[0];
		var img_id 			= priceobj.getAttribute("img_id");
		var vid 			= priceobj.getAttribute("vid");			
  		var price 			= priceobj.getAttribute("price");
  		//alert(img_id + ' : ' + vid + ' : ' + price);
  		
	     // get the current displayed price
	    var price_idEl 	= document.getElementById("price-" + img_id + "-" + vid);
	  	var priceval    = getText(price_idEl);
	  	replaceText(price_idEl,price);
	  	
	  	// make qty box visible and add 1 to it
	  	document.getElementById(img_id + "-" + vid).style.visibility = "visible";
	  	document.getElementById(img_id + "-" + vid).value = 1;
	  	
	    // change price to show completed checking
	    setStyle(price_idEl,'background','green');
	    setStyle(price_idEl,'color','white');
	    
    }
  }
	   
  
  
  function updateBasket() {
    if (request.readyState == 4 && request.status == 200) {
		/* get xml response from server script */
		var xmlDoc = request.responseXML;  
		
		// get the current selected img_id and updated basket total from xml
		var order 	= xmlDoc.getElementsByTagName('order')[0];
		var img_id 			= order.getAttribute("img_id");
		var basket_total 	= order.getAttribute("basket_total");
		
		// get all img_id's currently open on the page
		var images = getElementsByClassName("img_id","span");
		for (var x = 0 ; x < images.length ; x++) {
			var id = images[x].firstChild.nodeValue;
			// now update the basket total of this basket window
			// note : this is because there can be multiple basket windows open, and each shows the basket total
			var bsk_totEl = document.getElementById("total-" + id);
			replaceText(bsk_totEl,basket_total);
		}		
		
		// update the main basket total in the site template
		var basket_totalEl = document.getElementById("baskettotal");
		replaceText(basket_totalEl,basket_total);		
		
		// now refresh the basket page
		var goTo = wbUrl + '/shop/lightbox.php?action=reload&img=' + img_id;
		window.location.href = goTo;
    }
  }


  function updatePage() {
    if (request.readyState == 4 && request.status == 200) {
		/* get xml response from server script */
		var xmlDoc = request.responseXML;
		
		// get the current selected img_id and updated basket total from xml
		var order 	= xmlDoc.getElementsByTagName('order')[0];
		var img_id 			= order.getAttribute("img_id");
		var basket_total 	= order.getAttribute("basket_total");
		var img_qty 	    = order.getAttribute("img_qty");
		var img_filename 	= order.getAttribute("img_filename");
		var img_path 		= order.getAttribute("img_path");
		
		// get all img_id's currently open on the page
		var images = getElementsByClassName("img_id","span");
		for (var x = 0 ; x < images.length ; x++) {
			var id = images[x].firstChild.nodeValue;
			// now update the basket total of this basket window
			// note : this is because there can be multiple basket windows open, and each shows the basket total
			var bsk_totEl = document.getElementById("total-" + id);
			replaceText(bsk_totEl,basket_total);
			
			// to indicate the value has been updated highlight the basket total value
			setStyle(bsk_totEl,'background','yellow');
			setStyle(bsk_totEl,'fontWeight','bold');
		}
		
		// update the main basket total in the site template
		var basket_totalEl = document.getElementById("baskettotal");
		replaceText(basket_totalEl,basket_total);
		
		// set the basket icon color
		var basketIcon = new Image();
		var iconEl  = document.getElementById('icon-' + img_id);
		var iconImg = iconEl.getElementsByTagName('img')[0];
		var iconSrc = iconImg.getAttribute('src');
		var iconPath = iconSrc.substring(0,iconSrc.lastIndexOf('/'));	

		// thumbnail url
		var thumbUrl = wbUrl + '/filestore/' + img_path + '/thumbs/thumb_' + img_filename;	
		
		// check if this image is already in the lightbox
		var lbImg = document.getElementById("lbid-" + img_id);
		// get the lightbox div element so that we can append or remove this image
		var lightboxEl = document.getElementById('fs_lightbox');
		
		if(basket_total > 0){
			// this image has been selected so make the basket icon the red one
			var iconName = 'basket_red.gif';
			
			// if this image is not in the lightbox then add the image thumbnail to the lightbox
			if(!lbImg){
				var lightBoxImg = new Image();
				
				var newThumb = document.createElement("img");
			    newThumb.setAttribute("src", thumbUrl);
			    // get the thumb width and calc new width when new height = 40 (default lightbox thumb height)
				var thumbWidth  = newThumb.getAttribute("width") * 1;
				var thumbHeight = newThumb.getAttribute("height") * 1;
				var newWidth    = parseInt( thumbWidth / (thumbHeight/40) );
				
			    newThumb.setAttribute("id", "lbid-" + img_id);
			    newThumb.setAttribute("height", "40");
			    newThumb.setAttribute("width", newWidth);
			    lightboxEl.appendChild(newThumb);
			    newThumb.onclick = null;	
			    

				// check if the lightbox title is set (if not then display a title and link)
				if(!document.getElementById("fs_lightbox_link")){
					// display new text element "SHOPPING BASKET"
					var tempLbTitleEl = document.createElement("div");
					tempLbTitleEl.setAttribute("id", "fs_lightbox_title");
					var tempLbTitleText = document.createTextNode("SHOPPING BASKET");
					tempLbTitleEl.appendChild(tempLbTitleText);
					// insert the title in the fs_lightbox node
					lightboxEl.insertBefore(tempLbTitleEl,newThumb);
					
					// create text link to view lightbox
					// <div id="fs_lightbox_link"><a href="http://www.website.co.uk/shop/lightbox.php" title="view basket" />To view your selections click here</a></div>
					var tempLbLinkEl = document.createElement("div");
					tempLbLinkEl.setAttribute("id", "fs_lightbox_link");
					// create the <a> tag for the link
					var tempLbLink = document.createElement("a");
					var url = wbUrl + "/shop/lightbox.php";
					tempLbLink.setAttribute("href",url);
					tempLbLink.setAttribute("title","view basket");
					// add the link text
					var tempLbLinkText = document.createTextNode("To view your selections click here");
					// append text to end of <a> node
					tempLbLink.appendChild(tempLbLinkText);
					// now append <a> to end of <div> node
					tempLbLinkEl.appendChild(tempLbLink);
					// now insert the completed link into the fs_lightbox node
					lightboxEl.insertBefore(tempLbLinkEl,newThumb);
				}			    
			    			
			}

		}else{
			var iconName = 'basket.gif';
			
			// remove image thumbnail from lightbox (if it is already there)
			if(lbImg){
				lightboxEl.removeChild(lbImg);
			}
			
			// check how many images are left in the lightbox
			var numLbImages = 0;
			for(var n=0; n < lightboxEl.childNodes.length; n++){
				if(lightboxEl.childNodes[n].nodeName.toLowerCase() == "img"){
					numLbImages = numLbImages + 1;
				}
			}
			
			if(numLbImages <= 0){
				// no images left - so remove the lightbox title and link
				var lbTitleEl = document.getElementById("fs_lightbox_title");
				var lbLinkEl  = document.getElementById("fs_lightbox_link");
				lightboxEl.removeChild(lbTitleEl);
				lightboxEl.removeChild(lbLinkEl);
			}	
		}
	
		var iconUrl  = iconPath + '/' + iconName;
		basketIcon.src = iconUrl;
		document['icon-' + img_id].src = basketIcon.src
		

		/* now get the options vid and qty */
		var options = order.getElementsByTagName("option");
		
		for (var i = 0 ; i < options.length ; i++) {
			// get one option after another
			var option = options[i];
			// now we have the option object, get the contents
			// get the vid
			var vid = option.getElementsByTagName("vid")[0].firstChild.nodeValue;
			// get the quantity
			var qty = option.getElementsByTagName("qty")[0].firstChild.nodeValue;
			
			//alert(vid + " : " + qty);
			
			// update the field value (in case it was not a number)
			document.getElementById(img_id + "-" + vid).value = qty;
			
		}
		
		// now close the window after half second
		setTimeout("hs_close()", 500);
    }
  } 
  
  
  
  
  function getQty(imgid,gall_id,basket){
  	// get the img_id and pid 
  	var img_idEl 	= document.getElementById("img-" + imgid);
  	var img_id 		= getText(img_idEl);
  	var pidEl 		= document.getElementById("pid");
  	var pid 		= getText(pidEl);
  	
  	/* get all the form fields name and value, where name = vid & value = qty */
    var form = document.getElementById( "form-" + img_id );
    var elements = form.elements;
    var fqty = "";
    var foptions = "";
    var checkvid = 0;
    var checkqty = 0;
    
    for ( i = 0; i < elements.length-1; i++ ) {
    	var fname	= elements.item(i).name;
    	var fval	= elements.item(i).value;
    	
    	// check if the name is a number (vid) ie a qty field
    	if(!isNaN(fname)){
    		// this is a qty field - so assemble the fqty string.. vid-qty:
    		if(checkqty++ == 0){
    			fqty = fqty + fname + "-" + fval; 
    		}else{
    			fqty = fqty + ':' + fname + "-" + fval; 
    		}  
    	}else{
			// this is an option ddbox - slit the name on '-' to get vid, pos, opt_id
			var opt 	= fname.split("-");
			var vid 	= opt[1];
			var pos		= opt[2];
			var opt_id 	= opt[3];
			var optval  = fval;

			// assemble foptions string
			if(checkvid != vid){
				if(checkvid == 0){
					// do this only on the first iteration
					foptions = foptions + vid + '-' + optval;
				}else{
					foptions = foptions + ':' + vid + '-' + optval;
				}
				checkvid = vid;
			}else{
				foptions = foptions + '-' + optval;
			}
    	}
    }
    
    //alert(foptions + ',' + fqty);
    
    var url = wbUrl + '/modules/fsgallery/updateBasket.php';
  	request.open("POST", url, true);
  	
  	if(basket == 0){
  		request.onreadystatechange = updatePage;
  	}else{
  		request.onreadystatechange = updateBasket;
  	}
  	request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  	request.send( 	"gall_id=" + escape(gall_id) + 
  					"&img_id=" + escape(img_id) + 
  					"&pid=" + escape(pid) + 
  					"&order=" + escape(fqty) + 
  					"&options=" + escape(foptions)); 	
  									
  }

  

  
  
  // onchange of option ddbox check if all options are selected 
  // and then get the price from fs_option_price
function getPrice(imgid,vid,opt_id,opt1,opt2,opt3,opt4,opt5){
    // get selected option value
    var optid  = 'opt-' + imgid + '-' + vid + '-' + opt_id;
    var optval = document.getElementById(optid).value;
    // get the price text id
    var priceid = "price-" + imgid + "-" + vid;
  	// get qty field id
    var qtyid = imgid + '-' + vid;
    
    if(optval == 0) { resetQty(qtyid,priceid); return false; }
    //alert(optval);

    // check if any other option values are all > 0 (ie: all selected)
    if(opt1 > 0){
        var optid1 = 'opt-' + imgid + '-' + vid + '-' + opt1;
        var optval1 = document.getElementById(optid1).value;
        if(optval1 == 0) { resetQty(qtyid,priceid); return false; }
    }
    if(opt2 > 0){
        var optid2 = 'opt-' + imgid + '-' + vid + '-' + opt2;
        var optval2 = document.getElementById(optid2).value;
        if(optval2 == 0) { resetQty(qtyid,priceid); return false; }
    }else{
    	var optval2 = 0;
    }
    if(opt3 > 0){
        var optid3 = 'opt-' + imgid + '-' + vid + '-' + opt3;
        var optval3 = document.getElementById(optid3).value;
        if(optval3 == 0) { resetQty(qtyid,priceid); return false; }
    }else{
    	var optval3 = 0;
    }
    if(opt4 > 0){
        var optid4 = 'opt-' + imgid + '-' + vid + '-' + opt4;
        var optval4 = document.getElementById(optid4).value;
        if(optval4 == 0) { resetQty(qtyid,priceid); return false; }
    }else{
    	var optval4 = 0;
    }
    if(opt5 > 0){
        var optid5 = 'opt-' + imgid + '-' + vid + '-' + opt5;
        var optval5 = document.getElementById(optid5).value;
        if(optval5 == 0) { resetQty(qtyid,priceid); return false; }
    }else{
    	var optval5 = 0;
    }
    // if it has not returned false at this stage then all option values must have been selected
    // so we can now get the price of the current combination
    //alert(vid + " :: " + optval1 + optval2 + optval3 + optval4 + optval5);
    
    // change price text to show checking for new price
    var price_idEl 	= document.getElementById(priceid);
  	var priceval    = getText(price_idEl);
    replaceText(price_idEl,'CHECKING');
    setStyle(price_idEl,'background','red');
    setStyle(price_idEl,'color','white');
    
    var url = wbUrl + '/modules/fsgallery/updatePrice.php';
  	request.open("POST", url, true);
  
  	request.onreadystatechange = updatePrice;

  	request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  	request.send( 	"img_id=" + escape(imgid) + 
  					"&vid=" + escape(vid) + 
  					"&optval1=" + escape(optval1) + 
  					"&optval2=" + escape(optval2) + 
  					"&optval3=" + escape(optval3) + 
  					"&optval4=" + escape(optval4) + 
  					"&optval5=" + escape(optval5)); 
}


// reset the qty field to zero and hide it
// also remove the price text
function resetQty(qtyid,priceid)
{
	// hide the qty field and set value to null
	document.getElementById(qtyid).style.visibility = "hidden";
	document.getElementById(qtyid).value = '';
	// reset price text to null
	var price_idEl 	= document.getElementById(priceid);
  	var priceval    = getText(price_idEl);
    replaceText(price_idEl,'');
    setStyle(price_idEl,'background','white');
    setStyle(price_idEl,'color','black');
}