Ext.onReady(function(){
			var menu = new wbx.menu();
});


Ext.namespace('wbx');

wbx.menu = function(){
	
	this.mainEntrys = [];
	this.subEntrys = [];
	this.subEntryItems = [];
	this.subsubEntrys = []; 
	
	this.headmenu = [];
	this.headmenuDropdowns = [];	
	
	Ext.each(Ext.query('ul[id=navi] li'),function(item){
		el = Ext.get(item);
		if(!el.hasClass('spacer')){
			this.mainEntrys.push(el);
			el.addListener({
				mouseover:{
					fn: 	this.subShow,
					menuId: el.id.substring(8),
					scope: this,
					elName: 'submenu_',
					hideAlls: [this.subEntrys, this.subsubEntrys]
				}
			});
			if(el.hasClass('navi_selected')){
				this.showEntry(Ext.get('submenu_'+el.id.substring(8)));
			}else{
				this.hideEntry(Ext.get('submenu_'+el.id.substring(8)));
			}
		}
	}, this);	

	Ext.each(Ext.query('ul[id^=submenu_]'),function(item){
		el = Ext.get(item);
		this.subEntrys.push(el);
	}, this);		
	
	Ext.each(Ext.query('li[id^=posforsub]'),function(item){
		 el = Ext.get(item);
		 this.subEntryItems.push(el);
		 el.addListener({
			mouseover:{
				fn: 	this.subShow,
				scope: this,				
				hideAlls: [this.subsubEntrys],
				anchor: 'posforsubsub',
				menuId: el.id.substring(12),
				elName : 'subsubmenu_'
				},
			mouseleave:{
				fn: function(e, el, params){
						this.doSubsubHide = true;
						var task = new Ext.util.DelayedTask(function(){
							if(this.doSubsubHide == true){
								this.hideEntry(params.setEl);
							}
						}, this);
					   task.delay(500); 
				},
				setEl:Ext.get('subsubmenu_'+el.id.substring(12)),
				scope:this
			}						
			});
	}, this);		
    
	Ext.each(Ext.query('ul[id^=subsubmenu_]'),function(item){
		el = Ext.get(item);
		el.addListener({
			mouseover:{
				fn: function(){
					this.doSubsubHide = false;
				},
				scope: this
			},
			mouseleave:{
				fn: function(e, el, params){
					   this.hideEntry(params.setEl);
				},
				setEl:el,
				scope:this
			}
		});	
		this.subsubEntrys.push(el);
	}, this);	
	
	Ext.each(Ext.query('ul[id^=headsubmenu]'),function(item){
		el = Ext.get(item);
		el.addListener({
			mouseover:{
				fn: function(){
					this.doSubsubHide = false;
				},
				scope: this
			},
			mouseleave:{
				fn: function(e, el, params){
					   this.hideEntry(params.setEl);
				},
				setEl:el,
				scope:this
			}
		});			
		this.headmenuDropdowns.push(el);
	}, this);	
	
	Ext.each(Ext.query('ul[id^=headmenu] li'), function(item){
		el = Ext.get(item);
		el.addListener({
			mouseover:{
				fn: this.subShow,
				scope: this,
				hideAlls: [this.headmenuDropdowns],
				anchor: 'posforheadsub',
				menuId: el.id.substring(13),
				elName: 'headsubmenu'
			},
			mouseleave:{
				fn: function(e, el, params){
						this.doSubsubHide = true;
						var task = new Ext.util.DelayedTask(function(){
							if(this.doSubsubHide == true){
								this.hideEntry(params.setEl);
							}
						}, this);
					   task.delay(500); 
				},
				setEl:Ext.get('headsubmenu'+el.id.substring(13)),
				scope:this
			}
		});
	},this);
	
    this.hideAll([this.subsubEntrys, this.headmenuDropdowns]);
	
			
};


wbx.menu.prototype.subShow = function(e, el, params){

	this.hideAll(params.hideAlls);
	this.doSubsubHide = false;
	setEl = Ext.get(Ext.get(params.elName+params.menuId));
	this.showEntry(setEl);
	if(params.anchor){
		try{
			setEl.setStyle({position: 'absolute', left: Ext.get(params.anchor+params.menuId).getLeft()+'px'});
		}catch(err){};	
	}
};

wbx.menu.prototype.hideAll = function(items){
	for(var i=0; i<=(items.length-1); i++){
		Ext.each(items[i],this.hideEntry, this);
	};
};

wbx.menu.prototype.showEntry = function(el){
	try{
		el.setStyle({display: 'block', visibility: 'visible'});
	}catch(err){};
};

wbx.menu.prototype.hideEntry = function(el){
	try{	
		el.setStyle({display: 'none', visibility: 'hidden'});
	}catch(err){};
};