// GLOBAL INIT
$(document).ready(function() {
	
	Preferences.init();
	
});



var Preferences = {



	// INIT
	init: function() {
		
		// Build nodes
		var myP = document.createElement("P");
		myP.id = "preferences-launcher";
		var myLink = myP.appendChild(document.createElement("A"));
		myLink.onclick = function() { Preferences.showPreferences(); }
		myLink.appendChild(document.createTextNode(Localization.prefs_title));
		
		var navigation = document.getElementById("alternate-navigation");
		if (! navigation ) navigation = document.getElementById("page-navigation");
		var refChild = navigation.nextSibling;
		if (refChild) {
			navigation.parentNode.insertBefore(myP, refChild);
		} else {
			navigation.parentNode.appendChild(myP);
		}

	},


	// UPDATE PREFERENCES
	updatePreferencesCookie: function(idx1, val1, idx2, val2) {
		
		// Update cookie
		var oldCookie = readCookie("preferences");
		if (oldCookie) {
			var cookieVals = oldCookie.split(/_/);
			cookieVals[idx1] = val1;
			if (idx2 != null) cookieVals[idx2] = val2;
			var newCookie = cookieVals.join("_");
			writeCookie("preferences", newCookie, 7);
		}
		
	},


	// UPDATE COLOR STYLESHEET
	updateColorStylesheet: function(idx1, val1, idx2, val2) {
		
		this.updatePreferencesCookie(idx1, val1, idx2, val2);
		
		// REFRESH COLOR STYLESHEET
		var myExp = /(.*)\/colors_(.*)\.css$/;
		var linkElems = document.getElementsByTagName("LINK");
		var sheets = Array();
		var prefs = Array();
		var paths = Array();
		for (var i = linkElems.length - 1; i > 0; i--) {
			if (linkElems[i].getAttribute("rel").indexOf("stylesheet") == -1) continue;
			var myMatch = linkElems[i].href.match(myExp);
			if (myMatch) {
				sheets[sheets.length] = linkElems[i];
				paths[paths.length] = myMatch[1];
				prefs[prefs.length] = myMatch[2];
			}
		}
		
		if (sheets.length >= 2) {
			var myPrefs = prefs[0].split(/_/);
			myPrefs[idx1] = val1;
			if (idx2 != null) myPrefs[idx2] = val2;
			var newHref = paths[0] + "/colors_" + myPrefs.join("_") + ".css";
			sheets[1].href = sheets[0].href;
			sheets[0].href = newHref;
		}
		
	},


	// UPDATE CURRENT COLOR
	updateCurrentColor: function(aCell, className) {
		
		var myCells = document.getElementById("color-chooser").getElementsByTagName("TD");
		for (var i = 0; i < myCells.length; i++) {
			if (! myCells[i].className) continue;
			removeClass(myCells[i], className);
		}
		addClass(aCell, className);
		
	},


	// BUILD PREFERENCES
	showPreferences: function() {
		
		var myPrefs = document.getElementById("preferences");
		if (myPrefs) {
			myPrefs.className = "Open";
			return;
		}
		myPrefs = document.body.appendChild(document.createElement("DIV"));
		myPrefs.id = "preferences";
		myPrefs.className = "Open";
		
		var myA = myPrefs.appendChild(document.createElement("A"));
		myA.appendChild(document.createTextNode("x"));
		myA.className = "Closer";
		myA.onclick = function() {
			document.getElementById("preferences").className = "Closed";
		}
		var cookieVals = Array();
		var prefCookie = readCookie("preferences");
		if (prefCookie) {
			cookieVals = prefCookie.split(/_/);
		}
		// Form required by Konqueror for radio buttons
		var myForm = myPrefs.appendChild(document.createElement("FORM"));
		myForm.id = "preferences-form";
		myForm.appendChild(this.buildTextChooser(cookieVals));
		myForm.appendChild(this.buildColorChooser(cookieVals));
		
		// DEFAULTS
		// WARNING: in IE, input attrs need to be set before the node is inserted
		var myP = myPrefs.appendChild(document.createElement("P"));
		myP.className = "Defaults";
		myButton = document.createElement("INPUT");
		myButton.type = "button";
		myButton.value = Localization.prefs_defaults;
		myButton.onclick = function() {
			writeCookie("preferences", "");
			var myExp = /^[^\#]+/;
			var myMatch = ("" + window.location).match(myExp);
			window.location = myMatch[0];
		}
		myP.appendChild(myButton);
		
		// IE Sucks
		var ieSucks = document.getElementById("text-chooser").getElementsByTagName("INPUT");
		for (var i = 0; i < ieSucks.length; i++) {
			if (ieSucks[i].value == "toCheck") try { 
				ieSucks[i].checked = "checked";
			} catch(e) {
			}
		}
		
	},


	// BUILD CHECKBOX ELEMENT
	// WARNING: in IE, input attrs need to be set before the node is inserted
	buildCheckbox: function(parent, label, val, cookieIdx, bodyClass) {
		var myLabel = parent.appendChild(document.createElement("LABEL"));;
		var myInput = document.createElement("INPUT");
		myInput.type = "checkbox";
		if (val == "1") try {
			myInput.checked = checked;
		} catch(e) {
			myInput.value = "toCheck"; // IE Sucks
		}
		myInput.onclick = function() {
			this.checked ? addClass(document.body, bodyClass) : removeClass(document.body, bodyClass);
			Preferences.updatePreferencesCookie(cookieIdx, this.checked ? 1 : 0);
		}
		myLabel.appendChild(myInput);
		myLabel.appendChild(document.createTextNode(" " + label));
		return myLabel;
	},


	// BUILD RADIO ELEMENT
	// WARNING: in IE, input attrs need to be set before the node is inserted
	buildRadio: function(parent, labels, val, cookieIdx, bodyClasses, fname) {
		for (var idx = 0; idx < labels.length; idx++) {
			var myLabel = parent.appendChild(document.createElement("LABEL"));
			var myInput = document.createElement("INPUT");
			myInput.type = "radio";
			myInput.name = fname;
			myInput.value = idx;
			if (val == idx) try {
				myInput.checked = checked;
			} catch(e) {
				myInput.defaultChecked = true; // IE Sucks
			}
			myInput.onclick = function() {
				removeClasses(document.body, bodyClasses);
				addClass(document.body, bodyClasses[this.value]);
				Preferences.updatePreferencesCookie(cookieIdx, this.value);
			}
			myLabel.appendChild(myInput);
			myLabel.appendChild(document.createTextNode(" " + labels[idx]));
		}
		return myLabel;
	},


	// BUILD SELECT ELEMENT
	buildSelect: function(parent, opts, val) {
		var mySelect = parent.appendChild(document.createElement("SELECT"));
		var myOption;
		for (var i = 0; i < opts.length; i++) {
			myOption = mySelect.appendChild(document.createElement("OPTION"));
			myOption.value = opts[i][0];
			if (opts[i][0] == val) myOption.selected = "selected";
			myOption.appendChild(document.createTextNode(opts[i][1]));
		}
		return mySelect;
	},


	// BUILD TEXT CHOOSER LINE
	buildTextChooserLine: function(parent, label) {

		myP = parent.appendChild(document.createElement("P"));
		myP.appendChild(document.createElement("EM")).appendChild(document.createTextNode(label));
		return myP;

	},


	// BUILD TEXT CHOOSER
	buildTextChooser: function(cookieVals) {
		
		$cIdx = 7;
		
		var myP, mySpan, myLabel, myInput, labels, bodyClasses, myNode;
		var myChooser = document.createElement("DIV");
		myChooser.id = "text-chooser";
		
		// TEXT SIZE
		labels = Array("A", "A", "A");
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_text_size);
		bodyClasses = Array("Text0", "Text1", "Text2");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_text_size");
		// small
		myNode = myP.firstChild.nextSibling;
		myNode.title = Localization.prefs_size_small;
		myNode.style.fontSize = "75%";
		// medium
		myNode = myNode.nextSibling;
		myNode.title = Localization.prefs_size_medium;
		myNode.style.fontSize = "100%";
		// large
		myNode = myNode.nextSibling;
		myNode.title = Localization.prefs_size_large;
		myNode.style.fontSize = "120%";
		
		// TEXT FONT + TITLES FONT
		labels = Array(Localization.prefs_font_sans, Localization.prefs_font_serif, Localization.prefs_font_mono);
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_text_font);
		bodyClasses = Array("Sans", "Serif", "Mono");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_text_font");
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_titles_font);
		bodyClasses = Array("TSans", "TSerif", "TMono");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_titles_font");
		
		// TITLES FONT VARIANT
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_titles_variant);
		this.buildCheckbox(myP, Localization.prefs_variant_smallcaps, cookieVals[$cIdx], $cIdx++, "TSmallCaps");
		this.buildCheckbox(myP, Localization.prefs_variant_italic, cookieVals[$cIdx], $cIdx++, "TItalic");
		this.buildCheckbox(myP, Localization.prefs_variant_bold, cookieVals[$cIdx], $cIdx++, "TBold");
		
		// TITLE DECO
		labels = Array(Localization.prefs_deco_plain, Localization.prefs_deco_tab, Localization.prefs_deco_fancy);
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_title1_deco);
		bodyClasses = Array("", "TabH1", "FancyH1");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_title1_deco");
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_title2_deco);
		bodyClasses = Array("", "TabH2", "FancyH2");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_title2_deco");
		
		// LOGO + BANNER ALIGNMENT
		labels = Array(Localization.prefs_align_left, Localization.prefs_align_center, Localization.prefs_align_right);
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_logo_align);
		bodyClasses = Array("", "LogoC", "LogoR");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_logo_align");
		myP = this.buildTextChooserLine(myChooser, Localization.prefs_banner_align);
		bodyClasses = Array("", "BannerC", "BannerR");
		this.buildRadio(myP, labels, cookieVals[$cIdx], $cIdx++, bodyClasses, "prefs_banner_align");
		
		// THE END :)
		return myChooser;
		
	},


	// BUILD COLOR CHOOSER
	buildColorChooser: function(cookieVals) {

		var selectSize = 1;
		var myP, mySelect, lbl, opts;
		var myChooser = document.createElement("DIV");
		myChooser.id = "color-chooser";
		
		// COLOR SELECTOR
		// WARNING: in IE, input attrs need to be set before the node is inserted
		var sLine, sLabel, sInput;
		sLine = myChooser.appendChild(document.createElement("P"));
		
		sLabel = sLine.appendChild(document.createElement("LABEL"));
		sInput = document.createElement("INPUT");
		sInput.type = "radio"; sInput.name = "color_type"; sInput.id = "prefs_color_0";
		sInput.checked = "checked";
		sLabel.appendChild(sInput);
		sLabel.appendChild(document.createTextNode("base color (black x)"));
		
		sLabel = sLine.appendChild(document.createElement("LABEL"));
		sInput = document.createElement("INPUT");
		sInput.type = "radio"; sInput.name = "color_type"; sInput.id = "prefs_color_1";
		sLabel.appendChild(sInput);
		sLabel.appendChild(document.createTextNode("accents color (white x)"));
		
		// COLOR PICKER
		var myTable = myChooser.appendChild(document.createElement("TABLE"));
		var myTBody = myTable.appendChild(document.createElement("TBODY"));
		var step = 32;
		for (sat = 255; sat > 0; sat -= step) {
				if (sat < 160) step = 16;
				if (sat < 64) step = 8;
			var myRow = myTBody.appendChild(document.createElement("TR"));
			for (hue = 0; hue < 256; hue += 8) {
				var myCell = myRow.appendChild(document.createElement("TD"));
				myCell.hue = hue;
				myCell.sat = sat;
				myCell.title = "H:" + hue + "-S:" + sat;
				if (hue == 0) myCell.title += " : red";
				if (hue == 40) myCell.title += " < yellow";
				if (hue == 88) myCell.title += " > green";
				if (hue == 128) myCell.title += " : cyan";
				if (hue == 168) myCell.title += " < blue";
				if (hue == 216) myCell.title += " > magenta";
				myCell.style.background = myCell.style.color = this.HSV_TO_RGB(hue, sat, 128);
				if (hue == cookieVals[0] && sat == cookieVals[1]) addClass(myCell, "Current");
				if (hue == cookieVals[2] && sat == cookieVals[3]) addClass(myCell, "Second");
				myCell.onclick = function() {
					$colorNum = 0;
					if (document.getElementById("prefs_color_0").checked) {
						Preferences.updateCurrentColor(this, "Current");
						Preferences.updateColorStylesheet(0, this.hue, 1, this.sat);
					} else if (document.getElementById("prefs_color_1").checked) {
						Preferences.updateCurrentColor(this, "Second");
						Preferences.updateColorStylesheet(2, this.hue, 3, this.sat);
					}
				}
				myCell.appendChild(document.createTextNode("X"));
			}
		}
		
		// SELECT ELEMENTS
		myP = myChooser.appendChild(document.createElement("P"));
		
		// type
		var lblL = Localization.prefs_color_light;
		var lblD = Localization.prefs_color_dark;
		mySelect = this.buildSelect(myP, Array(
			Array("0", lblL + " + " + lblL),
			Array("3", lblD + " + " + lblD),
			Array("2", lblL + " + " + lblD),
			Array("1", lblD + " + " + lblL)
		), cookieVals[4]);
		mySelect.size = selectSize;
		mySelect.onchange = function() {
			Preferences.updateColorStylesheet(4, this.value);
		}
		
		// contrast
		lbl = Localization.prefs_color_contrast + " ";
		opts = Array();
		for (var i = -5; i <= 5; i++) {
			opts[opts.length] = Array(i, lbl + (i >= 0 ? '+' : '') + i);
		}
		mySelect = this.buildSelect(myP, opts, cookieVals[5]);
		mySelect.size = selectSize;
		mySelect.onchange = function() {
			Preferences.updateColorStylesheet(5, this.value);
		}
		
		// birghtness
		lbl = Localization.prefs_color_brightness + " ";
		opts = Array();
		for (var i = -5; i <= 5; i++) {
			opts[opts.length] = Array(i, lbl + (i >= 0 ? '+' : '') + i);
		}
		mySelect = this.buildSelect(myP, opts, cookieVals[6]);
		mySelect.size = selectSize;
		mySelect.onchange = function() {
			Preferences.updateColorStylesheet(6, this.value);
		}
		
		return myChooser;
		
	},


	// HSV TO RGB
	HSV_TO_RGB: function (H, S, V) {
		
		H = H / 255;
		S = S / 255;
		V = V / 255;
		var R, G, B;
		
		if (S == 0) {
			R = G = B = V * 255;
		}
		else {
			
			var var_H, var_i, var_1, var_2, var_3;

			var_H = H * 6;
			var_i = Math.floor( var_H );
			var_1 = V * ( 1 - S );
			var_2 = V * ( 1 - S * ( var_H - var_i ) );
			var_3 = V * ( 1 - S * (1 - ( var_H - var_i ) ) );

			if       (var_i == 0) { var_R = V     ; var_G = var_3  ; var_B = var_1 ; }
			else if  (var_i == 1) { var_R = var_2 ; var_G = V      ; var_B = var_1 ; }
			else if  (var_i == 2) { var_R = var_1 ; var_G = V      ; var_B = var_3 ; }
			else if  (var_i == 3) { var_R = var_1 ; var_G = var_2  ; var_B = V     ; }
			else if  (var_i == 4) { var_R = var_3 ; var_G = var_1  ; var_B = V     ; }
			else                  { var_R = V     ; var_G = var_1  ; var_B = var_2 ; }

			R = parseInt(var_R * 255);
			G = parseInt(var_G * 255);
			B = parseInt(var_B * 255);
		}

		return "rgb(" + R + "," + G + "," + B + ")";
		
	}


};