<!--

// MN Flag user clicked on swatch or not
var userClickSwatch = false;
var currColor = "000";

function HiliteImgBorder(item, colorcode)
{
  // alert("item = " + item + ":: colorcode = " + colorcode);

  var item = item.toLowerCase();

  var elemList = document.getElementsByName("swatch");
  if(elemList == null || elemList.length == 0)
    return;

  var imageCount = elemList.length;

  for (var i = 0; i < imageCount; i++)
  {

    var unHighlghtBorder = true;  
    var pattern = new RegExp(item, "i");

    var picRef = elemList[i];

    var isImage = picRef.src.match(pattern);
    var isThumb = picRef.src.match(".101");      
    var isColor = ExtractColorCode(picRef.src, item);

    // alert("isImage = " + isImage + "::isThumb = " + isThumb + "::isColor = " + isColor);
    // re- ins here
    if(isImage != null && isThumb != null && isColor != null)
    {
      if(isImage.length > 0 && isThumb.length > 0 && isColor.length > 0)
      {
        if(isColor == colorcode)
        {
          // alert('Swatch FOUND');
          unHighlghtBorder = false;
          picRef.className = "highlightSwatch";
        }
      }
    }

    // Do this afterward to avoid flashing the highlight
    if(unHighlghtBorder)
        picRef.className = "pdswatch";
  }
}

function swapFullColorImage(item, colorcode, classcode)
{

   // Don't do this unless we have swatches
   var FullProcSrcElem;
   var elemList = document.getElementsByName("FullProdSrc");
   if(elemList == null || elemList.length == 0)
	return;

   FullProcSrcElem = elemList[0];

   // Don't do this unless we have swatches
   elemList = document.getElementsByName("swatch");

   if(elemList == null || elemList.length == 0)
      return;

   //Swaps in a full color .102 image

    item = item.toLowerCase();
    colorcode = colorcode.toLowerCase();
           
    var urlPart = (window.location.protocol == "https") ? "https://images-s.qvc.com" : "http://images-p.qvc.com";

    var filePart = item + "_" + colorcode + ".102";

    var macroPart = "&macro=$proddetailmain$";

    var defaultPart = "&default=";
    defaultPart += "/" + item.substr(0,1); 
    defaultPart += "/" + item.substr(item.length - 2,item.length);
    defaultPart += "/" + item + "_" + colorcode +  ".101";

    var linktext = urlPart + "/ProductAssetWeb/ProductAssetService?file=" + filePart + macroPart + defaultPart;

    
    FullProcSrcElem.src = linktext;

    // Pass the image code. f/n will highlight the swatch extension image
    HiliteImgBorder(item, colorcode);

    // Scroll the window so that the full image is visible

    var offPar = FullProcSrcElem.offsetParent;
    var topOffset = FullProcSrcElem.offsetTop;
    while(offPar != null)
    {
        topOffset += offPar.offsetTop;
        offPar = offPar.offsetParent;
    }

    if(document.body.scrollTop > topOffset)
    {
	// The Availability Guide breaks if the just set the document.location
    	window.scroll(0, topOffset);		
    }


    
    // 12 12 06 mv here.
    // CHECK IF userClickSwa flag is false
   // Get the Product Short Description

   elemList = document.getElementsByName("ShortDesc");
   if(elemList != null && elemList.length != 0)
	shortdesc = elemList[0].value;
   else
	shortdesc = "";

    if(userClickSwatch == false && shortdesc != "")
    {
        if ( typeof(Qvc_cmCreatePageViewTag_sw) != "undefined" ) 
        {
          // CALL coremetrics wrapper routine to accomodate source for variables/ swatches

          Qvc_cmCreatePageViewTag_sw(shortdesc);
        }
      
        userClickSwatch = true;      
    }
    
    //now lets see if the dropdown needs to be changed
    var ColorSizeSel;
    var elemList = document.getElementsByName("ColorSize");
    
    if(elemList != null && elemList.length > 0)
    {
    	ColorSizeSel = elemList[0];
    }
    else
    {
    	ColorSizeSel = null;
    }
    
    if(ColorSizeSel != null)
    {
    	//we only need to set the color if it is not the same as the selected color.
	//we need to find the ColorSizeSel option that has the correct color code

	var optCC,optCD,i;
	var selInd = ColorSizeSel.selectedIndex;
	
	for(i=1; i < ColorSizeSel.options.length; i++)
	{
		var currValue = ColorSizeSel.options[i].value;
		var arrValues = new Array();

		if(currValue.indexOf(':') > 0)
		{
			arrValues = currValue.split(":")

			if(arrValues.length > 0)
			{
				optCC = arrValues[2].toLowerCase();
				optCD = arrValues[4];

				if(optCC == colorcode)
				{
					if(i != selInd)
					{
						//we need to determine how to call SelectOption

						var SelOptionSel;
						var elemList2 = document.getElementsByName("selOption1");

						if(elemList2 != null && elemList2.length > 0)
							SelOptionSel = elemList2[0];
						else
							SelOptionSel = null;

						if(SelOptionSel != null) //we have sizes
						{
							if(SelOptionSel.selectedIndex > 0)
							{
								//then we have a selected size, so we can call SelectOption
								SelectOption(SelOptionSel.options[SelOptionSel.selectedIndex].text, optCD);
							}

						}
						else //we don't have sizes
						{
							SelectOption(optCD, '');
						}


						break;
					}
				}
			}
		}
	}
	
	//just double check the value of the color code of the selectedIndex.  if it doesn't
	//match we need to reset it.
	
	if(ColorSizeSel.selectedIndex > 0)
	{
		var val = ColorSizeSel.options[ColorSizeSel.selectedIndex].value;
		var arr = new Array();
		var selectedColorCode = '';
	
		if(val.indexOf(':') > 0)
		{
			arr = val.split(":");
	
			if(arr.length > 0)
			{
	
				selectedColorCode = arr[2].toLowerCase();
				if ((selectedColorCode != '') && (selectedColorCode != colorcode))
				{
					ColorSizeSel.options[0].selected = true;
				}
			}
	
		}
	}
	
    }
    
    currColor = colorcode;
    
}

