var Popup = new Class({
    Implements: [Options, Events],
    options: {
        defaultWidth: 500,
        defaultHeight: 300,
        transDuration: 500
    },
    initialize: function(options) {
        this.setOptions(options);
        this.initializePopups();
    },
    initializePopups: function() {
        this.SetupPopups();

        if (this.popupitems.length > 0) {
            if (this.cssOverlay == null) {
                this.SetupOverlay();

                window.addEvent('resize', function(e) {
                    if (this.currentObj != null) {
                        if (this.currentObj.style.display == 'block') {
                            this.reposition();
                        }
                    }
                } .bindWithEvent(this));

                window.addEvent('scroll', function(e) {
                    if (this.currentObj != null) {
                        this.scrolling = true;
                        if (this.currentObj.style.display == 'block') {
                            this.reposition();
                        }
                    }
                } .bindWithEvent(this));
            }
        }
    },
    currentObj: null,
    id: '',
    width: 0,
    height: 0,
    popupitems: [],
    adjustHeight: function(newHeight) {
        this.height = newHeight;
        this.currentObj.morph({ 'height': newHeight });
    },
    resizeObject: function(width, height) {
        this.currentObj.morph({ 'height': height, 'width': width });
    },
    positionObject: function(top, left) {
        this.currentObj.morph({ 'top': top, 'left': left });
    },
    positionandresizeObject: function(top, left, width, height) {
        this.currentObj.morph({ 'top': top, 'left': left, 'height': height, 'width': width });
    },
    reposition: function() {
        if (this.currentObj != null) {
            if (this.scrolling) {
                this.currentObj.get('morph').cancel();
            }
            this.positionOverlay();
            this.positionObject(this.y + 10, (this.x + document.getCoordinates().width - this.width) / 2);
        }
    },
    show: function(width, height) {

        this.onShow();
        this.positionOverlay();

        $('CssOverlay').style.display = "block";
        $("CssOverlay").setStyles({ 'opacity': 0.6 });

        this.currentObj.style.display = "block";

        this.width = width;
        this.height = height;

        var currentCoords = this.currentObj.getCoordinates();

        if (currentCoords.top != this.y + 25 || currentCoords.left != (this.x + document.getCoordinates().width - width) / 2) {
            this.positionandresizeObject(this.y + 25, (this.x + document.getCoordinates().width - width) / 2, width, this.GetApplicableHeight());
        }
        else {
            this.resizeObject(width, this.GetApplicableHeight());
        }
    },
    hide: function() {
        this.resizeObject(10, 10);
        var h = function() { this.currentObj.style.display = "none"; $('CssOverlay').style.display = "none"; } .bindWithEvent(this);
        h.delay(this.options.transDuration - 100);
        this.fireEvent('onHide', this, 10);

    },
    popupPosition: function() {
        //get the scroll offsets
        var y = (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
        var x = (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);

        this.y = y;
        this.x = x;
    },
    SetupOverlay: function() {
        try {
            if ($('CssOverlay') == null) {
                var body = $(document.body);
                var cssOverlay = new Element('div', { 'class': 'CssOverlay', 'id': 'CssOverlay', 'style': 'display:none;position:absolute;background:#333333;zindex:100;' });
                cssOverlay.innerHTML = " ";
                cssOverlay.inject(body);
            }

            try {
                this.positionOverlay();
            }
            catch (e) {
                alert('Setup CSS Overlay - 2 - ' + e.message);
            }

            //            $('CssOverlay').addEvent('click', function(e) {
            //                this.hide();
            //            } .bindWithEvent(this));
        }
        catch (e) { alert(e.message); }

    },
    positionOverlay: function() {
        var overlay = $('CssOverlay');
        this.popupPosition();

        overlay.style.top = this.y + 'px';
        overlay.style.left = this.x + 'px';

        overlay.style.width = document.getCoordinates().width + 'px';
        overlay.style.height = document.getCoordinates().height + 'px';
    },
    extractDetails: function(value) {
        try {
            var options = value.split("-");
            if (options.length > 1) {
                this.id = options[0];
                try { this.width = options[1]; } catch (e) { this.width = this.options.defaultWidth; }
                try { this.height = options[2]; } catch (e) { this.height = this.options.defaultHeight; }
            }
            else {
                this.id = options[0];
                this.width = this.options.defaultWidth;
                this.height = this.options.defaultHeight;
            }
        } catch (e) { alert(e.message); }
    },
    SetupPopups: function() {
        this.popupitems = [];

        var popup_a = [];
        var gIndex;
        var a_tags = $$('a');

        a_tags.each(function(a) {
            //test 'Popup' and link extension, and collect all milkbox links
            if (a.rel.length > 0) {
                if (a.rel && a.rel.test(/^Popup/i)) {
                    popup_a.push(a);
                }
            }
        }, this);

        popup_a.each(function(a) {

            this.popupitems.push(a);
            $(a).store('href', a.href);
            $(a).store('rel', a.rel);
            $(a).store('title', a.title);

            var section = a.rel.split('[');
            if (section.length > 1) {
                this.extractDetails(section[1].substring(0, section[1].length - 1))
            }

            $(a).store('popupid', this.id);
            $(a).store('popupwidth', this.width);
            $(a).store('popupheight', this.height);

            $(a).addEvent('click', function(e) {
                var button;
                if ($(e.target) != null) {
                    button = ($(e.target).match('a')) ? $(e.target) : $(e.target).getParent('a');
                    e.preventDefault();
                }
                else {
                    button = e;
                }
                this.currentObj = $(button.retrieve('popupid'));
                this.currentObj.set('morph', { duration: this.options.transDuration
                                , transition: Fx.Transitions.Expo.easeOut
                                , link: 'chain'
                });

                this.currentObj.get('morph').removeEvent('onComplete');
                this.currentObj.get('morph').addEvent('onComplete', function() {
                    if (this.scrolling) {
                        this.scrolling = false;
                    }
                } .bindWithEvent(this));

                this.show(button.retrieve('popupwidth'), button.retrieve('popupheight'));
            } .bindWithEvent(this));
        } .bindWithEvent(this));
    },
    ReloadPopups: function() {
        this.initializePopups();
    },
    GetApplicableHeight: function() {
        if (this.currentObj != null) {
            var child = this.currentObj.getElement('.PopupContent');
            if (child != null) {
                var contentCoords = child.getCoordinates();


                var newHeight = this.height;
                if (contentCoords.height + 25 < this.height) {
                    newHeight = contentCoords.height + 25;
                }
                return newHeight;
            }
            else {
                return this.height;
            }
        }
        else {
            return this.height;
        }
    },
    ResizeHeight: function() {
        if (this.currentObj != null) {
            this.currentObj.morph({ 'height': this.GetApplicableHeight() });
        }
    },
    onComplete: function() { },
    onStart: function() { },
    onShow: function() { },
    onHide: function() { },
    scrolling: false
});

var Popups;

window.addEvent('domready', function() {
    Popups = new Popup();
});

function ReloadPopups(sender, args) {
    if ($$(".PopupContainer").length > 0) {
        Popups.ReloadPopups();
        Popups.ResizeHeight();
    }
}

window.addEvent('domready', function() {
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(ReloadPopups);
});