// closes highslide window
function hs_close(){
	return parent.window.hs.close();
}
	   
	   
  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(img_qty > 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;
			// 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;
    query = "";
    for ( i = 0; i < elements.length-1; i++ ) {
        query = query + elements.item(i).name + "-" + elements.item(i).value + ":";
    }
     
    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(query)); 	
  									
  }