function OptionChange(Option2Desc)
{

	//first check to see if ColorSize is not set to "Color" or "" and store text
	var ColorSizeText;
	var ColorSizeValue;

	var ColorSizeSel;
	var elemList = document.getElementsByName("ColorSize");

	if(elemList != null && elemList.length > 0)
		ColorSizeSel = elemList[0];
	else
		ColorSizeSel = null;

	if(ColorSizeSel != null)
	{
		if(ColorSizeSel.selectedIndex >= 0 )
		{
			ColorSizeValue = ColorSizeSel.options[ColorSizeSel.selectedIndex].value;

			if (ColorSizeValue != "Color" || ColorSizeValue != "Size" || ColorSizeValue != "")
			{
				ColorSizeText = ColorSizeSel.options[ColorSizeSel.selectedIndex].text;
			}
		}
		//remove all options from second select besides first one
		ColorSizeSel.options.length = 1;
	}


	var newOption;
	var i;
	var j;
	var k = 1;

	var SelOptionSel;
	elemList = document.getElementsByName("selOption1");

	if(elemList != null && elemList.length > 0)
		SelOptionSel = elemList[0];
	else
		SelOptionSel = null;

	if(SelOptionSel != null)
	{
		var iFirstSelectedIndex = SelOptionSel.selectedIndex;

		if(SelOptionSel.options[iFirstSelectedIndex].value == 'Size')
		{
			if (country == "DE")
			{
				ColorSizeSel.options[1] = new Option("Bitte zuerst Größe auswählen","");
			}		
			else
			{
				ColorSizeSel.options[1] = new Option("Select Size First","");
			}
			ColorSizeSel.options[0].selected = true;
		}
		else if(SelOptionSel.options[iFirstSelectedIndex].value == 'Color')
		{
			ColorSizeSel.options[1] = new Option("Select Color First","");
			ColorSizeSel.options[0].selected = true;
		}
		else
		{
			// loop through the color codes array
			for(i=0; i < arrFirstValues.length; i++)
			{
				if(arrSecondValues[i])
				{
					// does this color code match the color code that is selected?
					if(SelOptionSel.options[iFirstSelectedIndex].value == arrFirstValues[i])
					{
						// loop through the sizes available for this color code
						for(j=0; j < arrSecondValues[i].length; j++)
						{
							ColorSizeSel.options[k] = new Option(arrSecondNames[i][j], arrSecondValues[i][j]);

							//if this was the previously selected color, keep it selected
							if(arrSecondNames[i][j] == ColorSizeText ||
							((arrSecondNames[i][j] + " - WAITLIST ONLY") == ColorSizeText) ||
							 (arrSecondNames[i][j] == (ColorSizeText + " - WAITLIST ONLY")))
							{
								ColorSizeSel.options[k].selected = true;
							}

							k++;
						}
					}
				}
			}
		}
	}

	if( ColorSizeSel != null)
	{	
		if(Option2Desc != null || Option2Desc != "")
		{
			for(i=0; i < ColorSizeSel.options.length; i++)
			{
				if(ColorSizeSel.options[i].text == Option2Desc)
				{
					ColorSizeSel.options[i].selected = true;
				}
			}
		}

		if(ColorSizeSel.options.selectedIndex < 1) 
		{
			ColorSizeSel.options[0].selected = true;
		}
	}

	if (country != "DE")
	{
		ShowHideWaitlist();
	}
}

