// Set objects for dropdown lists.
var sizeChartObj = new Object( );

sizeChartObj = [{value:"1084", text:"men's apparel", header:"Men's Apparel"},
                {value:"1085", text:"men's shoes", header:"Men's Shoes"},
                {value:"1087", text:"men's belts", header:"Men's Belts"},
                {value:"1086", text:"men's hats & gloves", header:"Men's Hats & Gloves"},
                {value:"1090", text:"women's apparel", header:"Women's Apparel"},
                {value:"1094", text:"women's shoes", header:"Women's Shoes"},
                {value:"1092", text:"women's rings", header:"Women's Rings"},
                {value:"1091", text:"women's belts", header:"Women's Belts"},
                {value:"1093", text:"women's hats & gloves", header:"Women's Hats & Gloves"},
                {value:"1088", text:"baby", header:"Baby"},
                {value:"1092", text:"women's rings", header:"Women's Rings"},
                {value:"1091", text:"women's belts", header:"Women's Belts"},
                {value:"1084", text:"men's apparel", header:"Men's Apparel"},
                {value:"1087", text:"men's belts", header:"Men's Belts"},
                {value:"1086", text:"men's hats & gloves", header:"Men's Hats & Gloves"},
                {value:"1093", text:"women's hats & gloves", header:"Women's Hats & Gloves"},
                {value:"1085", text:"men's shoes", header:"Men's Shoes"},
                {value:"1094", text:"women's shoes", header:"Women's Shoes"},
                {value:"1089", text:"petites' apparel", header:"Petites' Apparel"}];

			
	
// Initialize dropdown list.
function initOptions() {
	var selType = document.sizeChartList.scType;
	
	selType.options.length = 0;
	
	selType.options[selType.options.length] = new Option(resourceBundleValues.sizeChart.headerDropdown, "");
	
	for (var j = 0; j < sizeChartObj.length; j++) {
		selType.options[selType.options.length] = new Option(sizeChartObj[j].text, sizeChartObj[j].value);
	}
}
		
// Set value of 'cid' field (hidden) with value of selected size chart option.
function setCid(iType) {
	return iType.options[iType.options.selectedIndex].value;
}

function replaceText(iText){

    var newSpan = document.createElement("span");
    var newText = document.createTextNode(iText);
    newSpan.appendChild(newText);

    var para = document.getElementById("sizeChartContentHeader");
    var spanElm = document.getElementById("hdrText");
    para.replaceChild(newSpan,spanElm);
}

// Checks to see if there's a value for the 'cid'.  If yes, set selected indices of both dropdown lists.
function setSelectedIndices(cid) {
	var setTypeIndex = -1;
	var setTypeHeader = "";
	
	if (cid != "") {
		for (var k = 0; k < sizeChartObj.length && setTypeIndex == -1; k++) {
			if (sizeChartObj[k].value == cid.toString()) {
				setTypeIndex = k;
				setTypeHeader = sizeChartObj[k].header;
			}
		}
	} else {
		setTypeIndex = -1;
		return;
	}
	
	if (setTypeIndex >= 0) {
		document.sizeChartList.scType.selectedIndex = setTypeIndex+1;
		replaceText(setTypeHeader);
		return;
	}
}

//  Hide divs that were specified by ID.  Pass in name of the ID.
function hideDiv(el) {
    var ele = $(el);
    if(ele)
        $(el).setStyle({display: 'none'});
}

//  Show divs that were specified by ID.  Pass in the name of ID.
function showDiv(el) {
    var ele = $(el);
    if(ele)
        $(el).setStyle({display: 'block'});
}

//  Hides and shows designated divs based on ID.  Pass in alphanumeric portion of element ID, numeric portion of element ID and 
//  the number of display block in the grouping.
function toggleDiv(el, elid, length) {
	var openDiv = el + elid;
	for (i=1; i<=length; i++) {
		if (elid == i) {
			showDiv(openDiv);
		} else {
			var closeDiv = el + i;
			hideDiv(closeDiv.toString());
		}
	}
}	

// Validate form
function validate() {
	var setType = document.sizeChartList.scType;
	if (setType.options[setType.options.selectedIndex].value == "") {
		alert(resourceBundleValues.sizeChart.sizeChartSelectError);
		setType.focus();
		return false;
	} else {
		var getCid = setCid(setType);
		window.location.href = "/browse/sizeChart.do?cid=" + getCid;
	}
}
	
// Gets the url parameter and initializes dropdown lists and toggle layers.
Event.observe(window,"load",function() {
	var strCid = getQuerystringParam("cid");

    if( document.sizeChartList ) {
        initOptions();

        setSelectedIndices(strCid);

        if (strCid.length > 0 && strCid != brandProperties.DEFAULTSIZECHARTID) {
            toggleDiv("cid", "2", 2);
            toggleDiv("tab", "1", 2);
        } else {
            toggleDiv("cid", "1", 2);
        }
     }
	
});