var dvr = {};

dvr.Map = function(m, h) {
	
	if (!m) {
		return;
	}

	var rs = $A(m.select('ul.regions li'));
	
	if (!rs.length) {
		throw new Error('нет регионов');
		return;
	}

	this.map = m;
	this.regions = [];

	this.region = function(alias) {
		var data = this.regions.filter(function(region) {
			return region.alias == alias;
		});
		return data.first();
	}

	m.up('form').addClassName('usejs');

	var areas = '';
	rs.each(function(r) {
		this.regions.push(new dvr.Region(this, r));
		if (Object.isArray(h)) {
			h.each(function(i) {
				if (i.event && i.handler) {
					this.regions.last().observe(i.event, i.handler);
				}
			}.bind(this));
		}
		if (this.regions.last().selected()) {
			this.regions.last().selected(true);
		}
		areas += this.regions.last().getAreaText();
	}.bind(this));
	
	m.insert('<map name="mapArea" id="mapArea">'+ areas +'</map>'+
		'<img src="/images/1px.png" id="mapImage" usemap="#mapArea"/>');

	this.regions.invoke('initArea');
};

dvr.Region = function(m, r) {

	var ev = [], p = {};

	if (typeof r.onclick == 'function') {
		p = r.onclick();
		r.onclick = null;
	}

	this.alias = p.alias;
	this.title = p.title;
	this.li = r;
	this.chb = this.li.down('input');

	this.observe = function(et, h) {
		ev.push([et, h]);
	};

	this.fire = function(et) {
		ev.each(function(a) {
			if (a[0] == et) {
				a[1](this);	
			}
		}.bind(this));
	};

	this.selected = function(bool, hover) {
		if (typeof bool === 'boolean') {
			this.chb.checked = bool;
			this.li[bool ? 'addClassName' : 'removeClassName']('g-current');
			this.li.style.backgroundPosition = this.li.hasClassName('g-current')
				? p.bp_current : (hover === false ? '0px -500px' : p.bp_hover);

			f[bool ? 'show' : 'hide']();

			if (pic) {
				pic[bool || hover === false ? 'hide' : 'show']();
			}

			this.fire('change');
		}
		return this.chb.checked;
	};

	var amov = function() {
		if (this.li.hasClassName('g-current')) {
			return;
		}
		this.li.style.backgroundPosition = p.bp_hover;
		if (pic) {
			pic.show();
		}
	};

	var amou = function() {
		if (this.li.hasClassName('g-current')) {
			return;
		}
		this.li.style.backgroundPosition = '0px -500px';
		if (pic) {
			pic.hide();
		}
	};
	
	var ac = function(e) {
		if (e) {
			Event.stop(e);
		}
		this.selected(!this.selected() ? true : false);
	};

	r.style.width = p.width;
	r.style.height = p.height;
	r.style.left = p.x;
	r.style.top = p.y;

	r.lastChild.style.left = p.label_x;
	r.lastChild.style.top = p.label_y;

	var f = $(m.map.appendChild(document.createElement('img')));
	f.src = '/images/tpl/map_flag.png';
	f.className = 'flag png';
	f.style.left = p.flag_x;
	f.style.top = p.flag_y;
	f.hide();

	var pic = false;
	if (p.picture_src) {
		pic = $(m.map.appendChild(document.createElement('img')));
		pic.src = p.picture_src;
		pic.hide();
		pic.className = 'picture png';
		pic.style.left = p.picture_x;
		pic.style.top = p.picture_y;
	}


	this.getAreaText = function() {
		var html = '<area'+
		' id="area-'+ this.alias +'"'+
		' href="'+ this.title +'"'+
		' alt="'+ this.title +'"'+
		' shape="poly"';
		if (p.coords) {
			html += ' coords="'+ p.coords.replace(/\s/g, ',').replace(/\.\d/g, '') +'"';
		}
		html += ' />';
		return html;
	};

	this.initArea = function() {
		var a = $('area-'+ this.alias);
		a.observe('mouseover', amov.bindAsEventListener(this));
		a.observe('mouseout', amou.bindAsEventListener(this));
		a.observe('click', ac.bindAsEventListener(this));
	};
	

	
};

dvr.selected = $('mapSelected');
dvr.selected.addClassName('usejs');
dvr._selectedList = null;
dvr.selectedList = function() {
	if (!dvr.selected.firstChild || dvr.selected.firstChild.tagName.toLowerCase() != 'ul') {
		dvr._selectedList = $(document.createElement('ul'));
		dvr._selectedList.addClassName('selected-regions');
		dvr.selected.insert({top: dvr._selectedList});
	}
	return dvr._selectedList;
};

dvr.removeSelected = function(region) {

	if (!dvr.isSelected(region)) {
		return;
	}

	var li = dvr.selectedList().down('li.'+ region.alias);
	if (li) {
		li.remove();
	}
	if (dvr.selectedList().childNodes.length == 0) {
		dvr.selected.removeClassName('g-selected');
	}
};

dvr.addSelected = function(region) {
	if (dvr.isSelected(region)) {
		return;
	}
	dvr.selected.addClassName('g-selected');
	dvr.selectedList().insert(
		'<li class="'+ region.alias +'">'+
			'<a href="#" onclick="mapObject.region(\''+ region.alias +'\').selected(false, false); return false;" title="Удалить регион">'+
				//'<img src="/images/tpl/delete.png" alt="удалить"/>'+
				region.title +
			'</a>'+
		'</li>');
};

dvr.isSelected = function(region) {
	return !!dvr.selectedList().down('li.'+ region.alias);
};

var mapObject = new dvr.Map($('map'), [{
	event: 'change',
	handler: function(region) {
		dvr[region.selected() ? 'addSelected' : 'removeSelected'](region);
	}
},{
	event: 'change',
	handler: function(region) {
		new Ajax.Request('call~'+ (region.selected() ? 'add' : 'delete'), {
			parameters: {alias: region.alias},
			method: 'get'
		});
	}
}]);