


function CountrySlider() {
	
	this.slide_overlap = 6;
	this.button_width = -1;
	this.slider_item_width = -1;
	this.slider_item_content_width = -1;
	this.open_slide_no = 1;
	this.slider_item_content_container_width = -1;
	this.slider_item_content_width = -1;
	this.slider_count = -1;
	this.slider_height = -1;
	this.slider_width = -1;
	
	this.timer = null;
	this.mouseover_slide = -1;
	
	this.init_slider = function() {
		this.slider_height = $('country_slider').clientHeight-4;        // 2 = border (top & bottom both 2px)
		this.slider_width  = $('country_slider').clientWidth;
		
		this.slider_items = this.getSliderItems();
		this.slider_count = this.slider_items.length;
		
		var b = this.getByClassname('slider_item_menu');
		this.button_width = b.clientWidth;


		this.slider_item_content_width = $('country_slider').clientWidth - (this.slider_count * this.button_width) +  + (this.slide_overlap*this.slider_count);
		this.slider_item_width = this.button_width + this.slider_item_content_width;
		
		// position slides & set properties
		for(var x=0; x < this.slider_items.length; x++) {
			var si = this.slider_items[x];
			
			si.style.zIndex = x;
			si.style.height = this.slider_height + 'px';
			si.slide_no = x;
			si.slider = this;
			var current_slider_item = this.getItemNo(x);
			current_slider_item.style.width = this.slider_item_width + 'px';
			this.getContentNo(x).style.width = this.slider_item_content_width + 'px';
			
			// calculate slide position
			var space_left = this.slider_width - (this.button_width * (this.slider_count-x));	// positioning to the right

                        current_slider_item.base_position = (space_left) + ((this.slider_items.length-x)*this.slide_overlap) - 5;
                        current_slider_item.open_position = x * (this.button_width-this.slide_overlap);
			current_slider_item.style.left = current_slider_item.base_position + 'px';
			

			Event.observe(si, 'mouseover', function() { cs.menu_mouseover(this.slide_no); });	// set events
			Event.observe(si, 'mouseout', function() { cs.menu_mouseout(this.slide_no); });	// set events
		}
	}
	
	this.getSliderItems = function() {
		if (!this.slider_items) {
			var divs = $('country_slider').getElementsByTagName('div')
			var items = new Array();
			for(var x=0; x < divs.length; x++) {
				if (divs[x].className == 'slider_item')
					items.push(divs[x]);
			}
			
			this.slider_items = items;
		}
		
		return this.slider_items;
	}
	
	this.getItemNo = function(no) {
		items = this.getSliderItems();
		
		if (no >= 0 && no < items.length)
			return items[no];
		else
			return null;
	}
	
	this.getContentNo = function(no) {
		var divs = $('country_slider').getElementsByTagName('div');
		
		var content_no = 0;
		for(var x=0; x < divs.length; x++) {
			if (divs[x].className == 'slider_item_content') {
				if (no == content_no)
					return divs[x];
				
				content_no++;
			}
		}
		
		return null;
	}
	
	this.menu_mouseover = function(slide_no) {
		if (this.timer != null)
			clearTimeout(this.timer);
		
		this.mouseover_slide = slide_no;
		this.timer = setTimeout(function() { cs.show_mouseover_slide(); }, 10);
	}
	this.show_mouseover_slide = function() {
		if (this.mouseover_slide != -1)
			this.open_slide(this.mouseover_slide);
		
		this.mouseover_slide = -1;
	}
	this.menu_mouseout = function(slide_no) {
		if (!slide_no)
			return;
		
		if (this.mouseover_slide == slide_no)
			this.mouseover_slide = -1;
		
		if (this.timer != null)
			clearTimeout(this.timer);
	}
	this.setActive = function(slide_no) {
		anchors = this.getItemNo(slide_no).getElementsByTagName('a');//className = 'slider_tab_active';
		for(x=0; x < anchors.length; x++) {
			if (anchors[x].className.indexOf('slider_tab') == 0) {
				anchors[x].className = 'slider_tab_active';
				break;
			}
		}
	}
	this.setUnActive = function(slide_no) {
		anchors = this.getItemNo(slide_no).getElementsByTagName('a');//className = 'slider_tab_active';
		for(x=0; x < anchors.length; x++) {
			if (anchors[x].className.indexOf('slider_tab') == 0) {
				anchors[x].className = 'slider_tab';
				break;
			}
		}
	}
	
	this.open_slide = function(slide_no) {
		if (slide_no == this.open_slide_no)
			return;
		
		this.open_slide_no = slide_no;
		
		var x=0;
		items = this.getSliderItems();
		for(; x <= this.open_slide_no; x++) {
			var o = items[x];
			
			$(o).morphing = true;
			
			if ($(o).morph_effect)
				$(o).morph_effect.cancel();
			
			this.setUnActive(x);
			$(o).morph_effect = new Effect.Morph(o, 
					{ 
						style: 'left: ' + o.open_position + 'px;'
						, afterFinish: function( effect ) {
							this.morphing = false;
							if (effect.element.slide_no == effect.element.slider.open_slide_no)
								effect.element.slider.setActive(effect.element.slide_no);
							
						} 
					});
		}
		
		for(; x < this.slider_count; x++) {
			var o = items[x];
			
			$(o).morphing = true;
			if ($(o).morph_effect)
				$(o).morph_effect.cancel();
			this.setUnActive(x);
			$(o).morph_effect = new Effect.Morph(o, { style: 'left: ' + o.base_position + 'px;', afterFinish: function() { this.morphing=false; } } );
//			$(o).morph('left: ' + o.base_position + 'px;', { afterFinish: function() { this.morphing=false; } } );
		}
		
		
	}
	
	this.getByClassname = function(name) {
		var objs = $('country_slider').getElementsByTagName('div');
		
		for(var x=0; x < objs.length; x++) {
			if (objs[x].className == name)
				return objs[x];
		}
		
		return null;
	}
	
	
}

var cs = null;
function init_slider() {
	cs = new CountrySlider();
	
	cs.init_slider();
}

// init after dom loaded
//document.observe("dom:loaded", function() { init_slider(); });


