var TopNavigation = Class.create({

    initialize: function()
    {
        this.groups = new Array();
        this.element = new Element('div', {id: 'navcontainer'});
    },
    
    addGroup: function(name, url, isactive)
    {
        var group = new TopNavigationItemGroup(name, url, isactive);
        this.groups.push(group);
        return group;
    },
    
    addGroupItem: function(groupname, name, url)
    {
        var group = this.getGroupByName(groupname);
        if(group != null)
        {
            group.items.push(new TopNavigationItem(name, url));
        }
    },
    
    getGroupByName: function(name)
    {
        result = null;
        
        this.groups.each(function(group)
        {
            if(group.name == name)
            {
                result = group;
            }
        });
        
        return result;
    },
    
    readFromList: function(baseelement)
    {
        var list = baseelement.firstDescendant();
        
        var _self = this;
        
        list.childElements().each(function(listelement)
        {
            var link = listelement.firstDescendant();
            var group = _self.addGroup(link.innerHTML, link.getAttribute('href'), listelement.className == 'current');
            
            var sublists = listelement.getElementsByTagName('ul');
            if(sublists.length > 0)
            {
                var sublist = $(sublists[0]);
                sublist.childElements().each(function(sublistelement)
                {
                    var link = sublistelement.firstDescendant();
                    _self.addGroupItem(group.name, link.innerHTML, link.getAttribute('href'));
                });
            }
        });
    },
    
    render: function(target)
    {
        var list = new Element('ul', {'class':'nav'});
        this.element.appendChild(list);
        
        for(var i=0; i<this.groups.length; i++)
        {
            this.groups[i].render(list, i == 0, i+1 == this.groups.length);
        }
        
        target.innerHTML = '';
        target.appendChild(this.element);
    }

});

var TopNavigationItem = Class.create({

    initialize: function(name, url)
    {
        this.name = name;
        this.url = url;
    },
    
    render: function(target)
    {
        var listitem = new Element('li');
        listitem.update('<a href="' + this.url + '">' + this.name + '</a>');
        
        target.appendChild(listitem);
    }

});

var TopNavigationItemGroup = Class.create(TopNavigationItem, {
    
    initialize: function($super, name, url, isactive)
    {   
        this.isActive = isactive;
        this.items = new Array();
        $super(name, url);
    },
    
    addItem: function(name, url)
    {
        this.items.push(new TopNavigationItem(name, url));
    },
    
    render: function(target, firstgroup, lastgroup)
    {
        var listitem = new Element('li', {'class':'top' + (firstgroup ? ' first' : '') + (lastgroup ? ' last' : '') + (this.isActive ? ' current' : '')});
        
        listitem.observe('mouseover', function(){LoadSubNav();});
        
        if(this.items.length > 0)
        {
            var list = new Element('ul', {'class': 'subnav'});
            
            this.items.each(function(item){
                item.render(list);
            });
            
            listitem.appendChild(list);
        }
        else
        {
            listitem.className += ' empty';
        }
        
        listitem.innerHTML = '<a href=\"' + this.url + '\" class=\"top_link\"><span>' + this.name + '</span><!--[if gte IE 7]><!--></a><!--><![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->' + listitem.innerHTML + '<!--[if lte IE 6]></td></tr></table></a><![endif]-->';
        
        target.appendChild(listitem);
    }

});



var TopNavUtility = {
    
    subnavloaded: false,
    
    renderNav: function(source)
    {
        var topnav = new TopNavigation();
        topnav.readFromList(source);
        topnav.render($('topnavigation'));
    },
    
    loadSubNav: function(panelid)
    {
        if(!TopNavUtility.subnavloaded)
        {
            TopNavUtility.subnavloaded = true;
            __doPostBack(panelid)
        }
    }

}