formtoolbox.js

its a varypowrerfull javascript tool

/*
 *  $Id: formtoolbox.js,v 1.1 2006/08/07 10:41:25 source Exp $
 *
 *  This file is part of the OpenLink Software Ajax Toolkit (OAT) project.
 *
 *  Copyright (C) 2006 Ondrej Zara and OpenLink Software
 *
 *  See LICENSE file for details.
 */
function Toolbox(obj) {	
	var self = this;
	this.obj = obj;

	this.selectFile = function(callback,mode) {
		if ($("options_type_http").checked) {
			var name = OAT.Dav_old.getNewFile("/DAV/home/"+OAT.Ajax.user,".xml","xml");
			if (!name) { return; }
			if (name.slice(name.length-4).toLowerCase() != ".xml") { name += ".xml"; }
			callback(name);
		}
		if ($("options_type_dav").checked) {
			var options = {
				mode:mode,
				onOKClick:function(path,fname){
					var name = path + fname;
					callback(name);
				},
				onOpenClick:function(path,fname,data){
					var name = path + fname;
					callback(name);
					return true; /* return false will keep browser open */
				},
				user:OAT.Xmla.user,
				pass:OAT.Xmla.password,
				pathDefault:"/DAV/home/"+OAT.Xmla.user+"/",
				file_ext:'xml'
			};
			OAT.WebDav.open(options);
		}
	}

	this.win = new OAT.Window({min:0,max:0,close:1,height:0,width:180,x:-15,y:170,title:"Control Properties"});
	this.win.hide = function() {OAT.Dom.hide(self.win.div);};
	this.win.show = function() {OAT.Dom.show(self.win.div);};
	this.win.onclose = function() {
		self.win.hide();
		tbar.icons[1].toggle();
	}
	this.win.content.className = "toolbox";
	this.content = OAT.Dom.create("div");
	this.name = OAT.Dom.create("span");
	var tmp = OAT.Dom.create("div");
	tmp.innerHTML = "Selected: ";
	tmp.appendChild(this.name);
	this.win.content.appendChild(tmp);
	this.win.content.appendChild(this.content);
	
	this.clear = function() {
		OAT.Dom.clear(self.content); /* clear toolbox */
		self.win.content.style.height = ""; /* set toolbox to auto-stretch */
		self.win.div.style.height = "";
	}
	
	this.createTable = function() {
		var t = OAT.Dom.create("table");
		var b = OAT.Dom.create("tbody");
		t.appendChild(b);
		self.table = b;
		self.content.appendChild(t);
	}
	
	this.addTable = function(a,b) {
		var r = OAT.Dom.create("tr");
		var d = OAT.Dom.create("td");
		d.className = "cell_1";
		d.appendChild(a);
		r.appendChild(d);
		if (b) {
			var d = OAT.Dom.create("td");
			d.className = "cell_2";
			d.appendChild(b);
			r.appendChild(d);
		} else {
			d.className = "cell_single";
			d.setAttribute("colSpan",2);
			d.colSpan = 2;
		}
		self.table.appendChild(r);
	}
	
	this.showForm = function(form) {
		self.clear();
		self.name.innerHTML = "[form]";
		self.createTable();
		var f = form;

		/* name */
		var text = OAT.Dom.text("Name");
		var inp = OAT.Dom.create("input"); 
		inp.setAttribute("type","text");
		inp.setAttribute("size","14");
		inp.value = f.name;
		OAT.Dom.attach(inp,"keyup",function() {f.name = inp.value;} )
		self.addTable(text,inp);
		/* hidden */
		var hid = OAT.Dom.create("input");
		hid.setAttribute("type","checkbox");
		hid.checked = (f.hidden == "1" ? true : false);
		OAT.Bindings.bindBool(hid,f,"hidden");
		var text = OAT.Dom.text("Hidden");
		self.addTable(text,hid);
		/* empty */
		var empty = OAT.Dom.create("input");
		empty.setAttribute("type","checkbox");
		empty.checked = (f.empty == "1" ? true : false);
		OAT.Bindings.bindBool(empty,f,"empty");
		var text = OAT.Dom.text("Clear with empty resultset");
		self.addTable(text,empty);
		/* cursor type */
		var cursor = OAT.Dom.create("select");
		OAT.Dom.option("Snapshot",0,cursor);
		OAT.Dom.option("Dynaset",1,cursor);
		cursor.selectedIndex = f.cursorType;
		OAT.Bindings.bindSelect(cursor,f,"cursorType");
		var text = OAT.Dom.text("Cursor type");
		self.addTable(text,cursor);
		/* page size */
		var size = OAT.Dom.create("input");
		size.setAttribute("type","text");
		size.setAttribute("size","3");
		size.value = f.pageSize;
		OAT.Bindings.bindString(size,f,"pageSize");
		var text = OAT.Dom.text("Page size");
		self.addTable(text,size);
		
		/* datasource */
		var t = OAT.Dom.text("Data binding");
		self.addTable(t);
		var ds = OAT.Dom.create("span");
		switch (f.ds.type) {
			case 0: ds.innerHTML = "[none] "; break;
			case 1: ds.innerHTML = "SQL "; break;
			case 2: ds.innerHTML = "WSDL "; break;
		}
		var ds_btn = OAT.Dom.create("input");
		ds_btn.setAttribute("type","button");
		ds_btn.value = "edit";
		var text = OAT.Dom.text("Type");
		var ds_div = OAT.Dom.create("div");
		ds_div.appendChild(ds);
		ds_div.appendChild(ds_btn);
		self.addTable(text,ds_div);
		OAT.Dom.attach(ds_btn,"click",function(){DS.readBinding(f);});
		
		/* field bindings */
		if (f.ds.type != 0) {
			var cnt_select = OAT.Dom.create("select");
			for (var j=0;j<=f.inputFields.length;j++) {
				OAT.Dom.option(j,j,cnt_select);
				if (j == f.fieldBinding.selfFields.length) { cnt_select.selectedIndex = j; }
			}
			var text = OAT.Dom.text("Bound fields");
			self.addTable(text,cnt_select);
			/* count change reference */
			var fieldCountRef = self.fieldCountRef(cnt_select,f);
			OAT.Dom.attach(cnt_select,"change",fieldCountRef);

			/* actual field bindings */
			var fb = f.fieldBinding;
			for (var i=0;i<fb.selfFields.length;i++) {
				var pair = self.createFieldPair(form,i);
				self.addTable(pair[0],pair[1]);
			}
		}
		
		/* css props */
		var t = OAT.Dom.text("Appearance");
		self.addTable(t);
		var elm = f.div;
		var text = OAT.Dom.text("BG color");
		var color = OAT.Dom.style(elm,"backgroundColor");
		var c1 = OAT.Dom.create("div",{cssFloat:"right",styleFloat:"right",width:"16px",height:"8px",margin:"3px",backgroundColor:color,border:"1px solid #000",cursor:"pointer",overflow:"hidden"});
		self.addTable(text,c1);
		OAT.Bindings.bindColor(c1,elm.style,"backgroundColor");
		
		var text = OAT.Dom.text("FG color");
		var color = OAT.Dom.style(elm,"color");
		var c2 = OAT.Dom.create("div",{cssFloat:"right",styleFloat:"right",width:"16px",height:"8px",margin:"3px",backgroundColor:color,border:"1px solid #000",cursor:"pointer",overflow:"hidden"});
		self.addTable(text,c2);
		OAT.Bindings.bindColor(c2,elm.style,"color");
		
		var text = OAT.Dom.text("Font size");
		var font = new OAT.Combolist(["60%","80%","100%","120%","140%"],OAT.Dom.style(elm,"fontSize"));
		font.input.setAttribute("size","6");
		self.addTable(text,font.div);
		OAT.Bindings.bindCombo(font,elm.style,"fontSize");

		/* remove */
		if (form.div != obj.base) {
			var del = OAT.Dom.create("a",{marginTop:"3px"});
			del.setAttribute("href","#");
			del.innerHTML = "remove";
			OAT.Dom.attach(del,"click",function(){obj.delForm(f);});
			self.addTable(del);
		}
		
		/* if needed, resize property window */
		var tableW = OAT.Dom.getWH(self.table)[0];
		var divW = parseInt(self.win.content.style.width);
		if (tableW > divW) { self.win.content.style.width = tableW + "px"; }
	}
	
	this.showObject = function(object) {
		var o = object;
		self.clear();
		self.name.innerHTML = OAT.FormObjectNames[o.name];
		self.createTable();
		var hid = OAT.Dom.create("input");
		hid.setAttribute("type","checkbox");
		hid.checked = (o.hidden == "1" ? true : false);
		OAT.Bindings.bindBool(hid,o,"hidden");
		var text = OAT.Dom.text("Hidden");
		self.addTable(text,hid);
		/* data etc */
		if (o.userSet) { /* value */
			var text = OAT.Dom.text("Value");
			var inp = OAT.Dom.create("input"); 
			inp.setAttribute("type","text");
			inp.setAttribute("size","14");
			inp.value = o.getValue();
			OAT.Dom.attach(inp,"keyup",function() {o.setValue(inp.value);} )
			self.addTable(text,inp);
		}
		if (o.properties.length) {
			var t = OAT.Dom.text("Properties");
			self.addTable(t);
		}
		for (var i = 0;i<o.properties.length;i++) {
		
			var p = o.properties[i];
			var text = OAT.Dom.text(p.name);
			switch (p.type) {
				case "string":
					var input = OAT.Dom.create("input");
					input.setAttribute("size","14");
					input.value = p.value;
					OAT.Bindings.bindString(input,p,"value");
					self.addTable(text,input);
				break;
				case "bool":
					var input = OAT.Dom.create("input");
					input.setAttribute("type","checkbox");
					input.checked = (p.value == "1");
					OAT.Bindings.bindBool(input,p,"value");
					self.addTable(text,input);
				break;
				case "color":
					var input = OAT.Dom.create("div",{cssFloat:"right",styleFloat:"right",width:"16px",height:"8px",margin:"3px",backgroundColor:p.value,border:"1px solid #000",cursor:"pointer",overflow:"hidden"});
					OAT.Bindings.bindColor(input,p,value);
					self.addTable(text,input);
				break;
				
				case "combo":
					var input = new OAT.Combolist(p.options,value);
					input.input.setAttribute("size","6");
					OAT.Bindings.bindCombo(input,p,"value");
					self.addTable(text,input.div);
				break;
				
				case "select":
					var input = OAT.Dom.create("select");
					for (var j=0;j<p.options.length;j++) {
						var item = p.options[j];
						if (typeof(item) == "object") {
							var name = item[0];
							var value = item[1];
						} else {
							var name = item;
							var value = item;
						}
						OAT.Dom.option(name,value,input);
						if (value == p.value) { input.selectedIndex = j; }
					}
					OAT.Bindings.bindSelect(input,p,"value");
					self.addTable(text,input);
				break;

				case "form":
					var input = OAT.Dom.create("select");
					OAT.Dom.option("","",input);
					for (var j=0;j<self.obj.forms.length;j++) {
						var f = self.obj.forms[j];
						if (f != o.form) { OAT.Dom.option(f.toString(),f,input); }
						if (f == p.value) { input.selectedIndex = j; }
					}
					OAT.Bindings.bindSelect(input,p,"value");
					self.addTable(text,input);
				break;

				case "file":
					var input = OAT.Dom.create("div");
					var input1 = OAT.Dom.create("span");
					var txt = OAT.Dom.text(" ");
					var input2 = OAT.Dom.create("input");
					input2.setAttribute("type","button");
					input1.innerHTML = p.value.split("/").pop();