0byt3m1n1

Path: /data/applications/aps/tikiwiki/14.1-0/standard/htdocs/lib/jquery_tiki/ [ Home ]
File: tiki-themegenerator.js
/* $Id: tiki-themegenerator.js 55342 2015-05-06 12:57:37Z jonnybradley $
 *
 * Include JS file for Tiki 7 Theme Generator
 */

$(document).ready( function() {
	
	// float button fn
	$(".tgFloatDialog").click(function() {
		openThemeGenDialog($("select[name=themegenerator_theme]").val());
		return false;
	});
});
	
function initThemeGenDialog() {    // closure for colorpicker code
	// 
	// colorpicker for the colour swatches
	// expose options for event fns
	var colorSelector = ".colorSelector > div";
	var colorInput = "input.tgValue";

	var colorPickerListItem = null;		// still sort of globals really
	var tgLivePreviews = [];		// need to know what was clicked from "inside" colorpicker


	var getHex = function ( rgb ) {	// RGB values must be integers in the range 0-255
		return '#' + (0x1000000 + rgb[0]*0x10000 + rgb[1]*0x100 + rgb[2]).toString(16).slice(-6);
	};

	var opts = {
		color:'#888',
		onBeforeShow:function () {
			colorPickerListItem = $(this).parent();	 // store for later (maybe there's a better way?)

			var c = $.trim($(colorInput, colorPickerListItem).val());
			var m = c.match(/^#([0-9A-F]{3})$/i);	// check for only 3 hex chars
			if (m) {
				c = c[0] + c[1] + c[1] + c[2] + c[2] + c[3] + c[3];	// double 'em
			}
			$(this).ColorPickerSetColor(c);

			if ($(".tgLivePreview:checked", $(colorPickerListItem).parent().parent()).length) {
				tgLivePreviews = [];
				m = $(colorInput, colorPickerListItem).attr("name");
				m = m.match(/\[(.*?)\]/);	// colour type
				if (m) {
					m = m[1];
				}
				if (m === "fgcolors") {
					m = ["color"];
				} else if (m === "bgcolors") {
					m = ["background-color"];
				} else if (m === "bordercolors") {
					m = ["border-top-color", "border-right-color", "border-bottom-color", "border-left-color", "border-color", "border"];
				}
				var zall = $(":visible");
				for (var t in m) {
					for (var i = 0; i < zall.length; i++) {
						var $el = $(zall[i]);
						if ($el.length && $el.css(m[t]) && getHex($el.css(m[t])) == c) {
							tgLivePreviews.push([ m[t], $el[0] ]);
						}
					}
				}
			}
		},
		onShow:function (colpkr) {
			$(document.body).css("user-select", "none");
			$(document.body).css("-webkit-user-select", "none");
			$(document.body).css("-moz-user-select", "none");
			$(colpkr).fadeIn(500);
			return false;
		},
		onHide:function (colpkr) {
			$(document.body).css("user-select", "");
			$(document.body).css("-webkit-user-select", "");
			$(document.body).css("-moz-user-select", "");
			colorPickerListItem = null;
			$(colpkr).fadeOut(500);
			return false;
		},
		onChange:function (hsb, hex, rgb) {
			if (colorSelector) {
				$(colorSelector, colorPickerListItem).css('backgroundColor', '#' + hex);
			}
			if (colorInput) {
				$(colorInput, colorPickerListItem).val('#' + hex);
			}
			$(colorPickerListItem).addClass('changed');

			if ($(".tgLivePreview:checked", $(colorPickerListItem).parent().parent()).length) {
				$(tgLivePreviews).each(function () {
					$(this[1]).css(this[0], '#' + hex);
				});
			}
		},
		onSubmit:function (hsb, hex, rgb, el) {
			this.onChange(hsb, hex, rgb);
		}
	};	// end opts for colorpicker

	$(".colorSelector").each(function () {
		var colorItem = this;
		$(this).parent().ColorPicker(opts);
	});

	// checkboxes to select items
	$(".tgItems :checkbox").click(function (e, flip) {
		if (flip) {
			if (!$(this).prop("checked")) { // flip trickery to get trigger to toggle the right classes
				$(this).parent().addClass("selected");
			} else {
				$(this).parent().removeClass("selected");
			}
		} else {
			if ($(this).prop("checked")) { // flip trickery to get trigger to toggle the right classes
				$(this).parent().addClass("selected");
			} else {
				$(this).parent().removeClass("selected");
			}
		}
	});

	// reset button fn
	$(".tgResetSection").click(function () {
		var container = $(this).parent().nextAll("ul");
		$(".tgItem :checkbox:checked", container).each(function () {
			$(this).parent().find("input.tgValue").val($(this).val());
			$(this).parent().find(".colorSelector > div").css("background-color", $(this).val());
			$(this).trigger("click", [true]);
			//$(this).parent().removeClass("selected");
		});
		return false;
	});

	// select modified colours
	$(".tgToggleChanged").click(function () {
		var container = $(this).parent().nextAll("ul");
		$(".tgItem", container).each(function () {
			if ($("input.tgValue", this).val() !== $("input[type=checkbox]", this).val()) {
				$(this).find("input[type=checkbox]").trigger("click", [true]);
			}
		});
	});

	// toggle selection
	$(".tgToggle").click(function () {
		var container = $(this).parent().nextAll("ul");
		$("input[type=checkbox]", container).trigger("click", [true]);
	});

	if (jqueryTiki.ui) {
		$(function () {
			var $div;
			$(".tgSize", "#themegenerator_container").focus(
				function () {

					if ($div) {
						$div.fadeOut("fast").remove();
					}
					var $input = $(this);
					var unit = getUnit($input);
					var val = getNumber($input);
					var pxVal = val;
					if (unit == "em") {
						pxVal = $(parseFloat(val)).toPx();
					} else if (unit == "%") {
						pxVal = $(parseFloat(val / 100.0)).toPx();
					}
					var options = {
						min: -1,
						max: val > 0 ? val * 10 : 20,
						step: 1,
						value: val,
						slide: function () {
							setNumber($input, $(this).slider("value"));
							if ($(".tgLivePreview:checked", $(this).parents(".tgItems").parent()).length) {
								$(tgLivePreviews).each(function () {
									$(this[1]).css(this[0], $input.val());
								});
							}
						}
					};
					if ("em|ex|in|cm|mm".indexOf(unit) > -1) {
						options.min = 0;
						options.max = val * 5;
						options.step = 0.01;
					} else if ("%".indexOf(unit) > -1) {
						options.min = val * 0.8;
						options.max = val * 1.2;
					}

					if ($(".tgLivePreview:checked", $(this).parents(".tgItems").parent()).length) {
						tgLivePreviews = [];
						var m = $(this).attr("name");
						m = m.match(/\[(.*?)\]/);	// size type
						if (m) {
							m = m[1];
						}
						if (m === "fontsize") {
							m = ["font-size"];
						} else if (m === "borderwidths") {
							m = ["border-top-width", "border-right-width", "border-bottom-width", "border-left-width"];
						} else if (m === "lineheight") {
							m = ["line-height"];
						} else if (m === "borderradii") {
							m = ["border-radius", "-webkit-border-radius", "-moz-border-radius",
								"border-top-left-radius", "-webkit-border-top-left-radius", "-moz-border-radius-topleft",
								"border-top-right-radius", "-webkit-border-top-right-radius", "-moz-border-radius-topright",
								"border-bottom-left-radius", "-webkit-border-bottom-left-radius", "-moz-border-radius-bottomleft",
								"border-bottom-right-radius", "-webkit-border-bottom-right-radius", "-moz-border-radius-bottomright"
							];
						}
						var zall = $(":visible:not(#themegenerator_container *)");
						for (var t in m) {
							for (var i = 0; i < zall.length; i++) {
								var $el = $(zall[i]);
								if ($el.length && $el.css(m[t])) {
									var s = $el.css(m[t]).match(/([\d\.\-+]+)(?:px|em|ex|%|in|cm|mm|pt|pc)?/);
									if (s && s[1] && Math.round(s[1]) == pxVal) {
										tgLivePreviews.push([m[t], $el[0]]);
									}
								}
							}
						}
					}


					$div = $("<div style='position:absolute;width:" + $input.parent().width() + "px; height:11px;right:0;" +
					"top:" + $input.height() * 2 + "px;display:none;' />");
					$div.slider(options);
					$input.parent().append($div);
					$div.show("fast");
				}).blur(function () {
					//if ($div) { $div.remove(); }
				});
		});

		var getNumber = function ($el) {
			var m = $el.val().match(/([\d\.\-+]+)(?:px|em|ex|%|in|cm|mm|pt|pc)?/);
			if (m) {
				return m[1];
			} else {
				return 0;
			}
		};
		var setNumber = function ($el, val) {
			$el.val(val + getUnit($el));
		};
		var getUnit = function ($el) {
			var m = $el.val().match(/[\d\.\-+]+(px|em|ex|%|in|cm|mm|pt|pc)?/);
			if (m) {
				return m[1];
			} else {
				return "px";	// default to px if no unit specified
			}
		}
	}

//	// disable for now
//	$("input[type=checkbox].tgLivePreview", "#tg_section_typography")
//		.prop("checked", "")
//		.attr("disabled", "disabled");

	$("label", "#themegenerator_container").each(function () {    // labels go 100% width in dialog
		$(this).css("width", ($(this).text().length * 0.6) + "em");
	});

//	$(".themegenerator", "#themegenerator_container").tabs({
//		select:function (event, ui) {
//			setCookie("tab", ui.index, "themegen");
//		},
//		selected:getCookie("tab", "themegen", 0)
//	});

	if (jqueryTiki.tooltips) {
		$(document).tiki_popover();
	}

	$("#tg_css_file", "#themegenerator_container").change(function () {
		openThemeGenDialog();
	});
}


function openThemeGenDialog( themename ) {
	if (themename) {
		setCookie("name", themename, "themegen");
	} else {
		themename = getCookie("name", "themegen", tr("no theme"));
	}
	var l = getCookie("left", "themegen");
	var t = getCookie("top", "themegen");
	var w = getCookie("width", "themegen", 660);
	var h = getCookie("height", "themegen", 500);
	var p = { my: "center", at: "center", of: window };

	if (l !== null && t !== null) {
		p = { my: "left top", at: "left+" + parseInt(l, 10) + " top+"+ parseInt(t, 10), of: window };
	}

	var $themegeneratorContainer = $("#themegenerator_container");
	if ($themegeneratorContainer.length === 0) {
		$("body").append($("<div id='themegenerator_container'><form action='tiki-admin.php?page=look&cookietab=6' method='post'></form></div>"));
	}

	var $form = $('form', $themegeneratorContainer);

	$.post("tiki-admin.php?page=look", {tg_open_dialog: true, tg_css_file: $("#tg_css_file", "#themegenerator_container").val()}, function(data) {
			if (!$form.length) {
				$themegeneratorContainer = $("#themegenerator_container");
				$form = $("form", $themegeneratorContainer);
			}
			$form.html(data);
			initThemeGenDialog();
			ajaxLoadingHide();
		},
	"html");

	$themegeneratorContainer
		.dialog({
			width: w,
			height: h,
			position: p,
			modal: false,
			title: tr("Theme Generator:") + " " + themename,
			buttons: {
				Cancel: function () {
					$(this).dialog('close');
					setCookie("themegen", "");
					deleteCookie("themegen");
				},
				'Save': function () {
					var bValid = true;

					if (bValid) {

						$form.submit();
						$(this).dialog('close');
					}
				},
				Preview: function () {

					$form.append($("<input type='hidden' name='tg_preview' value='dialog' />"))
						.submit();
					//$(this).dialog('close');
				}
			},
			close: function () {
				setCookie("state", "closed", "themegen");
				$(this).find('input[type=text]').val('').removeClass('ui-state-error');
			},
			open: function (event, ui) {
				setCookie("state", "open", "themegen");
			},
			dragStop: function (event, ui) {
				setCookie("left", parseInt(ui.position.left, 10), "themegen");
				setCookie("top", parseInt(ui.position.top, 10), "themegen");
			},
			resizeStop: function (event, ui) {
				setCookie("width", parseInt(ui.size.width, 10), "themegen");
				setCookie("height", parseInt(ui.size.height, 10), "themegen");
			}
		})
		.parent().css("z-index", 5);

	ajaxLoadingShow('themegenerator_container');
}