/**
 * LightboxAnimation Class
 */
LightboxAnimation = new Class({
    /**
     * Constructor
     *
     * @param Lightbox
     */
    initialize: function(lightbox) {
        this.lightbox = lightbox;
        this.current_step = null;
        this.step_arr = [];

        var thisObject = this;
        this.overlay_fx = new Fx.Style(this.lightbox.overlay, 'opacity', {
            duration: 400, 
            transition: Fx.Transitions.Quart.easeIn,
            onComplete: function() {
                thisObject.animate();
            }
        });
        this.canvas_height_fx = new Fx.Styles(this.lightbox.canvas, {
            duration: 400, 
            transition: Fx.Transitions.Quart.easeIn,
            onComplete: function() {
                thisObject.animate();
            }
        });
        this.canvas_width_fx = new Fx.Styles(this.lightbox.canvas, {
            duration: 400, 
            transition: Fx.Transitions.Quart.easeIn,
            onComplete: function() {
                thisObject.animate();
            }
        });
    },

    /**
     * @param string
     * @param integer
     * @param integer
     * @param Array
     * @return void
     */
    show: function(data, width, height, scripts) {
        this.data = data;
        this.width = width;
        this.height = height;
        this.scripts = scripts;

        if (this.lightbox.overlay.getStyle('opacity') == 0) {
            this.step_arr = ['start', 'overlay_max', 'canvas_show', 'canvas_height', 'canvas_width', 'display_content'];
        } else if (this.width == this.lightbox.canvas.getStyle('width').toInt() && this.height == this.lightbox.canvas.getStyle('height').toInt()) {
            this.step_arr = ['display_content'];
        } else {
            this.step_arr = ['overlay_max', 'canvas_show', 'canvas_height', 'canvas_width', 'display_content'];
        }

        this.lightbox.container.setStyle('display', 'block');
        this.current_step = 0;
        this.animate();
    },

    /**
     * @return void
     */
    hide: function() {
        this.width = this.lightbox.lightbox_min_width;
        this.height = this.lightbox.lightbox_min_height;

        this.step_arr = ['hide_content', 'canvas_width', 'canvas_height', 'canvas_hide', 'overlay_min', 'end'];
        this.current_step = 0;
        this.animate();
    },

    /**
     * @param string
     * @return void
     */
    animate: function() {
        if (this.current_step >= this.step_arr.length) {
            return;
        }

        var step = this.step_arr[this.current_step++];
        eval('this.'+ step +'_step();');
    },

    /**
     * @return void
     */
    end_step: function() {
        this.lightbox.content.setStyle('display', 'none');
        this.lightbox.container.setStyle('display', 'none');
        this.lightbox.canvas.setStyles({
            width: this.lightbox.lightbox_min_width, 
            left: ((Window.getWidth().toInt() - this.lightbox.lightbox_min_width) / 2) + Window.getScrollLeft(),
            height: this.lightbox.lightbox_min_height,
            top: ((Window.getHeight().toInt() - this.lightbox.lightbox_min_height) / 2) + Window.getScrollTop()
        });

        this.animate();
    },

    /**
     * @return void
     */
    start_step: function() {
        this.lightbox.content.setStyle('display', 'none');
        this.lightbox.container.setStyle('display', 'block');
        this.lightbox.canvas.setStyles({
            width: this.lightbox.lightbox_min_width, 
            left: ((Window.getWidth().toInt() - this.lightbox.lightbox_min_width) / 2) + Window.getScrollLeft(),
            height: this.lightbox.lightbox_min_height,
            top: ((Window.getHeight().toInt() - this.lightbox.lightbox_min_height) / 2) + Window.getScrollTop()
        });

        this.animate();
    },

    /**
     * @return void
     */
    display_content_step: function() {
        this.lightbox.setContent(this.data);
        this.lightbox.handleScripts(this.scripts);
        this.animate();
    },

    /**
     * @return void
     */
    hide_content_step: function() {
        this.lightbox.removeContent(this.data);
        this.animate();
    },

    /**
     * @return void
     */
    canvas_hide_step: function() {
        this.lightbox.canvas.setStyle('display', 'none');
        this.animate();
    },

    /**
     * @return void
     */
    canvas_show_step: function() {
        this.lightbox.canvas.setStyle('display', 'block');
        this.animate();
    },

    /**
     * @return void
     */
    canvas_width_step: function() {
        if (this.lightbox.canvas.getStyle('width').toInt() == this.width) {
            return this.animate();
        }

        this.canvas_width_fx.start({
            'left': ((Window.getWidth().toInt() - this.width) / 2) + Window.getScrollLeft(),
            'width': this.width
        });
    },

    /**
     * @return void
     */
    canvas_height_step: function() {
        if (this.lightbox.canvas.getStyle('height').toInt() == this.height) {
            return this.animate();
        }

        this.canvas_height_fx.start({
            'top': ((Window.getHeight().toInt() - this.height) / 2) + Window.getScrollTop(),
            'height': this.height
        });
    },

    /**
     * @return void
     */
    overlay_max_step: function() {
        this.overlay_fx.start(0.8);
    },

    /**
     * @return void
     */
    overlay_min_step: function() {
        this.overlay_fx.start(0);
    }
});

