var fontSize = new Array('mediumText', 'largeText', 'xLargeText');
var styleSwitcherRules = {
	'#mediumText' : function(el){
		el.onclick = function(){
			switchStyles('fontSize', 'mediumText');
			this.blur();
			return false;
		}
	},
	'#largeText' : function(el){
		el.onclick = function(){
			switchStyles('fontSize', 'largeText');
			this.blur();
			return false;
		}
	},
	'#xLargeText' : function(el){
		el.onclick = function(){
			switchStyles('fontSize', 'xLargeText');
			this.blur();
			return false;
		}
	}
};

/* rule registration can be fount in init.js */

function switchStyles(styleType, styleClass){

	/* switch classes */
	switch (styleType) {
	
		case 'fontSize':
 		for (i=0;i<fontSize.length;i++){
			if(checkClass(bodyEl, fontSize[i])){swapClass(bodyEl, fontSize[i], '')};
		}
		break;
		
		case 'bodyColor':
 		for (a=0;a<bodyColor.length;a++){
			if(checkClass(bodyEl, bodyColor[a])){swapClass(bodyEl, bodyColor[a], '')};
		}
		break;
	}
	
	addClass(bodyEl, styleClass);
	createCookie('styles',bodyEl.className,365);

}

function setUserStyles(){
	if (getCookie('styles')){
		document.getElementsByTagName('body')[0].className = readCookie('styles');
	} 
}

/* -- BASIC CLASS MANIPULATION AND TESTING METHODS -- */

// add class to the element
function addClass(o,c){
	if(!checkClass(o,c)){o.className+=o.className==''?c:' '+c;}
}

// add class to the element
function removeClass(o,c){
	if(checkClass(o,c)){o.className+=o.className==''?c:-c;}
}

// swap classes
function swapClass(o,c1,c2){
	var cn=o.className
	o.className=!checkClass(o,c1)?cn.replace(c2,c1):cn.replace(c1,c2);
}

// check if an element has the defined class
function checkClass(o,c){
	return new RegExp('\\b'+c+'\\b').test(o.className);
}