var bg_images = [ 'one', 'ten', 'two', 'three', 'eleven', 'five', 'six', 'twelve' ];
var bg_image_labels = [
	'&rsquo;zine illustrations <em>by</em> Fish McGill',
	'concept art <em>by</em> Matt Moore',
	'illustration <em>by</em> David Goodrich',
	'illustration <em>by</em> Reiko Murakami',
	'concept art <em>by</em> Matt Perlot',
	'screenshot <em>from</em> The Beatles: Rock Band',
	'Phase illustrations <em>by</em> Aaron Stewart',
	'concept art <em>by</em> Paul Lyons'
];
var current_bg_image_index;

var mp3_player_artist;
var mp3_player_song_title;
var current_item = null;

$( function ( ) {
	// Load a random background image
	var which = Math.floor( Math.random( ) * bg_images.length );
	$( 'body' ).addClass( bg_images[which] );
	$( '#bg-label' ).html( bg_image_labels[which] );
	current_bg_image_index = which;

	$( 'ul#topnav li a' ).bind( 'click', function ( e ) { 
		$( 'ul#topnav li a' ).removeClass( 'current' );
		$( this ).addClass( 'current' );
	} );

	$( '.fade-to' ).click ( function ( ) {
		var which = $( this ).attr( 'rel' );

		// Don't fade if we're already on this panel...
		if ( $( '.current-panel' ).attr( 'id' ) == $( 'div#' + which + '-div' ).attr( 'id' ) )
			return false;

		// Any particular special needs here?
		switch ( which )
		{
			case 'games':
				$( 'div.games-home' ).show( );
				$( 'div#games-detail' ).html( null );
				break;
			case 'about':
				$( 'div.about-home' ).show( );
				$( 'div#about-detail' ).html( null );
				$( 'ul#about-list li' ).removeClass( 'current' );
				break;
			case 'news':
				$( 'div.news-home' ).show( );
				var which_news = $( 'div#news-div ul.accordion li:first ul li:first' ).attr( 'rel' );
				$( 'div#news-detail' ).load( 'inc/news/' + which_news + '.html' );

				$( 'div#news-div ul.accordion li' ).removeClass( 'current' );
				$( 'div#news-div ul.accordion li ul li' ).removeClass( 'current' );

				$( '.accordionPanel' ).each( function ( e ) {
					$( this ).css( 'display', 'none' );
				} );

				$( 'div#news-div ul#news-list li:first strong' ).click( );
				$( 'div#news-div ul#news-list li:first ul li:first' ).click( );
				break;
			case 'jobs':
				$( 'div#jobs-detail' ).load( 'inc/jobs/openings.html' );
				$( 'ul#jobs-list li' ).removeClass( 'current' );
				$( 'ul#jobs-list li:first' ).addClass( 'current' );
				break;
		}

		$( '.current-panel' ).fadeOut( 750, function ( ) { 
			$( '.current-panel' ).removeClass( 'current-panel' );
			$( 'div#' + which + '-div' ).fadeIn( 1000 ).addClass( 'current-panel' );	
			$.scrollTo( $( '#' + which ), { duration: 0 } );
		} );

		setTopNav( which );
	} );

	// Make sure we set the right top-nav item
	$( '.advance a' ).live( 'click', function ( e ) { 
		if ( $( this ).attr( 'rel' ) )
			setTopNav( $( this ).attr( 'rel' ) );
	} );

	// Clicking on any game brings up the detail for that page 
	$( 'ul#games-list li a' ).bind( 'click', function ( e ) { 
		var which = $( this ).attr( 'rel' );
		$( 'div#games-div' ).css( 'height', '1600px' );
		$( 'div.games-home' ).fadeOut( 750, function ( ) { 
			$.scrollTo( $( '#games' ), { duration: 0 } )
			$( 'div#games-detail' ).load( 'inc/games/' + which + '.html' );
			$( 'div#games-detail' ).fadeIn( 1000, function ( ) { 
				$( 'div#games-div' ).css( 'height', 'auto' );
			} );
		} );

		setTopNav( 'games' );
	} );

	// Clicking on any "back to games" button or "games" in the top nav
	$( '.back-to-games' ).live( 'click', function ( e ) { 
		$.scrollTo( $( '#games' ), { duration: 0 } )
		$( 'div#games-div' ).css( 'height', '1600px' );
		$( 'div#games-detail' ).fadeOut( 750, function ( ) { 
			$( 'div.games-home' ).fadeIn( 750, function ( ) { 
				$( 'div#games-div' ).css( 'height', 'auto' );
			} );
			$( 'div#games-detail' ).html( null );
		} );
		
		setTopNav( 'games' );
	} );

	// Clicking on any "back to about" button or "about" in the top nav
	$( '.about-overview' ).live( 'click', function ( e ) { 
		$.scrollTo( $( '#about' ), { duration: 0 } )
		$( 'div#about-div' ).css( 'height', '2000px' );
		$( 'ul#about-list li' ).removeClass( 'current' );
		$( 'div#about-detail' ).fadeOut( 750, function ( ) { 
			$( 'div.about-home' ).fadeIn( 750, function ( ) { 
				$( 'div#about-div' ).css( 'height', 'auto' );
			} );
			$( 'div#about-detail' ).html( null );
		} );
		
		setTopNav( 'about' );
	} );

	// Clicking about links changes current item
	$( 'ul#about-list li' ).bind( 'click', function ( e ) { 
		$( 'ul#about-list li' ).removeClass( 'current' );
		$( this ).addClass( 'current' );

		var which = $( this ).attr( 'rel' );
		$( 'div#about-div' ).css( 'height', '1600px' );
		$.scrollTo( $( '#about' ), { duration: 0 } );
		$( 'div.about-home' ).hide( ).fadeOut( 750, function ( ) { 
			$( 'div#about-detail' ).fadeOut( 750, function ( ) { 
				$( this ).load( 'inc/about/' + which + '.html' );
			} ).fadeIn( 750, function ( ) { 
				$( 'div#about-div' ).css( 'height', 'auto' );
			} );
		} );
	} );

	// Clicking jobs links changes current item
	$( 'ul#jobs-list li' ).bind( 'click', function ( e ) { 
		$( 'ul#jobs-list li' ).removeClass( 'current' );
		$( this ).addClass( 'current' );

		var which = $( this ).attr( 'rel' );
		$.scrollTo( $( '#jobs' ), { duration: 0 } );
		$( 'div.jobs-home' ).fadeOut( 750, function ( ) { 
			$( 'div#jobs-detail' ).fadeOut( 750, function ( ) { 
				$( this ).load( 'inc/jobs/' + which + '.html' );
			} ).fadeIn( 750 );
		} );
	} );
	
	// Clicking on news links loads up that month's news
	$( 'ul.news-months li' ).bind( 'click', function ( e ) { 
		$( 'ul#news-list li' ).removeClass( 'current' );
		$( this ).addClass( 'current' );

		var which = $( this ).attr( 'rel' );
		$.scrollTo( $( '#news' ), { duration: 0 } );
		$( 'div.news-home' ).fadeOut( 750, function ( ) { 
			$( 'div#news-detail' ).fadeOut( 750, function ( ) { 
				$( this ).load( 'inc/news/' + which + '.html' );
			} ).fadeIn( 750 );
		} );
	} );

	// Manipulate the MP3 player via the song list
	$( 'ul#listening li' ).live( 'click', function ( e ) { 
		var which = $( this ).attr( 'rel' );

		// Don't switch out the info panel if we haven't changed songs
		if ( which == current_item )
			return true;

		$( 'ul#listening li' ).removeClass( 'listening' );	
		$( this ).addClass( 'listening' );

		$( 'div#band-info' ).load( 'inc/bands/' + which + '.html' );
	} );

	// Load a random song into the music player
	current = Math.floor( Math.random( ) * 10 );
	var which_song = $( 'ul#listening li:eq(' + current + ') a' );
	which_song.click( );
	current_item = $( 'ul#listening li.listening' ).attr( 'rel' );

	// Need to make sure the correct down arrow is showing based on the year
	$( '.a-trigger' ).click( function ( ) { 
		$( '.a-trigger span' ).hide( );

		var which = $( this ).attr( 'rel' );
		$( '#arrow-' + which ).show( );
	} );

	// Manipulate year accordion in news section
	$( '.accordion li strong.a-trigger' ).click( function ( ev ) {
		$( '.accordionPanel' ).each( function ( e ) {
			if ( 'block' == $( this ).css( 'display' ) )
				$( this ).slideToggle( 'slow' );
		} );

		var el = $( ev.target ).next( ".accordionPanel" );
		el.slideToggle("slow");
	});


	var anchor = self.document.location.hash.substring( 1 );
	switch ( anchor )
	{
		case 'games':
		case 'about':
		case 'news':
		case 'jobs':
		case 'contact':
			$( 'ul#topnav li[rel="' + anchor + '"]' ).click( );
			break;
		case 'charity':
			$( 'ul#topnav li[rel="about"]' ).click( );
			$( 'ul#about-list li[rel="charity"]' ).click( );
			break;
	}

} );


function setTopNav ( which )
{
	$( 'ul#topnav li a' ).removeClass( 'current' );
	$( 'ul#topnav li.' + which + ' a' ).addClass( 'current' );
}


function setMP3PlayerInfo ( ) 
{ 
	$( 'h3#mp3-info' ).html( mp3_player_song_title + ' <em>by</em> ' + mp3_player_artist );
}


// Cycles through available background images and changes the label in the
// footer accordingly.
function cycleBackgroundImages ( ) 
{
	$( '.current-panel' ).fadeOut( 750, function ( ) { 
		$( '.current-panel' ).animate( { opacity: 0 }, 1000, function ( ) { 
			$( 'body' ).removeClass( bg_images[current_bg_image_index] );
			current_bg_image_index++;
			if ( current_bg_image_index >= bg_images.length )
				current_bg_image_index = 0;
			$( 'body' ).addClass( bg_images[current_bg_image_index] );
			$( '#bg-label' ).html( bg_image_labels[current_bg_image_index] );
			$( '.current-panel' ).animate( { opacity: 1.0 }, 1000 ).fadeIn( 750 );
		} );
	} );
}


function LOG(msg) {
    try {
        if (console) {
            console.log(msg);
        }
        
    } catch(err) {}
}
