﻿Type.registerNamespace("Mcw.UserControls");

Mcw.UserControls.MenuItem = function(element) {
    Mcw.UserControls.MenuItem.initializeBase(this, [element]);
    
    this._menuControl = null;
    this._elLi = null;
    this._elChildMenu = null;
    this._parentMenuItem = null;
    this._arrChildMenuItems = null;
    this._timer = null;
    this._interval = 500;
    this._blIsActive = false;
}
Mcw.UserControls.MenuItem.prototype = {
    initialize: function() {
        Mcw.UserControls.MenuItem.callBaseMethod(this, 'initialize');
        
        // Initialize Array for collecting child MenuItems.
        this._arrChildMenuItems = new Array();
        
        // Retrieve reference to the parent Li element.
        if (this.get_element().parentNode)
            this._elLi = this.get_element().parentNode;
        
        if (this._elLi && this._elLi.getElementsByTagName("ul").length > 0) {
            // Retrieve reference to child menu Ul element.
            var arrULs = this._elLi.getElementsByTagName("ul");
            this._elChildMenu = arrULs[0];
			
			// ~~~~~~~~~ CUSTOM ADDITION : ADD EXTRA (EMPTY) LI AS LAST DROP DOWN ITEM FOR ROUNDED CORNERS ~~~~~~~~~ //
			var myLi = document.createElement("li");
			myLi.className = "myLi";
			this._elChildMenu.appendChild(myLi);
			
        }
		
    },
    dispose: function() {
        if (this.get_events())
            $clearHandlers(this.get_element());
        
        if (this._elChildMenu && $find(this._elChildMenu.id) && $find(this._elChildMenu.id).get_events())
            $clearHandlers(this._elChildMenu);
        
        Mcw.UserControls.MenuItem.callBaseMethod(this, 'dispose');
    },
    hideChildMenus: function() {
        // Hide possible active child menu's.    
        if (this._menuControl)
            this._menuControl.hideChildMenus(this);
    },
    addEventHandlers: function(_strDropDownBehavior) {     
        if (this._elChildMenu) {
            // Add the right behavior (onClick or onMouseOver)
            if (_strDropDownBehavior == "onClick")
                this.addClickHandlers();
            else
                this.addMouseOverHandlers();
        } else if (_strDropDownBehavior == "onMouseOver") {
            // Add Handler for MenuItem Href element to hide possible active child menus. 
            $addHandlers(this.get_element(), {
                mouseover: this.hideChildMenus
            }, this);
        }
    },
    addMouseOverHandlers: function() {
            // Add Handlers for MenuItem Href element. 
            $addHandlers(this.get_element(), {
                mouseover: this.showChildMenu,
                mouseout: this.startTimer
            }, this);
            
             // Add Handlers for child MenuItem Ul element. 
            $addHandlers(this._elChildMenu, {
                mouseover: this.showChildMenu, 
                mouseout: this.startTimer
            }, this);
    },
    addClickHandlers: function() {
        // Add Handlers for MenuItem Href element. 
            $addHandlers(this.get_element(), {
            click: this.showChildMenu
        }, this);
        
         // Add Handlers for child MenuItem Ul element. 
        $addHandlers(this._elChildMenu, {
            click: this.showChildMenu
            }, this);
    },
    findChildMenuItems: function() {
        if (this._elChildMenu) {
            // Get reference to all Href elements.
            var arrHrefs = this._elChildMenu.getElementsByTagName("a");
            var menuItem;
            
            if (arrHrefs) {
                for (var i = 0; i < arrHrefs.length; i++) {
                    if ($find(arrHrefs[i].id)) {
                        // Get reference to client side MenuItem instance.
                        menuItem = $find(arrHrefs[i].id);
                        
                        // Set parent-child relation between MenuItems.
                        menuItem._parentMenuItem = this;
                        
                        // Add the child MenuItem to the collection.
                        Array.add(this._arrChildMenuItems, menuItem);
                    }
                }
            }
        }
    },
    showChildMenu: function(sender) {
        // Stop previous Timer instance.
        if (this._timer)
            this.stopTimer();
    
        if (!this._blIsActive) {        
            // Hide possible active child menus.
            this.hideChildMenus();
        
            // Show child menu UL element.
            if (this._elChildMenu)
                this._elChildMenu.style.display = "block";
				// ~~~~~~~~~ CUSTOM ADDITION : MAKE WIDTH DROPDOWN SAME AS PARENT ~~~~~~~~~ //
				this._elChildMenu.style.width = this._elChildMenu.parentNode.offsetWidth - 10 + "px";
            
            // Set IsActive value.            
            this._blIsActive = true;
        }
    },
    hideChildMenu: function() {   
        // Show child menu UL element.
        if (this._elChildMenu)
            this._elChildMenu.style.display = "none";

        // Stop previous Timer instance.
        if (this._timer)
            this.stopTimer();
        
        // Set IsActive value. 
        this._blIsActive = false;
    },
    startTimer: function(sender) {   
        // Stop previous Timer instance.
        if (this._timer)
            this.stopTimer();
        
        // Start Timer instance and set EventHandler.
        this._timer = window.setInterval(Function.createDelegate(this, this.hideChildMenu), this._interval);
    },
    stopTimer: function() {   
        // Stop previous Timer instance if there is one active.
        if (this._timer) {
            window.clearInterval(this._timer);
            this._timer = null;
        }
    },
    
    // - Properties -
    set_MenuControl: function(menuControl) {
        this._menuControl = menuControl;
    }
}

Mcw.UserControls.MenuItem.registerClass("Mcw.UserControls.MenuItem", Sys.UI.Control);
