// $Id: tree-wizard.js 5239 2006-11-21 16:16:58Z alex $
/**
 * The southprojects DHTML Calendar
 *
 * Copyright (c) 2006 by SouthProjects
 * http://www.southprojects.com
 * Santiago, Chile,
 * Version 1.2 Dec 2006.
 * All rights reserved.
 *
 *
 * Tree Wizard
 */


var wizard = null;
var Utils = southprojects.Utils;

function initWizard() {
	wizard = new southprojects.Wizard({
		tabsID      : 'tabs',
		tabBarID    : 'tab-bar'
        });
	wizard.onInit = initPage;
	wizard.addCustomValidator("initLevel", function(value) {
		// allow the empty string or a pozitive integer
		if (/^\+?[0-9]*$/.test(value))
			return true;
		return "You can write a pozitive integer or leave this field blank.";
	});
	wizard.onBeforeTabChange = function(currentTab, newTab) {
		if (newTab == "pane-contents")
			clearIcons();
		// allow tab to change
		return true;
	};
	wizard.setupNav();
	wizard.init();
};

function initPage() {
	southprojects.Tooltip.setupFromDFN();
	var dul = document.getElementById("designtree");
	var lis = dul.getElementsByTagName("li");
	for (var i = lis.length; --i >= 0;) {
		var li = lis[i];
		_designInitLI(li);
	}
	var designlabel = document.getElementById("f_design_label");
	designlabel.onkeyup = function() {
		var self = this;
		setTimeout(function() {
			var li = _g_design_currentLI;
			if (li) {
				while (li.firstChild && !/^[uo]l$/i.test(li.firstChild.tagName))
					li.removeChild(li.firstChild);
				var div = document.createElement("div");
				div.innerHTML = self.value;
				var p = li.firstChild;
				while (div.firstChild)
					li.insertBefore(div.firstChild, p);
			}
		}, 25);
	};
	designlabel.onkeypress = function(ev) {
		ev || (ev = window.event);
		if (ev.keyCode == 13)
			designInsert(true);
	};
};

var _g_design_currentLI = null;
function _designInitLI(li) {
	if (!southprojects.is_ie5)
		li.style.cursor = "pointer";
	li.onclick = function(ev) {
		ev || (ev = window.event);
		if (_g_design_currentLI)
			Utils.removeClass(_g_design_currentLI, "active");
		// var li = ev ? (ev.currentTarget || ev.srcElement) : this;
		var li = this;
		if (li) {
			Utils.addClass(li, "active");
			if (ev)
				Utils.stopEvent(ev);
			_g_design_currentLI = li;
			var input = document.getElementById("f_design_label");
			input.disabled = false;
			var txt = "", tmp = li.firstChild;
			while (tmp && tmp.nodeType == 3) {
				txt += tmp.data;
				tmp = tmp.nextSibling;
			}
			txt = txt.replace(/^\s+/, '').replace(/\s+$/, '');
			input.value = txt;
			input.select();
			input.focus();
		}
		return false;
	};
};

function alertDesignNoSelectedNode() {
	alert("You need to click a node in the tree first");
};

function designInsert(after) {
	var li = _g_design_currentLI;
	if (!li) {
		alertDesignNoSelectedNode();
		return;
	}
	var newli = document.createElement("li");
	newli.innerHTML = "New Item";
	li.parentNode.insertBefore(newli, after ? li.nextSibling : li);
	_designInitLI(newli);
	newli.onclick();
	return false;
};

function designAddSubtree() {
	var li = _g_design_currentLI;
	if (!li) {
		alertDesignNoSelectedNode();
		return;
	}
	// assume the subtree already exists (it can happen)
	var newul = li.getElementsByTagName("ul")[0];
	if (!newul) {
		// only if not existent, create one
		newul = document.createElement("ul");
		li.appendChild(newul);
	}
	var newli = document.createElement("li");
	newul.appendChild(newli);
	newli.innerHTML = "New Item";
	_designInitLI(newli);
	newli.onclick();
	return false;
};

