// JavaScript Document


var GMap = new Class({

  Implements: [Options, Events],
	
	options: {
		map: {
		  zoom: 10,
			center: {
				lat: 49.817492,
				lng: 15.472962
			},
			type: 'roadmap'
		},
		markers: [],
		bubbleTemplate: '',
		canvas: 'div.google-map-canvas',
		toggle: 'p.google-map-toggle',
		minHeight: null,
		maxHeight: 500
	},
	
	initialize: function(element, options){
		
		this.element = document.id(element);
		
		this.canvas = this.element.getElement(this.options.canvas);
		
		this.setOptions(options);
		
		this.options.minHeight = this.canvas.getSize().y;
		
		this.isBig = false;
		
    // initialize map
		this.map = new google.maps.Map(this.canvas, {
		  zoom: this.options.map.zoom,
			center: this.parseLatLng(this.options.map.center),
			mapTypeId: google.maps.MapTypeId[this.options.map.type.toUpperCase()]
		});
		
		this.markers = new Array();
		this.bounds = null;
		
		this.toggle = this.element.getElement(this.options.toggle);
		if (this.toggle){
  		this.toggle.addEvent('click', function(){
			  if (this.isBig){
					this.canvas.setStyle('height', this.options.minHeight);
					this.toggle.set('html', '<span>Zobrazit větší mapu</span>');
					this.isBig = false;
				} else {
					this.canvas.setStyle('height', this.options.maxHeight);
					this.isBig = true;
					this.toggle.set('html', '<span>Zobrazit menší mapu</span>');
				}
				google.maps.event.trigger(this.map, 'resize');
				this.map.setCenter(this.parseLatLng(this.options.map.center));
  		}.bind(this));
		}
		
		if (this.options.markers.length){
			 this.addMarker(this.options.markers);
		}
		
		if (this.options.markers.length > 1 && this.bounds != null) this.map.fitBounds(this.bounds);
		
		
	},
	
	addMarker: function(markers){
		var bounds = new google.maps.LatLngBounds();
		var markers = new Array(markers).flatten();
		var map = this.map;
		markers.each(function(markerOptions, index){
			// create marker
			var latlng = this.parseLatLng(markerOptions.position);
			var marker = new google.maps.Marker({
				position: latlng, 
				map: map, 
				title: markerOptions.title
			});
			this.markers.push(marker);
			bounds.extend(latlng);
			
			// create info window
			if (markerOptions.data){
				var infoWindow = new GMap.Window(markerOptions.data, this.options.bubbleTemplate);
				google.maps.event.addListener(marker, 'click', function(){ infoWindow.open(map, marker); });
			}
		}, this);
		
		this.bounds = bounds;
		
	},
	
	parseLatLng: function(position){
		return new google.maps.LatLng(position.lat, position.lng);
	}

});

GMap.Window = new Class({

  initialize: function(data, template){
		
		this.template = template;
		this.data = data;
		
		this.infoWindow = new google.maps.InfoWindow({content: this.template.substitute(this.data)});
		
		return this.infoWindow;
	}

});

var Checkbox = new Class({

  Implements: [Events, Options],
	
	options: function(){
		//onChange: $empty(radio)
	},
	
	initialize: function(element, options){
		this.element = document.id(element);
		
		this.setOptions(options);
	  
		this.span = this.element.getParent('span');
    this.span.addClass('ready');
		this.label = this.element.getParent('label');
		this.label.addEvent('click', function(event){
			event.preventDefault();
			this.checkStatus();
		}.bind(this));
		
		this.checkStatus(true);
		
		return this;
		
	},
	
	checkStatus: function(onload){
		if (!onload) this.element.checked = !this.element.checked;
		this.checked = this.element.checked;
		this.element.checked ? this.span.addClass('checked') : this.span.removeClass('checked');
    if (!onload) this.fireEvent('change', this.element);
	},
	
	check: function(){
		this.element.checked = true;
		this.checkStatus(true);
	},
	
	uncheck: function(){
		this.element.checked = false;
		this.checkStatus(true);
	},
	
	checked: false

});

var Dealers = {
	
	init: function(){
		Dealers.Form.init();
		
		this.searchDealerInput = $('form-search-dealer-city');
		if (this.searchDealerInput) new Autocompleter.Request.JSON(this.searchDealerInput, '/prodejni-mista/mesta');
	}

 };

Dealers.Form = {

  init: function(){
		
		this.forms = document.getElements('form');

		this.forms.each(function(form){
			var formID = form.get('id');
			if (formID){
				var objectTitle = formID.replace('form-','').camelCase().capitalize();
				if (this[objectTitle]) this[objectTitle].init(form);
			}
		}, this);
		
	}

 };

Dealers.Form.DealerFilter = {
	
	init: function(form){
	  this.form = form;
		
		this.selects = this.form.getElements('select');
		
		this.selects.addEvent('change', function(event){
		  this.form.submit();
		}.bind(this));

	}
	
 };
 
Dealers.Form.MainSearch = {
	
	init: function(form){
		var self = this;
		
		this.form = form;
		
		var checkboxEls = this.form.getElements('input[type=checkbox]');
		var checkboxes = new Array();
		checkboxEls.each(function(checkboxEl){
			var cb = new Checkbox(checkboxEl, {
				onChange: function(checkbox){
					checkbox.checked ? checkbox.getParent('label').addClass('checked') : checkbox.getParent('label').removeClass('checked');
				}
			});
			checkboxes.push(cb);
		});
		
		var tools = this.form.getElements('p.tools');
		tools.each(function(tool){
			var buttons = tool.getElements('a');
			buttons.addEvent('click', function(event){
				event.preventDefault();
				var clicked = document.id(event.target);
				if (clicked.get('tag') != 'a') clicked = clicked.getParent('a');
				var fieldset = clicked.getParent('fieldset');
				if (clicked.hasClass('select-all')){
					checkboxes.each(function(checkbox){
						if (checkbox.element.getParent('fieldset') == fieldset){
							checkbox.check();
						}
					});
				}
				if (clicked.hasClass('deselect-all')){
					checkboxes.each(function(checkbox){
						if (checkbox.element.getParent('fieldset') == fieldset){
							checkbox.uncheck();
						}
					});
				}
			});
		});

		var tabPanels = this.form.getElements('fieldset.tab-panel');
		var tabAnchorList = this.form.getElement('ul.tab-anchors');
		var tabAnchors = tabAnchorList.getElements('a');
		tabAnchors.each(function(anchor, index){
			var id = anchor.get('href').replace('#','');
			var panel = document.id(id);
			if (index > 0) panel.dispose();
			anchor.addEvent('click', function(event){
				event.preventDefault();
				checkboxes.each(function(checkbox){
					checkbox.uncheck();
					checkbox.element.getParent('label').removeClass('checked');
				});
				tabPanels.dispose();
				tabAnchors.removeClass('active');
				anchor.addClass('active');
				panel.inject(tabAnchorList, 'after');
			});
		});
		
		this.cityInput = document.id('form-search-dealer-city');
		this.cityInput.addEvent('focus', function(){
			this.resetMap();
		}.bind(this));
	},
	
	resetCity: function(){
		this.cityInput.value = '';
		return this;
	},
	
	resetMap: function(){
		HenkelLepidla.map.reset();
		var checked = this.form.getElements('input[type=radio]');
		checked.each(function(radio){
			radio.checked = false;
		});
		return this;
	}
	
	
 };


window.addEvent('domready', Dealers.init.bind(Dealers));


