﻿/* Expander class by Nic Bell */
var content, wrapper, pageBase, flyingBox;

var Expander = new Class({

    initialize: function(ele) {
        this.element = $(ele);
        pageBase = $('base');
        wrapper = this.element.getParent('#wrapper');
        content = this.element.getElement('#content');
        this.morphEffect = new Fx.Morph(this.element, { duration: 1100, transition: Fx.Transitions.Bounce.easeOut, link: 'chain' });
    },

    start: function() {
        if (window.location.href.indexOf('#back') > 0)
            this.skip();
        else {
            this.morphEffect.start({ 'margin-top': 199 }).chain(
            //Notice that 'this' refers to the calling object
                function() {
                    this.setOptions({ duration: 700, transition: Fx.Transitions.Expo.easeOut });
                    this.start({ 'background-color': '#333' });
                },
                function() {
                    pageBase.setStyle('top', '800px');
                    wrapper.setStyle('height', '800px');
                    this.start({ 'width': 550 });
                },
                function() { this.start({ 'height': 800, 'margin-top': 0 }); },
                function() { this.start({ 'width': 950 }); },
                function() {
                    this.set({ 'background-image': 'none' });
                    content.setStyle('display', 'block'); //no col
                    wrapper.setStyle('background', '#222222 url(/Resources/img/oioi.gif) no-repeat scroll 50% 0');
                }
            );
        }
    },

    skip: function() {
        this.element.setStyles({ width: 950, height: 800, background: '#333' });
        wrapper.setStyles({ height: 800, background: '#222222 url(/Resources/img/oioi.gif) no-repeat scroll 50% 0' });
        pageBase.setStyle('top', '800px');
        content.setStyle('display', 'block');
    }

});
/* Project Gallery class by Nic Bell */
var ProjectGallery = new Class({

    //ele is the UL, step size is how much to move on each step
    initialize: function(ele, stepSize) {
        this.element = $(ele);
        this.stepSize = stepSize.toInt();
        this.galleryFX = new Fx.Morph(this.element, { duration: 700, transition: Fx.Transitions.Expo.easeOut });
        this.attach();
    },

    attach: function() {
        this.element.getElements('li').addEvent('mouseenter', function() { this.addClass('orange'); });
        this.element.getElements('li').addEvent('mouseleave', function() { this.removeClass('orange'); });
    },

    next: function() {
        this.element.setStyle('position', 'relative');
        var topPos = this.element.getStyle('top').toInt();
        var height = this.element.getStyle('height').toInt();

        if ((height + topPos) > 600)
            this.galleryFX.start({ 'top': (topPos - this.stepSize) });
    },

    previous: function() {
        this.element.setStyle('position', 'relative');
        var topPos = this.element.getStyle('top').toInt();
        var height = this.element.getStyle('height').toInt();

        if ((topPos + this.stepSize) <= 0)
            this.galleryFX.start({ 'top': (topPos + this.stepSize) });
        else
            this.galleryFX.start({ 'top': 0 });
    }

});