_PagerAnimation = new Class({
    /**
     * Constructor
     *
     * @param Pager
     */
    initialize: function(pager) {
        this.pager = pager;

        this.current_step = null;
        this.step_arr = [];
        this.content = {};
        this.navigation_main_width = 530;
        this.content_main_width = 756;

        var thisObject = this;
        this.navigation_main_fx = new Fx.Styles($('navigation-main'), {
            duration: 300,
            transition: Fx.Transitions.Quart.easeInOut,
            onComplete: function () {
                thisObject.animate();
            }
        });
        this.content_main_fx = new Fx.Styles($('content-main'), {
            duration: 600,
            transition: Fx.Transitions.Quart.easeInOut,
            onComplete: function () {
                thisObject.animate();
            }
        });
    },

    /**
     * @param string
     * @param string
     * @param Object
     * @param Object
     * @return void
     */
    show: function(old_template, new_template, content, scripts) {
        this.content = content;
        this.scripts = scripts;
        this.template = new_template;

        switch (old_template +'-'+ new_template) {
            case 'home-default':
                this.navigation_main_width = 150;
                this.content_main_width = 530;
                this.step_arr = ['content_main', 'navigation_main', 'display_content'];
                break;
            case 'default-home':
                this.navigation_main_width = 0;
                this.content_main_width = 756;
                this.step_arr = ['navigation_main', 'content_main', 'display_content'];
                break;
            default:
                this.step_arr = ['display_content'];
                break;
        }

        this.current_step = 0;
        this.animate();
    },

    /**
     * @param string
     * @return void
     */
    animate: function() {
        if (this.current_step >= this.step_arr.length) {
            return;
        }

        var step = this.step_arr[this.current_step++];
        eval('this.'+ step +'_step();');
    },

    /**
     * @return void
     */
    display_content_step: function() {
        $('content-main').setStyles({
            height: 'auto',
            backgroundColor: '#fff'
        });

        this.pager.setContent(this.template, this.content, this.scripts);
        this.animate();
    },

    /**
     * @return void
     */
    navigation_main_step: function() {
        $('navigation-main').setStyles({
            display: 'block'
        });
        this.navigation_main_fx.start({
            'width': this.navigation_main_width
        });
    },

    /**
     * @return void
     */
    content_main_step: function() {
        var coordinates = $('content-main').getCoordinates();

        $('content-main').setStyles({
            height: coordinates.height,
            backgroundColor: '#E9E9E9'
        });

        $('content-main').empty();
        this.content_main_fx.start({
            'width': this.content_main_width
        });
    }
});