/**
 * Setup t-error divs as dialogs, to appear similar to the b4f's current
 * design.
 * 
 * @requires Events from events.js.
 */ 
var ErrorDialogs = {
	dialogRE:/\bt-error|userMessages\b/,
	skipRE:/\bt-invisible\b/,
	altDialogRE:/\bdialog\b/,
	init:Events.attach(window, "load", function() {
		ErrorDialogs.applyDialogs();
		ClickHandler.addHandler("closeDialog", ErrorDialogs.closeDialog);
		Events.detach(ErrorDialogs.init);
	}),
	/**
	 * Create an ok button with a divinable label and target.
	 * 
	 * @param {String} lbl The label of the button (the text on its' face)
	 * @param {String} trgt The id of the dialog this button targets.
	 */
	okButton:function(lbl,trgt) {
		var ok = document.createElement("div");
		ok.className = "dialog_button dialog_okButton";
		var a = document.createElement("a");
		a.href = "#" + trgt;
		a.rel = "closeDialog";
		a.appendChild(document.createTextNode(lbl));
		ok.appendChild(a);
		return ok;
	},
	/**
	 * Searches through all the divs and targets those with a classname
	 * 't-error' for setting them up as a dialog.
	 */
	applyDialogs:function() {
		var divs = document.getElementsByTagName("div");
		this.dialogRE.test("");
		for (var i = 0; i < divs.length; i++) {
			var div = divs[i];
			if (this.dialogRE.test(div.className) && !this.skipRE.test(div.className)) {
				var ok = div.lastChild.getElementsByTagName?div.lastChild.getElementsByTagName("a")[0]:null; //lastchild could be a textnode...
				if (ok && ok.rel && ok.rel == "closeDialog") return true; //This dialog has already been processed... 
				document.getElementById("content").appendChild(div); //In case the dialog is nested, we rather place it at the top of the page...
				/** 
				 * upgrade to Tapestry 5.0.9
				 * T5.0.9 does not initialize the id in the 't-error' anymore. Div's like
				 * <div class='t-error' id="loginform:errors" ...> are no longer available,
				 * so we have to set the id ourselves
				 */
				if (div.id=='') {
					div.id=div.parentNode.id+':errors';
				}
				div.appendChild(this.okButton("Ok", div.id));
				div.className += " dialog";
				this.setBodyState(true);
			} else if (this.altDialogRE.test(div.className)) { //Server-side prepped dialogs
				document.getElementById("content").appendChild(div); //In case the dialog is nested, we rather place it at the top of the page...
				this.setBodyState(true);
			}
		}
	},
	/**
	 * Handles clicks on the links generated by the applyDialogs
	 * method.
	 */
	closeDialog:function(target){
		var href = target.href;
		var id = target.href.substr(target.href.indexOf("#") + 1); //Get id
		if (id) {
			var dialog = document.getElementById(id); //Get dialog
			if (dialog) {
				dialog.className+=" dialog_CLOSED"; //Set classname for closed dialogs
				var f = document.getElementById("content")?document.getElementById("content").getElementsByTagName("form")[0]:null;
				if (f) {
					for (var i = 0; i < f.elements.length; i++) {
						if (f.elements[i].className.indexOf("validation-FAILED") > -1) {
							f.elements[i].focus();
							i = f.elements.length;
						}
					}
				}
				ErrorDialogs.setBodyState(false);
			} else {
				alert("No dialog found for id '" + id + "'!");
			}
		} else {
			alert("Dialogs are not supported for elements without an id!")
		}
		return true; //Cancel the default action of the anchor
	},
	/**
	 * Toggle 'state' of open/closed dialogs on the body-tag, this to help solve some
	 * IE6 troubles concerning overlaying 'select'-elements...
	 */
	setBodyState:function(b){
		var e = (document.body||document.documentElement);
		if (b) e.className += " dialog_OPEN";
		else e.className = e.className.replace(/ ?\bdialog_OPEN\b/gi, "");
	}
};

(document.body||document.documentElement).className += " dialog_ENABLED";
