String.prototype.format = function(){
    var args = arguments;
    return this.replace(/\{(\d+)\}/g, function (m, n) {
	return args[n];
    });
};

function fadeIn(target, callBack) {
    $(target).stop().fadeTo("fast", "1", callBack);
}

function fadeOut(target, callBack) {
    $(target).stop().fadeTo("fast", "0", function() { 
	$(this).css("display", "none");
	if(callBack)
	    callBack(); 
    });
}

function bind_defaultButton() {
    $('button.default-button').each(function(index) {
	var label = $(this).html();
	$(this).html("<span class='default-button-left'></span> \
		<span class='default-button-label'>{0}</span> \
		<span class='default-button-right'></span>".format(label));
    });
}

//forms
function bind_textinput() {
    var template = "<span class='textinput'> \
			<span class='textinput-left'></span> \
			<span class='textinput-input'> \
				{0} \
			</span> \
			<span class='textinput-right'></span> \
		</span>";
    
    $('.textinput').each(function(index) {		
	$(this).removeClass('textinput');
	var container = $(this).parent();
		
	template1 = template.format($(this).outerHTML());
	$(this).replaceWith(template1);
	var obj = $('.textinput-input:eq('+index+') input', container);
	//obj.attr('default',obj.val());
	$(obj).focus(function(e) 	{
	    $(this).parent().parent().addClass('focus');
	    if(this.value == $(this).attr('default'))
		this.value = "";
	});
	$(obj).blur(function(e) 	{
	    $(this).parent().parent().removeClass('focus');
	    if(this.value=="")
		this.value = $(this).attr('default');
	});
    });
}

function bind_textarea() {
    var template = "<table id='{id}' class='textarea' style='{style}'> \
		<tr> \
			<td class='textarea-top-left textarea-corner'></td> \
			<td class='textarea-top-center'></td> \
			<td class='textarea-top-right textarea-corner'></td> \
		</tr> \
		<tr> \
			<td class='textarea-middle-left'></td> \
			<td class='textarea-middle-center'>{content}</td> \
			<td class='textarea-middle-right'></td> \
		</tr> \
		<tr> \
			<td class='textarea-bottom-left textarea-corner'></td> \
			<td class='textarea-bottom-center'></td> \
			<td class='textarea-bottom-right textarea-corner'></td> \
		</tr> \
	</table>";			
	
    $('.textarea').each(function(index) {
	//$(this).removeClass('rounded');
		
	var obj = $(this);
	var item = template;
	obj.addClass('textarea-content');
	obj.removeClass('textarea');
		
	if(obj.attr('id') != undefined)
	{
	    item = item.replace('{id}', obj.attr('id'));
	    obj.removeAttr('id');
	}
	else
	    item = item.replace('{id}', '');				
			
	item = item.replace('{content}', obj.outerHTML());
		
	obj.replaceWith(item);
		
    });
}

(function($){
    $.fn.truncateByHeight = function(maxHeight) {	
	this.each(function(){
	    jObj = $(this);
	    while(jObj.height() > maxHeight){
		txt = jObj.text();
		txt = txt.substring(0, txt.lastIndexOf(' '));
		jObj.text(txt);

		if(jObj.height() <= maxHeight)
		    jObj.text(txt+'...');
	    }
	});
    };
})(jQuery);

function Popup(instanceName, headerText, selectorContent){
    this.instanceName = instanceName;
    this.selContent = selectorContent;
    this.headerText = headerText;
    this.width = 300;
    this.onShowing = null;
    this.onHiding = null;
    
    this.html = '<div class="popup-modal"></div>'
    +'<div class="popup">'
    +'<span class="popup-lt"></span>'
    +'<a class="popup-btn-close" href="javascript:void(0)" onclick="'+this.instanceName+'.hide()"></a>'
    +'<span class="popup-top"></span>'
    +'<p class="popup-header">'+this.headerText+'</p>'
    +'<p class="popup-line"><span></span></p>'
    +'<div class="popup-content">'+$(this.selContent).html()+'</div>'
    +'<span class="popup-lb"></span>'
    +'<span class="popup-rb"></span>'
    +'<span class="popup-bottom"></span>'
    +'</div>';
    
    this.init = function(){
	//$(this.selContent).css('display','block');
	$(this.selContent).html(this.html);
    };
    
    this.show = function(){
	if(this.onShowing != null)
	    this.onShowing();
	
	var height = $(this.selContent+' .popup').height();
	$(this.selContent+' .popup').css('width', this.width + 'px')
	.css('margin-top', '-' + (height / 2) + 'px')
	.css('margin-left', '-' + (this.width / 2) + 'px')
	.fadeIn("fast");
	$(this.selContent+' .popup-modal').fadeIn("fast");
    };
    
    this.hide = function(){
	if(this.onHiding != null)
	    this.onHiding();
	
	$(this.selContent+' .popup').fadeOut("fast");
	$(this.selContent+' .popup-modal').fadeOut("fast");
    };
    
    this.init();
}