var CityFilterBlock = new Class({
	
	Implements: Options,
	
	options: {
		city_id:				'filter-city',
		district_id:				'filter-district',
		
		related_pfx:			'filter-related-city-',
		default_first: '- Visi miestai -',
		separator : true
	},
	
	cities:	null,
	selected_city: null,
	
	initialize: function(options) {
		this.setOptions(options);
		
		this.cities = new Array();
		var options = $(this.options.city_id).options;
		for(var i = 0; i < options.length; i++) {
			this.cities[i] = { 
						'id': 		options[i].value,
						'title': 		options[i].text,
						'related': 	options[i].className,
						'selected':	options[i].selected
					    };
					    
			this.selected_city = options[i].selected ? options[i].value : this.selected_city;
		}
		
		
		$(this.options.city_id).addEvent('change', this.onCityChange.bind(this));
		$(this.options.district_id).addEvent('change', this.onDistrictChange.bind(this));
		
		this.filterCities(0);
		if(this.options.district_id != 'filter-city' || $(this.options.district_id).selectedIndex > 0) {
			this.selectDistrict($(this.options.district_id).options[$(this.options.district_id).selectedIndex].value);
		}
	},	
	
	onCityChange: function() {
		var index = $(this.options.city_id).selectedIndex;
		var options = $(this.options.city_id).options;
		
		this.selected_city = options[index].value;
		
		var districtId = options[index].className.substring(this.options.related_pfx.length);
		this.selectDistrict(districtId);
		this.filterCities(districtId);
	},
	
	onDistrictChange: function() {
		var index = $(this.options.district_id).selectedIndex;
		var options = $(this.options.district_id).options;
		
		var districtId = options[index].value;
		this.selectDistrict(districtId);
	},
	
	selectDistrict: function(id) {
		var options = $(this.options.district_id).options;
		var selected = 0;
		for(var i = 0; i < options.length; i++) {
			if(options[i].value != id) {
				options[i].selected = false;
			} else {
				options[i].selected = true;
				selected = i;
			}
		}
		
		$(this.options.district_id).selectedIndex = selected;
		this.filterCities(id);
	},
	
	filterCities: function(id) {
		this.clearCities();
		var selectedIndex = 0;

		
		if(id == null || id == 0) {
			for(var i = 0; i < this.cities.length; i++) {
				var o = new Element('option', {
					'class':		this.cities[i].related,
					'value':		this.cities[i].id
				});
				o.setText(this.cities[i].title);
				o.selected = this.selected_city == this.cities[i].id ? true : false;
				$(this.options.city_id).adopt([o]);

				if(this.options.separator && (i + 1) == 9) {
					o = new Element('option', {
						'value':	0
					});
					o.setText("------------------------------");
					o.selected = false;
					$(this.options.city_id).adopt([o]);
				}
			}
		} else {
			var o = new Element('option', {
				'value':		'-1'
			});
			o.setText(this.options.default_first);
			$(this.options.city_id).adopt([o]);
			
			for(var i = 0; i < this.cities.length; i++) {
				if(this.cities[i].related == (this.options.related_pfx + id)) {
					var o = new Element('option', {
						'class':		this.cities[i].related,
						'value':		this.cities[i].id
					});
					o.setText(this.cities[i].title);
					o.selected = this.selected_city == this.cities[i].id ? true : false;
					$(this.options.city_id).adopt([o]);
				}
			}
		}
		for(var i = 0; i < $(this.options.city_id).options.length; i++) {
			if($(this.options.city_id).options[i].value == this.selected_city) {
				selectedIndex = i;
				break;
			}
		}
		$(this.options.city_id).selectedIndex = selectedIndex;
	},
	
	clearCities: function() {
		var options = $(this.options.city_id).getElements('option');
		$(this.options.city_id).length = 0;
		/*
		for(var i = (options.length - 1); i >= 0; i--) {
			options[i].remove();
		}
		*/
	}
});