//----------------------------------------------------------------------
// Config

var maxWidth = 940;
var maxHeight = 1000;
var imageCount = 0;

// These vars are set dynamically in show.tpl 
var primaryMedia;
var category;
var videoUrl;
var videoWidth;
var videoHeight;


//----------------------------------------------------------------------
// Start her up

document.observe( 'dom:loaded', initApp );


//----------------------------------------------------------------------
// debugTrace

function debugTrace( str )
{
	if ( !$('debug') ) return;
	$('debug').update( $('debug').innerHTML + str + '<br />' );
}


//----------------------------------------------------------------------
// initApp

function initApp()
{
	debugTrace( 'initApp' );
	
	// Initialize the page
	initXHTML();
	
	// Set external links to pop new tabs
	initExternalLinks();
	
	// SWFAddress
	SWFAddress.setTracker( null );
	if( primaryMedia == 'image' )
	{
		SWFAddress.addEventListener( SWFAddressEvent.INIT, initView );
		SWFAddress.addEventListener( SWFAddressEvent.CHANGE, setView );
	}
	
	// Events
	initEventHandlers();
}


//----------------------------------------------------------------------
// initXHTML

function initXHTML()
{	
	debugTrace( 'initXHTML' );
	
	if( primaryMedia == 'image' )
	{
		// Init XHTML
		$('window').setStyle({ height:'5px', overflow:'hidden' });
		$('slider').setStyle({ position:'absolute' });
	
		// Change gallery nav links
		var galLinks = $('galleryNav').select('a');
		for ( var i = 0; i < galLinks.length; i++ )
		{
			var section = galLinks[i].href.split('#')[1];
			galLinks[i].href = '#/' + section + '/';
			imageCount++;
		}
		debugTrace( 'imageCount: ' + imageCount );
		
		// Previous button
		var prevLink = new Element('a', { href: '#', title:'Previous Image', 'class': 'arrow'  }).update("&lsaquo;");
		var prevListEl = new Element('li').update( prevLink );
		Element.insert( $('galleryNav'), { top: prevListEl } ) ;
		
		// Next button
		var nextLink = new Element('a', { href: '#', title:'Next Image', 'class': 'arrow' }).update("&rsaquo;");
		var nextListEl = new Element('li').update( nextLink );
		Element.insert( $('galleryNav'), { bottom: nextListEl } );
	}
	else if( primaryMedia == 'video' )
	{
		embedQT( videoUrl, 'video', videoWidth, videoHeight );		
	}
	
	// Change nav links
	var navLinks = $('nav').select('a');
	for ( var i = 0; i < navLinks.length; i++ )
	{
		if( navLinks[i].href.include('#') )
		{
			var section = navLinks[i].href.split('#')[1];
			navLinks[i].href = '/#/' + section + '/';
		}
	}
	
	// Back link
	var backLink = $('back').select('a')[0];
	var section = backLink.href.split('#')[1];
	backLink.href = '/#/' + section + '/';
}


//----------------------------------------------------------------------
// initExternalLinks

function initExternalLinks()
{	
	debugTrace( 'initExternalLinks' );
	
	var hostname = window.location.hostname.sub('www.','').toLowerCase();
	if ( hostname.empty() ) return;
	
	var aLinks = $$('a');
	for ( var i = 0; i < aLinks.length; i++ )
	{
		var aLink = aLinks[i];
		var url = aLink.href.toLowerCase();
		
		if ( url.startsWith('http://') || url.startsWith('https://') )
		{
			if ( url.startsWith('http://') ) url = url.sub('http://','');
			else if ( url.startsWith('https://') ) url = url.sub('https://','');
			if ( url.startsWith('www.') ) url = url.sub('www.','');
			if ( !url.startsWith( hostname ) ) aLink.writeAttribute('target', '_blank');
		}
		else if ( aLink.hasClassName('pop-up') )
		{
			aLink.writeAttribute('target', '_blank');
		}
	}	
}


//----------------------------------------------------------------------
// initView

function initView()
{	
	// Process nav section
	var address = SWFAddress.getValue().gsub( '/', '');
	var imgNum = ( address.empty() ) ? 1 : Number( address );
	var sectionId = 'img' + imgNum;
	debugTrace( 'initView: ' + imgNum );
	
	// Init XHTML
	var newY = '-' + $( sectionId ).positionedOffset().top + 'px';
	$('slider').setStyle({ top: newY });
}


//----------------------------------------------------------------------
// setView

function setView()
{
	// Process nav section
	var address = SWFAddress.getValue().gsub( '/', '');
	var imgNum = ( address.empty() ) ? 1 : Number( address );
	var prevImg = ( imgNum > 1 ) ? imgNum - 1 : imageCount;
	var nextImg = ( imgNum < imageCount ) ? imgNum + 1 : 1;
	var sectionId = 'img' + imgNum;
	debugTrace( 'setView: ' + imgNum );
	
	// Update gallery nav selection
	var galLinks = $('galleryNav').select('a');
	for ( var i = 1; i < galLinks.length - 1; i++ )
	{
		if ( i == imgNum ) galLinks[i].addClassName('selected');
		else galLinks[i].removeClassName('selected');
	}
	
	// Update prev/next buttons
	galLinks[ 0 ].href = '#/' + prevImg + '/';
	galLinks[ galLinks.length - 1 ].href = '#/' + nextImg + '/';
	debugTrace( 'prevImg: ' + prevImg + ', ' + 'nextImg: ' + nextImg );
	
	// Transitions
	var newHeight = $( sectionId ).getHeight() + 'px;';
	var newY = '-' + $( sectionId ).positionedOffset().top + 'px;';
	new Effect.Morph( 'slider', { style:'top: ' + newY, duration:1.0, transition:Effect.Transitions.EaseFromTo });
	new Effect.Morph( 'window', { style:'height:' + newHeight, duration:1.0, transition:Effect.Transitions.EaseFromTo });
}


//----------------------------------------------------------------------
// initEventHandlers 

function initEventHandlers()
{
	// Gallery nav links
	if( primaryMedia == 'image' )
	{
		var galLinks = $('galleryNav').select('a');
		for ( var i = 0; i < galLinks.length; i++ )
		{
			Event.observe( galLinks[i], 'click', function( event )
			{
				Event.stop( event );
				this.blur();
				if ( !this.hasClassName('selected') )
				{
					var section = this.href.gsub( '/', '').split('#')[1];
					debugTrace( 'gallery click: ' + section );
					SWFAddress.setValue( '/' + section + '/' );
				}
			});
		}
	}
	
	// To Top link
	var toTopLink = $$('p#toTop a')[0];
	Event.observe( toTopLink, 'click', function( event )
	{
		Event.stop( event );
		this.blur();
		new Effect.ScrollTo( 'head', { duration:0.5, transition:Effect.Transitions.EaseFromTo } );
	});
}


//----------------------------------------------------------------------
//  embedQT
	
function embedQT( url, divId, w, h )
{
	var myQTObject = new QTObject( url, 'qtMovie', w, h + 16 );
	myQTObject.addParam( 'name', 'qtMovie' );
	myQTObject.addParam( "controller", "true" );
	myQTObject.addParam( 'bgcolor' , '#000000' );
	myQTObject.addParam( 'autoplay', 'true' );
	myQTObject.write( divId );
}