function designRemove() {
	var li = _g_design_currentLI;
	if (!li) {
		alertDesignNoSelectedNode();
		return;
	}
	if (confirm("Remove selected node and any subtrees it might have?")) {
		var p = li.parentNode, p2 = p;
		li.parentNode.removeChild(li);
		if (!/\S/.test(p.innerHTML)) {
			p2 = p.parentNode;
			p2.removeChild(p);
			p = p2;
		}
		_g_design_currentLI = null;
		document.getElementById("f_design_label").disabled = true;
	}
	return false;
};

function doPreview() {
	var config = getConfig();
	var ul = document.getElementById("designtree");
	var div = document.getElementById("designpreview");
	while (div.firstChild)
		div.removeChild(div.firstChild);
	ul = ul.cloneNode(true);
	ul.id = "tree-preview";
	div.appendChild(ul);
	new southprojects.Tree("tree-preview", config);
};

function generateCode() {
	var html = getHeaders();
	html += makeIndent(1) + "<body>\n";
	html += makeIndent(2) + ('<!-- The HTML for the tree-->\n');
	html += getHTML(2, document.getElementById("designtree"));
	html += makeIndent(2) + ('<!-- The Javascript code to initiate the tree-->\n');
	html += makeIndent(2) + '<script type="text/javascript">\n';
	html += makeIndent(3) + 'new southprojects.Tree("designtree", {';
	var config = getConfig();
	var first = true;
	for (var prop in config) {
		if (!first)
			html += ",";
		else first = false;
		var val = config[prop];
		if (typeof val == "string")
			val = '"' + val + '"';
		html += "\n" + makeIndent(4) + prop + ' : ' + val;
	}
	html += "\n" + makeIndent(3) + '});\n';
	html += makeIndent(2) + "</script>\n";
	html += makeIndent(2) + "<noscript>\n <br/>\n";
	html += makeIndent(2) + 'This page uses a <a href="http://www.southprojects.com/website/main/products/prod2/"> Javascript Tree </a>,';
	html += makeIndent(2) + 'but your browser does not support Javascript.\n';
	html += makeIndent(2) + '<br/>\n Either enable Javascript in your Browser or upgrade to a newer version.\n </noscript>\n';

	html += makeIndent(2) + '<a href="http://www.southprojects.com/website/main/products/prod3/">southprojects Javascript Tree</a>\n';

	html += makeIndent(1) + "</body>\n</html>";
	return html;
};


function clearIcons() {
	var ul = document.getElementById("designtree");
	var img;
	while (img = ul.getElementsByTagName("img")[0])
		img.parentNode.removeChild(img);
};

function makeCode() {
	var ta = document.getElementById("f_code");
	ta.value = generateCode();
};

function propChange(field, value) {
	switch (field.id) {
	    case "f_collapsed":
		document.getElementById("display-initLevel").style.visibility = value ? "hidden" : "visible";
		if (!value) {
			document.getElementById("f_initLevel").select();
			document.getElementById("f_initLevel").focus();
		}
		break;
	    case "f_dynamic":
	    case "f_compact":
		var cc = document.getElementById("f_collapsed");
		var cl = document.getElementById("l_collapsed");
		value = document.getElementById("f_dynamic").checked ||
			document.getElementById("f_compact").checked;
		if (value) {
			cc.checked = true;
			cc.onclick();
			cl.disabled = cc.disabled = true;
		} else
			cl.disabled = cc.disabled = false;
		break;
	    case "f_icons_css":
			break;
	}
};

function getConfig() {
	var config = {};
	function setConfigParam(param, id, elDefault) { 
		var element =  document.getElementById(id);
		if (element) {
			//this works as long as params are boolean checkboxes
			param = element.checked;
		} else {
			param = elDefault;
		}
	};

//	setConfigParam(config.hiliteSelectedNode, "f_hiliteSelectedNode", true);
	setConfigParam(config.compact, "f_compact", false);
	setConfigParam(config.dynamic, "f_dynamic", false);

	var level = document.getElementById("f_initLevel").value;
	if (document.getElementById("f_collapsed").checked)
		config.initLevel = 0;
	else if (level != "") {
		level = parseInt(level);
		if (!isNaN(level))
			config.initLevel = level;
	}
	if (document.getElementById("f_icons_css").value != 'none') {
				config.defaultIcons = "customIcon";
	}
	return config;
};

/* functions that return the HTML code */

