// README
//
// There are two steps to adding a property:
//
// 1. Create a member variable to store your property
// 2. Add the get_ and set_ accessors for your property
//
// Remember that both are case sensitive!


/// <reference name="MicrosoftAjaxTimer.debug.js" />
/// <reference name="MicrosoftAjaxWebForms.debug.js" />
///<reference name="AjaxControlToolkit.Animation.Animations.js" assembly="AjaxControlToolkit" />
///<reference name="AjaxControlToolkit.Animation.AnimationBehaviour.js" assembly="AjaxControlToolkit" />



Type.registerNamespace('Liquid.LiquidWebControls');

Liquid.LiquidWebControls.LiquidMenu = function(element) {
    Liquid.LiquidWebControls.LiquidMenu.initializeBase(this, [element]);

    // TODO : (Step 1) Add your property variables here
    this._skin = null;    
    this._isContext = null;  
    this._contextElementID = null;    
    this._onContextElementClick$delegate = Function.createDelegate(this, this._onContextElementClick);
    this._onMouseUpContext$delegate = Function.createDelegate(this, this._onMouseUpContext);
    this._onDocumentMouseDown$delegate = Function.createDelegate(this, this._onDocumentMouseDown);
    this._onMenuMouseDown$delegate = Function.createDelegate(this, this._onMenuMouseDown);
};
Liquid.LiquidWebControls.LiquidMenu.prototype = {

    add_contextElementClick : function(handler) {
        this.get_events().addHandler("contextElementClick", handler);
    },
    remove_contextElementClick : function(handler) {
        this.get_events().removeHandler("contextElementClick", handler);
    },
    _onContextElementClick : function(evt) {   
        // if this is not a non IE raised contextmenu 
                  
            this.showContextMenu(evt.rawEvent);
            var eh = this.get_events().getHandler("contextElementClick");
            if (eh) {
                eh(evt, Sys.EventArgs.Empty);
            }
        evt.preventDefault();
        evt.stopPropagation();
        return false;        
    },   
    
    _onMouseUpContext : function(evt) {   
        // if this is not a non IE raised contextmenu 
        //if (!(evt.type=='contextmenu'&&!this.hasContext())) {             
            this.showContextMenu(evt.rawEvent);
            var eh = this.get_events().getHandler("contextElementClick");
            if (eh) {
                eh(evt, Sys.EventArgs.Empty);
            }
        //}
        evt.preventDefault();
        evt.stopPropagation();
        return false;        
    },    
    
    _onDocumentMouseDown : function(evt) {
        this.hideContextmenu(evt);
        evt.preventDefault();
        evt.stopPropagation();
    }, 
    
    _onMenuMouseDown : function(evt) {
        evt.preventDefault();
        evt.stopPropagation();
        return false;
    }, 
    
    get_events : function() {  
         if(!this._events) {  
                this._events = new Sys.EventHandlerList();  
         }     
         return this._events;  
    },  
     
    initialize : function() {
        Liquid.LiquidWebControls.LiquidMenu.callBaseMethod(this, 'initialize');

        
        // TODO: Add your initalization code here 
        if (this._isContext) {
            if (this._contextElementID!==null&&this._contextElementID.length > 0) {
                if (!this.hasContext()) {
                    $addHandler($get(this._contextElementID),"mouseup",this._onMouseUpContext$delegate);                    
                } 
                $addHandler($get(this._contextElementID),"contextmenu",this._onContextElementClick$delegate);              
                $addHandler(this.get_element(),"mousedown",this._onMenuMouseDown$delegate);
                $addHandler(document,"mousedown",this._onDocumentMouseDown$delegate);
            }            
        }
    },

    dispose : function() {
        // TODO: Add your cleanup code here
        $clearHandlers(this.get_element());        
        Liquid.LiquidWebControls.LiquidMenu.callBaseMethod(this, 'dispose');
    },    
    
    ///Functions
   
    showContextMenu : function(evt) {                 
        var mouseX;
        var mouseY;
        
        if (this.hasContext) { // grab the x-y pos.s if browser is IE
            mouseX = evt.clientX + document.body.scrollLeft;
            mouseY = evt.clientY + document.body.scrollTop;
        } else {  // grab the x-y pos.s if browser is NS
            mouseX = e.pageX;
            mouseY = e.pageY;
        } 
        //move the menu away from the pointer so that mouse over does not fire.   
        
        this.get_element().style.display = 'block';
        this.menuItemContainer().get_element().style.display = 'block';         
           
        
        this.get_element().style.overflow = 'visible';
        this.get_element().style.zIndex = '1000';      
        this.menuItemContainer().equalizeWidths(); 
        
        var clientBounds = $common.getClientBounds();
        var menuSize = $common.getSize(this.get_element());
        //bottom edge detection
        if (clientBounds.height-mouseY < menuSize.width) {
            mouseY = mouseY - menuSize.height - 5;  
        } else {
            mouseY+=5;  
        }
        //right edge detection
        if (clientBounds.width-mouseX < menuSize.height) {
            mouseX = mouseX - menuSize.width - 5;  
        } else {
            mouseY+=5;  
        }
        //left edge detection
        if (mouseX < 0) {mouseX = 5;}
        //top edge detection
        if (mouseY < 0) {mouseY = 5;}
        $common.setLocation(this.get_element(),new Sys.UI.Point(mouseX,mouseY));               
    } ,    
    
    hideContextmenu : function(evt) {
        if (this.menuItemContainer()) {
            $common.setVisible(this.menuItemContainer().get_element(), false);
            this.menuItemContainer().get_element().style.display = 'none';
        }
    },
    
    hasContext : function() {
        var has = true;
        if (Sys.Browser.agent == Sys.Browser.Opera) {
           has = false;
        }   
        return has; 
    },
    //returns the first child of the menu which is the root Ul contained in a menuItem Container.
    menuItemContainer : function() {
        return $commonLiquid.getChildObjectByTagName(this.get_element(),'UL');
    },  
    
    removeMenuItemsCssClass : function(CssClass) {        
        var mic = this.menuItemContainer();
        if (mic) {mic.removeMenuItemsCssClass(CssClass);}    
    },   

    // TODO: (Step 2) Add your property accessors here
    get_isContext : function() {
        return this._isContext;
    },
    set_isContext : function(value) {
        this._isContext = value;
    },    
    
    get_skin : function() {
        return this._skin;
    },
    set_skin : function(value) {
        this._skin = value;
    }, 
    
    get_orientation : function() {
        return this._orientation;
    },
    set_orientation : function(value) {
        this._orientation = value;
    },
    
    get_contextElementID : function() {
        return this._contextElementID;
    },
    set_contextElementID : function(value) {
        this._contextElementID = value;
    }
};
Liquid.LiquidWebControls.LiquidMenu.registerClass("Liquid.LiquidWebControls.LiquidMenu", AjaxControlToolkit.ControlBase);

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////

