Click here to Skip to main content
15,886,258 members
Articles / Web Development / HTML

AWUI - a simple web user interface library with AJAX support

Rate me:
Please Sign up or sign in to vote.
4.33/5 (5 votes)
26 Jul 2007CPOL4 min read 47.8K   382   35  
An article on creating a custom JavaScript controls set and cross-browser support library
////////////////////////////////////////////////////////////
// AWUI - a web user interface - supports IE5+, Firefox, Opera 9
var AWUI_IS_IE = (document.all != undefined && typeof(ActiveXObject) != "undefined");
var AWUI_IS_OPERA = (navigator.userAgent.toLowerCase().indexOf("opera") > -1 || (document.all != undefined && !AWUI_IS_IE));
var AWUI_IS_MOZILLA = (!AWUI_IS_OPERA && !AWUI_IS_IE);
var AWUI_ID_DELIM = "#";

// create one global library
var AWUI = {
	AWUI_KEY: "AWUI Common",
	IS_IE : AWUI_IS_IE,
	IS_OPERA : AWUI_IS_OPERA,
	IS_MOZILLA : AWUI_IS_MOZILLA,
	
	// [[ config 
	ID_PREFIX : "awui",
	ID_DELIM : AWUI_ID_DELIM,
	ID_DELIM_RE : new RegExp(AWUI_ID_DELIM,"ig"),
	THROW_ERRORS : true,
	// ]]
	
		
	// [[ error codes
	ERROR_UNKNOWN : 0, 			// E_FAIL
	ERROR_OBJECT : 1, 			// E_POINTER
	ERROR_INVALID_VALUE : 2, 	// E_INVALIDARG
	ERROR_DOM : 3,
	ERROR_XML : 4,
	ERROR_RUNTIME : 10,
	// ]]
	
	// [[ strings
	STR_AWUI_ERROR : "AWUI Error",
	STR_ERR_UNKNOWN : "Unknown error",
	// ]]
	
	extend: function (subclass_, superclass_) {
	    var f = function() {};
	    f.prototype = superclass_.prototype;
	    subclass_.prototype = new f();
	    subclass_.prototype.constructor = subclass_;
	    subclass_.superclass = superclass_.prototype;
	    if (superclass_.prototype.constructor === Object.prototype.constructor)
	    	superclass_.prototype.constructor = superclass_;
	},

	// common functions set
	isEmpty: function (var_) { 
		var res = false;
		try { res = (var_ == undefined || var_ == null || var_ == ""); } catch (ex) { res = false; }
		return res; 
	},
	isFunction: function (obj_)	{ 
		return (typeof(obj_) == "function");
	},
	push: function (ar_, el_)	{ 
		if(ar_ && (typeof(ar_) == "object") && (typeof(ar_.length) != "undefined") ) 
			ar_[ar_.length] = el_;
	},
	
	// DOM interaction
	el: function (id_)	{ 
		return document.getElementById (id_); 
	},
	gvar: function (name_)	{ 
		if (this.isEmpty(name_)) return null;
		eval("var res = window." + name_);
		return res; 
	},
	wr: function (str_)	{ 
		try {
			document.write (str_); 
		} catch (e) {
			var msg = this.getErrorDesc (e);
			this.processError( this.AWUI_KEY + ": " + msg, this.ERROR_DOM);
		}
	},
	crel: function (type_) { 
		return document.createElement (type_);
	},
	crtext: function(str_) { 
		return document.createTextNode (str_);
	},
	crimg: function (src_, id_, w_, h_, alt_) { 
		var img = document.createElement ("IMG");
		img.border = 0;	var arg = arguments;
		if (arg.length == 0) return img;	img.src = src_;
		if (arg.length == 1) return img;	img.id = id_;
		if (arg.length == 2) return img;	img.width = w_;	
		if (arg.length == 3) return img;	img.height = h_;		
		if (arg.length == 4) return img;	img.alt = alt_;	
		return img;
	},
	
	preloadImg: function (src_)	{	
		if (!src_) return;
		var i = new Image(); i.src = src_;
	},
	preloadImages: function (ar_, path_)	{	
		if (!ar_ || !ar_.length) return;
		if (this.isEmpty(path_)) path_ = "";
		for (key in ar_)
			this.preloadImg (path_ + ar_[key]);
	},
	absPos: function (obj_)	{
		var res = { left : 0, res : 0 };
		if (!obj_) return res;
		res.left = parseInt(obj_.offsetLeft);	res.top = parseInt(obj_.offsetTop);
		var prnt = obj_.offsetParent;
		while (prnt) {	res.left += prnt.offsetLeft;	res.top += prnt.offsetTop;	prnt = prnt.offsetParent;	}
		return res;
	},

	appendRow: function (tbl_, pos_)	{	
		if (this.isEmpty(pos_)|| parseInt(pos_) < 0) pos_=-1;	
		if (!tbl_ || !tbl_.tBodies)
			return;
		if (tbl_.tBodies.length == 0) tbl_.appendChild ( this.crel("TBODY"));
		var row = this.crel("TR"); var tBody = tbl_.tBodies[0]; var nRow=0;
		if (!tBody || !row) return null;
		if (pos_ == -1) {
			tBody.appendChild(row);
			return row;
		}
		for(var ndx=0; ndx<tBody.childNodes.length; ndx++) {
			if (pos_ == nRow) {
				tBody.insertBefore(row, tBody.childNodes[ndx]);
				return row;
			}	
			if ( String(tBody.childNodes[ndx].tagName).toUpperCase() == "TR") 
				nRow++;
		}
		return row;
	},
	// events processing
	stopPropagation: function(e_) {
		if (e_ && e_.stopPropagation) e_.stopPropagation(); 
		if (e_ && e_.preventDefault) e_.preventDefault(); 
		if (window.event) window.event.cancelBubble = true;
		return false;
	},
	getKeyCode : function (e_) {
		return parseInt(e_ ? e_.which : window.event.keyCode);
	},
	srcEl: function (e_) {
		if (this.IS_IE)	
			return (e_ ? e_.srcElement : (window.event ? window.event.srcElement : null) );
		else	
			return (e_ ? e_.target : null);
	},
	setUnselectable: function (obj_) {
		if (obj_ && obj_.style)	{
			obj_.setAttribute("UNSELECTABLE","on"); 
			obj_.style.MozUserSelect = "none"; 
		}

	},
	
	// quotation
	quoteXml : function(s_)	{	
		return String (s_).replace (/&/g, "&amp;").replace (/</g, "&lt;").replace (/>/g, "&gt;");	
	},

	// WUI utility
	getWuiObj: function (id_) {
		if (this.isEmpty (id_)) return null;
		eval("var obj = window." + String(id_).split (this.ID_DELIM_RE)[0]);
		return obj;
	},
		
	processError: function (message_, code_) {
		if (code_ == undefined) code_ = 0;
		var e = new Error (code_, message_);
		e.description = e.message = message_;	
		e.number = e.code = code_;	
		e.name = this.STR_AWUI_ERROR;
		if (this.THROW_ERRORS)
			throw e;
		else
			alert (e.name + ": " + (message_ ? message_ : "Unknown") );
	},

	getErrorDesc: function (ex) {
		if (this.isEmpty(ex))
			return this.STR_ERR_UNKNOWN;
		var msg;
		if (this.IS_OPERA) {
			msg = ex.code + ", " + ex.message;
		} else if (this.IS_IE) {
			msg = ex.number + ", " + ex.description;
		} else {
			msg = String (ex);
		}
		return msg;
	}
	
};

