var SimpleBox = new MK111.Class({
    options: {
        width: 300,
        height: 200,
        opacity: "0.8",
        btnTitle: "Ok",
        closeBtn: null,
        boxTitle: "messageBox",
        boxClass: "mainBox",
        id: "myID",
        fadeSpeed: 500,
        box: null,
        addContentID: null,
        addContent: null,
        boxTxtColor: "#000",
        isVisible: false,
        isDrag: true
    },
    initialize: function(a) {
        this.isVisible = false;
        if (a.isDrag) {
            this.isDrag = a.isDrag
        }
        if (a.width) {
            this.width = a.width
        }
        if (a.height) {
            this.height = a.height
        }
        if (a.opacity) {
            this.opacity = a.opacity
        }
        if (a.btnTitle) {
            this.btnTitle = a.btnTitle
        }
        if (a.boxTitle) {
            this.boxTitle = a.boxTitle
        }
        if (a.boxClass) {
            this.boxClass = a.boxClass
        }
        if (a.boxTxtColor) {
            this.boxTxtColor = a.boxTxtColor
        }
        if (a.fadeSpeed) {
            this.fadeSpeed = a.fadeSpeed
        }
        if (a.id) {
            this.id = a.id
        }
        if (a.closeBtn) {
            this.closeBtn = MK111.$(a.closeBtn)
        }
        if (a.addContentID) {
            this.addContentID = a.addContentID
        }
        if (a.addContentID) {
            this.addContent = MK111.$(this.addContentID).innerHTML;
            MK111.$(this.addContentID).setStyle("visibility", "hidden");
            MK111.$(this.addContentID).remove()
        }
        this.createBox()
    },
    createBox: function() {
        this.box = new MK111.Element("div");
        this.box.addClass(this.boxClass)
    },
    clickClose: function() {
        MK111.$(this.box).effect("opacity", {
            wait: true,
            duration: this.fadeSpeed,
            transition: MK111.Fx.Transitions.linear
        }).chain(function() {}).start(this.opacity, 0);
        this.isVisible = false
    },
    fadeOut: function() {
        if (this.isVisible) {
            MK111.$(this.box).effect("opacity", {
                wait: true,
                duration: this.fadeSpeed,
                transition: MK111.Fx.Transitions.linear
            }).chain(function() {}).start(this.opacity, 0);
            this.isVisible = false
        }
    },
    fadeIn: function() {
        if (document.documentElement && document.documentElement.clientWidth) {
            theWidth = document.documentElement.clientWidth
        } else {
            if (document.body) {
                theWidth = document.body.clientWidth
            }
        }
        if (window.innerHeight) {
            theHeight = window.innerHeight
        } else {
            if (document.documentElement && document.documentElement.clientHeight) {
                theHeight = document.documentElement.clientHeight
            } else {
                if (document.body) {
                    theHeight = document.body.clientHeight
                }
            }
        }
        var c = window.getScrollTop();
        var b = (theHeight - this.height) / 2;
        b = (b + c);
        var a = (theWidth - this.width) / 2;
        // Disable default position
        //this.box.setStyle("top", b);
        //this.box.setStyle("left", a);
        this.box.setStyle("position", "absolute");
        this.box.setStyle("width", this.width);
        this.box.setStyle("height", this.height);
        this.box.setStyle("opacity", this.opacity);
        this.box.setStyle("cursor", "move");
        this.box.setStyle("z-index", "999990000");
        this.box.setAttribute("id", this.id);
        this.box.setStyle("visibility", "hidden");
        this.box.injectInside(document.body);
        if (this.isVisible == false) {
            this.box.effect("opacity", {
                wait: true,
                duration: this.fadeSpeed,
                transition: MK111.Fx.Transitions.linear
            }).start(0, this.opacity);
            this.addHT();
            this.isVisible = true
        }
    },
    addHT: function() {
        this.closeBtn = new MK111.Element("button", {
            styles: {
                border: "none",
                "background-image": "url(/DesktopModules/Markit.FancyPopup/Images/bg_button.gif)",
                color: "#666",
                position: "absolute",
                bottom: "3px",
                right: "3px",
                width: "44px",
                height: "19px",
                "font-size": "10px",
                "font-family": "arial",
                cursor: "pointer"
            }
        });
        var c = this.width.toInt() + 5;
        if (window.ie) {
            var a = new MK111.Element("div", {
                styles: {
                    width: c,
                    height: "auto",
                    "background-repeat": "repeat-x",
                    "background-position": "right top",
                    "line-height": "20px",
                    padding: "5px 5px 5px 10px",
                    position: "absolute",
                    clear: "both",
                    "margin-bottom": "10px",
                    top: "0px",
                    left: "0px",
                    color: "#eee"
                }
            })
        } else {
            var a = new MK111.Element("div", {
                styles: {
                    width: c,
                    height: "auto",
                    "background-repeat": "repeat-x",
                    "background-position": "right top",
                    "line-height": "auto",
                    padding: "5px 5px 5px 10px",
                    position: "absolute",
                    clear: "both",
                    "margin-bottom": "10px",
                    top: "0px",
                    left: "0px",
                    color: "#eee"
                }
            })
        }
        MK111.$(a).innerHTML = this.boxTitle;
        var b = new MK111.Element("div", {
            styles: {
                padding: "10px"
            }
        });
        b.setAttribute("id", "myContent");
        this.box.innerHTML = "";
        b.injectInside(this.box);
        b.innerHTML = this.addContent;
        this.closeBtn.innerHTML = this.btnTitle;
        MK111.$(this.closeBtn).addEvent("click", this.clickClose.bindWithEvent(this));
        a.injectInside(this.box);
        this.closeBtn.injectInside(this.box);
        if (this.isDrag == "true") {
            this.box.makeDraggable()
        }
    }
});
SimpleBox.implement(new MK111.Options, new MK111.Events);
SimpleBoxControler = {
    _instance: [],
    run: function(a) {
        if (typeof(a) != "object") {
            return
        }
        if (!this._instance[a.id]) {
            this._instance[a.id] = new SimpleBox({
                width: a.width,
                height: a.height,
                btnTitle: a.btnTitle,
                closeBtn: "myBtn",
                boxClass: a.boxClass,
                id: "376",
                fadeSpeed: a.fadeSpeed,
                opacity: "0.9",
                addContentID: a.id,
                boxTitle: a.boxTitle,
                isDrag: String(a.isDrag)
            })
        }
        if (!this._instance[a.id].isVisible) {
            this._instance[a.id].fadeIn()
        }
    }
};