The Lost Notebook

The thing I didn't like in AJAX related stuff was that first I don't know much Javascript, and second that there was no real way to debug the whole thing. Well, with some practice I think I'll get to understand JS, especially with jQuery. As for debugging, enter Venkman! You'll have to get used to it, but it doesn't take that long to get it working for you.
I needed Venkman last night as I was trying to get the tabs and the jqModal plugins to play nice together. The code is beautiful, maintainable, and small! However, I wasn't getting what I wanted and it got frustrating since no one seemed to be able to help.
So, after quite a bit of debugging and following the code around jQuery and jqModal (the tabs plugin is simply perfect, for what I need at least!) here was the solution:

/*
 * jqModal - Minimalist Modaling with jQuery
 *
 * Copyright (c) 2007 Brice Burgess , http://www.iceburg.net
 * Licensed under the MIT License:
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * $Version: 2007.02.14 +r6
 * slightly modified by Abdallah Deeb 
 */

(function($) {
$.fn.jqm=function(o,x,y){
var _o = {
zIndex: 3000,
overlay: 50,
overlayClass: 'jqmOverlay',
wrapClass: 'jqmWrap',
closeClass: 'jqmClose',
trigger: '.jqModal',
ajax: false,
target: false,
autofire: false,
focus: false
};
$.jqm.serial++; s = $.jqm.serial;
hash[s] = {c:$.extend(_o, o),active:false,w:this,o:false,u:$('input,select,button',this)[0]||this[0],cb:[($.isFunction(x))?x:false,($.isFunction(y))?y:false]};
$(_o.trigger).bind("click",{'s':s},function(e) {
	return (!hash[e.data.s]['active'])?$.jqm.open(hash[e.data.s],this):false;});
if(_o.autofire) $(_o.trigger).click();
return this;
}
$.fn.jqmClose=function(){var p=this.parent();
	this.hide().insertBefore(p); p.remove(); return this;}
$.jqm = {
open:function(h,trig){
	var h.t=trig;
	var c=h.c; h.cc='.'+c.closeClass;
	var z=c.zIndex; if (c.focus) z+=10; if (c.overlay == 0) z-=5;
	if(!$.isFunction(h.q)) h.q=function(){return $.jqm.close(h)};
	h['active']=true;

	var f=$('').css({'z-index':z-2,opacity:0});
	var o=$('
').css({'z-index':z-1,opacity:c.overlay/100}).addClass(c.overlayClass);
	$([f[0],o[0]]).css({height:$.jqm.pageHeight(),width:'100%',position:'absolute',left:0,top:0});

	if (c.focus) { if($.jqm.x.length == 0) $.jqm.ffunc('bind'); $.jqm.x.push(s);
		o=f.add(o[0]).css('cursor','wait');}
	else if (c.overlay > 0){o.bind('click', h.q); o=($.jqm.ie6)?f.add(o[0]):o;}
	else o=($.jqm.ie6)?f.css('height','100%').prependTo(h.w):false;
	if (o) h.o=o.appendTo('body');

	h.w.wrap('
');
	if (c.ajax) { var r=c.target; r=(r)?(typeof r == 'string')?$(r,h.w):$(r):h.w;
		var url=c.ajax; url=(url.substr(0,1) == '@')?$(trig).attr(url.substring(1)):url;
		r.load(url, function() {$(h.cc,h.w).bind('click',h.q);}); }
	else h.w.find(h.cc).bind('click',h.q);

	(h.cb[0])?h.cb[0](h):h.w.show(); h.u.focus();
	return false;
},
close:function(h){var h['active'] = false;
	$(h.cc,h.w[0]).unbind('click',h.q);
	var x=$.jqm.x; if(x.length != 0) { x.pop(); 
		if (x.length == 0) $.jqm.ffunc('unbind'); }
	(h.cb[1])?h.cb[1](h):h.w.jqmClose(); if(h.o) h.o.remove();
	return false;
},
pageHeight:function(){var d=document.documentElement;
	return Math.max(document.body.scrollHeight,d.offsetHeight,d.clientHeight || 0,window.innerHeight || 0);
},
hash: {},
serial: 0,
x: [],
f:function(e) { var s=$.jqm.x[$.jqm.x.length-1];
	if($(e.target).parents('#jqmID'+s).length == 0) { hash[s].u.focus(); return false;} return true;
},
ffunc:function(t) {$()[t]("keypress",$.jqm.f)[t]("keydown",$.jqm.f)[t]("mousedown",$.jqm.f);},
ie6:$.browser.msie && typeof XMLHttpRequest == 'function'
};
var hash=$.jqm.hash;
})(jQuery);

Similar Posts:

None Found