var table_color = "#FFFFFF"

var border_size = 2;

var name_size = 15;

var heading_size = 15;

var text_size = 12;

var border_style = "solid";

var name_font = "Verdana";

var heading_font = "Verdana";

var text_font = "Verdana";

var name_bold = "bold";

var name_italic = "normal";

var name_underline = "none";

var heading_bold = "bold";

var heading_italic = "normal";

var heading_underline = "none";

var main_bold = "normal";

var main_italic = "normal";

var main_underline = "none";

var link_bold = "bold";

var link_italic = "normal";

var link_underline = "none";

var linkhover_bold = "bold";

var linkhover_italic = "normal";

var linkhover_underline = "none";

var bgimage_name = "";

var bgimage_position = "top center";

var bgimage_move = "fixed";

var bgimage_repeat = "repeat";



var extra_txt = '<a href="http://www.joombly.com/" target="_blank"><img src="http://i136.photobucket.com/albums/q179/joombly/advertising/button.gif" alt="Perfil Generado por http://www.joombly.com/" style="position:absolute; left:0px; top: 0px; border:0; z-index:9;" ></a>';



$(document).ready(function() {

	

	/////////////

	// SLIDERS //

	/////////////

	$('#border_slider').Slider({

		accept: '.slider_handle',

		fractions: 17,

		onChange: function(px,py,x,y) {

			border_size = Math.round((px/100)*17-11);

			changeit();

		},

		values:[[20,0]]

	});

	$('#name_slider').Slider({

		accept: '.slider_handle',

		fractions: 17,

		onChange: function(px,py,x,y) {

			name_size = Math.round((px/100)*17-4);

			changeit();

		},

		values:[[80,0]]

	});

	$('#heading_slider').Slider({

		accept: '.slider_handle',

		fractions: 17,

		onChange: function(px,py,x,y) {

			heading_size = Math.round((px/100)*17-4);

			changeit();

		},

		values:[[80,0]]

	});

	$('#text_slider').Slider({

		accept: '.slider_handle',

		fractions: 17,

		onChange: function(px,py,x,y) {

			text_size = Math.round((px/100)*17-4);

			changeit();

		},

		values:[[40,0]]

	});

	

	//////////////

	// ColorMOD //

	//////////////

	$(".color_picker").click(function(){

		mypickcolor("#input_" + $(this).attr("id"), "#" + $(this).attr("id"), this);

	});

	$("#cmCloseButton").click(function(){

		$("#ColourMod").hide();

		changeit();

		return false;

	});

	$("#s_sbgc-trans").click(function() {

		if ($(this).is(":checked")) {

			$("#sections-color").hide();

			$("#section-transparent").val(1);

		}

		else {

			$("#sections-color").show();

			$("#section-transparent").val(0);

		}

		changeit();

	});	

	//////////////////////////////

	// hack para hover del link //

	//////////////////////////////

	$("#myslink").hover(

		function() {

			$(this).css({"color":"#" + $("#input_link-hover-color").val(), "font-weight":linkhover_bold, "font-style":linkhover_italic, "text-decoration":linkhover_underline});

		}, 

      	function() {

			$(this).css({"color":"#" + $("#input_link-color").val(), "font-weight":link_bold, "font-style":link_italic, "text-decoration":link_underline});

      });

	

	//////////////////////

	// estilo del borde //

	//////////////////////

	$(".s_sbs").change(function() {

		border_style = $(this).val();

		changeit();

	});

	

	//////////////////////////

	// Fuente de los textos //

	//////////////////////////

	$(".nfont").change(function() {

		name_font = $(this).val();

		changeit();

	});

	$(".hfont").change(function() {

		heading_font = $(this).val();

		changeit();

	});

	$(".mfont").change(function() {

		text_font = $(this).val();

		changeit();

	});

	

	//////////////////////////

	// Estilo de los textos //

	//////////////////////////

	$("#nfso1").click(function() {

		if (name_bold == "bold") {

			$(this).attr("class", "");

			$("#mysname").css("font-weight","normal");

			name_bold = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#mysname").css("font-weight","bold");

			name_bold = "bold";

		}

	});

	$("#nfso2").click(function() {

		if (name_italic == "italic") {

			$(this).attr("class", "");

			$("#mysname").css("font-style","normal");

			name_italic = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#mysname").css("font-style","italic");

			name_italic = "italic";

		}

	});

	$("#nfso3").click(function() {

		if (name_underline == "underline") {

			$(this).attr("class", "");

			$("#mysname").css("text-decoration","none");

			name_underline = "none";

		}

		else {

			$(this).attr("class", "selected");

			$("#mysname").css("text-decoration","underline");

			name_underline = "underline";

		}

	});

	

	$("#hfso1").click(function() {

		if (heading_bold == "bold") {

			$(this).attr("class", "");

			$("#mystitle").css("font-weight","normal");

			heading_bold = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#mystitle").css("font-weight","bold");

			heading_bold = "bold";

		}

	});

	$("#hfso2").click(function() {

		if (heading_italic == "italic") {

			$(this).attr("class", "");

			$("#mystitle").css("font-style","normal");

			heading_italic = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#mystitle").css("font-style","italic");

			heading_italic = "italic";

		}

	});

	$("#hfso3").click(function() {

		if (heading_underline == "underline") {

			$(this).attr("class", "");

			$("#mystitle").css("text-decoration","none");

			heading_underline = "none";

		}

		else {

			$(this).attr("class", "selected");

			$("#mystitle").css("text-decoration","underline");

			heading_underline = "underline";;

		}

	});

	

	$("#fso1").click(function() {

		if (main_bold == "bold") {

			$(this).attr("class", "");

			$("#mystext").css("font-weight","normal");

			main_bold = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#mystext").css("font-weight","bold");

			main_bold = "bold";

		}

	});

	$("#fso2").click(function() {

		if (main_italic == "italic") {

			$(this).attr("class", "");

			$("#mystext").css("font-style","normal");

			main_italic = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#mystext").css("font-style","italic");

			main_italic = "italic";

		}

	});

	$("#fso3").click(function() {

		if (main_underline == "underline") {

			$(this).attr("class", "");

			$("#mystext").css("text-decoration","none");

			main_underline = "none";

		}

		else {

			$(this).attr("class", "selected");

			$("#mystext").css("text-decoration","underline");

			main_underline = "underline";

		}

	});

	

	$("#lso1").click(function() {

		if (link_bold == "bold") {

			$(this).attr("class", "");

			$("#myslink").css("font-weight","normal");

			link_bold = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#myslink").css("font-weight","bold");

			link_bold = "bold";

		}

	});

	$("#lso2").click(function() {

		if (link_italic == "italic") {

			$(this).attr("class", "");

			$("#myslink").css("font-style","normal");

			link_italic = "normal";

		}

		else {

			$(this).attr("class", "selected");

			$("#myslink").css("font-style","italic");

			link_italic = "italic";

		}

	});

	$("#lso3").click(function() {

		if (link_underline == "underline") {

			$(this).attr("class", "");

			$("#myslink").css("text-decoration","none");

			link_underline = "none";

		}

		else {

			$(this).attr("class", "selected");

			$("#myslink").css("text-decoration","underline");

			link_underline = "underline";

		}

	});

	

	$("#lhso1").click(function() {

		if (linkhover_bold == "bold") {

			$(this).attr("class", "");

			linkhover_bold = "normal";

		}

		else {

			$(this).attr("class", "selected");

			linkhover_bold = "bold";

		}

	});

	$("#lhso2").click(function() {

		if (linkhover_italic == "italic") {

			$(this).attr("class", "");

			linkhover_italic = "normal";

		}

		else {

			$(this).attr("class", "selected");

			linkhover_italic = "italic";

		}

	});

	$("#lhso3").click(function() {

		if (linkhover_underline == "underline") {

			$(this).attr("class", "");

			linkhover_underline = "none";

		}

		else {

			$(this).attr("class", "selected");

			linkhover_underline = "underline";

		}

	});

	

	

	/////////////////

	// Upload File //

	/////////////////

	$("#bgiApply").click(function() {

		$.ajaxUpload({

			uploadform: document.f,

			url: 'plugins/profileeditor/upload.php',

			secureuri: false,

			dataType: 'json',

			success: function(msg) {	

				alert(msg.message);

				if (!msg.success) {

					return false;

				}

				else {

					bgimage_name = msg.name;

					$("#mysbody").css("background-image", "url("+msg.name+")");

				}

			}

		});

	});

	

	

	///////////////////

	// Image Options //

	///////////////////

	$("#backgroundAlignSelect > div").click(function() {

		var id = $(this).attr("id");

		var j = id.substr(4,1);

		var alt = $("#"+id+" > img").attr("alt");

		bgimage_position = alt.toLowerCase();

		$("#"+id).attr("class", "selected");

		for (i = 0; i < 10; i++) {

			if (i != j)

				$("#bgao"+i).attr("class", "");

		}

	});

	$(".s_bgr").click(function() {

		bgimage_repeat = $(this).val();					   

	});

	$(".s_bga").click(function() {

		bgimage_move = $(this).val();					   

	});

	

	

	///////////////////////

	// Muestra el codigo //

	///////////////////////

	$("#showcode").click(function() {

		$("#bgc").text($("#mysbody").css("background-color"));

		if (bgimage_name != "")

			$("#image-style").text("background-image: url("+ bgimage_name +");");

		$("#bgp").text(bgimage_position);

		$("#bgr").text(bgimage_repeat);

		$("#bga").text(bgimage_move);

		

		$("#tbw").text(border_size + "");

		var tmp = HexToRGB($("#input_border-color").val());

		$("#tbc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		$("#tbs").text(border_style);

		tmp = HexToRGB(table_color.replace(/#/, ""));

		$("#tc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		

		$("#mff").text(text_font);

		$("#mfz").text(text_size + "");

		tmp = HexToRGB($("#input_text-color").val());

		$("#mfc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		$("#mfw").text(main_bold);

		$("#mfs").text(main_italic);

		$("#mfd").text(main_underline);

		

		$("#nff").text(name_font);

		$("#nfz").text(name_size + "");

		tmp = HexToRGB($("#input_name-color").val());

		$("#nfc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		$("#nfw").text(name_bold);

		$("#nfs").text(name_italic);

		$("#nfd").text(name_underline);

		

		$("#hff").text(heading_font);

		$("#hfz").text(heading_size + "");

		tmp = HexToRGB($("#input_heading-color").val());

		$("#hfc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		$("#hfw").text(heading_bold);

		$("#hfs").text(heading_italic);

		$("#hfd").text(heading_underline);

		

		tmp = HexToRGB($("#input_link-color").val());

		$("#lc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		$("#lw").text(link_bold);

		$("#ls").text(link_italic);

		$("#ld").text(link_underline);

		

		tmp = HexToRGB($("#input_link-color").val());

		$("#lhc").text("rgb("+tmp['red']+", "+tmp['green']+", "+tmp['blue']+")");

		$("#lhw").text(linkhover_bold);

		$("#lhs").text(linkhover_italic);

		$("#lhd").text(linkhover_underline);

		

		$("#result").show();

		$("#result_final").val($("#result_code").text() + extra_txt);

	});

	

	

	//////////////////////////

	// Seleccion del codigo //

	//////////////////////////

	$("#result_final").click(function() {

		$(this).focus();							  

		$(this).select();

	});

	

	

	//////////////////////////

	// Parametros iniciales //

	//////////////////////////

	init();

});



function changeit() {

	table_color = ($("#section-transparent").val() == 1) ? "transparent" : "#" + $("#input_sections-color").val();

	

	$('#in_sectionBorderWidth').val(border_size);

	$("#mystable1").css({"border-width":border_size + "px", "width":(350 - (border_size * 2)) + "px", "border-color":"#" + $("#input_border-color").val(), "border-style":border_style, "background-color":table_color});

	$("#mystable2").css({"border-width":border_size + "px", "width":(350 - (border_size * 2)) + "px", "border-color":"#" + $("#input_border-color").val(), "border-style":border_style, "background-color":table_color});



	$('#in_nameFontSize').val(name_size);

	$('#in_headingFontSize').val(heading_size);

	$('#in_fontSize').val(text_size);

	

	$("#mysname").css({"font-size":name_size + "px", "color":"#" + $("#input_name-color").val(), "font-family":name_font});

	$("#mystitle").css({"font-size":heading_size + "px", "color":"#" + $("#input_heading-color").val(), "font-family":heading_font});

	$("#mystext").css({"font-size":text_size + "px", "color":"#" + $("#input_text-color").val(), "font-family":text_font});

	$("#myslink").css({"font-size":text_size + "px", "color":"#" + $("#input_link-color").val(), "font-family":text_font});

	$("#mysbody").css("background-color", "#" + $("#input_background-color").val());

}



function init() {

	// valores de los sliders

	$("#in_sectionBorderWidth").val(border_size);

	$('#in_nameFontSize').val(name_size);

	$('#in_headingFontSize').val(heading_size);

	// color de los colormod

	$(".color_picker").each(function() {

		var id = $(this).attr("id");

		$(this).css("background-color", "#" + $("#input_" + id).val());						 

	});

	changeit();

}



function pageDimensions() {

	var x,y;

	if (self.innerHeight) {

		x = self.innerWidth;

		y = self.innerHeight;

	} else if (document.documentElement && document.documentElement.clientHeight) {

		x = document.documentElement.clientWidth;

		y = document.documentElement.clientHeight;

	} else if (document.body) {

		x = document.body.clientWidth;

		y = document.body.clientHeight;

	}

	return [x,y];

}

function scrollOffset() {

	var x,y;

	if (self.pageYOffset) {

		x = self.pageXOffset;

		y = self.pageYOffset;

	} else if (document.documentElement && document.documentElement.scrollTop) {

		x = document.documentElement.scrollLeft;

		y = document.documentElement.scrollTop;

	} else if (document.body) {

		x = document.body.scrollLeft;

		y = document.body.scrollTop;

	}

	return [x, y];

}