﻿function Menu( place, config ){
	if( place == null )return;

	this.selectedItem = null;
	
	var self = this;
	
	var MENU_OBJ = this;

	var cont = document.createElement("DIV");
	cont.style.position = "relative";
	cont.style.styleFloat = "right";
	cont.style.cssFloat = "right";
	
	var totalwidth = 0;
	var maxheight = 0;
	for( var i=0; i<config.length; i++ ){
		totalwidth+= config[i].width;
		maxheight = Math.max(maxheight, config[i].height);
	}
	cont.style.width = totalwidth + "px";
	cont.style.height = maxheight + "px";	

	place.appendChild( cont );

	var modifyItem = function(id, isSelect){
		var sfEls = place.getElementsByTagName("LI");
		for (var i=0; i<sfEls.length; i++) {
			if( sfEls[i].id == id ){
				if( isSelect )
					sfEls[i].select();
				else
					sfEls[i].unselect();
			}
		}
	}

	this.selectItem = function( id ){
		modifyItem(id, true);
	}
	
	this.unSelectItem = function( id ){
		modifyItem(id, false);
	}	
	
	this.hideMenus = function(){
		var uls = cont.getElementsByTagName("UL");
		for(var i=0; i<uls.length; i++){
			uls[i].style.position = "absolute";
		}
		document.getElementById("nav").style.position = "static";
	}

	window.menu_images = [];
	function createHiddenImage( url ){
		if( url == null )return;
		setTimeout(function(){
			var img = document.createElement("IMG");
			img.src = url;
			img.style.position = "absolute";
			img.style.left = "-999999px";
			img.style.top = "-999999px";
			place.appendChild( img );
		});
	}
	function preloadImages( list ){
		for( var i=0; i<list.length; i++ ){
			createHiddenImage( list[i].overimage );
			createHiddenImage( list[i].outimage );			

			if( list[i].items )
				preloadImages(list[i].items);
		}
	}

	function MenuItem( config, isTop){
		var parent  = document.createElement("LI");
		if( config.id )
			parent.id = config.id;
		
		parent.style.width  = config.width + "px";
		parent.style.height = config.height + "px";
		parent.style.cursor = "pointer";
		if( config.overimage || config.outimage )
		parent.style.backgroundImage = "url( " + (config.selected ? config.overimage : config.outimage) + ")";
		parent.style.backgroundRepeat = "no-repeat";
		
		parent.over=function() {
			if( config.overimage )
			parent.style.backgroundImage = "url( " + config.overimage + ")";
			parent.className = "sfhover";

			if( parent.ul ){
				var top = 0;
				if( isTop )
					top = 0;
				else{	
					top = -1 * config.height;
				}
				parent.ul.style.marginTop   = top + "px";			
			}	
		}
		parent.out=function() {
			if( !parent.selected && (config.overimage || config.outimage) )
				parent.style.backgroundImage = "url( " + (config.selected ? config.overimage : config.outimage) + ")";
			parent.className="";
			setTimeout(self.hideMenus, 100 );
		}
		
		parent.select = function(){
 			 if( config.overimage )
			 parent.style.backgroundImage = "url( " + config.overimage + ")";
			 parent.selected = true;

			 try{
			 parent.parentNode.parentNode.select();
			 }catch(ex){}
			 self.selectedItem = config.id;
		}
		
		parent.unselect = function(){
 			 if( config.outimage )			
			 parent.style.backgroundImage = "url( " + config.outimage + ")";
			 parent.selected = false;
			 this.selectedItem = null;
		}
		
		var menuItemLink = document.createElement("A");
		
//		menuItemLink.style.width  = config.width + "px";
		menuItemLink.style.height = config.height + "px";
		menuItemLink.style.lineHeight = config.height + "px";
		
		if( config.url ){
			menuItemLink.href = config.url;
		}else
		if( config.callback ){
			menuItemLink.onmousedown = function(e){ 
				config.callback();
				return false; 
			};
		}else
		{
			menuItemLink.href = "javascript:void(0)";
		}

		var txt = config.text ? config.text : "&nbsp;";
		menuItemLink.innerHTML = txt;

		parent.appendChild( menuItemLink );

		if( config.items ){
		
			menuItemLink.className = "daddy";
			var ul = document.createElement( "UL" );
			ul.style.width  = config.width + "px";
			if( !isTop ){
				ul.style.marginLeft  = config.width + "px";
			}
				
			parent.ul = ul;
			parent.appendChild( ul );
			var mItem;
			for( var i=0; i<config.items.length; i++ ){
				if( config.items[i].width == null )config.items[i].width = config.width;
				if( config.items[i].height == null )config.items[i].height = config.height;
				ul.appendChild( new MenuItem(config.items[i]) );
			}
		}
		
		return parent;
	}
	
	var topCont = document.createElement("UL");
	topCont.id = "nav";
	cont.appendChild( topCont );
	var mItem;
	for( var i=0; i<config.length; i++ ){
		topCont.appendChild( new MenuItem(config[i], true) );
	}
	
	sfHover = function() {
		var sfEls = place.getElementsByTagName("LI");
		for (var i=0; i<sfEls.length; i++) {
			sfEls[i].onmouseover=function() {
				this.className+=" sfhover";
				this.over();
			}
			sfEls[i].onmouseout=function() {
				this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
				this.out();
			}
		}
	}
	window.onload = sfHover;
	
	preloadImages( config );
}
