/*

Description:
Add event handler to element.

Supports:
IE, NS, Mozilla.

Example:

var objHyperlink = document.getElementById('myHyperlink');

addEvent(objHyperlink, "click" , hyperlinkClickHandler, false);

*/

function addEvent(objElementToAttacheEventTo, strEventTypeToAttach, objFunctionToCall, blnUseCapture)
{
    // IE.
    if (objElementToAttacheEventTo.attachEvent)
    {
        var success = objElementToAttacheEventTo.attachEvent('on' + strEventTypeToAttach, objFunctionToCall);
    }
    
    // NS6+ or Mozilla.
    else if (objElementToAttacheEventTo.addEventListener)
    {
        objElementToAttacheEventTo.addEventListener(strEventTypeToAttach, objFunctionToCall, blnUseCapture);
        
        return true;
    }
    
    // Neither of above, attach old fashioned way.
    else
    {
        objElementToAttacheEventTo['on' + strEventTypeToAttach] = objFunctionToCall;
    }
   
}

/*

Description:
Remove event handler from element.

Supports:
IE, NS, Mozilla.

Example:

var objHyperlink = document.getElementById('myHyperlink');

removeEvent(objHyperlink, "click" , hyperlinkClickHandler);

*/

function removeEvent(objElementToRemoveEventFrom, strEventTypeToRemove, objFunctionToRemove)
{ 
    // IE.
    if (objElementToRemoveEventFrom.detachEvent)
    {
        objElementToRemoveEventFrom.detachEvent('on' + strEventTypeToRemove, objFunctionToRemove);
    }
    
    // NS6+ or Mozilla.
    else if (objElementToRemoveEventFrom.removeEventListener)
    {
        objElementToRemoveEventFrom.removeEventListener(strEventTypeToRemove, objFunctionToRemove);
        
        return true;
    }
    
    // Neither of above, detach old fashioned way.
    else
    {
        objElementToAttacheEventTo['on' + strEventTypeToRemove] = "";
    }
}


/*

Description:
Get event target element e.g. hyperlink.

Supports:
IE, NS, Mozilla.

Example:

myHyperlink.ommouseover = mouseover;

function mouseover(e)
{
    var targetHyperlink = getTarget(e, 'a');
}

*/
function getTarget(e, elementType)
{
    var target;
    
    // If IE.
    if (window.event && window.event.srcElement)
    {
        target = window.event.srcElement;
    }
    
    // Not IE.
    else if (e && e.target)
    {
        target = e.target;
    }
    
    // If no target found, return null.
    if (!target)
    {
        return null;
    }
    
    // If looking for a specific elmement up the chain.
    if (elementType.length != 0)
    {
        // Loop through elements to find required elementType e.g. 'a'.
        // Need to loop through elements to find target because event
        // will bubble up until it gets to body element.
        while (target != document.body && target.nodeName.toLowerCase() != elementType.toLowerCase())
        {
            target = target.parentNode;
        }
        
        // If elementType not found, return null.
        if (target.nodeName.toLowerCase() != elementType.toLowerCase())
        {
            return null
        }
    }
   
    // Return target element.
    return target;
}


/* Category menu code start */