function ShowHideWaitlist( )
{
	if (country == "UK")
	{
		document.getElementById("ltd_stock_links").style.display="none";
		document.getElementById("styled_waitlist").style.display="none";
		document.getElementById("styled_advorder").style.display="none";
	}
	
	var img, shimsrc, wlsrc, shimimg, aodate;

	var ColorSizeSel;
	var elemList = document.getElementsByName("ColorSize");

	if(elemList != null && elemList.length > 0)
		ColorSizeSel = elemList[0];
	else
		ColorSizeSel = null;

	var selOption;
	if(ColorSizeSel != null)
		selOption = ColorSizeSel.options[ColorSizeSel.selectedIndex].value;
	else
		selOption  = "";

	var values = new Array();
	values = selOption.split(":");

	if (country == "UK")
	{
		if (values[1] == 'W')
		{
			document.getElementById("ltd_stock_links").style.display="block";
			document.getElementById("styled_waitlist").style.display="block";
		}
		else if (values[1] == 'A')
		{
			document.getElementById("ltd_stock_links").style.display="block";
			document.getElementById("styled_advorder").style.display="block";
		}
	}
	else
	{		
		shimsrc="/qvc/gif/shim.gif";
		wlsrc = "/qvc/gif/waitlist3.gif";

		if (document.getElementById)
		{
			img = document.getElementById("waitlist");
			shimimg = document.getElementById("waitlistshim");			
		}
		else
		{
			img = document.ids.waitlist;		
			shimimg = document.ids.waitlistshim;					
		}

		img.src = (values[1] == 'W') ? wlsrc : shimsrc;

		img.height = (values[1] == 'W') ? "16" : "0";
		shimimg.height=(values[1] == 'W') ? "5" : "0";
	}

	//now we try to select the color image
	if(country != null && country == "US")
	{
		var curCC = getSelectedColorCode();

		if(curCC != "")
		{
			var ProductIdVal;
			elemList = document.getElementsByName("ProductId");

			if(elemList != null && elemList.length > 0)
				ProductIdVal = elemList[0].value;
			else
				ProductIdVal = "";

			var ClassCodeVal;
			elemList = document.getElementsByName("ClassCode");

			if(elemList != null && elemList.length > 0)
				ClassCodeVal = elemList[0].value;
			else
				ClassCodeVal = "";

			swapFullColorImage(ProductIdVal, curCC, ClassCodeVal, "");
		}
	}

}

var activated = 1;