Liquid.LiquidWebControls.LiquidMenuItem = function(element) {
    Liquid.LiquidWebControls.LiquidMenuItem.initializeBase(this, [element]);

    // TODO : (Step 1) Add your property variables here 
    this._active = null;
    this._text = null;
    this._imageUrl = null;
    this._isSeperator = null;
    this._linkId = null;
    this._imageId = null;
    this._drawerPulled = false;
    this._drawerId = null;   
    this._drawerLeft = 0;
    this._drawerTop = 0;  
    this._expanded = false;
    this._subMenuId = null;   
    this._parentMenuId = null;
    this._level = null;
    this._autoPostBackId = null;
    this._target = null;
    this._navigateUrl = null;
    this._postBackOnMenuItemClick = null;
    this._expandDirection = null;
    this._orientation = null;
    this._objAnimation = null;
    this._animation = null;    
    this._animationFramesPerSecond = null;
    this._animationDuration = null;
    this._animationDelay = null;
    this._onMouseOver$delegate = Function.createDelegate(this, this._onMouseOver);
    this._onMouseOut$delegate = Function.createDelegate(this, this._onMouseOut);
    this._onMenuItemClick$delegate = Function.createDelegate(this, this._onMenuItemClick);
};

Liquid.LiquidWebControls.LiquidMenuItem.prototype = {    
   
   
    remove_menuItemClick : function(handler) {
        this.get_events().removeHandler("menuItemClick", handler);
    },
    add_menuItemClick : function(handler) {
        this.get_events().addHandler("menuItemClick", handler);
    },
    raiseMenuItemClick : function(e) {    
        var eh = this.get_events().getHandler("menuItemClick");
        if (eh) {
            eh(e, Sys.EventArgs.Empty);
        }
        if (this._autoPostBackId && this._postBackOnMenuItemClick) {
            __doPostBack(this._autoPostBackId, "menuItemClick:");
        }
        //Stop the event from bubbling out of the menu item and 
        //surpress the default post back behaviour if _postBackOnMenuItemClick is False   
        e.stopPropagation();
        if (!this._postBackOnMenuItemClick) {
            e.preventDefault();
        }
    },
    
    get_events : function() {  
         if(!this._events) {  
                this._events = new Sys.EventHandlerList();  
         }     
         return this._events;  
     },  

    
    initialize : function() {
        Liquid.LiquidWebControls.LiquidMenuItem.callBaseMethod(this, 'initialize');

        if (this.hasDrawer()) {
            this.drawer().style.left = this.get_element().clientWidth;
        }
        
        // TODO: Add your initalization code here
        if (!this.get_isSeperator()) {
            $addHandlers(this.get_element(), {            
                mouseover:this._onMouseOver$delegate,  
                mouseout:this._onMouseOut$delegate,
                click:this._onMenuItemClick$delegate
            });
        }
    },

    dispose : function() {
        // TODO: Add your cleanup code here
        $clearHandlers(this.get_element());       
        Liquid.LiquidWebControls.LiquidMenuItem.callBaseMethod(this, 'dispose');
    },
    
    /* Event delegates */
    _onMouseOver : function(e) {   
        if (!this._objAnimation||!this._objAnimation.isPlaying) {            
            var to = $commonLiquid.getParentObjectByTagName(e.rawEvent.target||e.rawEvent.srcElement,'LI');            
            var from = $commonLiquid.getParentObjectByTagName(e.rawEvent.relatedTarget||e.rawEvent.fromElement,'LI');
            var li = this.get_element();
            //if there is no from item or the from and to are different and the from is not animating
            if (!from||(from.get_element().id!=to.get_element().id&&(!from._objAnimation||!from._objAnimation.isPlaying))) {	                  
                //FromEmptyElement OR FromOutsideMenu OR FromIsParentThis OR FromIsASiblingOfThis
                if (!from||!this.isMenuItem(from.get_element())||this.isParent(from.get_element())||this.isSibling(from.get_element()))  {
                    li.style.zIndex='1000';  
                    Sys.UI.DomElement.addCssClass(li, "expanded");                 
                    if (this.hasDrawer()&&!this._expanded) {                           
                        this._expanded = true;  
                        Sys.UI.DomElement.addCssClass(this.link(), "expandedLink");                        
                        this.pullDrawer();    
                    }   
                }	
            }  
        }     	                     
    },
    
    _onMouseOut : function(e) { 
        if (!this._objAnimation||!this._objAnimation.isPlaying) {  
            var from = $commonLiquid.getParentObjectByTagName(e.rawEvent.target||e.rawEvent.srcElement,'LI');        
            var to = $commonLiquid.getParentObjectByTagName(e.rawEvent.relatedTarget || e.rawEvent.toElement,'LI'); 
            var li = this.get_element();
            if (!to||from.get_element().id!=to.get_element().id&&to.get_element().id!=li.id) {              
                //ToEmptyElement OR ToOutsideMenu OR ToIsAParentOfThisElement OR ToIsASiblingOfThis
                if (!to||!this.isMenuItem(to.get_element())||this.isParent(to.get_element())||this.isSibling(to.get_element())) {                         
                    li.style.zIndex='0'; 
                    Sys.UI.DomElement.removeCssClass(li, "expanded");               
                    if (this.hasDrawer()&&this._expanded) {                       
                        this._expanded = false;    
                        Sys.UI.DomElement.removeCssClass(this.link(), "expandedLink");    
                        this.pushDrawer();   
                    }                             
                }    
            }  
        }     
    },   
    
    _onMenuItemClick : function(e) {
        $find(this._parentMenuId).removeMenuItemsCssClass("active");        
        this.set_active(true); 
        this.raiseMenuItemClick(e);
    }, 
    
    /* Functions */
    
    //return the related list item from a given element  
    
    
    isChild : function(e) {
        //Is the element e a child of this element
        return (e&&$commonLiquid.startsWith(e.id,this.get_element().id)&&this.get_element().id!=e.id);   
    },
    isParent : function(e) {
        //Is the element e a parent of this element
        return (e&&$commonLiquid.startsWith(this.get_element().id,e.id)&&this.get_element().id!=e.id);
    },
    isSibling : function(e) {
        //Is the element e a sibling of this element
        return (e&&this.isMenuItem(e)&&!this.isChild(e)&&!this.isParent(e));
    },
    isMenuItem : function(e) {
        //Is the element e a menu item
        return (e&&$commonLiquid.startsWith(e.id, this._parentMenuId));
    },
    
    hasDrawer : function() { 
        if (this._drawerId === null) {   
            return false;
        } else {   
            if (this._drawerId.length > 0) {
                return true;
            } else {
                return false;
            }
        } 
    },

    drawer : function() {      
        return $get(this._drawerId, this.get_element());
    }, 
    
    link : function () {
        return $get(this._linkId, this.get_element());
    } ,
    
    subMenu : function() {
        return $get(this._subMenuId, this.get_element());
    } ,
    
    image : function() {
        return $get(this._imageId, this.get_element());
    },
    
    pullDrawer : function(objItem) { 
        var sm = this.subMenu(); 
        var d = this.drawer();
        d.style.display = 'block';
        sm.style.display = 'block';              
        if (!this._drawerPulled) { 
            $find(this._subMenuId).equalizeWidths();           
            var clientBounds = $common.getClientBounds();
            var itemSize = $common.getSize(this.get_element());
            var menuBounds = $common.getBounds(this.subMenu());  
            var factor;                
            switch(parseInt(this._expandDirection,10)) {            
                case Liquid.LiquidWebControls.ExpandDirection.Right:
                    factor = 1;
                    this._drawerLeft = $commonLiquid.getWidth(this.get_element())-$commonLiquid.getWidth(this.get_element(),true);
                     //reverse the horizontal pull if we cross the right edge of the screen
                    if (menuBounds.x + this._drawerLeft + menuBounds.width > clientBounds.width) {
                        this._drawerLeft = -1*$common.getSize(this.drawer()).width;
                        factor = -1;      
                    }
                    this.horizontalPull(factor);
                    break;
                case Liquid.LiquidWebControls.ExpandDirection.Left:                
                    factor = -1;
                    this._drawerLeft = -1*$common.getSize(this.drawer()).width;
                    //reverse the horizontal pull if we cross the left edge of the screen
                    if (menuBounds.x + this._drawerLeft - menuBounds.width < 0) {
                        this._drawerLeft =$commonLiquid.getWidth(this.get_element())-$commonLiquid.getWidth(this.get_element(),true);
                        factor = 1;      
                    }
                    this.horizontalPull(factor);
                    break;
                case Liquid.LiquidWebControls.ExpandDirection.Up:
                    factor = 1;
                    this._drawerTop = $commonLiquid.getHeight(this.subMenu(),true)-$common.getSize(this.drawer()).height; 
                    //reverse the horizontal pull if we cross the left edge of the screen
                    if (menuBounds.y + this._drawerTop - menuBounds.height < 0) {
                        this._drawerTop =$commonLiquid.getHeight(this.get_element());
                        factor = -1;      
                    }    
                    this.verticalPull(factor);
                    break;                
                case Liquid.LiquidWebControls.ExpandDirection.Down:                
                    factor = -1;
                    this._drawerTop = $commonLiquid.getHeight(this.get_element());
                    //reverse the horizontal pull if we cross the left edge of the screen
                    if (menuBounds.y + this._drawerTop + menuBounds.height > clientBounds.height) {
                        this._drawerTop = $commonLiquid.getHeight(this.subMenu(),true)-$common.getSize(this.drawer()).height; 
                        factor = 1;      
                    }
                    this.verticalPull(factor);
                    break;                 
            }            
            this._drawerPulled = true;  
        }           
    },

    iifNaN : function (test,retVal) {
        if (isNaN(test)) {return retVal;}
        else {return test;} 
    },
    
    horizontalPull : function(factor) {
        var d = this.drawer();
        var sm = this.subMenu(); 
        d.style.top = '0px';                   
        switch (parseInt(this._animation,10)) {
            case Liquid.LiquidWebControls.Animation.None:                                                   
                d.style.left = '';
                d.style.left = this._drawerLeft.toString() + 'px';
                d.style.overflow = 'visible';               
                sm.style.zIndex = '1' + this._level.toString();  
                break;
            case Liquid.LiquidWebControls.Animation.Slide: 
                d.style.overflow = 'hidden';
                d.style.left = this._drawerLeft.toString() + 'px';
                sm.style.left = (-1*factor*$common.getSize(d).width).toString() + 'px';                
                if (this._objAnimation) {
                    this._objAnimation.dispose();
                }
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                //new AjaxControlToolkit.Animation.StyleAction(target, duration, fps, attribute, value);                
                this._objAnimation.add(new AjaxControlToolkit.Animation.MoveAnimation(sm,this._animationDuration,this._animationFramesPerSecond,factor*$common.getSize(d).width,0,true,'px'));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(sm, 0.01, null, 'zIndex', '1' + this._level.toString())); 
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'overflow', 'visible'));                                
                this._objAnimation.play();               
                break;  
            case Liquid.LiquidWebControls.Animation.Fade: 
                d.style.left = '';
                d.style.left = this._drawerLeft.toString() + 'px';
                d.style.overflow = 'visible'; 
                $common.setElementOpacity(d,0); 
                //sm.style.opacity = 0;                
                d.style.zIndex = '1' + this._level.toString();  
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                this._objAnimation.add(new AjaxControlToolkit.Animation.FadeInAnimation(d,this._animationDuration,this._animationFramesPerSecond,0, 1, true));
                this._objAnimation.play(); 
                break;
        }    
    } ,
    
  
    verticalPull : function(factor) {
        var d = this.drawer();
        var sm = this.subMenu();       
        d.style.left = '0px';
         
        switch (parseInt(this._animation,10)) {
            case Liquid.LiquidWebControls.Animation.None:
                d.style.overflow = 'visible';                
                d.style.top = this._drawerTop.toString() + 'px'; 
                sm.style.zIndex = '1' + this._level.toString();       
                break;
            case Liquid.LiquidWebControls.Animation.Slide:
                d.style.overflow = 'hidden';
                d.style.top = this._drawerTop.toString() + 'px'; 
                sm.style.top = (factor*$common.getSize(d).height).toString() + 'px';               
                if (this._objAnimation) {
                    this._objAnimation.dispose();
                }
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();                
                this._objAnimation.add(new AjaxControlToolkit.Animation.MoveAnimation(sm,this._animationDuration,this._animationFramesPerSecond,0,-1*factor*$common.getSize(d).height,true,'px'));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(sm, 0.01, null, 'zIndex', '1' + this._level.toString()));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'overflow', 'visible'));                  
                this._objAnimation.play();               
                break;
            case Liquid.LiquidWebControls.Animation.Fade: 
                d.style.overflow = 'visible';                
                d.style.top = this._drawerTop.toString() + 'px';
                $common.setElementOpacity(d,0);
                //sm.style.opacity = 0;     
                d.style.zIndex = '1' + this._level.toString();
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                this._objAnimation.add(new AjaxControlToolkit.Animation.FadeInAnimation(d,this._animationDuration,this._animationFramesPerSecond, 0, 1, true));
                this._objAnimation.play(); 
                break;
        }               
    },   
    
    pushDrawer : function(objItem) { 
        if (this._drawerPulled) {           
            switch(parseInt(this._expandDirection,10)) {
                case Liquid.LiquidWebControls.ExpandDirection.Left:
                    this.horizontalPush(1);
                    break;
                case Liquid.LiquidWebControls.ExpandDirection.Right:  
                    this.horizontalPush(-1);
                    break;
                case Liquid.LiquidWebControls.ExpandDirection.Up:
                    this.verticalPush(1);
                    break;
                case Liquid.LiquidWebControls.ExpandDirection.Down:
                    this.verticalPush(-1);                
                    break;  
            }                           
            //this.subMenu().style.display = 'none';  
            this._drawerPulled = false;
        }            
    },    
    
    
    horizontalPush : function(factor) {
        var d = this.drawer();
        var sm = this.subMenu();
        switch (parseInt(this._animation,10)) {   
            case Liquid.LiquidWebControls.Animation.None:
                sm.style.zIndex = '0';
                d.style.left = '0px';
                d.style.overflow = 'hidden';                 
                d.style.display='none'; 
                break;
            case Liquid.LiquidWebControls.Animation.Slide:
                d.style.overflow = 'hidden';
                if (this._objAnimation) {
                    this._objAnimation.dispose();
                }
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                //new AjaxControlToolkit.Animation.StyleAction(target, duration, fps, attribute, value); 
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(sm, 0.01, null, 'zIndex', '0'));              
                this._objAnimation.add(new AjaxControlToolkit.Animation.MoveAnimation(sm,this._animationDuration,this._animationFramesPerSecond,factor*$common.getSize(d).width,0,true,'px'));                                
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'display', 'none')); 
                this._objAnimation.play();               
                break;
            case Liquid.LiquidWebControls.Animation.Fade: 
                sm.style.zIndex = '0';
                d.style.overflow = 'hidden';
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                this._objAnimation.add(new AjaxControlToolkit.Animation.FadeOutAnimation(d,this._animationDuration,this._animationFramesPerSecond,0, 1, true));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'display', 'none'));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'left', '0px'));
                this._objAnimation.play();  
                break;
        }      
    },     
    
    verticalPush : function(factor) {
        var d = this.drawer();
        var sm = this.subMenu(); 
        switch (parseInt(this._animation,10)) {
            case Liquid.LiquidWebControls.Animation.None:
                sm.style.zIndex = '0';
                d.style.top = '0px';
                d.style.overflow = 'hidden'; 
                d.style.display='none'; 
                break;
            case Liquid.LiquidWebControls.Animation.Slide:
                d.style.overflow = 'hidden';            
                if (this._objAnimation) {
                    this._objAnimation.dispose();
                }
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                //new AjaxControlToolkit.Animation.StyleAction(target, duration, fps, attribute, value);  
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(sm, 0.01, null, 'zIndex', '0'));  
                this._objAnimation.add(new AjaxControlToolkit.Animation.MoveAnimation(sm,this._animationDuration,this._animationFramesPerSecond,0,factor*$common.getSize(d).height,true,'px'));                                
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'display', 'none')); 
                this._objAnimation.play();               
                break;  
            case Liquid.LiquidWebControls.Animation.Fade: 
                sm.style.zIndex = '0';
                d.style.overflow = 'hidden';
                this._objAnimation = new AjaxControlToolkit.Animation.SequenceAnimation();
                this._objAnimation.add(new AjaxControlToolkit.Animation.FadeOutAnimation(d,this._animationDuration,this._animationFramesPerSecond,0, 1, true));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'display', 'none'));
                this._objAnimation.add(new AjaxControlToolkit.Animation.StyleAction(d, 0.01, null, 'top', '0px'));
                this._objAnimation.play();   
                break;
        }        
    },  
    
    //retrieve the submenu if it exists and call its removeMenuItemsCssClass method
    //part of the series of functions that insure that only 1 menu item ever 
    //has the active class set to show the "active" menu item.
    removeMenuItemsCssClass : function(CssClass) {
        Sys.UI.DomElement.removeCssClass(this.get_element(), CssClass);
        var sm = $find(this._subMenuId);
        if (sm) {sm.removeMenuItemsCssClass(CssClass);}    
    },
  
    // TODO: (Step 2) Add your property accessors here
    
    get_active : function() {
        return this._active;
    },
    set_active : function(value) {
        this._active = value;
        var hasClass = Sys.UI.DomElement.containsCssClass(this.get_element(),"active"); 
        if (value && !hasClass) {
            Sys.UI.DomElement.addCssClass(this.get_element(),"active");
        }
        else if(!value && hasClass) {
            this.removeMenuItemsCssClass("active");
        }
        this.raisePropertyChanged('Active');
    },   
    
    get_autoPostBackId : function() {
        return this._autoPostBackId;
    },
    set_autoPostBackId : function(value) {
        this._autoPostBackId = value;
    },   
    
    get_text : function() {
        return this._text;
    },
    set_text : function(value) {
        if (this._text != value) {
            this._text = value;
            this.raisePropertyChanged("text");
        }
    },
    
    get_postBackOnMenuItemClick : function() {
        return this._postBackOnMenuItemClick;
    },
    set_postBackOnMenuItemClick : function(value) {        
        if (this._postBackOnMenuItemClick != value) {
            this._postBackOnMenuItemClick = value;
            this.raisePropertyChanged("postBackOnMenuItemClick");
        }
    },   
    
    get_expandDirection : function() {
        return this._expandDirection;
    },
    set_expandDirection : function(value) {        
        if (this._expandDirection != value) {
            this._expandDirection = value;
            this.raisePropertyChanged("expandDirection");
        }
    },
    
    get_orientation : function() {
        return this._orientation;
    },
    set_orientation : function(value) {        
        if (this._orientation != value) {
            this._orientation = value;
            this.raisePropertyChanged("orientation");
        }
    },
    
    get_target : function() {
        return this._target;
    },
    set_target : function(value) {
        if (this._target != value) {
            this._target = value;
            this.raisePropertyChanged("target");
        }
    },
    
    get_navigateUrl : function() {
        return this._navigateUrl;
    },
    set_navigateUrl : function(value) {
        if (this._navigateUrl != value) {
            this._navigateUrl = value;
            this.raisePropertyChanged("navigateUrl");
        }
    },
    
    get_imageUrl : function() {
        return this._imageUrl;
    },
    set_imageUrl : function(value) {
        if (this._imageUrl != value) {
            this._imageUrl = value;
            this.raisePropertyChanged("imageUrl");
        }
    },
    
    get_isSeperator : function() {
        return this._isSeperator;
    },
    set_isSeperator : function(value) {
        this._isSeperator = value;
    },
    
    get_linkId : function() {
        return this._linkId;
    },
    set_linkId : function(value) {
        this._linkId = value;
    },
    
    get_imageId : function() {
        return this._imageId;
    },
    set_imageId : function(value) {
        this._imageId = value;
    },
    
    get_drawerId : function() {
        return this._drawerId;
    },
    set_drawerId : function(value) {
        this._drawerId = value;
    },
    
    get_subMenuId : function() {
        return this._subMenuId;
    },
    set_subMenuId : function(value) {
        this._subMenuId = value;
    } ,
    
    get_parentMenuId : function() {
        return this._parentMenuId;
    },
    set_parentMenuId : function(value) {
        this._parentMenuId = value;
    },
    
    get_level : function() {
        return this._level;
    },
    set_level : function(value) {
        this._level = value;
    },
    
    get_animation : function() {
        return this._animation;
    },
    set_animation : function(value) {
        this._animation = value;
    },
    
    get_animationFramesPerSecond : function() {
        return this._animationFramesPerSecond;
    },
    set_animationFramesPerSecond : function(value) {
        this._animationFramesPerSecond = value;
    },
    
    get_animationDuration : function() {
        return this._animationDuration;
    },
    set_animationDuration : function(value) {
        this._animationDuration = value;
    },
    
    get_animationDelay : function() {
        return this._animationDelay;
    },
    set_animationDelay : function(value) {
        this._animationDelay = value;
    }                                                          
};
Liquid.LiquidWebControls.LiquidMenuItem.registerClass("Liquid.LiquidWebControls.LiquidMenuItem", Sys.UI.Control);