/*

<ul class="categoryMenu">
    <li class=" categoryMenuParentNode categoryMenuLeafNode ">
        <a href="/index.aspx" nohref="">By Brand</a>
    </li>
    <li class=" categoryMenuParentNode ">
        <a href="/Cosmetics.aspx?">Cosmetics</a>
        <ul>
            <li>
                <a href="Cosmetics-Eyes.aspx">Eyes</a>
                <ul>
                    <li>
                        <a href="Cosmetics-Eyes-EyeshadowPowders.aspx">Eyeshadow Powders</a>
                        <ul>
                            <li class="categoryMenuLeafNode">
                                <a href="Cosmetics-Eyes-EyeshadowPowders-Left.aspx">Left</a>
                            </li>
                        </ul>
                    </li>
                    <li class="categoryMenuLeafNode">
                        <a href="Cosmetics-Eyes-EyeshadowPencils.aspx">Eyeshadow Pencils</a>
                    </li>
                    <li class="categoryMenuLeafNode">
                        <a href="/index.aspx" id="_ctl1__ctl0_28" name="28" nohref="">Eyeliner Pencils</a>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
</ul>


*/
function menuInit()
{
    if (!document.getElementById)
        return;

    if (!document.getElementsByTagName)
        return;   
      
    // Get all "UL" tags on in document.
    var ulAry = document.getElementsByTagName('ul');
    var liAry = null;
    var node = null;
    
    // Loop through UL tags.
    for (var u = 0; u < ulAry.length; u++)
    {
        if (ulAry[u].className.search(/\bcategoryMenu\b/) == -1)
            continue;
            
        // Get all "LI" tags in current "UL".            
        liAry = ulAry[u].getElementsByTagName('li');
        
        // Loop through "LI" tags.
        for (var l = 0; l < liAry.length; l++)
        {
            // Get refernce to "LI" object.
            node = liAry[l];
            
            // If tag is an "LI" with child "UL" tags.
            if ( (node.nodeName.toLowerCase() == 'li') && (node.getElementsByTagName('ul').length > 0) )
            {
                // Add event handlers to "LI".
                addEvent(node, 'mouseover', getMenuMouseOverFor(node), false);
                addEvent(node, 'mouseout', getMenuMouseOutFor(node), false);
                
                // Add Css Class to 'A'.
                node.getElementsByTagName('a')[0].className += ' subHeader ';
            }
        }
    }
}

function menuCleanUp()
{
    if (!document.getElementById)
        return;

    if (!document.getElementsByTagName)
        return;   
      
    // Get all "UL" tags on in document.
    var ulAry = document.getElementsByTagName('ul');
    var liAry = null;
    var node = null;
    
    // Loop through UL tags.
    for (var u = 0; u < ulAry.length; u++)
    {
        if (ulAry[u].className.search(/\bcategoryMenu\b/) == -1)
            continue;
            
        // Get all "LI" tags in current "UL".            
        liAry = ulAry[u].getElementsByTagName('li');
        
        // Loop through "LI" tags.
        for (var l = 0; l < liAry.length; l++)
        {
            // Get refernce to "LI" object.
            node = liAry[l];
            
            // If tag is an "LI" with child "UL" tags.
            if ( (node.nodeName.toLowerCase() == 'li') && (node.getElementsByTagName('ul').length > 0) )
            {
                // Remove event handlers from "LI".
                removeEvent(node, 'mouseover', getMenuMouseOverFor(node));
                removeEvent(node, 'mouseout', getMenuMouseOutFor(node));
            }
        }
    }
}

function getMenuMouseOverFor(node)
{
    return function(e) {menuOptionOver(e, node);};
}

function getMenuMouseOutFor(node)
{
    return function(e) {menuOptionOut(e, node);};
}

function menuOptionOver(e, targetElement)
{
    // Get event source object.
    var el = window.event ? targetElement : e ? e.currentTarget : null;
    var node = null;
    
    if (!el)
        return;
        
    clearTimeout(el.outTimeout);
        
    // Loop through all child nodes of source element looking for "UL" tags.
    for (var i = 0; i < el.childNodes.length; i++)
    {
        node = el.childNodes[i]; 
        
        if (node.nodeName.toLowerCase() == 'ul')
        {
            node.style.display = 'block';
        }
    }
}

function menuOptionOut(e, targetElement)
{
    // Get event source object.
    var el = window.event ? targetElement : e ? e.currentTarget : null;
    var node = null;
    
    if (!el)
        return;
        
    el.outTimeout = setTimeout(function() { menuOptionOut2(el); }, 100);
}