// aObject - base class for all WUI components
// all its methods should be called through "aObject.prototype."
function aObject() {
	this.id = aObject.prototype.generateId();
	this.base = null;
	// register as global
	eval("window." + this.id + "=this");
};

aObject.prototype = {
	AWUI_KEY: "aObject",
	
	processError: function (obj_, message_, code_) {
		return AWUI.processError( ( !AWUI.isEmpty (obj_.AWUI_KEY) ? obj_.AWUI_KEY : aObject.prototype.AWUI_KEY) + ": " + message_, code_);
	},

	generateId: function () {
		var ndx = 1, id;
		while ( AWUI.gvar(id = AWUI.ID_PREFIX+""+ndx) ) ++ndx;
		return id;
	},
	
	// custom errors
	processError_CreateBase: function (obj_) {
		return AWUI.processError( ( (!AWUI.isEmpty (obj_.AWUI_KEY) ?  obj_.AWUI_KEY : aObject.prototype.AWUI_KEY)) + 
			": Invalid object base - cannot create DOM object", AWUI.ERROR_OBJECT);
	},

	processError_DuplicateObject: function (obj_) {
		return AWUI.processError( ( (!AWUI.isEmpty (obj_.AWUI_KEY) ?  obj_.AWUI_KEY : aObject.prototype.AWUI_KEY)) + 
			": Invalid name - element with the same name already exists", AWUI.ERROR_OBJECT);
	}

}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior)
Belarus Belarus
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions