TP.FontControl = Class.create({
	previous: null, 
	listeners: new Array(),
	initialize: function(){
		this.previous = $('default_font');
		if($('font_size') != null){
			$$('dl#font_size dd.font_change').each(function(el) {
				el.down().observe('click', function(event) { 
					this.change(el); 
					event.stop(); 
				}.bind(this));
			}.bind(this));

			fontSize = document.cookie.match ( 'fontSize=(.*?)(;|$)' );

			if(fontSize != null && typeof fontSize[1] != 'undefined'){
				this.change(fontSize[1]);
			} 
		}
	},
	change: function(el) {
		el = $(el);
		if (this.previous) 
			this.previous.down().removeClassName('on');
			
		this.previous = el;
		el.down().addClassName('on');
		
		var fontSize;
		switch(el.id){
			case 'large_font':
				fontSize = '100%';
				break;
			case 'medium_font':
				fontSize = '90%';
				break;
			case 'default_font':
				fontSize = '82%';
				break;
		}
		
		$$('body').first().style.fontSize = fontSize;
				
		document.cookie = 'fontSize='+el.id+';path=/;';		

		this.listeners.each(function(func){
			func();
		});			
	}, 
	
	registerEvent: function(event){
		this.listeners[this.listeners.size()] = event;
	}
});

document.observe("dom:loaded", function(){
	TP.fontControl = new TP.FontControl();
	
	// if the overview search exists we have to register it as an event listener
	// The OS should be created before the load events are fired of fto ensure a smooth appearance.
	if(TP.os != null){
		TP.fontControl.registerEvent(TP.os.refreshEvent);
		TP.fontControl.listeners.each(function(func){
			func();
		});			
	}
});