function menuOptionOut2(el)
{               
    // Loop through all child nodes of source element looking for "UL" tags.
    for (var i = 0; i < el.childNodes.length; i++)
    {
        node = el.childNodes[i]; 
        
        if (node.nodeName.toLowerCase() == 'ul')
        {
            node.style.display = 'none';
        }
    }
}

/* Category menu code end */



/* Navigation menu code start */


function navMenuInit()
{
    if (!document.getElementById) return;
    if (!document.getElementsByTagName) return;   
      
    // Get all "UL" tags on in document.
    var ulAry = document.getElementsByTagName('ul');
    var liAry = null;
    var node = null;
    
    // Loop through UL tags.
    for (var u = 0; u < ulAry.length; u++)
    {
        if (ulAry[u].className.search(/\bnavMenu\b/) == -1) continue;
            
        // Get all "LI" tags in current "UL".            
        liAry = ulAry[u].getElementsByTagName('li');
        
        // Loop through "LI" tags.
        for (var l = 0; l < liAry.length; l++)
        {
            // Get refernce to "LI" object.
            node = liAry[l];
            
            // If tag is an "LI" with child "UL" tags.
            if ( (node.nodeName.toLowerCase() == 'li') && (node.getElementsByTagName('ul').length > 0) )
            {
                // Add event handlers to "LI".
                addEvent(node, 'mouseover', getNavMenuMouseOverFor(node), false);
                addEvent(node, 'mouseout', getNavMenuMouseOutFor(node), false);
            }
        }
    }
}

function navMenuCleanUp()
{
    if (!document.getElementById) return;
    if (!document.getElementsByTagName) return;   
      
    // Get all "UL" tags on in document.
    var ulAry = document.getElementsByTagName('ul');
    var liAry = null;
    var node = null;
    
    // Loop through UL tags.
    for (var u = 0; u < ulAry.length; u++)
    {
        if (ulAry[u].className.search(/\bnavMenu\b/) == -1) continue;
            
        // Get all "LI" tags in current "UL".            
        liAry = ulAry[u].getElementsByTagName('li');
        
        // Loop through "LI" tags.
        for (var l = 0; l < liAry.length; l++)
        {
            // Get refernce to "LI" object.
            node = liAry[l];
            
            // If tag is an "LI" with child "UL" tags.
            if ( (node.nodeName.toLowerCase() == 'li') && (node.getElementsByTagName('ul').length > 0) )
            {
                // Remove event handlers from "LI".
                removeEvent(node, 'mouseover', getNavMenuMouseOverFor(node));
                removeEvent(node, 'mouseout', getNavMenuMouseOutFor(node));
            }
        }
    }
}

function getNavMenuMouseOverFor(node)
{
    return function(e) {navMenuOptionOver(e, node);};
}

function getNavMenuMouseOutFor(node)
{
    return function(e) {navMenuOptionOut(e, node);};
}

function navMenuOptionOver(e, targetElement)
{
    // Get event source object.
    var el = window.event ? targetElement : e ? e.currentTarget : null;
    var node = null;
    
    if (!el) return;
        
    clearTimeout(el.outTimeout);
        
    // Loop through all child nodes of source element looking for "UL" tags.
    for (var i = 0; i < el.childNodes.length; i++)
    {
        node = el.childNodes[i]; 
        
        if (node.nodeName.toLowerCase() == 'ul')
        {
            node.style.display = 'block';
        }
    }
}

function navMenuOptionOut(e, targetElement)
{
    // Get event source object.
    var el = window.event ? targetElement : e ? e.currentTarget : null;
    var node = null;
    
    if (!el) return;
        
    el.outTimeout = setTimeout(function() { navMenuOptionOut2(el); }, 200);
}

function navMenuOptionOut2(el)
{               
    // Loop through all child nodes of source element looking for "UL" tags.
    for (var i = 0; i < el.childNodes.length; i++)
    {
        node = el.childNodes[i]; 
        
        if (node.nodeName.toLowerCase() == 'ul')
        {
            node.style.display = 'none';
        }
    }
}

/* Navigation menu code end */