$(document).ready(function(){
	$('#homeBtn').bind( 'click', goToReferer );
	$('#closeBtn').bind( 'click', closeReader );
	$('#imgprevBtn').bind( 'click', prev );

	$('#nextButtonFadeGroup').bind( 'mouseup', next );
	$('#imgnextGhost').bind( 'click', next );

	$('#imgrefreshBtn').bind( 'click', refresh );
	$('#imgCommentsBtn').bind( 'click', showDescription );
	$('#imgPreviewsBtn').bind( 'click', showStepDetails );
	$('#spanPreviewsBtn').bind( 'click', showStepDetails );
	$('#spanCommentsBtn').bind( 'click', showDescription );
	showStepDetails();
	initApp();
});

function markNextButton()
{
	$('#nextButtonFadeGroup').cycle({ fx: 'fade', speed: 300,timeout:  3, cleartype:true, cleartypeNoBg : true });
}

function unmarkNextButton()
{
	$('#nextButtonFadeGroup').cycle('stop');
	$('#imgnextBtn').css( 'display', 'block' );
	$('#imgnextBtn').css("opacity", 1.0);
}

function loadReaderInterface()
{
	$('#divCommentsHidden p').html( track.description );
	var titre = track.title;

	/* if( titre.length >30 )
	{
		titre = titre.substr( 0,30 ) + '...';
	}
	*/

	$('#spanTitre').html( titre );
	$('#spanAuthor').html( '<a href="/user/' + track.authorNickname + '">' + track.authorNickname + '</a>' );
	var steps = track.steps;
	var text = '';
	for( var i=0;i<steps.length;i++ )
	{
		var url = steps[i].domain;
		text += '<div class="stepEmbed" id="stepEmbed'+ i +'"><div class="stepUrl">';
		text += steps[i].position + ') ' + url + '</div>';
		text += '<div style="margin-top : 3px;text-align : left;">' + steps[i].description + '</div></div>';
	}
	text += '';
	$('#divPreviewsHidden').append( text );
	$( '#spanNavigationPageNumbers2' ).html( track.nSteps );

	// Step menu
	$('#divPreviewsHidden .stepEmbed').each(
		function( index ) {
			$(this).bind(
				'click',
				function() {
					selectStep( index+1 );
				}
			);
			$(this).bind(
				'mouseover',
				function() {
					$(this).addClass("hover");
				}
			);
			$(this).bind(
				'mouseout',
				function() {
					$(this).removeClass("hover");
				}
			);

		}
	);
}

function resize()
{
	var clientHeight = $(window).height();
	$('#readerDiv').height( clientHeight );
	var spanHeight = clientHeight-304-44;
	if( spanHeight>1 )
	{
		$('#spanContent').height( spanHeight );
	}
	var spanHeight = clientHeight-304-70;
	$('.resizable').height( spanHeight );
}

function onSelectStep( oldPosition )
{
	var elPosition = oldPosition-1;
	$( '#divPreviewsHidden .stepEmbed:eq(' + elPosition + ')' ).removeClass( 'selected' );
	elPosition = stepIndex-1;
	$( '#divPreviewsHidden .stepEmbed:eq(' + elPosition + ')' ).addClass( 'selected' );
	$('#spanNavigationPageNumbers1').html( stepIndex );
	var url = track.steps[stepIndex-1].url;
	if( url.length>30 )
		var formatUrl = url.substr( 0,30 )+'...';
	else
		var formatUrl = url;
	$('#spanNavigationURL').html( '<a target="_blank" href="'+ url +'" title="'+url+'">'+formatUrl+'</a>' );

	var scrollPos = $( '#stepEmbed'+elPosition ).offset().top - 345+$('#divPreviewsHidden').scrollTop();
	$('#divPreviewsHidden').animate({scrollTop:scrollPos}, 1000 );
}

function showDescription()
{
	$('#imgComments').addClass( 'actif' );
	$('#imgPreviews').removeClass( 'actif' );
	$('#divPreviewsHidden').css( 'display', 'none' );
	$('#divCommentsHidden').css( 'display', 'block' );
}

function showStepDetails()
{
	$('#imgComments').removeClass( 'actif' );
	$('#imgPreviews').addClass( 'actif' );
	$( '#divCommentsHidden' ).css( 'display', 'none' );
	$( '#divPreviewsHidden' ).css( 'display', 'block' );
}