var font_size_changer = Class.create
({
	initialize: function(obj_container_element, array_target_elements, number_min, number_max, boolean_slider, boolean_reset, str_color, str_variation)
	{
		this.obj_container_element = obj_container_element;
		this.array_target_elements = array_target_elements;
		this.number_min = number_min;
		this.number_max = number_max;
		this.boolean_slider = boolean_slider;
		this.boolean_reset = boolean_reset;
		this.str_color = str_color;
		this.size_factor = 0;
		this.str_variation = str_variation;
		this.start_font_size = parseInt(this.array_target_elements[0].getStyle('fontSize').truncate(this.array_target_elements[0].getStyle('fontSize').length-2, ''));
		
		// The logic:
		this.create_inner_divs();
		
		if(this.str_variation == 'stairway')
		{
			this.get_slider();
			this.knob_class = 'knob_invisible';
			this.set_width_knob();
		}
		
		this.event_bigger();
		this.event_smaller();
		this.event_reset();
		if(document.cookie.split("size_factor=")[1])
			this.handle_cookie();
	}, // initialize()
		
		
	create_inner_divs: function()
	{
		Element.insert(this.obj_container_element, '<div id="button_smaller" class="button_smaller"></div>');
		
		if(this.str_variation == 'stairway')
		{
			Element.insert(this.obj_container_element, '<div id="zoom_slider" class="zoom_slider"></div>');
			Element.insert($('zoom_slider'), '<div class="knob_invisible" id="knob_invisible"></div>');
		}
		
		Element.insert(this.obj_container_element, '<div id="button_bigger" class="button_bigger"></div>');
		
		if(this.boolean_reset)
			Element.insert(this.obj_container_element, '<div id="button_reset" class="button_reset"></div>');
	},
	
	
	event_bigger: function()
	{
	var this_object = this;
		$('button_bigger').observe('click', function(event){
			// The current font size should be smaller than the max size
			if(this_object.array_target_elements[0].getStyle('fontSize').truncate(this_object.array_target_elements[0].getStyle('fontSize').length-2, '') < this_object.number_max)
			{
				this_object.my_slider.setValue(this_object.start_font_size+this_object.size_factor+1);
			}
		}); // event handler click
	},
	
	set_font_size_bigger: function()
	{
		this_object = this;
		this.array_target_elements.each(function(elm){
			var current_font_size = $(elm).getStyle('fontSize');
			current_font_size = current_font_size.truncate(current_font_size.length-1, '');
			current_font_size = parseInt(current_font_size);
			$(elm).setStyle({ fontSize: current_font_size+1+'px' });
			
			if(this_object.str_color)
			{
				$(elm).setStyle({color:this_object.str_color});
			}
		});
		this.size_factor = this.size_factor+1;
		this.set_cookie();	
		
		// individual: Balken Schrift schwarz
		$$('div.balken *').each(function(elm){
			elm.setStyle({color:this_object.str_color});
			});
		$$('div.content_breit *').each(function(elm){
			elm.setStyle({color:this_object.str_color});
		});
	},
	
	set_line_height_bigger: function()
	{
		this.array_target_elements.each(function(elm){
			var current_line_height = $(elm).getStyle('lineHeight');
			current_line_height = current_line_height.truncate(current_line_height.length-1, '');
			current_line_height = parseInt(current_line_height);
			$(elm).setStyle({ lineHeight: current_line_height+1+'px' });
		});
	},
	
	event_reset: function()
	{
	var this_object = this;
		$('button_reset').observe('click', function(event){
			this_object.reset();
		}); // event handler click
	},
	
	
	event_smaller: function()
	{
	var this_object = this;
		$('button_smaller').observe('click', function(event){
			// The current font size should be bigger than the min size
			if(this_object.array_target_elements[0].getStyle('fontSize').truncate(this_object.array_target_elements[0].getStyle('fontSize').length-2, '') > this_object.number_min)
			{
				this_object.my_slider.setValue(this_object.start_font_size+this_object.size_factor-1);
			}
		}); // event handler click
	},
	
	set_font_size_smaller: function()
	{
		this_object = this;
		this.array_target_elements.each(function(elm){
			var current_font_size = $(elm).getStyle('fontSize');
			current_font_size = current_font_size.truncate(current_font_size.length-1, '');
			current_font_size = parseInt(current_font_size);
			$(elm).setStyle({ fontSize: current_font_size-1+'px' });
			
			if(this_object.str_color)
			{
				$(elm).setStyle({color:this_object.str_color});
			}
			
		});
		this.size_factor = this.size_factor-1;
		this.set_cookie();
		
		// individual: Balken Schrift schwarz
		$$('div.balken *').each(function(elm){
			elm.setStyle({color:this_object.str_color});
			});
		$$('div.content_breit *').each(function(elm){
			elm.setStyle({color:this_object.str_color});
		});
	},
	
	set_line_height_smaller: function()
	{
		this.array_target_elements.each(function(elm){
			var current_line_height = $(elm).getStyle('lineHeight');
			current_line_height = current_line_height.truncate(current_line_height.length-1, '');
			current_line_height = parseInt(current_line_height);
			$(elm).setStyle({ lineHeight: current_line_height-1+'px' });
		});
	},
	
	reset: function()
		{
			this.size_factor = 0;
			// Line height and font size back
			for(var i=0; i< this.array_target_elements.length; i++)
				{
				this.array_target_elements[i].setStyle({'fontSize': ''});
				this.array_target_elements[i].setStyle({'lineHeight': ''});
				}
			this.my_slider.setValue(this.start_font_size);
			this.set_cookie();
			
			if(this.str_color)
			{
				this.array_target_elements.each(function(elm){
					$(elm).setStyle({color: ''});
				});
			}
			
			// individual: Balken Schrift schwarz
			$$('div.balken *').each(function(elm){
				elm.setStyle({color:''});
				});
			$$('div.content_breit *').each(function(elm){
				elm.setStyle({color:''});
			});
			
		},
		
	set_cookie: function()
	{
		var days = 30;
	    var date = new Date();
	    date.setTime(date.getTime()+(days*24*60*60*1000));
	    var expires = "; expires="+date.toGMTString();
		document.cookie = "size_factor="+this.size_factor+";"+expires;
	},
		
	handle_cookie: function()
	{
		// get the cookie information
		var my_cookie = document.cookie;
		var size_factor = my_cookie.split("size_factor=")[1];
		size_factor = size_factor.split(";");
		size_factor = parseInt(size_factor[0]);
		
		if(size_factor > 0)
		{
			for(var i=0; i<size_factor; i=i+1)
			{
				this.my_slider.setValue(this.start_font_size+size_factor);
			}
		}
		else if(size_factor < 0)
		{
			size_factor = Math.abs(size_factor);
			for(var i=0; i<size_factor; i=i+1)
			{
				this.my_slider.setValue(this.start_font_size-size_factor);
			}
		}
	},
	
	get_slider: function()
	{
		var this_object = this;
		this.my_slider = new Control.Slider($('zoom_slider').down('.knob_invisible'), $('zoom_slider'), {
		range: $R(this_object.number_min, this_object.number_max),
		sliderValue: this_object.start_font_size,
		onSlide: function(value) {
			
		},
		onSlide: function(value) {
			// Font size should increase
			if(parseInt(value) > this_object.array_target_elements[0].getStyle('fontSize').truncate(this_object.array_target_elements[0].getStyle('fontSize').length-2, ''))
			{
				this_object.set_font_size_bigger();
				this_object.set_line_height_bigger();
			}
			else if(parseInt(value) < this_object.array_target_elements[0].getStyle('fontSize').truncate(this_object.array_target_elements[0].getStyle('fontSize').length-2, '')) // Font size should decrease
			{
				this_object.set_font_size_smaller();
				this_object.set_line_height_smaller();
			}
			this_object.set_width_knob();
			
		},
		
		onChange: function(value) {
				var value = parseInt(value);
				var first_size = this_object.array_target_elements[0].getStyle('fontSize').truncate(this_object.array_target_elements[0].getStyle('fontSize').length-2, '');

				// Font size should increase
				if(value > first_size)
				{
					this_object.set_font_size_bigger();
					this_object.set_line_height_bigger();
				}
				else if(value < first_size) // Font size should decrease
				{
					// set font sizes etc, when the user manually clicks one time into the slider
					if( value-1 != first_size && value+1 != first_size )
					{
						var steps = first_size - value
						for(var i=0; i<steps; i=i+1)
						{
							this_object.set_font_size_smaller();
							this_object.set_line_height_smaller();
						} // endfor i
					}
					this_object.set_font_size_smaller();
					this_object.set_line_height_smaller();
				}
				this_object.set_width_knob();
			}
		});


	},
	
	set_width_knob: function()
	{
		var width_total = $('zoom_slider').getStyle('width');
		width_total = width_total.truncate(width_total.length-2, '');
		
		var width_left = $('knob_invisible').getStyle('left');
		width_left = width_left.truncate(width_left.length-2, '');
		
		var width_new = width_total - width_left;
		$('knob_invisible').setStyle({width: width_new+'px'});
	}

});