function CheckForColorSize()
{
	if(country == "UK")
	{
		if (document.getElementById('spanoption') != null)
			document.getElementById('spanoption').className='';

		if (document.getElementById('spansize') != null)
			document.getElementById('spansize').className='';
		
		document.getElementById("ColourError").style.display="none";
		document.getElementById("OptionError").style.display="none";
		document.getElementById("SizeError").style.display="none";
	}
	else
	{
		var tmpElement = document.getElementById("ColorErrorImg");
		if (tmpElement != null )
		{
			tmpElement.height = "0";		
		}

		tmpElement = document.getElementById("OptionErrorImg");
		if (tmpElement != null )
		{
			tmpElement.height = "0";			
		}

		tmpElement = document.getElementById("SizeErrorImg");
		if (tmpElement != null )
		{
			tmpElement.height = "0";
		}
	}

	tmpElement = document.getElementById("colorNbr");
	if (tmpElement != null )
	{
		tmpElement.style.color = "#000000";
	}

	tmpElement = document.getElementById("colorNbrBorder");
	if (tmpElement != null )
	{
		tmpElement.style.borderColor = "#000000";
	}

	tmpElement = document.getElementById("sizeNbr");
	if (tmpElement != null )
	{
		tmpElement.style.color = "#000000";
	}

	tmpElement = document.getElementById("sizeNbrBorder");
	if (tmpElement != null )
	{
		tmpElement.style.borderColor = "#000000";
	}

	var ret = true;
	
// Was used to prevent double clicking
//	if (activated != 1)
//	{
//		return false;
//	}

	if(document.getElementsByName)
	{

		var ColorSizeSel;
		var elemList = document.getElementsByName("ColorSize");

		if(elemList != null && elemList.length > 0)
			ColorSizeSel = elemList[0];
		else
			ColorSizeSel = null;

		if( ColorSizeSel != null )
		{
			// This element doesn't exist in all templates
			// If it doesn't exist, then "CheckDropDowns()" doesn't get called

			 elemList= document.getElementsByName("SelectedColorSize");

			if(elemList != null && elemList.length > 0)
				elemList[0].value = ColorSizeSel.selectedIndex;;

			if(ColorSizeSel.options != null)
			{	
				if(ColorSizeSel.options[ColorSizeSel.selectedIndex].value == "Size")				
				{
					ret = ShowSizeError(ColorSizeSel);
				}
				else if(ColorSizeSel.options[ColorSizeSel.selectedIndex].value == "Color")
				{
					ret = ShowColorError(ColorSizeSel);
				}
			}
		}

		var SelOptionSel;
		elemList = document.getElementsByName("selOption1");

		if(elemList != null && elemList.length > 0)
			SelOptionSel = elemList[0];
		else
			SelOptionSel = null;

		if(SelOptionSel != null)
		{
			if(SelOptionSel.options[SelOptionSel.selectedIndex].value == "Color")
			{
				// unselected error
				ret = ShowColorError(SelOptionSel);
			}
			else if(SelOptionSel.options[SelOptionSel.selectedIndex].value == "Size" )
			{
				// unselected size
				ret = ShowSizeError(SelOptionSel);
			}				
		}

		if(ret)
		{
			activated = 0;
		}

		return ret;
	}

	activated = 0;
	return true;
}

function ShowColorError(select)
{
	var opt = false;
	var img = document.getElementById("ColorErrorImg");	
	var redir;
	
	if(country == "UK") 
	{
		if (document.getElementById("ShowColorError").value)
		{
			var error = document.getElementById("ColourError");
			error.style.display="block";
			redir="#ColorError";	
		}
		else
		{
			var error = document.getElementById("OptionError");
			error.style.display="block";
			redir="#OptionError";		
		}
	
		document.getElementById("error").style.display="block";
		document.getElementById("error_title").style.display="block";		
		if (document.getElementById('spanoption') != null)
			document.getElementById('spanoption').className='required';	
	}
	else 
	{
		if (img == null )
		{
			img = document.getElementById("OptionErrorImg");
			opt = true;
		}

		if(img != null)
		{		
			if(!opt)
			{
				if(country == "DE")
				{
					img.src = "/degif/ColorErrorDE.gif";
				}			
				else
				{
					img.src = "/qvc/gif/ColorError.gif";
				}
				redir="#ColorError";
			}
			else
			{
				if(country == "DE")
				{
					img.src = "/degif/OptionErrorDE.gif";
				}			
				else
				{
					img.src = "/qvc/gif/OptionError.gif";
				}
				redir="#OptionError";
			}
			if(country == "DE")
			{
				img.height = "21";
			}
			else if(country != "UK")
			{			
				img.height = "16";
				var span = document.getElementById("colorNbr");
				span = span.style;
				span.color = "red";
				select.style.background="yellow";
			}
		}	
	}
	
	document.location.href=redir;

	return false;
}

