// JavaScript Document

var Prodejci = {

  init: function(){

		// map init
		if ($('map-wrapper')) new Map('map-wrapper', {
			field: '#mapa-sr-wrapper',
			parseRegexp: /\/predajci\/([^\-]*)(.*)\//
		});

	}
	
};

var Map = new Class({
		
		Implements: Options,
		
		options: {
			field: '.mapa-cr-wrapper',
			areas: 'area',
			parseRegexp: /\/prodejci\/([^\/-]*)(-.*)?\/.*/,
			width: 425,
			height: 211
		},
	
	  initialize: function(container, options){
			 
		   this.container = document.id(container);
			 
			 this.setOptions(options);
			 
			 this.field = this.container.getElement(this.options.field);
			 this.field.getElement('img').setOpacity(0.001);
			 
			 // kraje
			 this.areas = this.container.getElements('area');
			 
			 this.kraje = new Hash({
						'kosicky'         : [3, 1],
						'presovsky'       : [0, 2],
						'banskobystricky' : [1, 1],
						'zilinsky'        : [2, 1],
						'trenciansky'     : [3, 0],
						'nitriansky'      : [0, 1],
						'trnavsky'        : [2, 0],
						'bratislavsky'    : [1, 0]
			 });
			 
			 this.bubbles = new Hash({
						'banskobystricky'	: [182,  90],
						'bratislavsky'    : [ 14, 102],
						'kosicky' 				: [290,  55],
						'nitriansky'      : [ 99, 118],
						'presovsky'       : [290,  15],
						'trenciansky'     : [ 79,  54],
						'trnavsky'        : [ 50,  84],
						'zilinsky'   			: [150,  15]
			 });

       this.areas.each(function(element){
          var kraj = element.getProperty('href').replace(this.options.parseRegexp, '$1');
				 // bubble
	 			  var bubble = new Element('p', { 'class' : 'bubble' });
				  bubble.set('html', '<span>' + element.getProperty('title') +'</span>');
					bubble.setStyles({
					    'left' : this.bubbles.get(kraj)[0],
							'top'  : this.bubbles.get(kraj)[1]
					});
				  var bubbleFx = new Fx.Tween(bubble, { property: 'opacity', duration: 200, wait: false });
				  bubbleFx.set(0);
				  bubble.inject(this.field);
					
					element.removeProperties('title', 'alt');
					element.addEvents({
					  'mouseenter': function(){
							this.move(this.kraje.get(kraj), this.field);
							bubbleFx.start(1);
						}.bind(this),
						'mouseleave': function(){
							this.move([0, 0], this.field);
							bubbleFx.start(0);
						}.bind(this)
					});
			 }, this);
			
		},
		
		move: function(coords, field){
			var col = coords[0];
			var row = coords[1];
			field.setStyle('background-position', (-this.options.width*col) + 'px ' + (-this.options.height*row) + 'px');
		}
		
});

window.addEvent('domready', function(){

	Prodejci.init();
	
});
