﻿/**  Flyout Menu
-------------------------------------------------------------*/
var flyoutMenu = function() {this.init.apply(this, arguments)};
flyoutMenu.prototype = {

    //Properties-----------------------------------------------
    timeout: null,
    list: null,
    subnav: null,
    anchor: null,
    
    //Config---------------------------------------------------
    
    config: {
        clickable: false,
        hoverable: true,
        hide: true,
        hideTime: 500
    },
    
    //Constructor----------------------------------------------
    
    //Init
    init: function(el) {
        
        var object = this;
        this.subnav = el.getElementsByTagName("ul")[0];
        this.anchor = el.getElementsByTagName("a")[0];
        
        if(this.subnav)
        {
            if(this.config.clickable == true)
            {
                el.onclick = function() {
                    object.itemOver(this);
                };
            }
            
            if(this.config.hoverable == true)
            {
                el.onmouseover = function() {
                    object.itemOver(this);
                };
            }
            
            if(this.config.hide == true)
            {
                el.onmouseout = function() {
                    object.timeout = setTimeout(function(){
                        object.itemOut(el);
                    },object.config.hideTime);
                };
            }
        }
    },
    
    //Methods--------------------------------------------------
    
    itemOver: function(item) {
       
        clearTimeout(this.timeout); 
       
        if(this.list != null && this.list != item) 
            this.itemOut(this.list);
        
        
        flyoutMenu.prototype.list = item;
  
        this.subnav.className = 'flyout_shownav';
        this.anchor.className= 'hover';
    },
    
    itemOut: function(item) {
        var subnav = item.getElementsByTagName("ul")[0];
        var anchor = item.getElementsByTagName("a")[0];
       
        subnav.className = 'flyout_subnav';
        anchor.className= '';
    }
   
};



/** Init Behaviour
-------------------------------------------------------------*/
var rules = {
    'li.flyout' : function(el) {
        var menu = new flyoutMenu(el);
    }
}

Behaviour.register(rules);