function ShowSizeError(select)
{
	var opt = false;
	var img = document.getElementById("SizeErrorImg");
	var redir;
	
	if(country == "UK") 
	{
		if (document.getElementById("ShowSizeError").value)
		{
			var error = document.getElementById("SizeError");
			error.style.display="block";
			redir="#SizeError";
		}
		else
		{
			var error = document.getElementById("OptionError");
			error.style.display="block";
			redir="#OptionError";		
		}
	
		document.getElementById("error").style.display="block";
		document.getElementById("error_title").style.display="block";		
		if (document.getElementById('spansize') != null)
			document.getElementById('spansize').className='required';	
	}
	else 
	{
		if (img == null )
		{
			img = document.getElementById("OptionErrorImg");
			opt = true;
		}

		if(img != null)
		{		
			if(!opt)
			{
				if(country == "DE")
				{
					img.src = "/degif/SizeErrorDE.gif";
				}
				else
				{
					img.src = "/qvc/gif/SizeError.gif";
				}
				redir="#SizeError";
			}
			else
			{
				if(country == "DE")
				{
					img.src = "/degif/OptionErrorDE.gif";
				}
				else
				{
					img.src = "/qvc/gif/OptionError.gif";
				}
				redir="#OptionError";
			}

			if(country == "DE")
			{
				img.height = "21";
			}
			else if(country != "UK")
			{			
				var span = document.getElementById("sizeNbr");
				span = span.style;
				span.color = "red";
				select.style.background="yellow";
				img.height = "16";
			}		
		}
	}
	
	document.location.href=redir;
	
	return false;
}


function SelectOption(Option1Desc, Option2Desc)
{
	var i;

	var SelOptionSel;
	var elemList = document.getElementsByName("selOption1");

	if(elemList != null && elemList.length > 0)
		SelOptionSel = elemList[0];
	else
		SelOptionSel = null;

	if(SelOptionSel != null)
	{	
		for(i=0; i < SelOptionSel.options.length; i++)
		{		
			if(SelOptionSel.options[i].text == Option1Desc)
			{
				SelOptionSel.options[i].selected = true;
				OptionChange(Option2Desc);				
				break;
			}
		}
	}
	else
	{
		var ColorSizeSel;
		elemList = document.getElementsByName("ColorSize");

		if(elemList != null && elemList.length > 0)
			ColorSizeSel = elemList[0];
		else
			ColorSizeSel = null;

		for(i=0; i < ColorSizeSel.options.length; i++)
		{
			if(ColorSizeSel.options[i].text == Option1Desc)
			{
				ColorSizeSel.options[i].selected = true;
				if (country != "DE")
				{
					ShowHideWaitlist();
				}
				break;
			}
		}
	} 	

	if(country != null && country == "US")
	{
		var curCC = getSelectedColorCode();

		if(curCC != "")
		{
			var ProductIdVal;
			elemList = document.getElementsByName("ProductId");

			if(elemList != null && elemList.length > 0)
				ProductIdVal = elemList[0].value;
			else
				ProductIdVal = "";

			var ClassCodeVal;
			elemList = document.getElementsByName("ClassCode");

			if(elemList != null && elemList.length > 0)
				ClassCodeVal = elemList[0].value;
			else
				ClassCodeVal = "";

			swapFullColorImage(ProductIdVal, curCC, ClassCodeVal, "");
		}
	}
}


