if (typeof(VAS) == 'undefined') {
	VAS		= {};
	VAS.UI	= {};
}

VAS.UI.ShowProducts	= function()
	{
	var currImageIdNo = 0;
	var totImages=0;
	var container;
	var showLargeImage = '';
    var addToOrderStr = '+ Add to order +';
    var orderedStr = '+ Ordered +';

////////////////////////////////////////////////////////////////////////////////////////
//
//     Common Functions
//
////////////////////////////////////////////////////////////////////////////////////////
//  get all elements given a class
	var getElementsByClass = function(theClass)
		{ 
		var elementArray = [];
		if (document.all)
			{elementArray = document.all;}
		else
			{elementArray = document.getElementsByTagName("*");}
		var matchedArray = [];
		var pattern = new RegExp("(^| )" + theClass + "( |$)");
		for (var i = 0; i < elementArray.length; i++)
			{
			if (pattern.test(elementArray[i].className))
				{matchedArray[matchedArray.length] = elementArray[i];}
			}
		return matchedArray;
		};
		
//  remove an element		
	var removeElement = function(elP,elC)
		{
		var elParent = document.getElementById(elP);
		var elChild = document.getElementById(elC);
		elParent.removeChild(elChild);
		}

		
// set previous, close and next buttons	position	
	var setPosition	= function(reqdImg,idstring)
		{
		var viewport = [YAHOO.util.Dom.getViewportWidth(),YAHOO.util.Dom.getViewportHeight()];
		var reqdButtons = document.getElementById("maskbuttons");
		YAHOO.util.Dom.setStyle(reqdButtons, 'top', "30px");
		var buttonsLeft=(viewport[0]-393)/2 + "px";
		YAHOO.util.Dom.setStyle(reqdButtons, 'left', buttonsLeft);
		var imgLeft=(viewport[0]-(document.getElementById(idstring).width))/2 + "px";
		YAHOO.util.Dom.setStyle(reqdImg, 'left', imgLeft);
		YAHOO.util.Dom.setStyle(reqdImg, 'top', "70px");
		}


	var buildNewLargeImage	= function()
		{
//    remove current image
		var largeImageContIn = document.getElementById('maskincontainer');
		var maskOld= largeImageContIn.firstChild;
			largeImageContIn.removeChild(maskOld)

//    show new image 
		var viewport = [YAHOO.util.Dom.getViewportWidth(),YAHOO.util.Dom.getViewportHeight()];

		var imgTag=document.getElementById('img'+currImageIdNo);
		var imgTagSrc= imgTag.src;
		var imgTagAlt= imgTag.alt;
		var imgTagTitle= imgTag.title;

		var imageName= imgTagSrc.substring(imgTagSrc.lastIndexOf("/")+1,imgTagSrc.length);
		var largeProductImage = document.createElement('DIV');
			largeProductImage.setAttribute('class', 'largeproductimage');
			largeProductImage = largeImageContIn.appendChild(largeProductImage);	
		var largeImage = document.createElement('IMG');

		var thumbWidth =imgTag.width;
		var thumbHeight =imgTag.height;
		var thumbLand=false;
		if (thumbWidth < thumbHeight)
			{thumbPortrait=true;}
		else
			{thumbPortrait=false;}
		largeImage.setAttribute('src', '/vaimages/' + imageName);
		largeImage.setAttribute('alt', imgTagAlt);
		largeImage.setAttribute('title', imgTagTitle);

		largeImage.id = "a" + currImageIdNo;
		largeImage	= largeProductImage.appendChild(largeImage);

// set position
		var imgLeft;
		if (thumbPortrait)
			{imgLeft="302px";
			var imgLeft=(viewport[0]-393)/2 + "px";
			}
		else	
			{imgLeft="221px";
		var imgLeft=(viewport[0]-555)/2 + "px";}
			YAHOO.util.Dom.setStyle(largeProductImage, 'position', 'absolute');
			YAHOO.util.Dom.setStyle(largeProductImage, 'left', imgLeft);
			YAHOO.util.Dom.setStyle(largeProductImage, 'top', "121px");			

			YAHOO.util.Dom.setStyle(largeImage, 'visibility', 'visible');
		}
		
//   next product button
	var setNext	= function()
		{
// if at end remove next button else show
		if (currImageIdNo == totImages-1)
			{
			var nextBut = document.getElementById('nextlargeimage');
			YAHOO.util.Dom.setStyle(nextBut, 'visibility', 'hidden');
			}
		else
			{
			var nextBut = document.getElementById('nextlargeimage');
			YAHOO.util.Dom.setStyle(nextBut, 'visibility', 'visible');
			}
		}

		
//  previous product button
	var setPrev	= function()
		{
// if at start remove previous button else show
		if (currImageIdNo == 0)
			{
			var prevBut = document.getElementById('prevlargeimage');
			YAHOO.util.Dom.setStyle(prevBut, 'visibility', 'hidden');
			}
		else
			{
			var prevBut = document.getElementById('prevlargeimage');
			YAHOO.util.Dom.setStyle(prevBut, 'visibility', 'visible');
			}
		}
	
	
//////////////////////////////////////////////  reset add to order button				
	var resetAddToOrder = function ()
		{
		var addToOrderP = document.getElementById('panelsubmit'); 
		addToOrderP.parentNode.removeChild(addToOrderP);
		var orderBasketCont =document.getElementById('orderbasket');

//  check if product ordered			
			var currProduct = document.getElementById('productid' + currImageIdNo);
			var currProductClass = currProduct.className;		
			var searchProdClassStr = /ordered/;
			var currProductOrdered = currProductClass.search(searchProdClassStr);
			if (currProductOrdered == -1)
				{
// product not ordered - create blank paragraph			
				var panelSubmit = document.createElement('p');
					panelSubmit.setAttribute('id','panelsubmit');
					orderBasketCont.appendChild(panelSubmit);
				}
			else
				{
//  product ordered
				var panelSubmit = document.createElement('p');	
					panelSubmit.setAttribute('id','panelsubmit');
					YAHOO.util.Dom.setStyle(panelSubmit, 'background-color', '#ffffff');
					YAHOO.util.Dom.setStyle(panelSubmit, 'color', '#671C79');
					orderBasketCont.appendChild(panelSubmit);
					YAHOO.util.Dom.setStyle(panelSubmit, 'border', '2px solid #671C79');
					YAHOO.util.Dom.setStyle(panelSubmit, 'width', '136px');

				var panelSubmitText=document.createTextNode(orderedStr);
					panelSubmit.appendChild(panelSubmitText);	
				}		
		}

		
//////////////////////////////////////////////  update hidden form fields with previous and next product	
	var updHidden = function()
		{
		var nextForm = document.getElementById('selectsizeform');
				removeElement('selectsizeform','formhidden');
		var formHidden = document.createElement('div');
			formHidden.setAttribute('id', 'formhidden');
			nextForm.appendChild(formHidden);
		var clickProduct = document.getElementById("productid"+currImageIdNo);
		var oldHidden=clickProduct.getElementsByTagName('input');
		for (var j = 0; j < oldHidden.length; j++)
				{
				if (oldHidden[j].getAttribute('type')!='submit')
					{
					var newHidden = document.createElement('input');
						newHidden.setAttribute('type', 'hidden');
						newHidden.setAttribute('name', oldHidden[j].getAttribute('name'));
						newHidden.setAttribute('value', oldHidden[j].getAttribute('value'));
						formHidden.appendChild(newHidden);
					}
				}	
				
// extra for current id
			var idHidden = document.createElement('input');
			idHidden.setAttribute('type', 'hidden');
			idHidden.setAttribute('name', 'idout');
			idHidden.setAttribute('value', currImageIdNo);
			idHidden.setAttribute('id', 'idhidden');
			formHidden.appendChild(idHidden);

//  update select tag name with previous format no
			var nextFormat = document.getElementById('selectformat');
			var nextFormatString = 'formatout[' + currImageIdNo + ']';
				nextFormat.setAttribute('name', nextFormatString);
		}
		
		
//  reset selectedIndex to 0
	var resetSelIndex	= function()
		{
		var selectFormatList=document.getElementById('selectformat');
		selectFormatList.selectedIndex=0;
		}
		
				
//  create add to order button when selection made
	var selectionMade	= function()
		{
		currSelectId=this.id;
		currSelectId=currSelectId.substring(12);

		var parentProduct = document.getElementById('productid'+currSelectId);
		var submitP = document.getElementById('submit'+currSelectId);

		var selectProdClassName = parentProduct.className;
		var searchStr = /ordered/;
		var selectProdOrdered = selectProdClassName.search(searchStr);
		var orderedP = submitP.firstChild;
		if (selectProdOrdered == -1)
			{YAHOO.util.Dom.setStyle(submitP, 'background-color', '#ffffff');
			}
		else
			{	
//  ordered
// remove ordered button
			submitP.removeChild(orderedP);
			}
//  create submit button		
		var newSubmit = document.createElement('input');
			newSubmit.setAttribute('type', 'submit');
			newSubmit.setAttribute('name', 'submitout['+currSelectId+']');
			newSubmit.setAttribute('value', addToOrderStr);
				YAHOO.util.Dom.setStyle(newSubmit, 'color', '#FF33FF');
				YAHOO.util.Dom.setStyle(newSubmit, 'height', '18px');
				YAHOO.util.Dom.setStyle(newSubmit, 'padding', '0');
				YAHOO.util.Dom.setStyle(newSubmit, 'cursor', 'pointer');
			
			submitP.appendChild(newSubmit);
			
			YAHOO.util.Dom.setStyle(submitP, 'border', '2px solid #FF33FF');
		}

	
	 var backToTop = function() 
		{
		scroll(0,0);
		}
	
	
////////////////////////////////////////////////////////////////////////////////////////
//
//    Initialise
//
////////////////////////////////////////////////////////////////////////////////////////		
	var init	= function() 
		{
		
//////////////////////////////////////////////  add listener to each view larger link on main page
		var largeimage = getElementsByClass("viewlarger");
		for (var i = 0; i < largeimage.length; i++)
			{	
// add listener to link 	
			var viewLarger = document.getElementById(i);
			YAHOO.util.Event.addListener(viewLarger.id, 'click', showLargerImage ); 
// add listener to image 	
			var largeImage = document.getElementById('img'+i);
			YAHOO.util.Event.addListener(largeImage.id, 'click', showLargerImage ); 
			var altText= largeImage.getAttribute('alt');
			
			totImages++;
			}

//////////////////////////////////////////////  set up add to order area on main page
// add listener to drop down list
		var selects = getElementsByClass("productformat");
		for (var m = 0; m < selects.length; m++)
			{
			YAHOO.util.Event.addListener(selects[m], 'change', selectionMade );		
			}

// 3 possible states -
// blank - none ordered yet, not active
// +add to order+ - selection made but not yet added to basket, active as submit button
// +ordered+ - has been added to cart, not active
			
// remove submit button (unless marked as ordered) and add blank image. submit button exists for non javascript version
		var products1 = getElementsByClass("product");
		for (var n = 0; n < products1.length; n++)
			{	
			var prodClassName = products1[n].className;
			var searchStr = /ordered/;
			var prodOrdered = prodClassName.search(searchStr);
// delete submit input tag
			var oldSubmit=document.getElementById('submit'+n);
//  remove input node from paragraph
			var inputNode=oldSubmit.firstChild;		
				oldSubmit.removeChild(inputNode);
			if (prodOrdered == -1)
				{
				}
			else
				{
// product already ordered 
//  add ordered text
				var ordered = document.createTextNode(orderedStr);
					ordered	=  oldSubmit.appendChild(ordered);
					YAHOO.util.Dom.setStyle(oldSubmit, 'border', '2px solid #663366');
					YAHOO.util.Dom.setStyle(oldSubmit, 'background-color', '#ffffff');
					YAHOO.util.Dom.setStyle(oldSubmit, 'color', '#663366');
					YAHOO.util.Dom.setStyle(oldSubmit, 'width', '136px');
				}
			}

//  set container variable		
		container	= YAHOO.util.Dom.get('outercontainer');
		}
    

////////////////////////////////////////////////////////////////////////////////////////
//
//    Build and show panel with -
//    large image 
//    add to order functionality
//    basket totals and checkout button
//
////////////////////////////////////////////////////////////////////////////////////////		
	var showLargerImage = function(e)
		{	
		var currId=this.id;	
		var currImageId=this.id;
		if ((currId.substring(0,3)) == 'img')
			{
			currId=currId.substring(3);
			}
		else
			{
			currImageId= 'img'+this.id;
			}
		backToTop();
//////////////////////////////////////////////  build large image container		
		var largeImageCont = document.createElement('DIV');
		largeImageCont.setAttribute('id', 'maskcontainer');
		largeImageCont = container.appendChild(largeImageCont);	

		var largeImageContIn = document.createElement('DIV');
		largeImageContIn.setAttribute('id', 'maskincontainer');
		largeImageContIn = largeImageCont.appendChild(largeImageContIn);	

////////////////////////  build previous, next and close buttons	
		var largeImageButs = document.createElement('DIV');	
		largeImageButs.setAttribute('id', 'maskbuttons');
		largeImageButs = largeImageCont.appendChild(largeImageButs);	
		var prevLargeImage = document.createElement('A');
			prevLargeImage.setAttribute('href', '#');
			prevLargeImage.id = "prevlargeimage";
			prevLargeImage.title = "Previous";
			prevLargeImage	= largeImageButs.appendChild(prevLargeImage);
		var prevLargeImageBut = document.createTextNode('<< Previous');
			prevLargeImage.appendChild(prevLargeImageBut);				
//  add eventlistener to previous
		YAHOO.util.Event.addListener(prevLargeImage, 'click', clickPrev );

		var closeLargeImage = document.createElement('A');
			closeLargeImage.setAttribute('href', '#');
			closeLargeImage.id = "closelargeimage";
			closeLargeImage.title = "Close";
			closeLargeImage	= largeImageButs.appendChild(closeLargeImage);
		var closeLargeImageBut = document.createTextNode('Close');
			closeLargeImage.appendChild(closeLargeImageBut);				
//  add eventlistener to close
		YAHOO.util.Event.addListener(closeLargeImage, 'click', closeMask );

		var nextLargeImage = document.createElement('A');
			nextLargeImage.setAttribute('href', '#');
			nextLargeImage.id = "nextlargeimage";
			nextLargeImage.title = "Next";
			nextLargeImage	= largeImageButs.appendChild(nextLargeImage);
		var nextLargeImageBut = document.createTextNode('Next >>');
			nextLargeImage.appendChild(nextLargeImageBut);				
//  add eventlistener to next
			YAHOO.util.Event.addListener(nextLargeImage, 'click', clickNext );

//  set buttons position		
		var viewport = [YAHOO.util.Dom.getViewportWidth(),YAHOO.util.Dom.getViewportHeight()];
		var reqdButtons = document.getElementById("maskbuttons");
			YAHOO.util.Dom.setStyle(reqdButtons, 'top', "30px");
		var buttonsLeft=(viewport[0]-393)/2 + "px";
			YAHOO.util.Dom.setStyle(reqdButtons, 'left', buttonsLeft);
	

//////////////////////////////////////////////  build  large image		
// build from html thumbs

// get name of image
			var imgTag=document.getElementById(currImageId);
			var imgTagSrc= imgTag.src;
			var imgTagAlt= imgTag.alt;
			var imgTagTitle= imgTag.title;
			var imageName= imgTagSrc.substring(imgTagSrc.lastIndexOf("/")+1,imgTagSrc.length);
			var largeProductImage = document.createElement('DIV');
				largeProductImage.setAttribute('class', 'largeproductimage');
				largeProductImage = largeImageContIn.appendChild(largeProductImage);	
			var largeImage = document.createElement('IMG');

			var thumbWidth =imgTag.width;
					
			var thumbHeight =imgTag.height;
			var thumbLand=false;
			if (thumbWidth < thumbHeight)
				{thumbPortrait=true;}
			else
				{thumbPortrait=false;}
			largeImage.setAttribute('src', '/vaimages/' + imageName);
			largeImage.setAttribute('alt', imgTagAlt);
			largeImage.setAttribute('title', imgTagTitle);
			largeImage.id = "a" + currId;

			YAHOO.util.Dom.setStyle(largeImage, 'visibility', 'hidden');
			currImageIdNo=currId;
			largeImage	= largeProductImage.appendChild(largeImage);

// set position
			var imgLeft;
			if (thumbPortrait)
				{imgLeft="302px";
				var imgLeft=(viewport[0]-393)/2 + "px";
				}
			else	
				{imgLeft="221px";
				var imgLeft=(viewport[0]-555)/2 + "px";}
					YAHOO.util.Dom.setStyle(largeProductImage, 'position', 'absolute');
					YAHOO.util.Dom.setStyle(largeProductImage, 'left', imgLeft);
					YAHOO.util.Dom.setStyle(largeProductImage, 'top', "121px");			

		//	if (i==currId)
			//	{
//  make current one visible 
				YAHOO.util.Dom.setStyle(largeImage, 'visibility', 'visible');
			//	}
	//		}
			
			
//  hide previous button if first image clicked
			if (currImageIdNo==0)
				{
				YAHOO.util.Dom.setStyle(prevLargeImage, 'visibility', 'hidden');
				}
//  hide next button if last image clicked
			if (currImageIdNo==(totImages-1))
				{
				YAHOO.util.Dom.setStyle(nextLargeImage, 'visibility', 'hidden');
				}

				
//////////////////////////////////////////////  basket header and add to order functionality 
//////////////////////// build panel basket header
			var orderBasketCont = document.createElement('div');
				orderBasketCont.setAttribute('id', 'orderbasket');
				YAHOO.util.Dom.setStyle(orderBasketCont, 'top', "59px");
				YAHOO.util.Dom.setStyle(orderBasketCont, 'left', buttonsLeft);
				orderBasketCont = largeImageCont.appendChild(orderBasketCont);

			var newBasketCont = document.createElement('div');
				newBasketCont.setAttribute('id', 'panelbasket');
//				YAHOO.util.Dom.setStyle(newBasketCont, 'top', '5px');
	//			YAHOO.util.Dom.setStyle(newBasketCont, 'left', '230px');
				newBasketCont = orderBasketCont.appendChild(newBasketCont);
// get basket details from main page html and add to panel basket header
			var basketCont = document.getElementById('basket');

			var oldBasketP = basketCont.childNodes[0];
			var oldBasketText = oldBasketP.firstChild;
			var newBasketP = document.createElement('p');
				newBasketP.setAttribute('id', 'panelbasketp');
				YAHOO.util.Dom.setStyle(newBasketP, 'font-weight', 'bold');
				newBasketCont.appendChild(newBasketP);
			var newBasketPText=document.createTextNode(oldBasketText.nodeValue);
				newBasketP.appendChild(newBasketPText);
//	add checkout link of required
			if (oldBasketP.childNodes[1])
				{
				var oldCheckoutLink=oldBasketP.childNodes[1];
				var checkoutLink = document.createElement('a');
					checkoutLink.setAttribute('title', 'checkout');
					checkoutLink.setAttribute('href', '/updateorder.php');
					newBasketP.appendChild(checkoutLink);
				var checkoutLinkText=document.createTextNode(oldCheckoutLink.childNodes[0].nodeValue);
					checkoutLink.appendChild(checkoutLinkText);
				}
				
//////////////////////// build select drop down	and form	
// build container and form tag
			var selectSizeCont = document.createElement('div');
				selectSizeCont.setAttribute('class', 'selectsize');
				selectSizeCont = orderBasketCont.appendChild(selectSizeCont);
	
			var selectForm = document.createElement('form');
				selectForm.setAttribute('method', 'post');
				selectForm.setAttribute('id', 'selectsizeform');
				selectForm = selectSizeCont.appendChild(selectForm);
// start of select				
			var selectFormat = document.createElement('select');
			var formatString = 'formatout[' + currId + ']';
				selectFormat.setAttribute('name', formatString);
				selectFormat.setAttribute('class', 'productformat');
				selectFormat.setAttribute('id', 'selectformat');
				selectFormat = selectForm.appendChild(selectFormat);
// add list of options
			var oldSelect = document.getElementById("selectformat"+currId);
			var oldOptions = oldSelect.getElementsByTagName("option");
			for (var j = 0; j < oldOptions.length; j++)
				{
				var newOption = document.createElement('option');
					newOption.setAttribute('value', oldOptions[j].getAttribute('value'));
				if 	(j==0)
					{
					newOption.setAttribute('selected', oldOptions[j].getAttribute('selected'));
					}
					selectFormat.appendChild(newOption);
				var optionText=document.createTextNode(oldOptions[j].childNodes[0].nodeValue);
					newOption.appendChild(optionText);
				}	
				
// add listener to drop down list - panel only
				YAHOO.util.Event.addListener(selectFormat, 'change', optionSelected );		

//////////////////////// set up add to order/ordered area			
//  check if product ordered			
			var currProduct = document.getElementById('productid' + currId);
			var currProductClass = currProduct.className;		
			var searchProdClassStr = /ordered/;
			var currProductOrdered = currProductClass.search(searchProdClassStr);
			if (currProductOrdered == -1)
				{
// product not ordered - create blank paragraph			
				var panelSubmit = document.createElement('p');
					panelSubmit.setAttribute('id','panelsubmit');
					orderBasketCont.appendChild(panelSubmit);
				}
			else
				{
//  product ordered
				var panelSubmit = document.createElement('p');	
					panelSubmit.setAttribute('id','panelsubmit');
					YAHOO.util.Dom.setStyle(panelSubmit, 'background-color', '#ffffff');
					YAHOO.util.Dom.setStyle(panelSubmit, 'color', '#671C79');
					orderBasketCont.appendChild(panelSubmit);
					YAHOO.util.Dom.setStyle(panelSubmit, 'border', '2px solid #671C79');
					YAHOO.util.Dom.setStyle(panelSubmit, 'width', '136px');

				var panelSubmitText=document.createTextNode(orderedStr);
					panelSubmit.appendChild(panelSubmitText);	
				}

				
////////////////////////  add form  hidden fields
// build from main page html	
		var formHidden = document.createElement('div');
			formHidden.setAttribute('id', 'formhidden');
			selectForm.appendChild(formHidden);
		var clickProduct = document.getElementById("productid"+currId);
		var oldHidden=clickProduct.getElementsByTagName('input');
		for (var j = 0; j < oldHidden.length; j++)
				{
				if (oldHidden[j].getAttribute('type')!='submit')
					{
					var newHidden = document.createElement('input');
						newHidden.setAttribute('type', 'hidden');
						newHidden.setAttribute('name', oldHidden[j].getAttribute('name'));
						newHidden.setAttribute('value', oldHidden[j].getAttribute('value'));
						formHidden.appendChild(newHidden);
					}
				}	
// add extra for current id
		var idHidden = document.createElement('input');
			idHidden.setAttribute('type', 'hidden');
			idHidden.setAttribute('name', 'idout');
			idHidden.setAttribute('value', currId);
			idHidden.setAttribute('id', 'idhidden');
			formHidden.appendChild(idHidden);
			

//////////////////////////////////////////////  build and show panel		
    showLargerImage.maskcontainer = new YAHOO.widget.Panel("maskcontainer", 
		{ width:"101%",  height:"100%",position:"absolute", left:"0",top:"0", 
		visible:false, draggable:true, close:false, modal:false, zIndex:10 } ); 
		showLargerImage.maskcontainer.setBody(largeImageContIn); 
		showLargerImage.maskcontainer.render(container);
		showLargerImage.maskcontainer.show();
	};


	
///////////////////////////////////////////////////////////////////////////////////////
//
//   Send selected option to server
//   Get back updated basket totals
//
////////////////////////////////////////////////////////////////////////////////////////		
//  option selected listener
//  set up add to order button with listener to sendToServer	

//
//   3 STATES-
//  blank ie not ordered 
//  ordered (class = ordered)
//  add to order ie selection just made
//
//  if not ordered create add to order and listener
//  if ordered replace add to order text with ordered and remove listener
//  if add to order 

var optionSelected = function() 
	{ 
	var addToOrderP = document.getElementById('panelsubmit'); 
	if (addToOrderP.firstChild)
		{
		if (addToOrderP.firstChild.nodeValue==orderedStr)
			{
// remove replace ordered text with add to order, add listener, style
			YAHOO.util.Dom.setStyle(addToOrderP, 'background-color', '#ffffff');
			YAHOO.util.Dom.setStyle(addToOrderP, 'color', '#FF33FF');
			YAHOO.util.Dom.setStyle(addToOrderP, 'border', '2px solid #ffffff');
			YAHOO.util.Dom.setStyle(addToOrderP, 'cursor', 'pointer');
			addToOrderP.firstChild.nodeValue=addToOrderStr;
			YAHOO.util.Event.addListener(addToOrderP, 'click', sendToServer );
			}
		else	
			{
//  already set to add to order - do nothing			
			}
		}
	else
		{
//is blank		
		YAHOO.util.Dom.setStyle(addToOrderP, 'background-color', '#ffffff');
		YAHOO.util.Dom.setStyle(addToOrderP, 'color', '#FF33FF');
		YAHOO.util.Dom.setStyle(addToOrderP, 'cursor', 'pointer');
		
		var addToOrderText=document.createTextNode(addToOrderStr);
		addToOrderP.appendChild(addToOrderText);	

		YAHOO.util.Event.addListener(addToOrderP, 'click', sendToServer );
		}

	}	


////////////////////////////////////////////// post selected product to server
var sendToServer = function() 
	{ 
	var formSet = document.getElementById('selectsizeform'); 
	YAHOO.util.Connect.setForm(formSet); 
	var postForm = YAHOO.util.Connect.asyncRequest('POST', '/asyncsubmit.php', formcallback); 		
//   set text to ordered on button
	var addToOrderP = document.getElementById('panelsubmit'); 
		YAHOO.util.Dom.setStyle(addToOrderP, 'background-color', '#ffffff');
		YAHOO.util.Dom.setStyle(addToOrderP, 'color', '#671C79');
		YAHOO.util.Dom.setStyle(addToOrderP, 'border', '2px solid #671C79');
		YAHOO.util.Dom.setStyle(addToOrderP, 'width', '136px');
		addToOrderP.firstChild.nodeValue=orderedStr;
		YAHOO.util.Event.removeListener(addToOrderP);
	}	

//  call back for posted data 	
var formcallback = 
	{
      success: function(o) { getBasket(); 
			},
      failure: function(o) {
			}
	}

////////////////////////////////////////////// get updated basket totals from server 
var getBasket	= function() 
	{
	var getBasketDets = YAHOO.util.Connect.asyncRequest('GET', '/asyncbasket.php', basketcallback); 		
	}

//  callback for basket data	
var basketcallback = 
	{
      success: function(o) { showBasket(o.responseText); 
			},
      failure: function(o) {
			}
	}

// update basket header and update class on main page to ordered
var showBasket	= function(o) 
	{
//  split data string pasted back
	var basketSplit =o.split(':')
	var basketCont1 = document.getElementById('panelbasket');
//  update paragraph
	var basketContP1 = document.getElementById('panelbasketp');
	var oldBasketP=basketContP1.childNodes[0];

// unicode conversion
// pound 163 to 00A3
// dollar 36 to 0024
// euro 8364 to 20A0		
	if (basketSplit[1]=='163')
		{var currencyCode ='\u00A3'}
	else
	if (basketSplit[1]=='36')
		{var currencyCode ='\u0024'}
	else
	if (basketSplit[1]=='8364')
		{var currencyCode ='\u20AC'}
	
	var itemOrItems = 'item';
	if (basketSplit[0] > 1)
		{itemOrItems = 'items';}
		
	oldBasketP.nodeValue=basketSplit[0] + ' ' + itemOrItems + ' | ' + currencyCode + basketSplit[2] + ' | ';

//  create checkout link if required		
	if (basketContP1.childNodes[1] == null)
		{
		var checkoutLink = document.createElement('a');
			checkoutLink.setAttribute('href', '/updateorder.php');
			checkoutLink.setAttribute('title', 'Checkout');
			checkoutLink=basketContP1.appendChild(checkoutLink);	
		var checkoutText=document.createTextNode('Checkout');
			checkoutLink.appendChild(checkoutText);	
		}

//update class on main page to ordered
		var currProduct = document.getElementById('productid' + currImageIdNo);
		var currProductClass = currProduct.className;		
		var searchProdClassStr = /ordered/;
		var currProductOrdered = currProductClass.search(searchProdClassStr);
		if (currProductOrdered == -1)
			{
			currProduct.setAttribute('class', 'product ordered');
			var mainPageSubmit=document.getElementById('submit'+currImageIdNo);
			var mainPageOrdered = document.createTextNode(orderedStr);
				mainPageOrdered	=  mainPageSubmit.appendChild(mainPageOrdered);
				YAHOO.util.Dom.setStyle(mainPageSubmit, 'border', '2px solid #663366');
				YAHOO.util.Dom.setStyle(mainPageSubmit, 'background-color', '#ffffff');
				YAHOO.util.Dom.setStyle(mainPageSubmit, 'color', '#663366');
			
			}

	}

		
////////////////////////////////////////////////////////////////////////////////////////
//
//    Go to previous large image 
//
////////////////////////////////////////////////////////////////////////////////////////		
	var clickPrev = function() 
		{ 
//  update current id
		currImageIdNo = parseInt(currImageIdNo)-1;

//    build new image
		buildNewLargeImage();

//  set up prev and next
		setNext();
		setPrev();

//  update hidden form fields 
		updHidden();
		
//  reset add to order button				
		resetAddToOrder();

//  reset selectedIndex to 0				
		resetSelIndex();
		

	}


////////////////////////////////////////////////////////////////////////////////////////
//
//    Go to next large image 
//
////////////////////////////////////////////////////////////////////////////////////////		
	var clickNext = function() 
		{ 	
//  update current id
		currImageIdNo = parseInt(currImageIdNo)+1;

//    build new image
		buildNewLargeImage();
		
		
//  set up prev and next
		setNext();
		setPrev();

//  update hidden form fields 
		updHidden();
		
//  reset add to order button				
		resetAddToOrder();

//  reset selectedIndex to 0				
		resetSelIndex();
		
				
		}
			
		
////////////////////////////////////////////////////////////////////////////////////////
//
//    Close event
//
////////////////////////////////////////////////////////////////////////////////////////
	var closeMask = function() 
		{ 
////////////////////////////////////////////// update basket header on main page with details from panel	 
		var basketCont2 = document.getElementById('basket');
		var  basketCont2P= basketCont2.getElementsByTagName('p');
//  get panel basket details
		var basketContP1 = document.getElementById('panelbasketp');
		var panelBasketP=basketContP1.childNodes[0];
		basketCont2P[0].childNodes[0].nodeValue=panelBasketP.nodeValue;
// add checkout link if exists		
		if ((basketContP1.childNodes[1] != null) && (basketCont2P[0].childNodes[1] == null))
			{
			var checkoutLink = document.createElement('a');
				checkoutLink.setAttribute('href', '/updateorder.php');
				checkoutLink.setAttribute('title', 'Checkout');
				checkoutLink=basketCont2P[0].appendChild(checkoutLink);	
			var checkoutText=document.createTextNode('Checkout');
				checkoutLink.appendChild(checkoutText);	
//  remove empty basket listener
			var prodHeadOrderR = getElementsByClass("productheadorderr");
			for (var i = 0; i < prodHeadOrderR.length; i++)
				{	
				var  prodHeadOrderRA= prodHeadOrderR[i].getElementsByTagName('a');
				prodHeadOrderR[i].removeChild(prodHeadOrderRA[0]);
				}
//  rebuild without listener
			var prodHeadOrderR1 = getElementsByClass("productheadorderr");
			for (var i = 0; i < prodHeadOrderR1.length; i++)
				{	
				var prodHeadOrderRA1 = document.createElement('a');
				prodHeadOrderRA1.setAttribute('href', '/updateorder.php');
				prodHeadOrderRA1.setAttribute('title', 'Place Your Order');
				prodHeadOrderRA1=prodHeadOrderR1[i].appendChild(prodHeadOrderRA1);	
//  add image			
				var prodHeadOrderRImg = document.createElement('IMG');
					prodHeadOrderRImg.setAttribute('src', '/images/placeorder.gif');
					prodHeadOrderRImg.setAttribute('alt', 'Place your order');
					prodHeadOrderRImg	= prodHeadOrderRA1.appendChild(prodHeadOrderRImg);
			}
			
//<a href="/updateorder.php" title="Place Your Order">
 // <img src="/images/placeorder.gif" alt="Place your order">
//</a>



//<a href="#" title="Place Your Order" onclick="alert('Your basket is empty')">
 // <img src="/images/placeorder.gif" alt="Place your order">

		}
//////////////////////////////////////////////  delete panel			
      	 showLargerImage.maskcontainer.destroy();
		 currImageIdNo = 0;
	}


		
	return {
		init: init,
		formcallback: formcallback
			}
	
}();
	
	
//
//  POSSIBLE FUNCIOTNS
//	
	
//  update hidden fields in next and previous - also possibly show largeimage