	var currentState = '';
        var searchMode = '';
 	var stateTimeout = null;
        var theState = "";
 	var timeInterval = 200;
        var styleEntered = "";
        var styleActual = "";

function globals(){ }

   globals.colorId = '';
   globals.quantity = '';
   globals.productId = '';
   globals.styleNumber = '';

 	function $def(val){
		if (typeof val == "undefined")
			return '';

		if (val == undefined)
			return '';

		return val;
	}

	function setState(state){

		var loc = (location.href.split('#'))[0];

		window.location.replace(loc + "#" + state);

	}


	function changeToState(inState) {
                theState = inState;
		var stateData = inState.replace("#","").split(":");
		state = stateData[0];

		if (state == "simple"){
			$("input[name='searchType']").val(["style"]);

			showSimpleForm();

			// get the style and color from the hash
			var style = stateData[1];
			var color = stateData[2];

		   	// store colorId for future use after calls are complete.
			globals.colorId = color;

			//alert('style: ' + style + '\ncolor: ' + color);
                        getColors(style);


			//$("input[name='styleNumber']").val(style);
			//if (color != ''  || style != globals.styleNumber) {
			if ( style != globals.styleNumber) {
				//getStyleColors( color );
			//	getColorsByItem(document.form1, 'styleNumber');
				globals.styleNumber = style;
			}

		} else if (state == "advanced"){
			$("input[name='searchType']").val(["advanced"]);

			showAdvancedForm();

			restoreAdvancedState(inState);

		}
	}

	function checkState() {

		var state = window.location.hash.replace("#","");

		if (currentState != state) {

			currentState = state;

			changeToState(state);

		}

		stateTimeout = setTimeout(checkState, timeInterval);
	}



// ==============================


  function showAdvancedForm(frm)
  {

    document.getElementById('findType').style.display = 'block';
    document.getElementById('findStyle').style.display = 'none';
    searchMode = 'advance';
    if (frm){
    	setAdvancedState(frm);
    }
  }

  function showSimpleForm(frm)
  {
     document.getElementById('findStyle').style.display = 'block';
     document.getElementById('findType').style.display = 'none';
     searchMode = 'simple';
	// var frm = document.form1;
     if (frm) {
		var selectedColor = '';

		if (frm.styleColor.selectedIndex >= 0){
			selectedColor = frm.styleColor.options[frm.styleColor.selectedIndex].value
		}

     	setState('simple:' + frm.styleNumber.value + ':' + selectedColor);

     }

	//alert('showSimpleForm: ' + frm);

  }

  function setSimpleState(frm) {
  }

  function setAdvancedState(frm) {

	var brandId = $def( $("input[name='radioBrandId']:checked").val() );

	var prodId = $def( $("select[name='productId'] option:selected").val() );

   	var colorId = $def(  $("select[name='colorDD'] option:selected").val() );

   	var quantity = $def( $("input[name='quantity']").val() );

  	setState('advanced:' + brandId + ":" + prodId + ":" + colorId + ":" + quantity );

  }

  function restoreAdvancedState(state) {

	var stateData = state.replace("#","").split(":");
 	if ( $("input[name='radioBrandId']:checked").val() == null){
   		//alert('RESETTING RADIO BRAND ID WITH: ' + stateData[1]);
   		$("input[name='radioBrandId']").val([stateData[1]]);
   	}

	if	(	( $("input[name='radioBrandId']:checked").val() != null ) &&
			(	( $("select[name='productId'] option:selected").val() == null ) ||
				( $("select[name='productId'] option:selected").val() == -100 )
			)
		) {
   		//alert('RECALLING GETPRODUCTSBYCATEGORYPARAM WITH: ' + stateData[1]);
   		//getProductsByCategory(stateData[1], storeId, stateData[2] );
   		getProductsByCategoryParam(document.form1,'brand'+stateData[1]);
   	}

	//set the color in to be selected in the ddlb if one was passed in
	//alert('SETTING PRODUCTID: ' + stateData[2]);
	//$("select[name='productId']").val( stateData[2] );


   	// store item states for future use after calls are complete.
	globals.productId = stateData[2];
   	globals.colorId = stateData[3];

  	$("input[name='quantity']").val(stateData[4]);

  }

  function submitSearchForm()
  {
    var c1 = document.form1.searchType[1].checked;
    var c2 = document.form1.searchType[0].checked;

    if((c1==false) && (c2==false))
    {
    		alert('Please make a selection');
    		return false;
    }


    try
    {
      var boo = confirm();
      if(boo)
      {

        var x = document.forms.form1;
        clearTimeout(stateTimeout);

        document.getElementById('loadWheel').style.display = 'block';

        setTimeout(hideWheel,2000);
        x.submit();
      }
    }
    catch(err)
    {
    	hideWheel();
    }
    return false;
  }

  function resetForm()
  {

    removeAllSizeOptions();
    removeAllColorOptions();
    removeAllProductOptions();
    removeAllStyleColorOptions();
    document.form1.zipCode.value="";
    document.form1.styleNumber.value="";
    document.form1.itemNumber.value="";
    document.form1.quantity.value="";
    document.form1.searchType[0].checked=true;

    /*for (var i=0; i < document.form1.radioBrandId.length; i++)
    {
      document.form1.radioBrandId[i].checked=false;
    }
    */
    document.getElementById('loadWheel').style.display = 'none';
  }


