var Imagemap = new Class({
	setOptions: function(options) {
		this.options = Object.extend({
			firstClass: 'div',
			onComplete: Class.empty,
			onStart: Class.empty
		}, options || {});
	},	
    initialize: function(el,options){
		this.setOptions(options);
        this.el = $(el);
		this.imageMap = this.el.getElement('img');
		this.imageMapHeight = this.imageMap.getCoordinates().height;
		this.imageMapWidth = this.imageMap.getCoordinates().width;
		this.firstRun = false;
		
		this.el.getElements('div div img').each(function(el) {
			el.setProperty('width', this.imageMapWidth).setProperty('height', this.imageMapHeight);
		}.bind(this));
		this.showMapItem(this.el.getElements('#hovermaps ' + this.options.firstClass));
        this.el.getElements('map area').each(function(mapitem) {
            var isActive = this.el.getElement('#activemaps .' + mapitem.getProperty('class'));
			if (isActive) {
				mapitem.addEvents({
					'mouseover': function(e) {
						this.showHoverMap(e);
					}.bind(this),
					'mouseleave': function(e) {
						this.hideHoverMap(e);
					}.bind(this)
				});
			}
		}.bind(this));
    },
	showHoverMap: function(e) {
		if(this.firstRun == false) {
			this.hideMapItem(this.el.getElements('#hovermaps ' + this.options.firstClass));
			this.firstRun = true;
		}
		var event = new Event(e);
		var target = $(event.target);
		this.el.getElements('#hovermaps .' + target.getProperty('class')).each(function(el) {
			this.showMapItem(el);
		}.bind(this));
	},
	hideHoverMap: function(e) {
		var event = new Event(e);
		var target = $(event.target);
		this.el.getElements('#hovermaps .' + target.getProperty('class')).each(function(el) {
			this.hideMapItem(el)
		}.bind(this));
	},
	hideMapItem: function(el) {
		el.setStyles({
			'display': 'none',
			'visibility': 'hidden',
			'z-index': 0
		});
	},
	showMapItem: function(el) {
		el.setStyles({
			'display': 'block',
			'visibility': 'visible',
			'z-index': 999
		});
	}
});
