/* Using prototype.js event handlers for form handling    */
/* See the Prototype web site: http://www.prototypejs.org */
/* This script depends on categoryGroupProductData.js     */

function validateForm()
{
    //----- Zipcode field and related
    var zipcodeLabel = $("zipcodeLabel");
    var zipcodeField = getElementByName("zipcode");
    var zipcodeRegEx = /^\d{5}([\-]\d{4})?$/;

    //----- Locator result divs
    var locatorResultsDiv = $("locatorResults");
    var productDetailsDiv = $("productDetails");

	//----- Ensure valid zipcode (either 55555 or 55555-5555)
    if (zipcodeField.value.match(zipcodeRegEx))
    {
        //----- Zipcode is valid, remove css class named required
        zipcodeLabel.removeClassName("required");
        zipcodeField.removeClassName("required");

        //----- Ensure result divs are visible
        showElement(locatorResultsDiv);
        showElement(productDetailsDiv);

        //----- Continue with form submit (any non-null FormState value works here)
        saveFormState("searchForLocations");
        saveSelectedLocation("reset");
	return true;
    }
    else
    {
        //----- Zipcode not valid, add css class named required
        zipcodeLabel.addClassName("required");
        zipcodeField.addClassName("required");

        //----- Ensure result divs are hidden
        hideElement(locatorResultsDiv);
        hideElement(productDetailsDiv);

        //----- Cancel form submit
        return false;
    }
}

function saveDropDownSelections()
{
	//----- Save selected category and product into hidden form fields
	getElementByName("selectedGroup"   ).value = $F("groupList"   );
	//getElementByName("selectedProduct" ).value = $F("productList" );
	getElementByName("selectedCategory").value = $F("categoryList");
}

function saveSelectedLocation(locationId)
{
	//----- Save selected location into hidden form field
	getElementByName("selectedLocation").value = locationId;
	return true;
}

function saveFormState(state)
{
	//----- Save current state of form into hidden form field
	getElementByName("formState").value = state;
}

function updateGroupChoices()
{
	var selectedCategory = $F("categoryList");
	var selectedGroup    = 0;
	populateGroupDropDown(selectedCategory, selectedGroup);
	//updateProductChoices();
}

function updateProductChoices()
{
	var selectedGroup   = $F("groupList");
	var selectedProduct = 0;
	populateProductDropDown(selectedGroup, selectedProduct);
}

function clearItems(list)
{
	list.descendants().each(Element.remove);
}

function addItem(list, text, value, isSelected)
{
    if (list != null && list.options != null)
    {
    	list.options[list.options.length] = new Option(text, value, false, isSelected);
    }
}

function hideElement(target)
{
	if (target != null)
	{
		target.hide();
	}
}

function showElement(target)
{
	if (target != null)
	{
		target.show();
	}
}

function getElementByName(name)
{
	return $$('[name="' + name + '"]')[0];
}

function populateCategoryDropDown(selectedCategory)
{
	var categoryList = $("categoryList");

	clearItems(categoryList);

	for (var value = 0; value < categoryData.length; value++)
	{
		addItem(categoryList, categoryData[value][0], categoryData[value][2], selectedCategory == categoryData[value][2]);
	}
}

function populateGroupDropDown(selectedCategory, selectedGroup)
{
	populateDropDown($("groupList"), groupData, selectedCategory, selectedGroup);
}

function populateProductDropDown(selectedGroup, selectedProduct)
{
	populateDropDown($("productList"), productData, selectedGroup, selectedProduct);
}

function populateDropDown(list, data, selectedParent, selectedChild)
{
    clearItems(list);
    addItem(list, data[0][0], 0, selectedChild == 0);

    for (var value = 1; value < data.length; value++)
    {
            var text   = data[value][0];
            var parent = data[value][1];
            var index = data[value][2];
            
            if (selectedParent == 0 || selectedParent == parent)
            {
                    addItem(list, text, index, selectedChild == index);
            }
    }
}

Event.observe(window, 'load', function()
{
    //----- Hidden form fields contain product and category choices
    var selectedGroup    = getElementByName("selectedGroup"   ).value;
    //var selectedProduct  = getElementByName("selectedProduct" ).value;
    var selectedCategory = getElementByName("selectedCategory").value;

    //----- Init category, group and products
    populateCategoryDropDown(selectedCategory)
    populateGroupDropDown(selectedCategory, selectedGroup);
    //populateProductDropDown(selectedGroup, selectedProduct);
}
);