function selectColor(selectId, selectedColor){

	var select = document.getElementById(selectId);
	var index = 0;

	for (var i=0;i<select.options.length;i++) {
		if (select.options[i].value == selectedColor )
		{
			index = i;

			break;
		}
	}

	select.selectedIndex = index;

}




  function removeAllProductOptions()
  {
    try
    {
      var i;
      for(i=document.forms['form1'].productId.options.length-1;i>=0;i--)
      {
        document.forms['form1'].productId.remove(i);
      }
    }
    catch(err)
    {}
  }

  function removeAllSizeOptions()
  {
    try
    {
      var i;
      for(i=document.forms['form1'].sizeId.options.length-1;i>=0;i--)
      {
        document.forms['form1'].sizeId.remove(i);
      }
    }
    catch(err)
    {}
  }

  function removeAllColorOptions()
  {
    try
    {
      var i;
      for(i=document.forms['form1'].colorDD.options.length-1;i>=0;i--)
      {
        document.forms['form1'].colorDD.remove(i);
      }
    }
    catch(err)
    {}
  }

  function removeAllStyleColorOptions()
  {
  	// unselect previously selected color
  	globals.colorId = -100;

    try
    {
      var i;
      for(i=document.forms['form1'].styleColor.options.length-1;i>=0;i--)
      {
        document.forms['form1'].styleColor.remove(i);
      }
    }
    catch(err)
    {}
  }

  function trim(s)
  {
    var l=0; var r=s.length -1;
    while(l < s.length && s[l] == ' ')
    {     l++; }
    while(r > l && s[r] == ' ')
    {     r-=1;     }
    return s.substring(l, r+1);
  }

  function confirm()
  {
	    var searchType;
	    for (var i=0; i < document.form1.searchType.length; i++)
	    {
	      if (document.form1.searchType[i].checked)
	      {
	        searchType = document.form1.searchType[i].value;
	      }
	    }

			var ret = false;

			if(searchType == 'advanced')
			{
				if(document.forms['form1'].productId.value == '' || document.forms['form1'].productId.value == '-100')
 				{
 					document.getElementById('loadWheel').style.display = 'none';
   					alert('You must select a brand and product');
    				ret=false;
    				return ret;
 				}
	    		else
	    		{
	    			ret=true;
	    		}


	    		if(document.forms['form1'].colorDD.value == '' || document.forms['form1'].colorDD.value == '-100')
	  				{
	  				  document.getElementById('loadWheel').style.display = 'none';
	    				alert('You must select a color');
		    			ret=false;
	  				}
	    		else
	    		{
	    			ret=true;
	    		}

	    		if( document.forms['form1'].quantity.value != '' )
				{
						if ( isNaN(document.forms['form1'].quantity.value) )
						{
							document.getElementById('loadWheel').style.display = 'none';
							alert('You must enter a valid quantity');
							ret=false;
							return ret;
						}
			    		else
			    		{
			    			ret=true;
			    		}
				}
	    		else
	    		{
	    			ret=true;
	    		}
	    		return ret;
			}

	    if(searchType == 'style')
	    {
			if(document.forms['form1'].styleNumber.value == '')
			{
				document.getElementById('loadWheel').style.display = 'none';
    			alert('You must enter a style');
    			ret=false;
			}
    		else
    		{
    			ret=true;
    		}
    		if(document.forms['form1'].styleColor.value == '' || document.forms['form1'].styleColor.value == '-100' )
			{
				 document.getElementById('loadWheel').style.display = 'none';
				alert('You must select a color');
    			ret=false;
			}
    		else
    		{
    			ret=true;
    		}

	      return ret;
	    }

	    return ret;
  }

	function hideWheel(){
		//alert('hiding the wheel');
		document.getElementById('loadWheel').style.display = 'none';
	}





