

var GalMenu =  function(){};

var GalMenuCaller = function(src){
	$ajax(src, false, GalMenuCreater);
};

var GalMenuCreater = function(response){
	if(!response) return false;
	var objName = response.xml.getElementsByTagName("objName")[0].getAttribute("value");
	document[objName] = new GalMenu();
	document[objName].init(response);
	return document[objName];
};

GalMenu.prototype.init = function(response){

	if(!response) return false;
	
	
	this.visible		= false;
	this.showTo		= false;
	
	this.items		= new Array();
	
	this.xml 		= response.xml.firstChild;
	this.settings		= this.xml.getElementsByTagName("settings")[0];
	this.animDuration 	= this.settings.getElementsByTagName("animDuration")[0].getAttribute('value')*1000;
	this.animFxIn		= this.settings.getElementsByTagName("animType")[0].getAttribute('value');
	this.width		= this.settings.getElementsByTagName("width")[0].getAttribute('value');
	this.itemHeight		= parseInt(this.settings.getElementsByTagName("itemHeight")[0].getAttribute('value'));
	this.x			= this.settings.getElementsByTagName("position")[0].getAttribute('x');
	this.y			= this.settings.getElementsByTagName("position")[0].getAttribute('y');
	this.menuCaption	= this.settings.getElementsByTagName("caption")[0].firstChild.nodeValue;
	this.objContainer	= this.settings.getElementsByTagName("objContainer")[0].getAttribute('value');
	this.objContainer	= this.objContainer == "document.body" ? document.body : $(this.objContainer);
	
	this.itemContainer	= this.xml.getElementsByTagName("items")[0];
	
	this.make();
};

GalMenu.prototype.clean = function(){
	this.items = new Array();
	$(this.menuContainer).dispose().destroy();
};

GalMenu.prototype.make = function(){
	
	for(var i=0; this.itemContainer.childNodes[i]; i++){
		var Item = this.itemContainer.childNodes[i];
		
		this.items[i] = {
			caption: this.itemContainer.childNodes[i].firstChild.nodeValue
		};
		this.items[i].container = new Element("div", {
			styles:{
				height: this.itemHeight+'px',
				color:'#777777',
				padding:'0px',
				margin:'6px',
				fontSize:'16px',
				textAlign:'center',
				backgroundColor: '#333333',
				borderRadius: '3px'
			},
			events:{
				mouseover: function(){ this.makeAnim({color:'#bbbbbb',backgroundColor:'#444444'}, 'easeOutExpo', 300); },
				mouseout: function(){ this.makeAnim({color:'#777777',backgroundColor:'#333333'}, 'easeOutExpo', 300); },
				click: function(){ self.location.href=this.getAttribute('link'); }.bind(Item)
			}
		});
		$Anim(this.items[i].container);
		this.items[i].captionCont = new Element("div", {
			html: this.items[i].caption,
			styles:{ padding:'8px' }
		});
	}

	this.menuItem = new Element("div", {
		styles:{
			height: this.itemHeight+'px',
			color:'#777777',
			padding:'0px',
			margin:'6px',
			fontSize:'16px',
			textAlign:'center',
			fontWeight:'bold',
			backgroundColor: '#333333',
			borderRadius: '3px'
		}
	});
	this.menuItem.captionCont = new Element("div", {
		html: this.menuCaption,
		styles:{ padding:'8px' }
	})
	

	
	this.itemMargin = parseInt(this.items[0].container.getStyle('marginTop'));
	this.itemHeight = this.itemHeight+this.itemMargin;
	this.menuHeight = (this.itemHeight*(this.items.length+1))+this.itemMargin;
			
	
	this.menuContainer 	= new Element("div", {
		styles:{
			width: this.width+"px",
			height: this.menuHeight+'px',
			top: this.y-(this.itemHeight*this.items.length)+"px",
			left: this.x+"px",
			position:'fixed',
			backgroundColor: '#222222',
			opacity: .6,
			cursor:'pointer',
			zIndex:'20',
			borderRadius: '3px',
			textShadow: '0px 0px 2px #000',
			clip:'rect('+this.itemHeight*this.items.length+'px '+this.width+'px '+this.menuHeight+'px 0)'
		},
		events:{
			click: function(){this.menuContainer.makeAnim({top:this.y,clip:'0 '+this.width+' '+this.menuHeight+' 0'}, this.animFxIn, this.animDuration);}.bind(this),
			mouseleave: function(){ 
				this.showTo = setTimeout(function(){ this.menuContainer.makeAnim({top:this.y-this.itemHeight*this.items.length,clip:this.itemHeight*this.items.length+' '+this.width+' '+this.menuHeight+' 0'}, this.animFxIn, this.animDuration); }.bind(this), 500);
				this.menuContainer.makeAnim({opacity:0.6}, 'easeOutExpo', 500);
				}.bind(this),
			mouseenter: function(){ 
				clearTimeout(this.showTo);
				this.menuContainer.makeAnim({opacity:0.9}, 'easeOutExpo', 500);
			}.bind(this),
			animfinish: function(){ this.visible = this.visible ? false:true;}
		}
	});
	
	for(var i=0; this.itemContainer.childNodes[i]; i++)
		$(this.menuContainer).adopt(this.items[i].container.adopt(this.items[i].captionCont));
	
	$(this.menuContainer).adopt(this.menuItem.adopt(this.menuItem.captionCont));
	
	$Anim($(this.menuContainer));
	this.menuContainer.anim.Fx = this.animFxIn;
	this.menuContainer.anim.duration = this.animDuration;
	$(this.objContainer).adopt(this.menuContainer);
	
	this.isMade = true;
};


