/**
 * South McKeel Website ( $Id: mck.slideshow.js 1 2011-06-27 18:38:06Z brandon $ )
 *
 * Slideshow javascript
 *
 * @author			Brandon Davie <brandondavie@mckeelacademy.com>
 * @copyright		Copyright (c) 2010 The Schools of McKeel Academy
 * @link				http://mckeelschools.com/
 * @version			$Rev: 1 $
 * @package			sma
 * @subpackage	js
 */


var slideshow = Class.extend( {	
	ssWrapperObj: null,
	ssWrapperId: null,
	ssControlsObj: null,
	ssControlsId: null,
	ssType: null,
	ssInterval: null,
	ssCurrentObj: null,
	ssNextObj: null,
	ssPrevObj: null,
	ssUrl: null,
	ssPaused: false,
	ssLoaded: [],
	
	init: function( wrapper, type )
	{
		if ( ! $( '#' + wrapper ) )
		{
			return false;
		}

		this.ssWrapperObj = $( '#' + wrapper );
		this.ssWrapperId = wrapper;
		this.ssType = type;
		this.ssCurrentObj = $( '#' + this.ssWrapperId + ' .ssCurrent' );
		
		/* Type specific attributes... */
		if ( this.ssType == 'directory' )
		{
			this.ssDirectory = this.ssWrapperObj.find( 'img' ).attr( 'src' ).replace( mck.vars[ 'baseUrl' ], '' );
			this.ssUrl = this.ssWrapperObj.attr( 'class' ).split( ' ' ).slice( -1 );
		}
		
		/* Setup controls... */
		this.ssWrapperObj.prepend( '<div id="' + this.ssWrapperId + '_controls" class="ssControls"><ul><li><img src="' + mck.vars[ 'baseUrl' ] + '/images/icons/control_rewind.png" alt="" /></li><li><img src="' + mck.vars[ 'baseUrl' ] + '/images/icons/control_pause.png" alt="" /></li><li><img src="' + mck.vars[ 'baseUrl' ] + '/images/icons/control_fastforward.png" alt="" /></li></ul></div>' );
		this.ssControlsObj = $( '#' + this.ssWrapperId + '_controls' );
		this.ssControlsId = this.ssWrapperId + '_controls';
		
		/* Setup control events */
		var that = this;
		this.ssWrapperObj.hover(
			function()
			{
				that.ssControlsObj.css( { opacity: 0.0, display: 'block' } ).animate( { opacity: 0.65 }, 150 );
			},
			function()
			{
				that.ssControlsObj.hide();
			}
		);
		
		this.ssPaused = ( mck.getCookie( 'ssPaused' ) == 1 ) ? true : false;
		$( '#' + this.ssControlsId + ' li img' ).each(
			function()
			{
				$( this ).hover(
					function()
					{
						$( this ).css( { cursor: 'pointer' } );
					}
				);
				
				$( this ).click( function()
				{
					that.navigate( $( this ) );
				} );
				
				if ( that.ssPaused && $( this ).attr( 'src' ).match( /pause/ ) )
				{
					$( this ).attr( 'src', $( this ).attr( 'src' ).replace( 'pause', 'play' ) );
				}
			}
		);
		
		/* Start the slideshow... */
		this._setupInterval();
	},
	
	navigate: function( img )
	{	
		/* Make sure it's valid.. */
		imgSrc = null;
		if ( img && img.attr( 'src' ) )
		{
			imgSrc = img.attr( 'src' );
			
			if ( imgSrc.match( /rewind/ ) )
			{
				this._setupInterval();
				this.nextImage( true, true );
			}
			else if ( imgSrc.match( /pause/ ) )
			{
				img.attr( 'src', imgSrc.replace( 'pause', 'play' ) );
				this.ssPaused = true;
				mck.setCookie( 'ssPaused', 1 );
			}
			else if ( imgSrc.match( /play/ ) )
			{
				img.attr( 'src', imgSrc.replace( 'play', 'pause' ) );
				this.ssPaused = false;
				this.nextImage();
				this._setupInterval();
				mck.setCookie( 'ssPaused', 0 );
			}
			else if ( imgSrc.match( /forward/ ) )
			{
				this._setupInterval();
				this.nextImage( true );				
			}
		}
	},
	
	nextImage: function( force, rewind )
	{
		if ( this.ssPaused == true && force != true )
		{
			return;
		}
		
		/* Load next object... */
		var data = new Object();
		var that = this;
			
		data.ssType = this.ssType;
		data.ssCurrent = this.ssCurrentObj.attr( 'src' );
		data.ssDirection = ( rewind == true ) ? 'backward' : 'forward';
			
		$.post( mck.vars[ 'baseUrl' ] + '/slideshow/' + this.ssUrl, { data: $.toJSON( data ) }, function( returnData )
		{
			var obj = $.evalJSON( returnData );
			var tmpPrev = $( '<img>' ).attr( 'src', obj.previousImage ).attr( 'class', 'ssPrevious' );
			var tmpNew = $( '<img>' ).attr( 'src', obj.newImage ).attr( 'class', 'ssCurrent' );
			var tmpNext = $( '<img>' ).attr( 'src', obj.nextImage ).attr( 'class', 'ssNext' );
			
			/* Append new image to the wrapper... */
			that.ssWrapperObj.prepend( tmpNew );
			
			/* Fade out the old... */
			that.ssCurrentObj.animate( { opacity: 0.0 }, 1000,
				function()
				{
					that.ssCurrentObj.remove();
					that.ssCurrentObj = tmpNew;
				}
			);			
		} );		
	},
	
	_setupInterval: function()
	{
		var that = this;
		clearInterval( this.ssInterval );
		this.ssInterval = setInterval( function()
		{
			that.nextImage();
		},
		6000 );
	}
} );


/* Try to automatically detect any slideshows... */
$( document ).ready(
	function()
	{
		$( '.slideshowDir' ).each(
			function()
			{
				if ( $( this ).attr( 'id' ) )
				{
					new slideshow( $( this ).attr( 'id' ), 'directory' );
				}
			}
		);			
	}
);