/*
	The gaps for each font-size is by 2 pixels.
	"small" is the default font-size.
	
	CASE "small":-
	if the user preference font-size is medium 
		then it will add 2 pixels to each of the text in the page.
	if the user preference font-size is large 
		then it will add 4 pixels to each of the text in the page.
		
	CASE "medium":-
	if the user preference font-size is small 
		then it will subtract 2 pixels of each text in the page.
	if the user preference font-size is large 
		then it will add 2 pixels to each of the text in the page.
		
	CASE "large":-
	if the user preference font-size is small 
		then it will subtract 4 pixels of each text in the page.
	if the user preference font-size is medium
		then it will subtract 2 pixels to each of the text in the page.
		
	This font-size changing function is written using jQuery.
	Changing ".textChangeSize" means, the text changing on the page will not work properly.
	".textChangeSize" is the identity class serve for this function.
	
	The method for this function is to loop each of the tags in the html which contain ".textChangeSize",
	then it will retrieve the current tag's font-size and add pixels to it.
	
	Two parameters mode is availabe in this function.
	load (Case-Sensitive) - When user refresh or redirect to another page. It still trigger the text changing functions to change the default font-size to user preference font size.
	click (Case-Sensitive) - Stop/Prevent user from keep-on clicking on the button to trigger the font-size changing if user preference font-size is same as current font-size.
*/
function userPreferenceFontSize(size, mode){
	if($(".textChangeSize").length != 0){	
		if(getCookies("userPreferenceFontSize") == undefined || getCookies("userPreferenceFontSize") == ""){
			var previousFontSize = "small"; //default font-size if cookies is empty
		}
		else{
			var previousFontSize = getCookies("userPreferenceFontSize");
		}
		
		//Loop each of .textChangeSize class and change the fonts size accordingly.
		$(".textChangeSize").each(function(){			
			var currentFontSize = $(this).css("font-size");
			var intFontSize = parseInt(currentFontSize.replace("px", ""));
			var intFontSizeToChange = 0;
				
			switch(size){
				case "small":					
					if(previousFontSize == "medium"){
						intFontSizeToChange = -2;
					}
					else if(previousFontSize == "large"){
						intFontSizeToChange = -4;
					}
					else if(mode == "load"){
						intFontSizeToChange = 0;
					}
					$(".textChangeSize").css("letterSpacing", "0px");
					$(".textChangeSize").css("line-height", "18px");
				break;
				
				case "medium":
					if(previousFontSize == "small"){
						intFontSizeToChange = 2;
					}
					else if(previousFontSize == "large"){
						intFontSizeToChange = -2;
					}
					else if(mode == "load"){
						intFontSizeToChange = 2;
					}
					$(".textChangeSize").css("letterSpacing", "1px");
					$(".textChangeSize").css("line-height", "20px");
				break;
				
				case "large":
					if(previousFontSize == "small"){
						intFontSizeToChange = 4;
					}
					else if(previousFontSize == "medium"){
						intFontSizeToChange = 2;
					}
					else if(mode == "load"){
						intFontSizeToChange = 4;
					}
					$(".textChangeSize").css("letterSpacing", "2px");
					$(".textChangeSize").css("line-height", "22px");
				break;				
			}
			
			//Load font size	
			$(this).css("font-size", (intFontSize+intFontSizeToChange)+"px");	
		});	
		
		//Store the latest user preference font-size into this cookie. It will use for next round if user change the font-size again.
		setCookies("userPreferenceFontSize", size); 
	}
}

$(document).ready(function(){
	if(getCookies("userPreferenceFontSize") == undefined || getCookies("userPreferenceFontSize") == ""){
		var userPreferenceSize = "small";
	}
	else{
		var userPreferenceSize = getCookies("userPreferenceFontSize");
	}
	
	//Load when user refresh or redirect to another page. The cookies will be clear off once the browser is close completely.
	userPreferenceFontSize(userPreferenceSize, "load");
});