// 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");

        //alert('basket_total = ' + 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);

            // 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 && img_qty > 0){
                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');
}