/* ---------------------------------------------------------------
-   function getStoreInfo
-
-   purpose - used to get product category list for a store
-
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function getStoreInfo()
{

   if (theState.length > 13)
   {
      var stateData = theState.replace("#","").split(":");
      var temp = "<ul>";
      for (var x=1; x < categories.length; x++)
      {

         var keyval = categories[x].name;

             keyval = keyval.replace('&lt;sup&gt;&amp;reg;&lt;/sup&gt;','<sup>&reg;</sup>');
             keyval = keyval.replace('&lt;sup&gt;&amp;#8482;&lt;/sup&gt;','<sup>&#8482;</sup>');
             if (stateData[1] == x)
             {
                temp = temp + "<li><input type='radio' checked name='radioBrandId' id='brand"+x+"' value='" +x + "' class='radio' onClick='getProductsByCategoryId(" + x + ");'/><label for='brand'"+x+"'>" + keyval + "&nbsp;</label></li>";
                getProductsByCategoryId(x, stateData[2], stateData[3]);
             }
             else
             {
                temp = temp + "<li><input type='radio' name='radioBrandId' id='brand"+x+"' value='" +x + "' class='radio' onClick='getProductsByCategoryId(" + x + ");'/><label for='brand'"+x+"'>" + keyval + "&nbsp;</label></li>";
             }

      }
   }
   else
   {
      var temp = "<ul>";
      for (var x=1; x < categories.length; x++)
      {

         var keyval = categories[x].name;

             keyval = keyval.replace('&lt;sup&gt;&amp;reg;&lt;/sup&gt;','<sup>&reg;</sup>');
             keyval = keyval.replace('&lt;sup&gt;&amp;#8482;&lt;/sup&gt;','<sup>&#8482;</sup>');
             temp = temp + "<li><input type='radio' name='radioBrandId' id='brand"+x+"' value='" +x + "' class='radio' onClick='getProductsByCategoryId(" + x + ");'/><label for='brand'"+x+"'>" + keyval + "&nbsp;</label></li>";

      }
   }
   temp = temp +"</ul>";
   $('#findTyp2').html(temp);



}


/* ---------------------------------------------------------------
-   function getProductsByCategoryId
-
-   purpose - when selecting a product category, it goes and gets
-             a list of products for it
-
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function getProductsByCategoryId(categoryId)
{
   getProductsByCategoryId(categoryId, "", "");
}

function getProductsByCategoryId(categoryId, selectVal, colorSelect)
{
     var productDropDown = document.getElementById("productDD");
     var colorDropDown = document.getElementById("colorDD");
     colorDropDown.options.length = 0;
     document.form1.searchType[1].checked = true;
     searchMode = "advance";
     productDropDown.options.length = 0;
     productDropDown.options[productDropDown.length] = new Option("choose a product",-100, false, false);
     for (var ct=1; ct < categories[categoryId].styles.length; ct++)
     {
         for (var p=1; p < products.length; p++)
         {
           if (products[p].itemnumber == categories[categoryId].styles[ct])
           {
               var itemNumber =  products[p].itemnumber;
               var prodname =  products[p].description;
               var prodid = p;
	       //prodname = prodname.replace('&lt;sup&gt;&amp;reg;&lt;/sup&gt;','\u00AE' );
               //prodname = prodname.replace('&lt;sup&gt;&amp;#8482;&lt;/sup&gt;','\u2122' );
	       prodname = prodname.replace('<sup>&reg;</sup>','\u00AE' );
 	       prodname = prodname.replace('<sup>&#8482;</sup>','\u2122' );
 	       prodname = prodname.replace('&#8217;','\u2019');
               if (selectVal == prodid + ";" + itemNumber)
               {
                  productDropDown.options[productDropDown.length] = new Option(prodname,prodid + ";" + itemNumber , true, true);
                  getColorsForProdId(prodid + ";" + itemNumber, "none", colorSelect)
               }
               else
               {
                  productDropDown.options[productDropDown.length] = new Option(prodname,prodid + ";" + itemNumber , false, false);
               }
          }
       }

     }



}



/* ---------------------------------------------------------------
-   function locate
-
-   purpose - to call locate product and build the inventory table
-             from a web service through a jQuery AJax call. This
-             data is returned in xml, and is parsed into the table.
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function getColors(productCode)
{
  // getColors(productCode, "");
    if (styleEntered != productCode)
    {
       styleEntered = productCode;
       var sUrl = "externalStoreFrontServices/rest/v1/getProductInfo/" + storeId + "/" + productCode + "/0";
       $.get(sUrl, function(data) { parseStyleResponse(data); },"text/xml");
    }


}



function getColors(productCode, colorSelect)
{
    var colorDropDown = document.getElementById("styleColor");
    searchMode = "simple";
    if (styleEntered != productCode)
    {
      styleEntered = productCode;
      var sUrl = "externalStoreFrontServices/rest/v1/getProductInfo/" + storeId + "/" + productCode + "/0";
      $.get(sUrl, function(data) { parseStyleResponse(data); },"text/xml");

    }
}


function parseStyleResponse(styleResponse)
{
   var productCode = $(styleResponse).find("itemCode").text();
   var colorDropDown = document.getElementById("styleColor");
   var pfound = false;
   setState('simple:' + styleEntered + ":");
   var it = document.getElementById("errNotFound");
   it.innerHTML = "";
   document.form1.searchType[0].checked = true;
   for (var p=1; p < products.length; p++)
   {
     if (products[p].itemnumber == productCode)
     {
          colorDropDown.options.length = 0;
          colorDropDown.options[colorDropDown.length] = new Option("Choose A Color",-100, true, true);
          var colors = products[p].colors;
          var xstr=colors;
          colorCount = 0;
          pfound = true;
          while (xstr.indexOf(";") > 0)
          {
              var tcolor=xstr.substring(0,xstr.indexOf(";"));
              var description=tcolor.substring(0,tcolor.indexOf(","));
              var remain= tcolor.substring(tcolor.indexOf(",") +1);
              var colorCode = remain.substring(0, remain.indexOf(","));
              var remain2 = remain.substring(remain.indexOf(",")+1);
              var hexCode = remain2.substring(0, remain2.indexOf(","));
              var fileName = remain2.substring(remain2.indexOf(",")+1);
              colorDropDown.options[colorDropDown.length] = new Option(description,colorCode, false, false);
              xstr = xstr.substring(xstr.indexOf(";")+1);
              colorCount++;
          }
          if (colorCount == 0)
          {
            colorDropDown.options.length = 0;
            colorDropDown.options[colorDropDown.length] = new Option("No Colors Found",-100, true, true);
          }
          else
          {
             var collist = "";
             for (var ccount=1; ccount < colorDropDown.length-1; ccount++)
             {
               collist = collist + colorDropDown.options[ccount].value + "/";
             }
             collist = collist + colorDropDown.options[colorDropDown.length-1].value;

             p = products.length + 1;
             var sUrl = "externalStoreFrontServices/rest/v1/getProductInfo/" + storeId + "/" + styleEntered + "/" + collist;

             $.get(sUrl, function(data) { parseStyleColorResponse(data); },"text/xml");
         }

      }
   }
   if (pfound != true)
   {
      colorDropDown.options.length = 0;
      colorDropDown.options[colorDropDown.length] = new Option("No Colors Found",-100, true, true);
      it.innerHTML = "The Style number entered may be invalid. Please try another Item Number.";
   }

}
function parseStyleColorResponse(colorResponse)
{
  var productCode = $(colorResponse).find("itemCode").text();
  var selColorCode = $(colorResponse).find("colorCode").text();
  setState('simple:' + styleEntered + ":" +  selColorCode);
  var colorDropDown = document.getElementById("styleColor");
  document.form1.searchType[0].checked = true;
  colorDropDown.options.length = 0;
  colorDropDown.options[colorDropDown.length] = new Option("Choose A Color",-100, true, true);
  for (var p=1; p < products.length; p++)
  {
     if (products[p].itemnumber == productCode)
     {
          //var styleProd = document.getElementById("styleNumber");
          styleActual = productCode;
          var colors = sortColors(products[p].colors);
          var xstr=colors;
          pfound = true;
          while (xstr.indexOf(";") > 0)
          {
              var tcolor=xstr.substring(0,xstr.indexOf(";"));
              var description=tcolor.substring(0,tcolor.indexOf(","));
              var remain= tcolor.substring(tcolor.indexOf(",") +1);
              var colorCode = remain.substring(0, remain.indexOf(","));
              var remain2 = remain.substring(remain.indexOf(",")+1);
              var hexCode = remain2.substring(0, remain2.indexOf(","));
              var fileName = remain2.substring(remain2.indexOf(",")+1);
              fileName = fileName.substring(fileName.indexOf("images/") + 7);
              colorCount++;
              if (colorCode == selColorCode)
              {
                 colorDropDown.options[colorDropDown.length] = new Option(description,colorCode, true, true);
              }
              else
              {
                 colorDropDown.options[colorDropDown.length] = new Option(description,colorCode, false, false);
              }
              xstr = xstr.substring(xstr.indexOf(";")+1);
          }
          p = products.length + 1;

      }
   }

}


function getColorsForProdId(productId, mode)
{
   getColorsForProdId(productId, mode, "");
}

function getColorsForProdId(productId, mode, colorSelect)
{
  searchMode = "advance";
  document.form1.searchType[1].checked = true;
  itemNumber = productId;
  var prodId = productId.substring(0,productId.indexOf(";"));
  var colorDropDown = document.getElementById("colorDD");
  var colors = sortColors(products[prodId].colors);
  var xstr=colors;
  colorDropDown.options.length = 0;
  colorDropDown.options[colorDropDown.length] = new Option("Choose A Color",-100, true, true);
  while (xstr.indexOf(";") > 0)
  {
     var tcolor=xstr.substring(0,xstr.indexOf(";"));
     var description=tcolor.substring(0,tcolor.indexOf(","));
     var remain= tcolor.substring(tcolor.indexOf(",") +1);
     var colorCode = remain.substring(0, remain.indexOf(","));
     var remain2 = remain.substring(remain.indexOf(",")+1);
     var hexCode = remain2.substring(0, remain2.indexOf(","));
     var fileName = remain2.substring(remain2.indexOf(",")+1);
     fileName = fileName.substring(fileName.indexOf("images/") + 7);
     if (colorSelect == colorCode)
     {
        colorDropDown.options[colorDropDown.length] = new Option(description,colorCode, true, true);
     }
     else
     {
        colorDropDown.options[colorDropDown.length] = new Option(description,colorCode, false, false);
     }
     xstr = xstr.substring(xstr.indexOf(";")+1);
  }

}







/* ---------------------------------------------------------------
-   function loadProductInformation
-
-   purpose - on product change, get color information from product xml
-
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function loadProductInformation(productXml, dropdown)
{

     var colorDropDown = document.getElementById(dropdown);
     colorDropDown.options.length = 0;
     colorDropDown.options[colorDropDown.length] = new Option("Choose a Color",-100);
     getColorInfo(productXml, "", dropdown);



}


/* ---------------------------------------------------------------
-   function getColorInfo
-
-   purpose - to retrieve color details and load the list of colors
-             for the simple or advanced color dropdown
-
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function getColorInfo(instr, incol, dropdown)
{
    var colInfo = new Object();
    var colorDropDown = document.getElementById(dropdown);
    var cs = instr;
    $(instr).find("com\\.fruit\\.storefront\\.bean\\.Color").each(function()
    {
       var colorCode = $(this).children("code").text();
       var hex = $(this).children("hex").text();
       var description = $(this).children("description").text();
       if (incol == colorCode)
       {
           colorDropDown.options[colorDropDown.length] = new Option(description,colorCode + ";" + hex, true, true);
       }
       else
       {
           colorDropDown.options[colorDropDown.length] = new Option(description,colorCode + ";" + hex, false, false);
       }
    });

}




/* ---------------------------------------------------------------
-   function getStoreIdFromUrl
-
-   purpose - to parse out the store id from the url request
-
-
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function getStoreIdFromUrl()
{
   var store = "";
   var idx = document.URL.indexOf('?');
   var params = new Array();
   if (idx != -1)
   {
      var pairs = document.URL.substring(idx+1, document.URL.length).split('&');

      for (var i=0; i<pairs.length; i++)
      {
         nameVal = pairs[i].split('=');
         if (nameVal[0] == 'store')
         {
            store = nameVal[1];
         }
      }
   }
   store = 8;
   return store;
}


/* ---------------------------------------------------------------
-   function getInventoryDetails
-
-   purpose - calls product locator inventory to get inventory details
-             for a given item number color and or zipcode and or qty
-
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
function getInventoryDetails(itemnumber, colorcode, zipCode, qty)
{
  var storeId = getStoreIdFromUrl();

  var itemNum = '';
  var productId = itemnumber.substring(0, itemnumber.indexOf(";"));
  if (searchMode == 'simple')
  {
     itemNum = styleActual;
  }
  else
  {
     itemNum = itemnumber.substring(itemnumber.indexOf(";")+1);
  }
  var colCode = colorcode;
  var colHex = 000000;
  var minqty = 0;
  if (qty != "")
  {
     minqty = qty;
  }
  sUrl = "Product_Locator_Inventory.shtml?store=" + storeId + "&item=" + itemNum + "&color=" + colCode + "&swatch=" + colHex+"&quantity=" + minqty;
  if (zipCode != '')
  {
     sUrl = sUrl + "&zipCode=" + zipCode;
  }
  window.location = sUrl;
}



function sortColors(inColors)
{
   var outColors="";
   var xstr = inColors;
   var colArray = new Array();
   var colCount = 0;
   while (xstr.indexOf(";") > 0)
   {
      var tcolor=xstr.substring(0,xstr.indexOf(";"));
      xstr = xstr.substring(xstr.indexOf(";")+1);
      colArray[colCount] = tcolor;
      colCount++;
   }
   colArray.sort();
   for (var i=0; i < colArray.length; i++)
   {
      outColors = outColors + colArray[i] + ";";
   }
   return outColors;
}



/* ---------------------------------------------------------------
-   function create XML
-
-   purpose - take the xml text data and change it into an xml
-             dom object. IE 6.X didnt support the jQuery way
-             $(x,'xml) to convert, so I am using the activex
-             control for IE
-
-
-   created date  2/26/2009
-   written by  Mike Kucharski
-----------------------------------------------------------------*/
/* XML object is now being passed, no need to createXML
function createXML(x)
{
   var xmlDoc;
   try //Internet Explorer
   {
      xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
      xmlDoc.async="false";
      xmlDoc.loadXML(x);
      myBrowser= "IE";
   }
   catch(e)
   {
      try //Firefox, Mozilla, Opera, etc.
      {
          parser=new DOMParser();
          xmlDoc=parser.parseFromString(x,"text/xml");
      }
      catch(e)
      {
         alert(e.message);
         return;
      }
   }
   return xmlDoc;
}
*/
