function hideddrivetip(){
	if (ns6||ie){
	enabletip=false
	tipobj.style.visibility="hidden"
	tipobj.style.left="-1000px"
	tipobj.style.backgroundColor=''
	tipobj.style.width=''
	}
}
function processDropdown(currentDropDown,dropDownName,thisForm,formName,fromGraphicCodes){
		
		var prevAttrValue = thisForm.elements["attrVal_"+currentDropDown].value;
		var currAttrValue = thisForm.elements["attrValue_"+currentDropDown].value;
		var ddCount = thisForm.numOfDropdowns.value;
		var nGraphicCodeDataId;
		
		if(thisForm.elements["colorAttributeSequence"] != undefined
			&& thisForm.elements["colorAttributeSequence"].value != "" )
		{
			var colorAttributeSequence = parseInt(thisForm.elements["colorAttributeSequence"].value);						
		}		
		
		var colorAttributeValue;
		
		if(thisForm.elements["attrValue_"+colorAttributeSequence] != undefined
			&& thisForm.elements["attrValue_"+colorAttributeSequence].value != "" )
		{
			colorAttributeValue = thisForm.elements["attrValue_"+colorAttributeSequence].value;
		}
		
		
		for(i=parseInt(currentDropDown)+1;(thisForm.elements["attrValue_"+i] != undefined)&&i<=ddCount;i++)
		{
			if(i != colorAttributeSequence){
				thisForm.elements["attrValue_"+i].value = "";
				if(currAttrValue == "")
				{
					thisForm.elements["attrValue_"+i].disabled = true;
				}
			}
		}

		thisForm.elements["attrVal_"+currentDropDown].value = currAttrValue;
				
		var nextValue = parseInt(currentDropDown)+1;				
		
		if(thisForm.elements["selectedGraphicCodeDataID"] != undefined && 
			thisForm.elements["selectedGraphicCodeDataID"].value != "" )
		{
			nGraphicCodeDataId = thisForm.elements["selectedGraphicCodeDataID"].value;	
			if(nextValue == colorAttributeSequence){
				nextValue = nextValue+1;
			}			
		}			
		
		// This is used for passing colorAttribute for Graphic Codes
		
		var colorAttributeId ;

		if(thisForm.elements["colorAttributeId"] != undefined )
		{
			var colorAttributeId = thisForm.elements["colorAttributeId"].value;		
		}
		// END :This is used for passing colorAttribute for Graphic Codes
		
		// If condition to check for graphic codes
		
		
			if(((currAttrValue!= "")&&(prevAttrValue!=currAttrValue)&&(thisForm.elements["attrValue_"+nextValue] != undefined)))
			{
				var cAttributeValue = thisForm.elements["attrValue_"+currentDropDown].value;
				if(thisForm.elements["attrId_"+nextValue]!=undefined && cAttributeValue!="")
				{
					var cAttributeId = thisForm.elements["attrId_"+currentDropDown].value;
					var nAttributeId = thisForm.elements["attrId_"+nextValue].value;
					var nAttributeValue = thisForm.elements["attrValue_"+nextValue].value;
					var viewName='ProductDetailProcessView';							
					var attr= new Array();			
					var attrValues = new Array();
					for(i=1;i<nextValue;i++){					
						attr[i-1]=thisForm.elements["attrId_"+i].value;
						attrValues[i-1]=thisForm.elements["attrValue_"+i].value;						
					}					
					var bindArgs = 
					{
						url:	'AJAXForwardControllerCmd',
						content: 
						{
							redirectView: viewName,
							attrList: attr.join(),
							attrValues : attrValues.join(),
						    currAttrbuteId: cAttributeId,
						    nextAttributeId: nAttributeId,
						    currAttributeValue: cAttributeValue,
						    nextAttributeValue: nAttributeValue,
						    graphicCodeId: nGraphicCodeDataId,
							productId: thisForm.productId.value,																				
							storeId:thisForm.storeId.value,							
							colorAttributeId:colorAttributeId,
							colorAttributeValue:colorAttributeValue,
							catalogId:thisForm.catalogId.value,
							langId:thisForm.langId.value,
							dropDownName:dropDownName,
							formName: formName
						},
						preventCache: true,
						error:	function(type, errObj)
						{
								//document.getElementById("noEventText").style.visibility="visible";
								//document.getElementById("noEventText").style.display="";
						},
						load:	function(type, data, evt)
						{
								showEventData(data,dropDownName+nextValue); //Adding nextValue to identify the div for the next dropdown
						}
					};
					var requestObj = dojo.io.bind(bindArgs);
				}
			}		
}

function showEventData(data,elementName)
{
	var element = document.getElementById(elementName);
	element.innerHTML = data;
}

function readKeyboard(currentDropDown,dropDownName,thisForm,formName,e){
	var keynum;
	if(window.event){ // IE
		keynum = e.keyCode;
	}
	else if(e.which){ // Netscape/Firefox/Opera
		keynum = e.which;
	}
	if(keynum == 13){
		processDropdown(currentDropDown,dropDownName,thisForm,formName,false); // change this
	}
}