function makeIndent(indent) {
	var str = "";
	while (indent-- > 0)
		str += "    ";
	return str;
};

function htmlEncode(str) {
	str = str.replace(/&/ig, "&amp;");
	str = str.replace(/</ig, "&lt;");
	str = str.replace(/>/ig, "&gt;");
	str = str.replace(/\x22/ig, "&quot;");
	return str;
};

function checkOutputNode(node) {
	if (!node.tagName || node.tagName == '!' /* IE anomaly */)
		throw "Node has no tag";
	if (node.className) {
		if (/(^|\s)not-in-output(\s|$)/i.test(node.className))
			throw "class: not-in-output";
	}
};

function getHTML(indent, node, compact, noRoot) {
	var html = "";
	if (node.nodeType == 3) {
		var str = node.data;
		str = str.replace(/(^\s+|\s+$)/g, "");
		if (str) {
			if (!compact)
				html += makeIndent(indent);
			html += htmlEncode(str);
			if (!compact)
				html += "\n";
		}
		return html;
	} else try {
		checkOutputNode(node); // throws an exception if node shouldn't be displayed
		var tag = node.tagName.toLowerCase();
		if (!noRoot) {
			html += makeIndent(indent) + "<" + tag;
			var a = ["href", "src", "rel", "type", "http-equiv", "content", "alt"];
			for (var i = 0; i < a.length; ++i) {
				var val = node.getAttribute(a[i]);
				if (val)
					html += ' ' + a[i] + '="' + val + '"';
			}
			if (node.id == "designtree")
				html += ' id="' + node.id + '"';
			var enter = true;
			if (!node.firstChild &&
			    /^(link|meta|img|br|hr)$/i.test(tag)) {
				html += " />\n";
				noRoot = true;
				enter = false;
			} else
				html += ">";
			if (enter && !compact)
				html += "\n";
		}
		for (var i = node.firstChild; i; i = i.nextSibling)
			html += getHTML(indent + 1, i, compact);
		if (!noRoot) {
			if (!compact)
				html += makeIndent(indent);
			html += "</" + tag + ">";
			html += "\n";
		}
		return html;
	} catch(e) {
		return "";
	}
};

function getHeaders() {
	var headers = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">\n';
	headers += "<html>\n";
	headers += makeIndent(1) + "<head>\n";
	headers += makeIndent(2) + '<title>Javascript Tree Wizard By southprojects</title>\n';
	headers += makeIndent(2) + ('<!-- Adjust the paths to the tree location on your server if necessary-->\n\n');

	headers += makeIndent(2) + ('<!-- Javascript utilities file for the tree-->\n');
	headers += makeIndent(2) + '<script src="utils/southprojects.js" type="text/javascript"></script>\n';

	headers += makeIndent(2) + ('<!-- basic Javascript file for the tree-->\n');
	headers += makeIndent(2) + '<script src="sptree/src/tree.js" type="text/javascript"></script>\n';

	headers += makeIndent(2) + ('<!-- basic CSS file for the tree-->\n');
	headers += makeIndent(2) + '<link href="sptree/themes/tree.css" rel="stylesheet" />\n';

	headers += makeIndent(2) + ('<!-- CSS file for the lines in the tree-->\n');
	headers += makeIndent(2) + '<link href="sptree/themes/tree-lines.css" rel="stylesheet" />\n';

	var iconsStyle = document.getElementById("f_icons_css").value;
	if (iconsStyle != 'none') {
		headers += makeIndent(2) + ('<!-- CSS file for icons for folders and files ' + iconsStyle + ' style in the tree-->\n');
		headers += makeIndent(2) + '<link href="sptree/themes/' + iconsStyle + '.css" rel="stylesheet" />\n';
	}

	headers += makeIndent(1) + "</head>\n";
	return(headers);
}

/*
 * Set the active theme for the 
 */

function setActiveTheme(sel) {
	var i = 0, o, a = sel.options, theme;
	// First disable all the themes
	while (o = a[i++]) {
		theme = document.getElementById("theme-" + o.value);
		if (theme)
			theme.disabled = true;
	}

	//and now enable the selected one
	theme = document.getElementById("theme-" + sel.value);
	if (theme)
		theme.disabled = false;
};