///////////////////////////////////////////////////////////////////////////////////////////////////////////////



Liquid.LiquidWebControls.LiquidMenuItemContainer= function(element) {
    Liquid.LiquidWebControls.LiquidMenuItemContainer.initializeBase(this, [element]);    
    this._level = null;
    this._orientation = null;
    this._count = null
};

Liquid.LiquidWebControls.LiquidMenuItemContainer.prototype= {
    
    initialize : function() {
        Liquid.LiquidWebControls.LiquidMenuItemContainer.callBaseMethod(this, 'initialize'); 
        //equalise the widths of the top level menu Items               
        if (this._level===0&&!$commonLiquid.getParentObjectByTagName(this.get_element(),'DIV').get_isContext()) {             
            this.equalizeWidths(); 
        }        
    },
    
    equalizeWidths : function() {
        var ul = this.get_element();
        var d = this.get_element().parentNode;
        var w = 0;
        var h = 0;
        var ulContentSize = $common.getContentSize(ul);
        var liContentSize = {width:0,height:0};
        var itemSize; 
        var li;
        var liChild; 
        var i;  
        var j;     
        switch (parseInt(this._orientation,10)) {
            case Liquid.LiquidWebControls.Orientation.Horizontal:
                $common.setVisible(this.get_element(),true);
                this.get_element().style.display='block'; 
                for (i=0; i<ul.childNodes.length;i++) {
                    li = ul.childNodes[i];            
                    if (li.tagName=='LI') {
                        li.style.clear = 'none';
                        this.makeListItemVisible(li);
                        this.setListItemSize(li,this.getListItemSize(li).size);                        
                        itemSize = $common.getSize(li);                             
                        w += itemSize.width; 
                        if (itemSize.height>h){h=itemSize.height;}               
                    }                
                }
                //if the width of the menu has been set and it is greater than the total width of its menu items
                if (ul.style.width.length > 0 && ulContentSize.width > w) {
                    //share out the remaining width between the list items                   
                    var remainder =  (ulContentSize.width - w) % this.count();
                    var adjustment = (ulContentSize.width - w - remainder)/this.count();  
                    w = ulContentSize.width;                
                    for (i=0; i<ul.childNodes.length;i++) {
                        li = ul.childNodes[i];            
                        if (li.tagName=='LI') {   
                            itemSize = this.getListItemSize(li).size;
                            itemSize.width += adjustment;
                            if (i == (ul.childNodes.length - 1)) {itemSize.width += remainder;}
                            this.setListItemSize(li,itemSize);                                                          
                        }                
                    }
                }
                itemSize = {height:h,width:w};                
                $common.setContentSize(ul,itemSize);                
                $common.setSize(d,$common.getSize(ul));                                          
                break;
            case Liquid.LiquidWebControls.Orientation.Vertical: 
                //find the width of the widest list item
                liContentSize.width = ulContentSize.width;
                var adjustedForBorderBox = false;
                for (i=0; i<ul.childNodes.length;i++) { 
                    li = ul.childNodes[i];   
                    if (li.tagName=='LI') {                         
                        li.style.clear = 'both';
                        this.makeListItemVisible(li);   
                        itemSize = this.getListItemSize(li); 
                        //on the first Li adjust the default width for the border and padding of a menu item
                        if (!adjustedForBorderBox) {
                            liContentSize.width -= itemSize.borderBox.horizontal;
                            liContentSize.width -= itemSize.paddingBox.horizontal;
                            adjustedForBorderBox = true;
                        }
                        if (liContentSize.width < itemSize.size.width) {liContentSize.width = itemSize.size.width;}  
                        if (liContentSize.height < itemSize.size.height) {liContentSize.height = itemSize.size.height;}                       
                    }                
                }
                //equalize the widths of the list items 
                for (i=0; i<ul.childNodes.length;i++) {
                    li = ul.childNodes[i];
                    if (li.tagName=='LI') {
                        this.setListItemSize(li, liContentSize);                         
                        ulContentSize = $common.getSize(li);
                        h += ulContentSize.height;                                      
                    }
                }  
                ulContentSize.height = h;                                 
                $common.setVisible(ul,true);
                ul.style.display='block'; 
                $common.setContentSize(ul,ulContentSize);
                $common.setSize(d,$common.getSize(ul));
                break;
        }
    },

    dispose : function() {
        // TODO: Add your cleanup code here
        $clearHandlers(this.get_element());
        Liquid.LiquidWebControls.LiquidMenuItemContainer.callBaseMethod(this, 'dispose');
    }, 
    
    makeListItemVisible : function(li) {
        $common.setVisible(li,true);
        li.style.display = 'block';
    },
    
    getListItemSize : function(li) {        
        var size = {height:0,width:0};
        //safari 312.6 does not like getPaddingBox at all
        //so use getsize and adjust for border and padding
        var liContentSize = $common.getSize(li);
        var bSize = $common.getBorderBox(li);
        var pSize = {horizontal:0,vertical:0};
        try {
            pSize = $common.getPaddingBox(li);
        }
        catch(err) {
            //The browser is safari 312.6 and does not like the getPaddingBox function
        }        
        liContentSize.width -= bSize.horizontal;
        liContentSize.width -= pSize.horizontal;
        liContentSize.height -= bSize.vertical;
        liContentSize.height -= pSize.vertical;
        for (j=0; j<li.childNodes.length;j++) {            
            if (li.childNodes[j].tagName=='A') {
                size = this.getLinkSize(li.childNodes[j]);  
                break;               
            }               
        } 
        if (liContentSize.height > size.height) {size.height = liContentSize.height;}
        if (liContentSize.width > size.width) {size.width = liContentSize.width;}       
        return {size:size,borderBox:bSize,paddingBox:pSize}; 
    } , 
    
    setListItemSize : function(li, size) {  
        var childIndex = 0; 
        var liChild = null;    
        if (!$find(li.id).get_isSeperator()) {
            $common.setContentSize(li,size);
            for (childIndex=0; childIndex<li.childNodes.length;childIndex++) {
                liChild = li.childNodes[childIndex];
                if (liChild.tagName == 'A') {
                    liChild.style.width = size.width.toString() + 'px';
                }
            } 
        }else {
            li.style.width = size.width.toString() + 'px';
        }        
    }, 
    
    count : function() {
        var index  = 0;
        if (!this._count) {
            this._count = 0;
            for (index=0; index<this.get_element().childNodes.length;index++) {     
                if (this.get_element().childNodes[index].tagName=='LI') {
                    this._count++;                                
                }                
            }  
        }      
        return this._count;   
    }, 
    
    getLinkSize : function(link) {
        var w = 0;
        var h = 0;
        var linkSize;
        for (k=0; k<link.childNodes.length;k++) {
            linkSize = {width:$commonLiquid.getWidth(link.childNodes[k]),height:$commonLiquid.getHeight(link.childNodes[k])};
            w = w + linkSize.width;
            if (linkSize.height > h) {h = linkSize.height;}                                   
        }
        return {height:h,width:w};
    },  
    
    //remove a given CssClass from all of the menu Items in a menu
    removeMenuItemsCssClass : function(CssClass) {
        var ul = this.get_element();
        var ulCounter;
        var li;
        for (ulCounter=0; ulCounter<ul.childNodes.length;ulCounter++) {            
            if (ul.childNodes[ulCounter].tagName=='LI') {                 
                li = $find(ul.childNodes[ulCounter].id);
                if (li) {li.removeMenuItemsCssClass(CssClass);}
            }
        }        
    },    
    
    get_level : function() {
        return this._level;
    },
    set_level : function(value) {
        this._level = value;
    },
    
    get_orientation : function() {
        return this._orientation;
    },
    set_orientation : function(value) {
        this._orientation = value;
    }           
};

Liquid.LiquidWebControls.LiquidMenuItemContainer.registerClass('Liquid.LiquidWebControls.LiquidMenuItemContainer', Sys.UI.Control);


//////////////////////////////////////////////////////////////////////
 
Liquid.LiquidWebControls.ExpandDirection = function() { };
Liquid.LiquidWebControls.ExpandDirection.prototype = {
    Right : 0x01,
    Left : 0x02,
    Up : 0x03,
    Down : 0x04
};
Liquid.LiquidWebControls.ExpandDirection.registerEnum("Liquid.LiquidWebControls.ExpandDirection", true);



//////////////////////////////////////////////////////////////////////////////////////////////////////

Liquid.LiquidWebControls.Animation = function() { };
Liquid.LiquidWebControls.Animation.prototype = {
    None : 0x01,
    Slide : 0x02,
    Fade : 0x3
};
Liquid.LiquidWebControls.Animation.registerEnum("Liquid.LiquidWebControls.Animation", true);


//Notify the Sys.Application class this script has been loaded
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();