var TabPanel = Class.create();
TabPanel.prototype = {
    initialize: function( tabs ) {
        this.tabs = tabs;
        
        this.bindedClick = this.click.bindAsEventListener( this );
        
        for( var tabId in this.tabs ) {
            Event.observe( $(tabId), 'click', this.bindedClick );
            if( this.current == null ) {
                this.show( tabId );
            } else {
                this.getTab(tabId).hide();
            }
        }
    },
    getTab: function( tabId ) {
        return $(this.tabs[tabId]);
    },
    show: function( tabId ) {
        if( this.current != null ) {
            this.current.removeClassName("selected");
            this.getTab(this.current.id).hide();
        }
        this.current = $(tabId);
        this.current.addClassName("selected");
        this.getTab(this.current.id).show();
    },
    click: function( evt ) {
        var element = Event.element( evt );
        var tab = this.tabs[element.id]
        if( tab != null ) {
            this.show( element.id );
        }
    }
};

var AjaxLink = Class.create();
AjaxLink.prototype = {
    initialize: function( link, page, loadingPage ) {
        this.link = link;
        this.page = page;
        this.loadingPage = loadingPage;

        this.bindedClick = this.click.bindAsEventListener( this );
        this.ajaxComplete = this.success.bind(this);

        Event.observe( $(this.link), 'click', this.bindedClick );
    },
    click: function( evt ) {
        var element = Event.element( evt );
        Event.stop(evt);
        this.show();
    },
    show: function() {
        if( current_page != null ) {
            current_page.hide();
        }
        current_page = this;
        this.loadingPage.caller = this;
        this.loadingPage.custom(0,this.loadingPage.maxHeight);
        new Ajax.Request( $(this.link).href, { method: 'get', onSuccess: this.ajaxComplete } );
    },
    hide: function() {
        this.page.hide();
    },
    success: function( xhr ) {
        var f = function() {
            this.updateContent( xhr.responseText );
        };
        setTimeout( f.bind( this ), 700 );
    },
    updateContent: function( text ) {
        $('content').innerHTML = text;
        this.page.show(this.loadingPage);
        this.hideLoading();
    },
    hideLoading : function() {
        this.loadingPage.custom(this.loadingPage.maxHeight,0);
    },
    loadingComplete : function() {
        if( this.unload != null ) {
            this.unload();
        }
        this.unload = null;
        this.loadingPage.caller = null;
    }
};

var Page = Class.create();
Page.prototype = {
    initialize: function( options ) {
        this.pages = {};
        this.loading = new fx.Height('loading',{duration: 400, onComplete: this.loadingComplete.bind(this)});
        this.loading.maxHeight = this.loading.el.clientHeight;

        this.loading.hide();

        var opacity = new fx.Opacity( $('loading') );
        opacity.setOpacity( 0.5 );

        for( var link in options ) {
            this.pages[link] = new AjaxLink( link, options[link], this.loading );
        }
    },
    loadingComplete: function() {
        if( this.loading.caller ) {
            this.loading.caller.loadingComplete();
        }
    },
    show: function( link ) {
        this.pages[link].show(this.loading);
    }
};

var Home = Class.create();
Home.prototype = {
    initialize: function() {
    },
    show : function( loadingPage ) {
        this.gallery = new Gallery('home');
        this.gallery.start();
    },
    hide: function() {
        if( this.gallery != null ) {
            this.gallery.stop();
            this.gallery = null;
        }
    }
};

var Galleries = Class.create();
Galleries.prototype = {
    initialize: function() {
        this.ajax = {};
        this.links = { 'wedding-gallery': new GalleryPage('wedding-gallery'), 
                       'portraits-gallery': new GalleryPage('portraits-gallery'), 
                       'baby-gallery': new GalleryPage('baby-gallery') };
                       /*'products-gallery': new GalleryPage('products-gallery'), */
                       /*'landscapes-gallery': new GalleryPage('landscapes-gallery') };*/
    },
    show : function( loadingPage ) {
        for( var link in this.links ) {
            this.ajax[link] = new AjaxLink( link, this.links[link], loadingPage );
        }
    },
    hide: function() {
    }
};

var GalleryPage = Class.create();
GalleryPage.prototype = {
    initialize: function(id) {
        this.id = id;
    },

    show: function( loadingPage ) {
        if( this.gallery != null ) {
            this.gallery.unhook();
        }
        this.gallery = new Gallery(this.id);
        this.gallery.hook( 'nextButton', 'prevButton', 'counter' );
        
        $('gallery-controls').style.visibility = '';
    },
    hide: function() {
        $('gallery-controls').style.visibility = 'hidden';
    }
};

var Contact = Class.create();
Contact.prototype = {
    initialize: function() {
    },
    show : function(loadingPage) {
    },
    hide: function() {
    }
};

var Pricing = Class.create();
Pricing.prototype = {
    initialize: function() {
    },
    show : function(loadingPage) {
        this.pricingTab = new TabPanel( 
                                    { "tab-pricing": "pricing-tab",
                                     "tab-wedding": "wedding-tab",
                                     "tab-baby": "baby-tab", 
                                     "tab-portraits": "portraits-tab", 
					"tab-events": "events-tab" } );
	/*"tab-landscape": "landscape-tab" } );*/
    },
    hide: function() {
    }
};

var Bio = Class.create();
Bio.prototype = {
    initialize: function() {
        this.pages = [ 'bio-page1.html', 'bio-page2.html' ];
        this.nextPageBinding = this.nextPage.bindAsEventListener( this );
        this.prevPageBinding = this.prevPage.bindAsEventListener( this );
    },
    show : function(loadingPage) {
        this.current = 0;
        Event.observe( $('bionext'), 'click', this.nextPageBinding );
        Event.observe( $('bioprev'), 'click', this.prevPageBinding );
        
        this.loadPage();
    },
    hide: function() {
        Event.stopObserving( $('bionext'), 'click', this.nextPageBinding );
        Event.stopObserving( $('bioprev'), 'click', this.prevPageBinding );
    },
    pageComplete : function( response ) {
        $('aboutme').innerHTML = response.responseText;
    },
    nextPage : function( evt ) {
        Event.stop( evt );
        this.current = (this.current + 1) % this.pages.length;
        this.loadPage();
        return false;
    },
    prevPage : function( evt ) {
        Event.stop( evt );
        this.current = Math.abs( this.current - 1 );
        this.loadPage();
        return false;
    },
    loadPage : function() {
        new Ajax.Request( this.pages[ this.current ], { method: 'get', onSuccess: this.pageComplete } );
    }
};

var current_page = null;
var page = null;

function init() {
    page = new Page( { 'home-link': new Home(), 
                       'contact-link': new Contact(), 
                       'pricing-link': new Pricing(), 
                       'bio-link': new Bio(), 
                       'galleries-link': new Galleries() } );
    page.show( 'home-link' );
}

Behaviour.addLoadEvent(init);