var dialog = (function() {
	var TEMPLATE = {}
	var WRAP = [
		'<div class="lightbox">',
			'<div class="lightbox-top">',
				'<div class="lightbox-title"><b>${TITLE}</b></div>',
				'<div class="lightbox-action"><a class="close" href="javascript:dialog.close(\'${NAME}\')"></a></div>',
			'</div>',
			'<div class="lightbox-content ${CLASS}">',
				'${CONTENT}',
			'</div>',
			'<div class="lightbox-bottom">',
				'<div class="lightbox-bottom_l"></div>',
				'<div class="lightbox-bottom_r"></div>',
			'</div>',
		'</div>'
	].join('');

	var fn =  function(opt) {
		var name = opt.name;
		TEMPLATE[name] = opt;
	}
	
	fn.open = function(name, state, opt) {
		var tpl = TEMPLATE[name];
		opt = opt || {}
		var id = name + '-dialog';
		var d = $('.dialogs .' + id);		
		if (!tpl && d.length > 0) {
			tpl = TEMPLATE[name] = {name:name};
		}
		if (tpl) {
			var w = $(window);
			var html = WRAP.replace('${TITLE}',  opt.title || tpl.title || '快快提示')
							.replace('${NAME}', name)
							.replace('${CLASS}', id)
							.replace('${CONTENT}', d.html());
			var width = (opt.width || parseInt(tpl.width) || d.width()) + 2;
			var height =  (opt.height || parseInt(tpl.height) || d.height()) + 29;
			var top = opt.top || parseInt(tpl.top) || ((w.height() - d.height()) / 2);
			var left = opt.left || parseInt(tpl.left) || ((w.width() - d.width()) / 2);
			var overlay = (opt.overlay != null? opt.overlay :(tpl.overlay != null ? tpl.overlay : true));
			
			// fire on render event
			if (tpl.on_render) {
				var h = tpl.on_render.call(tpl, html);
				if (typeof h == 'string') {
					html =  h;
				}
			}
			
			$.blockUI({
				message : html,
				css : $.extend({
					width : width,
					//height : height,
					top : Math.max(top, 150) + 'px',
					left : Math.max(left, 200) + 'px',
					border: '0px',
					backgroundColor: ''
				}, opt.css || {}),
				showOverlay : overlay,
				overlayCSS:  { 
			        backgroundColor : '#000',
			        opacity : 0.6 
				}	
			});
			
			// fire on open event
			if (tpl.on_open) {
				var ld = $('.lightbox .' + id);
				tpl.on_open.call(tpl, ld);
			}
			this.state(name, state);
		}
	}
	
	fn.state = function(name , state) {
		var tpl = TEMPLATE[name];
		if (tpl) {
			var args = $.makeArray(arguments);
			args.shift();
			args.shift();
			var id = name + '-dialog';
			var d = $('.lightbox .' + id);
			if (typeof tpl.state == 'function') {
				args.unshift(state);
				args.unshift(d);
				tpl.state.apply(tpl, args);
			} else if (typeof tpl.state == 'object') {
				if (tpl.state[state]) {
					args.unshift(d);
					tpl.state[state].apply(tpl, args);
				}
			}
		}
	}
	
	fn.title = function(title) {
		$('.lightbox .lightbox-title b').html(title);
	}
	
	fn.content = function(content) {
		if (typeof content == 'string') {
			$('.lightbox .lightbox-content').html(content);
		} else if (typeof content == 'object') {
			$('.lightbox .lightbox-content').html().append(content);
		}
	}
	
	fn.close = function(name) {
		if (name) {
			var tpl = TEMPLATE[name];
			if (tpl && tpl.on_close) {
				var id = name + '-dialog';
				var ld = $('.lightbox .' + id);
				tpl.on_close.call(tpl, ld);
			}
		}
		$.unblockUI();
	}

	return fn;
})();

dialog({name : 'custom'});