window.addEvent('domready', function() {
    var about    = $('about');
    var contact  = $('contact');
    var gallery  = $('gallery');
    var events   = $('events');

    var body     = $('sylvia');
    var start_gallery = true;

    /* immediately hide elements other than "about" page */
    contact.fade('hide');
    gallery.fade('hide');
    events.fade('hide');
    body.set('class', 'about');

    $('nav_about').addEvent('click', function(e){
        contact.fade('out');
        gallery.fade('out');
        events.fade('out');
        about.fade('in');
        body.set('class', 'about');
        e.stop();
    });

    $('nav_contact').addEvent('click', function(e){
        about.fade('out');
        gallery.fade('out');
        events.fade('out');
        contact.fade('in');
        body.set('class', 'contact');
        e.stop();
    });
    $('nav_gallery').addEvent('click', function(e){
        about.fade('out');
        contact.fade('out');
        events.fade('out');
        gallery.fade('in');
        body.set('class', 'gallery');
        if( start_gallery ) {
            startGallery();
            start_gallery = false;
        }
        e.stop();
    });
    $('nav_events').addEvent('click', function(e){
        about.fade('out');
        contact.fade('out');
        gallery.fade('out');
        events.fade('in');
        body.set('class', 'events');
        e.stop();
    });
});