// This function replaces the main image on the product detail page, when the user clicks on the graphic code 
function image_click(targetImage,imagePath,graphicCodeId,currentDropDown,dropDownName,thisForm,formName,colorValue,imageId,totalGcs, startString)
{
	// This replaces the main product image with the selected graphic code image
	document.images[targetImage].src=imagePath;	
	
	var ddCount = thisForm.numOfDropdowns.value;

	//On clicking on a thumbnail image the first defining attribute(if color is not the first one) must be populated.
	var nextValue = 1;	
	
	var colorAttributeId ;
	
	// This sets the selected graphicCodeId to the hidden value(selectedGraphicCodeDataID) in the form
	thisForm.hasSingleGraphicCode.value = "false";
	thisForm.elements["selectedGraphicCodeDataID"].value = graphicCodeId;
	var k;
	 for(k=1;k<=totalGcs;k++){
		 var divGCimages = startString + k;
		 if(divGCimages == imageId){
		      document.getElementById(divGCimages).style.border = "solid 1px #0227C4";
		 }
		 else{
		      document.getElementById(divGCimages).style.border = "solid 1px #fff";
      	  }
	  }
	
	// Checking for a color attribute for the selected graphic code.
	// If we have a valid color attribute we assign this to the corresponding attrValue,
	// which is declared as a hidden variable in the form.
	// The disabling of the subsequent drop downs is also handled in the below block.
	// If the sequence of color is 1, we skip it. 
	if(thisForm.elements["colorAttributeId"] != undefined )
	{
		if("" != colorValue)
		{
			var colorAttributeSequence = parseInt(thisForm.elements["colorAttributeSequence"].value);
			thisForm.elements["attrValue_"+colorAttributeSequence].value = colorValue;	
			var colorAttributeValue = colorValue;
			
			for(i=parseInt(currentDropDown)+1;(thisForm.elements["attrValue_"+i] != undefined)&&i<=ddCount;i++)
			{	
				if(i != colorAttributeSequence){	
					thisForm.elements["attrValue_"+i].value = "";
					if(!thisForm.elements["attrValue_"+i].disabled){
						thisForm.elements["attrValue_"+i].disabled = true;	
					}
				}
			}	
		}		
		var colorAttributeId = thisForm.elements["colorAttributeId"].value;			
		
		if(nextValue == colorAttributeSequence){		
			nextValue = nextValue+1;
		}
	}else{
		for(i=parseInt(currentDropDown)+1;(thisForm.elements["attrValue_"+i] != undefined)&&i<=ddCount;i++)
		{			
			thisForm.elements["attrValue_"+i].value = "";
			if(!thisForm.elements["attrValue_"+i].disabled)	{
				thisForm.elements["attrValue_"+i].disabled = true;	
			}			
		}
	
	}
	

	// Checking if we have any other defining attributes to select
	if(thisForm.elements["attrValue_"+nextValue] != undefined)
	{		
			var currentDropdown = document.getElementById(dropDownName+nextValue);
			var loadingDropdown = document.getElementById("loading");
			currentDropdown.innerHTML = loadingDropdown.innerHTML;
			hideddrivetip();
   		    var m;
		    for(m=1;m<=totalGcs;m++){
			   var divGCimages = startString + m;
 			  document.getElementById(divGCimages).disabled  = true;
		   }
   		    
			var nAttributeId = thisForm.elements["attrId_"+nextValue].value;
			var viewName='ProductDetailProcessView';	
			var nGraphicCodeDataId = thisForm.elements["selectedGraphicCodeDataID"].value;						
			var bindArgs = 
			{
				url:	'AJAXForwardControllerCmd',
				content: 
				{
					redirectView: viewName,					
				    nextAttributeId: nAttributeId,				    				    
					productId: thisForm.productId.value,						
					graphicCodeId: nGraphicCodeDataId,								
					storeId:thisForm.storeId.value,					
					colorAttributeId:colorAttributeId,
					colorAttributeValue:colorAttributeValue,
					catalogId:thisForm.catalogId.value,
					langId:thisForm.langId.value,
					dropDownName:dropDownName,
					formName: formName
				},
				preventCache: true,
				error:	function(type, errObj)
				{
						//document.getElementById("noEventText").style.visibility="visible";
						//document.getElementById("noEventText").style.display="";
				},
				load:	function(type, data, evt)
				{		

						showEventData(data,dropDownName+nextValue); //Adding nextValue to identify the div for the next dropdown
						var n;
						 for(n=1;n<=totalGcs;n++){
					      var divGCimages = startString + n;
		 			      document.getElementById(divGCimages).disabled  = false;
					     }
				}
			};
			var requestObj = dojo.io.bind(bindArgs);				
	}	
}

