/**
 * ServiceHome (c) 2008
 * 
 * http://www.servicehome.net
 * info@servicehome.net
 * 
 * JavaScript based library to display modal dialogs on webpages.
 * 
 * based on:
 *  - Prototype 1.6           [http://www.prototypejs.org/]
 *  - script.aculo.us         [http://script.aculo.us/]
 * 
 * created: 02.10.2008
 */

/*.modalDialog_transparentDivs {
        filter: alpha(opacity=40);
        opacity: 0.4;
        background-color:#AAA;
        position: fixed;
        z-index: 499;
    }
    .modalDialog_contentDiv {
        border:3px solid #000;	
        padding:2px;
        z-index: 600;
        position: absolute;
        background-color:#FFFFFF;
    }
    .modalDialog_contentDiv_shadow {
        z-index: 550;
        position: absolute;
        background-color:#555;
        filter: alpha(opacity=30);
        opacity:0.3;
    }*/

var SH_ModalDialog = Class.create(
{
    initialize: function () {
        this.numberRegEx = /[+|-]*[0-9]+/;

        this.dragging = false;
        this.title_events_enabled = false;
        this.lastMousePos = new Object();
        this.lastMousePos.x = 0;
        this.lastMousePos.y = 0;
        
        this.modal = false;
        this.content = "";
        this.title = "";
        
        this.numberRegEx = /[+|-]*[0-9]+/;
        //this.append_autoclose = true;
        //this.append_autoclose_label = "<close>";
        
        // DLG constants
        this.dlg_title_div_id = "sh_modal_message_dlg_title";
        this.dlg_content_div_id = "sh_modal_message_dlg_content";
        
        this.dlg_id = "sh_modal_message_dlg";
        this.dlg_classname = "modalDialog_contentDiv";
        this.dlg_classname_shadow = "modalDialog_contentDiv_shadow";
        this.dlg_width = "550px";
        this.dlg_height = "400px";
        
        this.dlg_content_height = "380px";
        
        this.dlg_left = "0px";
        this.dlg_top = "0px";

        this.message_div = new Element("div", { 
            "id": this.dlg_id
            });
        this.message_div.setStyle({
            "width": this.dlg_width,
            "height": this.dlg_height,
            "position": "absolute",
            "display": "none"
        });
        this.message_div.addClassName(this.dlg_classname);
        this.message_div.left = this.dlg_left;
        this.message_div.top = this.dlg_top;
        
        Element.insert(document.body, { 
            top: this.message_div
        });
    },
    
    setTitle: function (title) {
        this.title = title;
    },
    
    __mouseDown: function (evt) {
        this.dragging = true;

        this.lastMousePos.x = Event.pointerX(evt);
        this.lastMousePos.y = Event.pointerY(evt);
    },
    
    __mouseUp: function (evt) {
        this.dragging = false;
        
        this.lastMousePos.x = Event.pointerX(evt);
        this.lastMousePos.y = Event.pointerY(evt);
    },
    
    __mouseMove: function (evt) {
        if (this.dragging == true) {
            //var test = Element.cumulativeOffset(this.message_div);
            var dx = Event.pointerX(evt) - this.lastMousePos.x;
            var dy = Event.pointerY(evt) - this.lastMousePos.y;
          
            this.lastMousePos.x = Event.pointerX(evt);
            this.lastMousePos.y = Event.pointerY(evt);
            
            this.__movePosition(dx, dy);
        }
    },
    
    __registerTitlebarEvents: function () {
        var title_div = $(this.dlg_title_div_id);

        if (this.title_events_enabled == false) {
            Event.observe(title_div, "mousedown", this.__mouseDown.bindAsEventListener(this));
            Event.observe(title_div, "mouseup", this.__mouseUp.bindAsEventListener(this));
            //Event.observe(title_div, "mouseout", this.__mouseUp.bindAsEventListener(this));
            
            Event.observe(document, "mousemove", this.__mouseMove.bindAsEventListener(this));
            
            this.title_events_enabled = true;
        }
    },
    
    
    setContentById: function (content_id) {
        var content = $(content_id);
        this.setContent(content.innerHTML);
    },
    
    setContent: function (content) {
        this.content = content;
        var title_div = $(this.dlg_title_div_id);
        if (title_div == null) {
            title_div = new Element("div", { 
                "id": this.dlg_title_div_id
            });
            title_div.setStyle({
                "backgroundColor": "#F3F3F3",
                "borderBottom": "1px solid #968E8E",
                "color": "#000000"
            });
        }
        title_div.innerHTML = '<div style="float: left;">' + this.title + '</div>';
                
        var text_content = $(this.dlg_content_div_id);
        if (text_content == null) {
            text_content = new Element("div", { 
                "id": this.dlg_content_div_id
            });
            text_content.setStyle({
                "overflow": "auto",
                "width": this.dlg_width,
                "height": this.dlg_content_height
            });
        }
        text_content.innerHTML = content;
        
        // append title and content
        this.message_div.appendChild(title_div);
        this.message_div.appendChild(text_content);

        var link = new Element("a", {});
        var close_img = new Element("img",  { 
            "src": "/js/images/close.gif"
        });
        
        link.appendChild(close_img);
        //link.appendChild(document.createTextNode("[schliessen X]"));
        var link_div = new Element("div", {});
        link_div.setStyle({
            "textAlign": "right"
        });
        link_div.appendChild(link);
        
        title_div.appendChild(link_div);
        Event.observe(link, "click", this.close.bindAsEventListener(this));
        
        this.__registerTitlebarEvents();
    },
    
    show: function (modal) {
        this.modal = modal;
        if (modal) {
            this.initModal(true);
        }
        this.__showDlg();
    },
    
    __showDlg: function () {
        this.dragging = false;
        this.message_div.style.display = "block";
        this.__centerOnViewport(this.message_div);
    },
    
    __centerOnViewport: function (element_ref) {
        var dim_ar = this.__getBrowserSize();
        var viewport_w = dim_ar[0];
        var viewport_h = dim_ar[1];
        
        var _w = element_ref.style.width.match(this.numberRegEx);
        var _h = element_ref.style.height.match(this.numberRegEx);

        //alert("top=" + Math.ceil((viewport_h - _h) / 2) + 'px');
        element_ref.style.left = Math.ceil((viewport_w - _w) / 2) + 'px';
        element_ref.style.top = Math.ceil((viewport_h - _h) / 2) + 'px';
    },
    
    /**
     * Move dialog.
     * 
     * @param x the xoffset
     * @param y the yoffset
     */
    __movePosition: function (x, y) {
        var xpos = 1.0 * this.message_div.style.left.match(this.numberRegEx);
        var ypos = 1.0 * this.message_div.style.top.match(this.numberRegEx);
        
        xpos += x;
        ypos += y;

        this.message_div.style.left = xpos + 'px';
        this.message_div.style.top = ypos + 'px';
    },

    /**
     * Set the size of the whole window.
     *
     * @param width will be interpreted as value in pixel.
     * @param height will be interpreted as value in pixel.
     *
     * @return void
     */
    setSize: function (width, height) {
        var w = width.match(this.numberRegEx);
        var h = height.match(this.numberRegEx);

        var title = $(this.dlg_title_div_id);
        var title_height = 0;
        if (title != null) {
            try {
                title_height = title.getHeight();
            } catch (exc) {
            // NOTHING
            };
        }
        this.message_div.setStyle({
            "width": w + "px",
            "height": h + "px"
        });

        var cdiv = $(this.dlg_content_div_id);
        cdiv.setStyle({
            "width": w + "px",
            "height": (h-title_height) + "px"
        });
    },
    
    centerRelativeTo: function (relative_ref) {
        if (relative_ref != null) {
            var result = Element.cumulativeScrollOffset(relative_ref);
            var top_ref = result.top + 150;
            
            var h = this.message_div.top.match(this.numberRegEx);
            var top = h * 1 + top_ref + "px";
            this.message_div.style.top = top;
        }
    },
    
    close: function() {
        if (this.modal) this.initModal(false);
        this.__hide();
    },
    
    __hide: function () {
        this.message_div.style.display = 'none';
    },
        
    initModal: function (show) {
        var div = $('ce_transparency_div');
        if (div == null) {
            div = new Element("div", { 
                "id": "ce_transparency_div"
            });
            div.addClassName("modalDialog_transparentDivs");

            Element.insert(document.body, {
                'top': div
            });
        }

        var footer = $('footer');
        var wert = Element.cumulativeOffset(footer);
        div.style.height = (wert.top + 95) + "px";

        if (show) {
            div.show();
        } else {
            div.hide();
        }
    },

    __getWindowSize: function() {
        var w = window
        var width = w.innerWidth || (w.document.documentElement.clientWidth || w.document.body.clientWidth);
        var height = w.innerHeight || (w.document.documentElement.clientHeight || w.document.body.clientHeight);
        
        return {
            'width': width,
            'height': height
        };
    },

    __getBrowserSizeNew : function()    {
        var data = this.__getBrowserSize();

        return({
            "width": data[0],
            "height": data[1]
        });
    },
    
    __getBrowserSize : function()    {
        var bodyWidth = document.documentElement.clientWidth;
        var bodyHeight = document.documentElement.clientHeight;
    	
        if (self.innerHeight){ // all except Explorer 
		 
            bodyWidth = self.innerWidth; 
            bodyHeight = self.innerHeight; 
        }  else if (document.documentElement && document.documentElement.clientHeight) {
            // Explorer 6 Strict Mode 		 
            bodyWidth = document.documentElement.clientWidth; 
            bodyHeight = document.documentElement.clientHeight; 
        } else if (document.body) {// other Explorers 		 
            bodyWidth = document.body.clientWidth; 
            bodyHeight = document.body.clientHeight; 
        } 
        return [bodyWidth,bodyHeight];
    },
    
    showDialog: function(self_ref, title, content) {        
        this.setTitle(title);
        this.setContent(content);

        this.show(true);
        this.centerRelativeTo(self_ref);
    },
    
    callDialogWithContent: function(self_ref, title, content_id) {
        var content = $(content_id);
                
        if (content != null) {
            content = content.innerHTML;
            this.showDialog(self_ref, title, content); // + '<div style="text-align: right;"><a onclick="dlg.close();"><strong>Schliessen</strong></a></div>');
        }
    }
}
);
