var Darkbox = new Class({
    Implements : [Events, Options],
    options    : {
        falldown : false
    },

    initialize: function(container, options) {
        this.setOptions(options);
        this.start($(container));
    },

    create_popup: function() {
        var frame  = new Element('div',  { 'class' : 'darkbox-frame' });
        var shadow = new Element('div',  { 'class' : 'darkbox-shadow' }).fade('hide').inject(frame);
        var canvas = new Element('div',  { 'class' : 'darkbox-canvas' }).inject(shadow, 'after');
        new Element('div',  { 'class' : 'darkbox-button' }).inject(canvas);

        return frame;
    },

    // Инициализируем и показываем
    start: function(container) {
        // Копируем контекст
        var ths = this;

        // Вешаем обработчик на ссылки
        container.getElements('a').each(function(a) {
           a.addEvent('click', function(e) {
                e.stop();
                
                if (!$$('div.darkbox-frame').length) {
                    // Если попап прежде не вызывался,
                    // создаём его и цепляем к BODY
                    darkbox = ths.create_popup().inject(document.body);
                }

                // Клонируем попап,
                // прицепляем клон к BODY и показываем его
                var frame = darkbox.clone().inject(document.body).addClass('darkbox-frame-on');

                var shadow = frame.getElement('div.darkbox-shadow');

               // Показываем "тень"
               shadow.set('tween', { duration : 300 }).fade(0.6);

                var canvas = frame.getElement('div.darkbox-canvas');
                var button = frame.getElement('div.darkbox-button');

                // Цепляем к попапу картинку и ждём её загрузки
                var image = new Element('img',  { 'src'   : a.get('href'), 'alt' : a.get('title') }).inject(canvas);

                image.addEvent('load', function() {
                    var imageWidth  = image.getWidth();
                    var imageHeight = image.getHeight();
                    var frameWidth  = frame.getWidth()-40;
                    var frameHeight = frame.getHeight()-40;

                    // Вписываем картинку в размер окна,
                    // если она шире, чем окно
                    if (imageWidth > frameWidth) {
                        imageWidth = frameWidth;
                        image.setStyle('width', imageWidth + 'px');

                        while (image.getHeight() > frameHeight) {
                            image.setStyle('width', imageWidth + 'px');
                            imageWidth--;
                        }

                        imageHeight = image.getHeight();
                    }

                    // Вписываем картинку в размер окна,
                    // если она выше, чем окно
                    if (imageHeight > frameHeight) {
                        imageHeight = frameHeight;
                        image.setStyle('height', imageHeight + 'px');

                        while(image.getWidth() > frameWidth) {
                            image.setStyle('height', imageHeight + 'px');
                            imageHeight--;
                        }

                        imageWidth = image.getWidth();
                    }


                    // Анимируем загрузчик до размеров картинки
                    // и одновременно смещаем к центру
                    var eff = new Fx.Morph(canvas, {
                        duration   : 500,
                        transition : Fx.Transitions.Sine.easeOut,
                        onComplete : function() {
                            // После завершения анимации показываем кнопку и картинку
                            canvas.addClass('darkbox-canvas-done');
                            button.addClass('darkbox-button-on');
                            button.addClass(navigator.platform.toLowerCase().indexOf('mac')+1?'darkbox-button-left':'darkbox-button-right');


                            image.fade('hide')
                                 .set('tween', { duration : 500, onComplete : function() {
                                    // Вешаем события для закрытия картинки
                                    [shadow, button].each(function(o) {
                                        o.addEvent('click', ths.hide.bind(ths, [canvas, shadow, frame]));
                                    })
                                 } })
                                 .fade('in');
                        }
                    });

                    canvas.addClass('darkbox-canvas-load');
                    eff.start({
                        'width'       : imageWidth,
                        'margin-left' : -imageWidth/2,
                        'height'      : imageHeight,
                        'margin-top'  : -imageHeight/2
                    });
                });


                // Внимательно слушаем клавишу Esc
                document.addEvent('keydown', function(e) {
                    if (e.code == 27)
                        ths.hide.run([canvas, shadow, frame], ths);
                });
           });
        });


    },

    // Прячем
    hide: function(canvas, shadow, frame) {
        if (!this.options.falldown) {
            canvas.dispose();
            shadow.set('tween', {
                duration : 300,
                onComplete : function() { frame.dispose(); }
            }).fade(0);
        } else {
            new Fx.Morph(canvas, {
                duration   : 500,
                transition : Fx.Transitions.Sine.easeInOut,
                onComplete : function() {
                    frame.dispose();
                }
            }).start({ 'top'  : shadow.getHeight() * 2 });
        }
    }
});