function checkDropDowns( )
{
	// There's an oddity in the German pages: the "Country" symbol only
	// exists when "selOption1" exists. That's not much of a problem
	// because we have to have at least one dropdown in order to be
	// worried about any of these options.

	var SelOptionSel;
	var elemList = document.getElementsByName("selOption1");

	if(elemList != null && elemList.length > 0)
		SelOptionSel = elemList[0];
	else
		SelOptionSel = null;

	var SelColorSize;
	elemList = document.getElementsByName("SelectedColorSize");

	if(elemList != null && elemList.length > 0)
		SelColorSize = elemList[0].value;
	else
		SelColorSize = "";

	if(SelOptionSel != null && (SelOptionSel.selectedIndex != 0) && (SelColorSize != ""))
	{
		OptionChange();

		elemList = document.getElementsByName("ColorSize");

		if(elemList != null && elemList.length > 0)
			elemList[0].selectedIndex = SelColorSize;

		if (country != "DE")
			ShowHideWaitlist();
	}


	if(typeof(country) != "undefined" && country == "US")
	{
		var curCC = getSelectedColorCode();

		var prodId;
		elemList = document.getElementsByName("ProductId");

		if(elemList != null && elemList.length > 0)
			prodId = elemList[0].value.toLowerCase();
		else
			prodId = "";

		if(curCC != "")
		{
			var ClassCodeVal;
			elemList = document.getElementsByName("ClassCode");

			if(elemList != null && elemList.length > 0)
				ClassCodeVal = elemList[0].value;
			else
				ClassCodeVal = "";

			// Force the image and highlighted swatch to match the dropdowns
			swapFullColorImage(prodId, curCC, ClassCodeVal, "");
		}
		else 
		{
			//Make sure we have a main image (we might have Full Motion Video)
 			if(typeof(document.FullProdSrc) == "undefined" || typeof(document.FullProdSrc.src) == "undefined")
        			return;

			// See if the main image has a color. If it does, highlight the
			// swatch that matches the image color. The image color matches
			// the color code provided in the URL.

			var imageURL = document.FullProdSrc.src.toLowerCase();
			var testStr = prodId + "_";
			var idx = imageURL.indexOf(testStr);

			if(idx > 0)
			{
				idx += testStr.length;
				var dotIdx = imageURL.indexOf(".", idx);
				if(dotIdx > idx)
				{
					curCC = imageURL.substring(idx, dotIdx);
					HiliteImgBorder(prodId, curCC);
				}
			}
		}
	}
	
	return false;
}


function showOptionWindow(URL, arg1, arg2)
{
	var curCC = getSelectedColorCode();

	if(curCC != "")
		URL += "&colorCode=" + curCC;
	else if (typeof(currColor) != "undefined" && currColor != "000")
	{
		URL += "&colorCode=" + currColor;
	}
	

	open_window(URL, arg1, arg2);
}


function getSelectedColorCode()
{
	if(typeof(country) == "undefined" || country != "US")
		return "";

	var elemList = document.getElementsByName("ColorSize");

	if(elemList == null || elemList.length == 0)
		return "";

	var ColorSizeSel = elemList[0];

	if(ColorSizeSel.selectedIndex > 0)
	{
		var selOption = ColorSizeSel.options[ColorSizeSel.selectedIndex].value;
		var values = new Array();
		values = selOption.split(":");

		if(values.length >= 2)
			return values[2];
	}

	return "";
}

function ExtractColorCode(URL, item)
{
	// Extract colorcode, if present

	// First, find the end of the item    
	var idxItem = URL.indexOf(item);

	if(idxItem < 0)
		return "";

	// Next, find the start of the extension
	var extensionMarker = ".";
	var idxExtension = URL.indexOf(extensionMarker, idxItem);

	if(idxExtension < 0)
		return "";

	// See if we even have a color code between the item and extension
	// If the difference is one or less, no color code is present
	if(idxExtension - idxItem <= 1)
		return "";

	// Extract the color code
	var ccIdx = idxItem + item.length;
	var ccString = URL.substring(ccIdx, idxExtension);

	// Strip any leading seperator characters like underscore
	var pattern = new RegExp("[A-Za-z0-9]", "i");	
	var firstChar = ccString.match(pattern);
	if(firstChar != null)
		ccString = ccString.substring(firstChar.index, ccString.length);

	// return what's left
	return ccString.toLowerCase();
}

// -->