var button;
var videoLink;
var Popup = new Class({
    Implements: [Options, Events],
    options: {
        defaultWidth: 500,
        defaultHeight: 300,
        transDuration: 500,
        siteWidth: 1002,
        useSiteWidth: true
    },
    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();

            var containerWidth = document.getCoordinates().width;
            if (this.options.useSiteWidth) {
                containerWidth = this.options.siteWidth;
            }
            this.positionObject(this.y + 10, (this.x + containerWidth - 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();

        var containerWidth = document.getCoordinates().width;
        if (this.options.useSiteWidth) {
            containerWidth = this.options.siteWidth;
        }

        if (currentCoords.top != this.y + 25 || currentCoords.left != (this.x + containerWidth - width) / 2) {
            this.positionandresizeObject(this.y + 25, (this.x + containerWidth - 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);
        location.reload();
    },
    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; z-index: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; }
                try { this.preventDefault = (options[3] == 'true'); } catch (e) { this.preventDefault = false; }
                try { smallVid = options[4]; } catch (e) { }
                try { largeVid = options[5]; } catch (e) { }
                try { division = options[6]; } catch (e) { }
            }
            else {
                this.id = options[0];
                this.width = this.options.defaultWidth;
                this.height = this.options.defaultHeight;
                this.preventDefault = false;
            }
        } 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).store('popupPrevent', this.preventDefault);

            $(a).addEvent('click', function (e) {

                if ($(e.target) != null) {
                    button = ($(e.target).match('a')) ? $(e.target) : $(e.target).getParent('a');
                    var link = a.rel.slice(0, a.rel.length - 13);
                    var newLink = link.substring(35);
                    videoLink = newLink;
                    //alert(button.retrieve('popupPrevent'));
                    
                    if (!button.retrieve('popupPrevent')) { 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 < this.height) {
                    newHeight = contentCoords.height;
                }
                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;
var smallVid;
var largeVid;

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

});

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

        Popups.ReloadPopups();
        Popups.ResizeHeight();
    }
}


function getLargeVid() {

    return largeVid;
}

function getSmallVid() {

    smallVid = videoLink;
    
    return smallVid;
}


function closeVideo() {

    Popups.hide();
}


function getDivision() {
    return division;
}


//function changeImage(clientID, newImage, xlImage) {
//    $(clientID + '_imgLargeImage').src = newImage;

//    $(clientID + '_lnkLargeImage').href = xlImage;
//    milkbox.reloadGalleries();
//}