//////////////////////////////////////////////////////////////////////////////////// IMGDIVROLLOVER
// class to cope with imgDivRollovers - shows / hide div depending on state & lang
// Usage: Applies itself to passed in element
ImgDivRollOverLang = new Class({
	Implements:[Events,Options],
	options: {
	  state:"thumb",
	  lang:"el"
	},
	initialize:function(ImgDiv, options) {
	  this.container = $(ImgDiv);
	  this.id = this.container.get("id");
	  this.setOptions(options);
	  this.images = this.container.getElements("img");
	  this.firstImage = this.images[0];
	  this.divs = this.container.getElements("div");
	  this.href = this.container.getElement('a').get("href");
		//alert(this.firstImage.getPosition().x);
	
		// need to position each div over the top of each image
		// this is the best way to do this
		this.container.getElements("div").each(function(div){
			div.position({
				position: 'topLeft',
				edge: 'topLeft',
				relativeTo: this.firstImage
			});
		}, this);
	
	  this.attach();
	},
	attach:function() {
		this.container.addEvent('mouseenter', function(){
			this.updateView("over");
		}.bind(this));
		this.container.addEvent('mouseleave', function(){
			this.updateView("out");
		}.bind(this));
		this.container.addEvent('click', function(){
			document.location.href = this.href;
		}.bind(this));			
	},
	setLang:function(strLang){
	//alert(id);
		this.options.lang = strLang;
	},
	setState:function(strState){
		this.options.state = strState;
	//alert(id);
	},
	switchView:function(strState){
		this.setState(strState);
		this.updateView("out");
	},
	// update view based on interaction type: over / out
	updateView:function(type){
		this.container.getElements("div").each(function(div){div.setStyle("display","none");});
		switch(type){
		case "over":
			if(this.options.state == "thumb") { // if switchView has been called if view = thumb > switch view to list / vice versa
				this.container.getElements("."+this.options.lang+"E").setStyle("display","block");
			} else {
				this.container.getElements("."+this.options.lang+"E").setStyle("display","none");
			} 
			break;
		case "out":
			if(this.options.state == "thumb") {
			  this.container.getElements("."+this.options.lang+"E").setStyle("display","none");
			} else {
			  this.container.getElements("."+this.options.lang+"E").setStyle("display","block");
			} 
			break;
		}
	}, 
	// helper function
	getId:function(){
	  alert(this.id);
	}
	
}, this);