/**
 * @constructor
 * @class MediaGallery
 */
var MediaGallery = new JS.Class({
    include: Ojay.Observable,
    
    /**
     * @param {String|HTMLElement} container
     * @param {Object} options
     */
    initialize: function(container, options) {
        this.container = Ojay(container);
        var region = this.container.children().at(0).getRegion();
        this._options = options || {};
        
        this.paginator = new Ojay.Paginator(container, {
            width:       (options.across * region.getWidth()) + 'px',
            height:      (options.down * region.getHeight()) + 'px',
            direction:   options.direction
        });
        
        this.mask    = new Ojay.PageMask({color: '#000000', opacity: 0.5});
        this.overlay = new Ojay.ContentOverlay({className: 'gallery-overlay'});
        this.mask.positionBehind(this.overlay);
        this.closeButton = this.getCloseButton();
        
        this.container.descendants('a').on('click', function(link, evnt) {
            evnt.stopDefault();
            this.mask.show('fade');
            this.updateOverlay(link.node.href)
            ._(this.overlay).fitToContent().center().show('fade')
            ._(this.closeButton).setPosition().show('fade');
        }, this);
        
        this.overlay.getContainer().on('click', Ojay.delegateEvent({
            'a.previous, a.next': function(link, evnt) {
                evnt.stopDefault();
                this.updateOverlay(link.node.href);
            }
        }), this);
    },
    
    /**
     * @returns {ContentOverlay}
     */
    getCloseButton: function() {
        if (this.closeButton) return this.closeButton;
        
        this.closeButton = new Ojay.Overlay({className: 'overlay-close'});
        this.closeButton
            .positionInFront(this.overlay)
            .setSize(20,20);
        
        var overlay = this.overlay;
        this.closeButton.extend({
            setPosition: function() {
                var region = overlay.getRegion(), mine = this.getSize();
                if (!region || !mine) return this;
                this.callSuper(region.right - mine.width * 0.7, region.top - mine.height * 0.3);
                return this;
        }   });
        
        this.closeButton.getContainer().on('click')._(this).hideOverlay();
        
        return this.closeButton;
    },
    
    /**
     * @returns {MediaGallery}
     */
    setup: function() {
        this.paginator.setup();
        if (this.paginator.getPages() <= 1) return this;
        var controls = this.paginator.addControls('after');
        var prev = controls.getPreviousButton(), next = controls.getNextButton();
        var container = this.paginator.getContainer();
        if (this._options.direction == 'vertical')
            container.insert(prev, 'before').insert(next, 'after');
        return this;
    },
    
    /**
     * @param {String} url
     * @returns {MethodChain}
     */
    updateOverlay: function(url) {
        return Ojay.HTTP.GET(url, {overlay: true}).insertInto(this.overlay).evalScripts()
                ._(this.closeButton).setPosition();
    },
    
    /**
     * @returns {MediaGallery}
     */
    hideOverlay: function() {
        [this.mask, this.overlay, this.closeButton].forEach({hide: 'fade'});
        this.overlay.setContent('');
        return this;
    }
});