/**
 * TopNavDropDown
 * @param {string} parentButton = id of parent button that triggers this drop down
 * @param {string} thisName = base name of drop down container
 * @return (string) button1 = division id (i.e. '51375')
 * @return (string) button2 OPTIONAL = division id (i.e. '51375')
 * @return (string) button3 OPTIONAL = division id (i.e. '51375')
 * @return (string) button4 OPTIONAL = division id (i.e. '51375')
 * @return (string) button5 OPTIONAL = division id (i.e. '51375')
 * Can have a variable length of drop down buttons (i.e. button6)
 * @author Jermaine Jackson
 * @date 10/8/2009
 */
 
var TopNavDropDown = Class.create();
TopNavDropDown.prototype = {
    initialize: function(parentButton, thisName, button1, button2, button3, button4, button5) {
        this.contentID = '3531061';
        this.objName = thisName + 'Button';
        this.containerName = thisName + 'DropDownContainer';
        this.buttonPrefix = thisName;
        this.clearImage = '/assets/common/clear.gif';
        this.parentButton = $(parentButton);
        this.parentHighlightState = '';
        this.parentDimState = '';
        this.delayAmount = '500';
        this.timeoutID = null;
        this.buttons = Array(button1, button2, button3, button4);
        this.dropDownButtons = { 'buttons': [] };
        this.initDimHighlightStates();
        //this.highligtOrDimParentButton();
        this.initDropDownButtons();
    },
    initDropDownButtons: function() {
        for (var i = 0; i < this.buttons.length; i++) {
            if (typeof this.buttons[i] != 'undefined') {
                this.dropDownButtons.buttons[i] = {
                    'divisionID': this.buttons[i],
                    'cssClass': 'topnavSprite_division' + this.buttons[i] + '_notSelected'
                }
            }
        }
    },
    /**
    * initDimHighlightStates 
    * set parent button's highlight and dim classNames
    */
    initDimHighlightStates: function() {
        thisState = this.parentButton.className;
        if (thisState.indexOf('_selected') > 0) {
            this.parentHighlightState = thisState;
            this.parentDimState = thisState.replace('_selected', '_notSelected');
        }
        else {
            this.parentHighlightState = thisState.replace('_notSelected', '_selected');
            this.parentDimState = thisState;
        }
    },
    showDropDown: function() {
        var self = this;
        var xyPos = Position.cumulativeOffset(self.parentButton);
        var xPos = xyPos[0];
        var yPos = xyPos[1] + this.parentButton.offsetHeight;
		
		
        this.cancelTimer();
        if (this.container == null) {
            var j = 0;
            styleStr = 'left:' + (xPos)+ 'px;'
                        + 'top:' + yPos + 'px;'
                        + 'width:135px;'
                        + 'position:absolute;'
                        + 'display:none;'
                        + 'z-index:9001;'
                        + 'margin-left:0px;';
            var dropDownContainer = Builder.node(
                'div', { id: self.containerName, style: styleStr });
            for (j = 0; j < this.dropDownButtons.buttons.length; j++) {
                var thisDivisionID = this.dropDownButtons.buttons[j].divisionID;
                var thisButtonID = this.objName + '_division' + thisDivisionID;
                var thisCSSClass = this.dropDownButtons.buttons[j].cssClass;
                var newButton = Builder.node('div', { id: thisButtonID + '_container' });
				
                if (this.buttonPrefix == "women") {
					/*start dropdown linking for  maternity in womens dropdown */
					if (thisDivisionID == "5997") {
						var newLink = Builder.node(
              	    	'a', {
			            	href: '/browse/division.do?cid=' + thisDivisionID,
	                        onmouseover: this.objName + ".highlight('" + thisButtonID + "','" + thisCSSClass + "');",
               				onmouseout: this.objName + ".dim('" + thisButtonID + "','" + thisCSSClass + "');"
						});							
					} else{				
				
					/*start dropdown linking for  womens directory category.do */
					var newLink = Builder.node(
              	      	'a', {
               		         href: '/browse/category.do?cid=' + thisDivisionID,
                        	onmouseover: this.objName + ".highlight('" + thisButtonID + "','" + thisCSSClass + "');",
                        	onmouseout: this.objName + ".dim('" + thisButtonID + "','" + thisCSSClass + "');"
                  		});
					}
						
					
					/*end dropdown linking for  womens directory category.do */
				}
				else if (this.buttonPrefix == "jeans") {
				/*start dropdown linking for  gap jeans */
						//alert("gapJeans dropdown");
						
						if (thisDivisionID == "Jeans") {
								var newLink = Builder.node(
              	    			  	'a', {
               					        href: '/browse/division.do?cid=56999',
                        				onmouseover: this.objName + ".highlight('" + thisButtonID + "','" + thisCSSClass + "');",
                        				onmouseout: this.objName + ".dim('" + thisButtonID + "','" + thisCSSClass + "');"
                  						});
						}
						if (thisDivisionID == "StreamJeans") {
								var newLink = Builder.node(
              	      				'a', {
               		         		href: 'http://www.gap1969.com?utm_source=gap_btn&utm_medium=ext_link&utm_term=&utm_content=&utm_campaign=2010denim',
									target:'_blank',
                        			onmouseover: this.objName + ".highlight('" + thisButtonID + "','" + thisCSSClass + "');",
                        			onmouseout: this.objName + ".dim('" + thisButtonID + "','" + thisCSSClass + "');"
                  					});
						}
					
					
				}	
				/* end dropdown linking for  gap jeans */
				else {
					var newLink = Builder.node(
                   		'a', {
                      		href: '/browse/subDivision.do?cid=' + thisDivisionID,
                        	onmouseover: this.objName + ".highlight('" + thisButtonID + "','" + thisCSSClass + "');",
                        	onmouseout: this.objName + ".dim('" + thisButtonID + "','" + thisCSSClass + "');"
                    	});
					
				}
                var newDropDownImage = Builder.node(
                    'img', {
                        id: thisButtonID,
                        className: thisCSSClass,
                        src: self.clearImage
                    });
                newLink.appendChild(newDropDownImage);
                newButton.appendChild(newLink);
                dropDownContainer.appendChild(newButton);
            }
            $('divisionContainer').appendChild(dropDownContainer);
            this.container = $(this.containerName);
        }
    	if (this.buttonPrefix == "baby") {	
			this.container.style.left = (xPos - 12) + 'px';
	       	this.container.style.top = (yPos + 7) + 'px';
		}
    	else if (this.buttonPrefix == "jeans") {	
			this.container.style.left = (xPos - 5) + 'px';
	       	this.container.style.top = (yPos + 7) + 'px';
		}		
    	else if (this.buttonPrefix == "women") {	
			this.container.style.left = (xPos - 1) + 'px';
	       	this.container.style.top = (yPos + 7) + 'px';
		}				
    	else if (this.buttonPrefix == "kids") {	
			this.container.style.left = (xPos + 2) + 'px';
	       	this.container.style.top = (yPos + 7) + 'px';
		}						
		else {
			this.container.style.left = xPos + 'px';
	       	this.container.style.top = (yPos + 1) + 'px';
		}
		
        new Effect.Appear(self.container, { duration: .3 });
    },
    highligtOrDimParentButton: function() {
        var dimParent = true;
        var docTitle = document.title;
        /* separate checks for each drop down (i.e. baby, women, etc...)
        check if this is a baby/newborn page/category/giftguide page
        if Gift Guide Baby pages, dim parent button
        else if this is a Baby page, highlight parent
        else default to dim state
        */
        if (this.buttonPrefix == "baby") {
            if (docTitle.indexOf("Women's Clothes:") >= 0 || docTitle.indexOf('Maternity Clothes:') >= 0 ||
                docTitle.indexOf("Women's Plus Size Clothes:") >= 0 || docTitle.indexOf("Men's Clothes:") >= 0 ||
                docTitle.indexOf("Girl's Clothes:") >= 0 || docTitle.indexOf("Boy's Clothes:") >= 0
            ) {
                this.parentButton.className = this.parentDimState;
            }
            else if (docTitle.indexOf('Baby Girl') >= 0 || docTitle.indexOf('Baby Boy') >= 0 || docTitle.indexOf('Newborn') >= 0 || gidLib.getQuerystringParam('cid') == '51350') {
                this.parentButton.className = this.parentHighlightState;
                //remove the built in onmouseout/over handlers since we are on a baby page
            }
            else {
                this.parentButton.className = this.parentDimState;
            }
        }
        else if (this.buttonPrefix == "women") {
			if (docTitle.indexOf("Maternity Clothes:") >= 0){
	        	this.parentButton.className = this.parentHighlightState;			
			}
			else if (typeof s != "undefined") {
            	if (s.channel) {
                	thisChannel = s.channel;
                    if (thisChannel.indexOf(this.buttonPrefix) >= 0) {
                        this.parentButton.className = this.parentDimState;
                    }
                }
            }
        }
    },
		
    highlight: function(thisButton, thisClassName) {
        this.cancelTimer();
        var newClassName = thisClassName.replace('_notSelected', '_selected');
		var newParentClassName = this.parentButton.className.replace('_notSelected', '_over');
        $(thisButton).className = newClassName;
        //this.highligtOrDimParentButton();
		
		this.parentButton.className = newParentClassName;
    },
    //called from drop down button 
    dim: function(thisButton, thisClassName) {
        this.setTimer();
		{
	        var newClassName = thisClassName.replace('_selected', '_notSelected');
			var newParentClassName = this.parentButton.className.replace('_over', '_notSelected');
    	    $(thisButton).className = newClassName;
			this.parentButton.className = newParentClassName;
		}
    },
    hideDropDown: function() {
        var self = this;
        //this.highligtOrDimParentButton();
        new Effect.Fade(self.container, { duration: .3 });
        this.cancelTimer();
    },
    setTimer: function() {
        var self = this;
        this.timeoutID = setTimeout(
            function() {
                self.hideDropDown();
            },
            self.delayAmount
        );
    },
    cancelTimer: function() {
        clearTimeout(this.timeoutID);
    }
};
var topNav = {
	divisionOver : function(thisButtonId, isSelected){
		var thisButton = $(thisButtonId);
		var thisClass = thisButton.className;
		//Check to see if division is Maternity, if so set Women NAV image to Over state
		if(thisClass.indexOf("_selected") < 0 ){
			thisButton.className = "topnavSprite_" + thisButtonId + "_over"; 
		}
		else{
			thisButton.parentNode.setAttribute("onmouseout", "topNav.divisionOut('" + thisButtonId + "', true);");
		}
	},
	divisionOut : function(thisButtonId, isSelected){
		 if(!isSelected){
			$(thisButtonId).className = "topnavSprite_" + thisButtonId + "_notSelected"; 
		}
	}
};
// kids/baby fix for iPad
var iPadForMenu = false; //assume false
var thisUserMenuUserAgent = navigator.userAgent;
if (thisUserMenuUserAgent.indexOf("iPad") != -1) {
	iPadForMenu = true;
} else {
	iPadForMenu = false;
}