/*
 * Navigation RollOver
 */
var NavigationRollOver = new Class(
{
    options: {
        startFx: 0,
        rollFx: 0
    },

    initialize: function(target) {
        this.options.startFx = new Fx.Morph(target, {duration: 10000, transition: Fx.Transitions.Sine.easeOut})
        this.options.rollFx = new Fx.Morph(target, {duration: 500, transition: Fx.Transitions.Sine.easeOut})
    },

    fadeRollOver: function() {
        this.options.startFx.start({'opacity': 0.5});
    },

    addRollOver: function(target) {
        var startFx = this.options.startFx;
        var rollFx = this.options.rollFx;

        target.addEvent('mouseenter', function(e) {
            startFx.cancel();
            rollFx.cancel();
            rollFx.start({'opacity': 1});
        });

        target.addEvent('mouseleave', function(e) {
            startFx.cancel();
            rollFx.cancel();
            rollFx.start({'opacity': 0.5});
        });
    }
});
NavigationRollOver.implement(new Options, new Events);
window.addEvent( "domready", function() {
    if($chk($('headerLinks'))) {
        var allButtons = $('headerLinks').getElements('li');

        allButtons = allButtons.filter(function(btn) { return btn.hasClass('rollover'); });

        allButtons.each(function(btn) {
            var rollOverStates = new NavigationRollOver(btn);
            rollOverStates.addRollOver(btn);
            rollOverStates.fadeRollOver();
        });
    }
});

/*
 * Side RollOver
 */
var SideRollOver = new Class(
{
    initialize: function(target) {
    },

    addRollOver: function(target) {
        var rollFx = new Fx.Morph(target, {duration: 200, transition: Fx.Transitions.Sine.easeIn});

        target.addEvent('mouseenter', function(e) {
            rollFx.cancel();
            rollFx.start({'background-color': '#BFF8FE', 'color': '#494949'});
        });

        target.addEvent('mouseleave', function(e) {
            rollFx.cancel();
            rollFx.start({'background-color': '#FFFFFF', 'color': '#DCDCDC'});
        });
    },
    
    addClick: function(target) {
        target.addEvent('click', function(e) {
            var activeButton = $('contentLeft').getElement('h2.active');
            if($chk(activeButton)) {
                activeButton.removeClass('active');        
            }
            target.addClass('active');            
            
            var targetID = target.id.split('-');

            updateWork(targetID[0], targetID[1]);
        });    
    }
});
SideRollOver.implement(new Options, new Events);
window.addEvent( "domready", function() {
     if($chk($('contentLeft'))) {
         var allButtons = $('contentLeft').getElements('h2');

         if(allButtons.length > 0) {
             allButtons = allButtons.filter(function(btn) { return btn.hasClass('rollover'); });

             allButtons.each(function(btn) {
                 //var rollOverStates = new SideRollOver(btn);
                 //rollOverStates.addRollOver(btn);
                 var rollOverStates = new SideRollOver(btn);
                 rollOverStates.addClick(btn);
             });

             // Instantiate first button
             allButtons[0].fireEvent('click');
         }
     }
 });

/*
 * Preview Links
 */
var PreviewLinks = new Class(
{
    initialize: function(target) {
    },

    addClick: function(target) {
        target.addEvent('click', function(e) {
            var targetID = target.id.split('-');

            updateWork(targetID[0], targetID[1]);
        });
    }
});
PreviewLinks.implement(new Options, new Events);
/*window.addEvent( "domready", function() {
     var allButtons = $('contentRight').getElements('img');

     allButtons = allButtons.filter(function(btn) { return btn.hasClass('rollover'); });

     allButtons.each(function(btn) {
         var previewLinks = new PreviewLinks(btn);
         previewLinks.addClick(btn);
     });
 });*/

/*
 * Accordion
 */
/*window.addEvent('domready', function() {
    var myAccordion = new Accordion($('contentLeft'), 'h1.toggler', 'div.element', {
        opacity: false,
        display: 'none',
        alwaysHide:true,
        onActive: function(toggler, element){
            toggler.setStyle('color', '#494949');
            toggler.setStyle('background-color', '#f4f4f4');
        },
        onBackground: function(toggler, element){
            toggler.setStyle('color', '#DCDCDC');
            toggler.setStyle('background-color', '#FFFFFF');
        }
    });
});*/

/*
 * Loading Work
 */
function updateWork(category, target) {
    //$('contentRight').innerHTML = "<img class='loading' src='images/loading.gif' />";
    var fade = new Fx.Tween($('contentRight'), {'duration':'short'});
    fade.start('opacity', '0').chain(
        function() {
            var catalogue = work.work;

            for(var i = 0; i < catalogue[category].length; i++) {
                if(catalogue[category][i].id.toString() == target.toString()) {
                    $('contentRight').innerHTML = catalogue[category][i].htmltext;

                    if(category == "web" && target.toString() == "MySpaceMobile") {
                        if(swfobject) {
                            swfobject.embedSWF('http://www.maggieha.com/images/demo_0b.swf', 'workSwfMobile', '312', '304', '8.0.0');
                        }
                    }
                    break;
                }
            }

            fade.start('opacity', '1');        
        }
    )
}

/*
 * Splash
 */
 window.addEvent('domready', function() {
    if($chk($('splash'))) {
        var myGallery = new gallery($('myGallery'), {
            embedLinks: false,
            showInfopane: false,
            timed: true,
            delay: 5000,
            showArrows: false,
            showCarousel: false,
            embedLinks: false,
            fadeDuration:750
        });
    }
});
