/**
 * SimpleBox - lightweight box dialog
 *
 * Usage:
 * 
 * var box = new SimpleBox({});
 * box.show(html);
 * box.showUrl(url);
 * 
 */

function SimpleBox()
{
    var me = this;
    me.options = {
        width:400, 
        buttons: [],
        title:"",
        top:null,
        id:null,
    }
    
    me.body = $("body");     
    
    if (typeof(window.boxList) == "undefined"){
        window.boxList = [];
    }
        
    if (arguments.length > 0)
    {
        $.extend(me.options, arguments[0]);    
    }
    
    
    this.init = function()
    {
        var shadow = $("body .boxShadow");
        
        if (shadow.length > 0){
            me.shadow = shadow;
            addShadow = false;
        }else{
            me.shadow = $("<div style='display:none' class='boxShadow'/>");
            addShadow = true;
        }
        
        
        me.frame = $("<div style='display:none' class='boxFrame'/>");
        
        me.header  = $("<div class='boxHeader'/>");
        me.content = $("<div class='boxContent'/>");
        me.footer  = $("<div class='boxFooter'/>");

        me.closeBtn   = $("<div style='float:right' class='boxClose'></a>");
        me.title   = $("<div style='float:left' class='boxTitle'>"+ me.options.title + "</div>");
        
        me.closeBtn.click(me.close);
        
        me.header.append(me.title);
        me.header.append(me.closeBtn);
        me.header.append("<div style='clear:both'/>");
        
        me.frame.append(me.header);
        me.frame.append(me.content);
        me.frame.append(me.footer);
        
        if (me.options.id != null)
        {
            var con = $("#"+me.options.id); //intialize content with #id
            me.content.append( con );
            con.show();
        }        
                    
        for(i=0;i<me.options.buttons.length;i++)
        {
            var el     = me.options.buttons[i];
            var button = $("<input type='button' value='"+ el.title + "' />");
            var value  = el.value;
            
            me.footer.append(button);
            
            var fn = function(b,v)
            {
                return function(){me.onButtonClick(b,v);}
            }
            button.bind("click", fn(button,value));
        }
        
        if (addShadow){
            me.body.append(me.shadow);
        }
        
        me.body.append(me.frame);
    }
    
    this.onButtonClick = function(element,value){}
    this.onLoad = function(){}
    this.onClose = function(){}
    
    this.close = function()
    {
        var list = [];
        var i = 0;
        for(i =0;i< window.boxList.length; i++)
        {   
            obj = window.boxList[i];
            if (obj != me){ list.push(obj);}
        }
        
        window.boxList = list;
        if (window.boxList.length == 0)
        {
           me.shadow.fadeOut();
        }
        me.frame.fadeOut("normal",function()
        {
            me.onClose();    
        }); 
    }
    
    
    this.show = function(data)
    {
        $(window).trigger("sbBeforeShow");
        
        window.boxList.push(me);
        me.shadow.css({opacity:0.5});
        me.shadow.show();
        
        me.frame.css("width",me.options.width );
        
        if (data != false) 
        {
            me.content.html(data);
        }
        
        
        var h1 = me.content.find("h1");
        
        if (h1.length>0)
        {
            me.content.find("h1").remove();
            me.title.html(h1.html());
        }
        me.frame.fadeIn();
        
        me.frame.css("position","absolute");
        
        
        if (me.options.top == null)
        {
            var top = ( $(window).height() - me.frame.height() ) / 2 + $(window).scrollTop();
        }else{
            var top = me.options.top + $(window).scrollTop();
        }
        
        
        var left = ( $(window).width()  - me.frame.width() ) / 2;
        top  = Math.floor(top);
        left = Math.floor(left);
        
        
        me.frame.css("left", left)
        me.frame.css("top", top);
        
        me.onLoad();
    }
    
    this.setWidth = function(w)
    {
        me.frame.css("width",w+"px");                
    }
    
    this.showUrl = function(url)
    {
        $.get(url, function(data){
          me.show(data);
        });
    }
    
    
    this.init();
    return this;   
}