TT_Dialog = Class.create();
TT_Dialog.prototype = {
  	initialize: function(dlgHeader, dlgContent, dlgButtons, dlgWidth) {
        this.dlgHeader = dlgHeader;
        this.dlgButtons = dlgButtons;
        this.dlgWidth = dlgWidth;
        this.dialog = null;
        this.dialogBody = null;
        if (typeof dlgContent=='string') {
            this.dlgContent = new Element('div', {});
            this.dlgContent.innerHTML = dlgContent;
        } else this.dlgContent = dlgContent;
        this.tt_buildGUI();
        this.afterShow = new Function;
        this.onEnter = new Function;
        this.onEsc = new Function;
  	},

	tt_buildGUI: function () {
        this.dialog = new Element('div',{});
        this.dialog.style['display'] = 'none';
        this.dialog.style['position'] = 'fixed';
        this.dialog.style['zIndex'] = '10001';
        this.shadow = new Element('div', {});
	    this.shadow.style['opacity'] = '0.5';
	    this.shadow.style['position'] = 'fixed';
	    this.shadow.style['background'] = '#666';
	    this.shadow.style['margin'] = '5px 0 0 3px';
        this.dialog.appendChild(this.shadow);
        this.dialog.appendChild(this.tt_dlgFace());
        var htmlBody=document.body;
        htmlBody.appendChild(this.dialog);
        this.tt_onKeypress = this.tt_onKeypress.bindAsEventListener(this);
        Event.observe(window, 'keypress', this.tt_onKeypress);
        this.tt_show();
    },
    
    tt_onKeypress: function (e) {
        if (e.keyCode==13) {
            this.onEnter();
        } else if (e.keyCode==27) {
            this.onEsc();
        }
	},

    tt_stopEvent: function () {
        Event.stopObserving(window, 'keypress', this.tt_onKeypress);
    },
    
    tt_dlgFace: function () {
        this.dlgFace = new Element('div', {
            'class' : 'tt_dlgContainer' 
        });
	    this.dlgFace.style['height'] = 'auto';
	    this.dlgFace.style['width'] = this.dlgWidth+'px';
        this.dlgFace.appendChild(this.tt_dlgHeader());
        this.dlgFace.appendChild(this.tt_dlgBody());
        this.dlgFace.appendChild(this.tt_dlgLoading());
        this.dlgFace.appendChild(this.tt_dlgFooter());
        return this.dlgFace;
    },
    
    tt_dlgHeader: function () {
        this.header =  new Element('div', 
            {'class':'tt_dlgHeader'});
        this.header.innerHTML = this.dlgHeader;
        return this.header;
    },
    
    tt_dlgBody: function () {
        this.dlgBody =  new Element('div', {
            'id'    :   'dlgBody',
            'class' :   'tt_dlgBody thientan13_dlgBody',//them thientan13_dlgBody de lam phan editubersich cho trang cha
            'style' :   'height:auto'
        });
        this.dlgBody.appendChild(this.dlgContent);
        return this.dlgBody
    },
    
    tt_dlgLoading: function () {
        this.dlgLoading =  new Element('div', 
            {'class':'tt_dlgLoading'});
        var l = this.dlgWidth/2 - 25;
        this.dlgLoading.style['marginLeft'] = l+'px';
        this.dlgLoading.hide();
        return this.dlgLoading;
    },
    
    tt_dlgFooter: function () {
        this.dlgFooter =  new Element('div', {
            'id': 'dlgFooter',
            'class':'tt_dlgFooter'
        });
        for (i=0; i < this.dlgButtons.length; i++) {
            var isDefault = this.dlgButtons[i].isDefault
            var defaultBtn = isDefault ? " defaultButton" : "";
            var btn = new Element('input', {
                'type'  : 'button',
                'id'    : 'btn' + this.dlgButtons[i].id,
                'value' : this.dlgButtons[i].value,
                'class' : 'tt_dlgButton' + defaultBtn
            }); this.dlgFooter.appendChild(btn);
        }
        return this.dlgFooter;
    },
    
    tt_show: function () {
        window.scroll(0, 0);
        this.Overlay = new TT_Overlay({ 
            isEffect: true,
            afterFinish: function () {
                this.dialog.show();
                this.tt_setDefaultPos();
                try {
                    var Drag = new TT_Drag();
                    Drag.tt_makeDraggable(this.dialog, this.header);
                } catch (e) {}
                this.afterShow();
            }.bind(this) 
        });
        this.Overlay.tt_show();
    },
    
    tt_loading: function () {
        this.dlgBody.hide();
        this.dlgFooter.hide();
        this.dlgLoading.show();
        var dlg_h = this.dlgFace.clientHeight;
        this.shadow.style['height'] = dlg_h + 'px';
    },

    tt_complete: function () {
        this.dlgBody.show();
        this.dlgFooter.show();
        this.dlgLoading.hide();
        var dlg_h = this.dlgFace.clientHeight;
        this.shadow.style['height'] = dlg_h + 'px';
    },

    tt_setSize: function (w, h) {
        try {
            if (w!=undefined) this.dlgFace.style['width'] = w + 'px';
            if (h!=undefined) this.dlgBody.style['height'] = h + 'px';
            this.tt_setDefaultPos();
        } catch (e) {}
    },
    
    tt_setDefaultPos: function () {
        var pageOffset = document.viewport.getScrollOffsets();
        var wnd_h = document.viewport.getHeight();
        var dlg_h = this.dlgFace.clientHeight;
        var dlg_w = this.dlgFace.getWidth();
        var top = parseInt(wnd_h - dlg_h)/2;
        var left = (_WND_W_ - dlg_w)/2 + pageOffset[0] + 133;
        this.dialog.style['top'] = (top < 0 ? 0 : top) + 'px';
        this.dialog.style['left'] = (left < 0 ? 0 : left) + 'px';
        this.shadow.style['width'] = dlg_w + 'px';
        this.shadow.style['height'] = dlg_h + 'px';
    },
    
    tt_textField: function (id, title, value) {
        var html = '';
        html += '<div id="lbl_'+id+'" class="tt_dlgLeft">'+title+'</div>';
        html += '<div class="tt_dlgRight">';
        html +=     '<input id="'+id+'" type="text" ';
        html +=          'value="'+ value+'" />';
        html += '</div>';
        var divRow = new Element('div', {'class': 'tt_dlgRow'});
        divRow.innerHTML = html;
        this.dlgContent.appendChild(divRow);
    },
    
    tt_fileField: function (id, title, value) {
        var html = '';
        html += '<div class="tt_dlgLeft">'+title+'</div>';
        html += '<div class="tt_dlgRight">';
        html += '<div id="'+id+'"></div>';
        html += '</div>';
        var divRow = new Element('div', {'class': 'tt_dlgRow'});
        divRow.innerHTML = html;
        this.dlgContent.appendChild(divRow);
        return new TT_Finder({
            id: id,
            container: $(id),
            inputvalue: value
        });
    },
    
    tt_textareaField: function (id, title, value) {
        var html = '';
        html += '<div id="lbl_'+id+'" class="tt_dlgLeft">'+title+'</div>';
        html += '<div class="tt_dlgRight">';
        html +=     '<textarea id="'+id+'" type="text" rows="5">'+value+'</textarea>';
        html += '</div>';
        var divRow = new Element('div', {'class': 'tt_dlgRow'});
        divRow.innerHTML = html;
        this.dlgContent.appendChild(divRow);
    },
    
    tt_customField: function (html, h) {
        var divRow = new Element('div', {'class': 'tt_dlgRow'});
        if (h!=undefined) divRow.style['height'] = h + 'px';
        divRow.innerHTML = html;
        this.dlgContent.appendChild(divRow);
    },
   
    tt_closeDialog: function () {
        this.dialog.remove();
        this.Overlay.tt_close();
        this.tt_stopEvent();
    }
}