var path = '/';
//var path = '/rarecompany.co.uk/';

var menu = {

	//config
	duration: 0.6,

	//construct function
	init: function() {
	
		//hide menu items
		$$('#main_nav li.submenu').each( function( elm ) {
		
			elm.hide();
		
		}.bind(this) );
		
		//add handlers
		$$('#main_nav ul li.title').each( function( elm ) {
		
			elm.observe( 'click', this.toggle.bindAsEventListener(this) );
		
		}.bind(this) );
		
	
	},
	
	//toggle the display of a submenu
	toggle: function(e) {
	
		this.clickedLink = e.findElement();
		this.submenu = this.clickedLink.up().next('li.submenu');
		
		if( this.submenu != undefined ) {
	
			e.stop();
		
			//hide or show the menu?
			if( this.submenu.getStyle('display') != 'none' ) this.hide();
			else this.show(); 
		
		}
	
	},

	//show a submenu
	show: function() {
		
		//change icon to plus
		this.clickedLink.up('li.title').setStyle( { backgroundImage: 'url(images/minus.jpg)' } )

		//show menu
		new Effect.Parallel( [
			new Effect.Appear( this.submenu, { sync: true } ),
			new Effect.BlindDown( this.submenu, { sync: true } )
			], { duration: this.duration }
		);
	
	},
	
	//hide a submenu
	hide: function() {
		
		//change icon to minus
		this.clickedLink.up('li.title').setStyle( { backgroundImage: 'url(images/plus.jpg)' } )

		//hide menu
		new Effect.Parallel( [
			new Effect.Fade( this.submenu, { sync: true } ),
			new Effect.BlindUp( this.submenu, { sync: true } )
			], { duration: this.duration }
		);
	
	}

}

document.observe( 'dom:loaded', menu.init.bind(menu) );


var ajaxLoader = {

	//config
	duration: 1,
	lastSelected: '',

	//construct function
	init: function() {
	
		//add handlers
		$$('#main_nav a').each( function( elm ) {
		
			elm.observe( 'click', this.loadLink.bindAsEventListener(this) );

		}.bind(this)	);
	
	},
	
	//load the link
	loadLink: function(e) {
	
		var clickedLink = e.findElement();
		if( clickedLink.tagName.toUpperCase() == 'IMG' ) clickedLink = clickedLink.up('a');
		var href = clickedLink.href.replace( /^.+\/(.+)?$/, '$1' );

		//quit if a submenu
		if ( clickedLink.up().next('li.submenu') != undefined ) return;
	
		e.stop();
		
		//change class
		if( this.lastSelected != '' ) this.lastSelected.removeClassName( 'selected' );
		clickedLink.addClassName( 'selected' );
		this.lastSelected = clickedLink;
		
		//hide content
		new Effect.Parallel( [
				new Effect.Fade( 'content-placeholder', { sync: true } ),
				new Effect.Morph( 'content', { style: { height: '40px' }, sync: true } )
			], { duration: this.duration, afterFinish: function() {
			
				//set loading area to loading
				$('content-loading').show();
				
				$('content').setStyle( { height: '40px' } );
				
				//get page by ajax
				new Ajax.Request( path + href + '.html', {
					
					method: 'get',
					onSuccess: function( t ) {
					
						$('content-loading').hide();
					
						//create temp div and load content into this
						//var tempDiv = new Element( 'div' ).hide();
						//document.body.insert( tempDiv );
					
						//work out height of content and expand container to this
						//tempDiv.update( t.responseText );
						//var h = tempDiv.getHeight();
						//tempDiv.remove();
							
						$('content-placeholder').update( t.responseText );
							
						//convert collapsable links
						collapsableText.init();
						var h = $('content-placeholder').getHeight();
						
						//update content
						new Effect.Parallel([
								new Effect.Appear( 'content-placeholder', { sync: true } ),
								new Effect.Morph( 'content', { style: { height: h + 'px' }, sync: true } )
							], { duration: this.duration }
						); // end Effect.Parallel
						
						//google analytics - register page view
						try {
							_gaq.push( [ '_trackPageview', path + href + '.html' ] );
						} catch( err ) {}
					
					}.bind(this) //end onSuccess
				
				}); //Ajax.Request
			
			}.bind(this) //end afterFinish
			
		}); // end Effect.Parallel
		
	} // end loadLink

}

document.observe( 'dom:loaded', ajaxLoader.init.bind(ajaxLoader) );



var collapsableText = {

	duration: 0.5,

	//construct function
	init: function() {

		//add handlers
		$$('#content .collapsable-text').each( function( elm ) {

			var title = elm.down('.title');
			var text = elm.down('.text');
			
			//add + to the title
			title.update( '+ ' + title.innerHTML ).setStyle( { cursor: 'pointer' } );
			text.hide();
			
			title.observe( 'click', this.toggle.bind(this) )

		}.bind(this)	);
	
	},
	
	toggle: function(e) {
		
		var title = e.findElement();
		var text = title.next('.text');
		
		//expand
		if( text.getStyle( 'display' ) == 'block' ) { //hide
		
			title.update( title.innerHTML.replace( /^\-/, '+' ) )
			new Effect.Parallel( [
				new Effect.Fade( text, { sync: true } ),
				new Effect.BlindUp( text, { sync: true } )
				], { duration: this.duration, queue: 'end' }
			);
		
		} else { //show

			text.show();
			var h = text.getHeight();
			text.setStyle( { height: '0px', overflow: 'hidden' } ).hide();
			$('content').setStyle('height: auto')
			
			title.update( title.innerHTML.replace( /^\+/, '-' ) );
			new Effect.Parallel( [
				new Effect.Appear( text, { sync: true } ),
				new Effect.Morph( text, { style: { height: h + 'px' }, sync: true } )
				], { duration: this.duration, queue: 'end' }
			);
		
		}
	
	}

}

document.observe( 'dom:loaded', collapsableText.init.bind(collapsableText) );