/*
	D3! Digital Producer
	-------------------------------------
	JQUERY SLIDER GALLERY - Version 0.0.1
*/
		
		
		
		
		
$.fn.sliderGallery = function( settings )
{	
	//--------------------------------------
	// TOOL SETTINGS
	//--------------------------------------
	
	settings = $.extend(
	{
		// Loder Path
		galleryLoader: 'loader.gif',
	
		// Div's
		galleryClip: 'gallery_clip',
		galleryContainer: 'gallery',
		galleryContainerWidth: 0,
		galleryContainerHeight: 0,
		//galleryPhotoHeight: 0,
		
		// Gallery Auto Slide
		galleryAutoSlide: false,
		galleryAutoSlideInterval: 7000,
		galleryAutoSlideStopWhenClicked: true,
		
		// Carousel
		galleryCarousel: true,
		
		// ArrowButtons
		galleryArrowsNavigation: true,
		galleryArrowsNavigationLeftArrow: '#left',
		galleryArrowsNavigationLeftArrowOut: '.left_arrow_out',
		galleryArrowsNavigationLeftArrowOver: '.left_arrow_over',
		galleryArrowsNavigationRightArrow: '#right',
		galleryArrowsNavigationRightArrowOut: '.right_arrow_out',
		galleryArrowsNavigationRightArrowOver: '.right_arrow_over',
		
		// Navigation
		galleryMenuContainer: '#menu',
		galleryMenuNavigation: false,
		galleryMenuNavigationContainer: '#nav',
		
		// Frame Description
		galleryFrameDescription: false,
		galleryFrameDescriptionContainer: '#description',
		galleryFrameDescriptionOrientation: 'vertical',
		
		// Animation
		slideEaseDuration: 600,
		slideEaseFunction: 'easeOutCubic'
		
	}, settings);
		
		
	
		
		
	return this.each( function()
	{	
		//--------------------------------------
		// VARS
		//--------------------------------------
		
		var slider = $( this );
		var sliderTimeout;
		var sliderDirection;
		var navClicks = true;
		var navControlStatus = true;
		var clickedOrientation = 'right'; 
		var firstTime = true;
		var currentFrame = 0;
		var currentPosition = 0;
		var numberOfFrames = [];
		var frameWidth = 0;
		var frameHeight = 0;
		settings.galleryContainerWidth > 0 ? frameWidth = settings.galleryContainerWidth : frameWidth = slider.find( '.frame' ).width();
		settings.galleryContainerHeight > 0 ? frameHeight = settings.galleryContainerHeight : frameHeight = slider.find( '.frame' ).height();
		var frameHeightDif = 0;
		var frameLoaderWidth = Math.ceil( ( frameWidth / 2 ) - 11 ) + 'px ';
		var frameLoaderHeight = Math.ceil( ( frameHeight / 2 ) - 11 ) + 'px ';
		var descriptionPos = 0;
		var descriptionWidth = frameWidth;
		var descriptionHeight = ( $( settings.galleryFrameDescriptionContainer ).parent().height() * 2.5 );
		var descriptionLastXPos = 0;
		var descriptionLastYPos = 0;
		
		
		
		
		
		//--------------------------------------
		// INIT PRELOADER
		//--------------------------------------
		
		$( settings.galleryContainer ).children( '.frame' ).hide().end().prepend( '<img class="loading" src="' + settings.galleryLoader + '" width="23" height="23" style="margin-top:' + -( frameHeight / 2 ) + 'px; padding:' + frameLoaderHeight + frameLoaderWidth + frameLoaderHeight + frameLoaderWidth + '; background: #999" />' );
		
		
		
		
		
		//--------------------------------------
		// START
		//--------------------------------------
		
		function start()
		{
			// Current Position
			currentPosition = 0;
			
			
			// Clip Height
			$( settings.galleryClip ).css( { width: frameWidth, height: Math.floor( settings.galleryContainerHeight - 5 ) } );
			
			
			// Menu
			$( settings.galleryMenuContainer ).css( { width: frameWidth } );
			
			
			// Container Position
			$( slider ).css( 'marginLeft', 0 );
			
			
			// Positioning each element of gallery
			$( 'div', slider ).each
			( 
				function( index ) 
				{
					// Hold in Array
					if( firstTime == true )
					{	
						var $this = $( this );
						numberOfFrames.push( $this );
						
						
						// Positioning First Time
						var lastXPos = index * frameWidth;
						if( frameWidth == 300 ) frameHeightDif = 2.5;
						else frameHeightDif = 0;
						var _height = ( $( this ).find( 'img' ).attr( 'height' ) );
						var _width = ( $( this ).find( 'img' ).attr( 'width' ) );
						//if( _height == 0 && galleryPhotoHeight > 0 ) _height = galleryPhotoHeight;
						var getImageHeight = Math.floor( ( ( ( _height * frameWidth ) / _width ) / 2 ) + frameHeightDif );
						$( this ).css( 'left', lastXPos );
						$( this ).css( 'top', -( getImageHeight ) );
						
						// Set Gallery IE
						if ( $.browser.msie ) 
						{
							var img = new Image();
							img.src = $( this ).find( 'img' ).attr( 'src' );
							var _height = img.height;
							var _width = img.width;
							
							var getIEImageHeight = Math.floor( ( ( ( _height * frameWidth ) / _width ) / 2 ) + frameHeightDif );
						   	$( this ).css( 'top', -( getIEImageHeight ) );
						}
						
						
						// Add Click
						if( $( this ).parent().attr( 'href' ) == "" || $( this ).parent().attr( 'href' ) == "#" )
						{
							$( this ).bind
							(
								'click', function() 
								{
									if( navControlStatus )
									{
										navControlStatus = false;
										navClicks = false;
								 		galleryArrowsNavigationRightArrowFnc();
								 		
								 		// Return
										return false;
								 	}
								}
							);
						}
					}
					
					
					// Positioning
					var lastXPos = index * frameWidth;
					$( this ).css( 'left', lastXPos );
					/*if( sliderDirection == 1 )
					{
						var lastXPos = ( ( ( numberOfFrames.length - index ) * frameWidth ) * -1 );
						$( this ).css( 'left', lastXPos );
					}
					if( sliderDirection < 1 )
					{
						var lastXPos = ( index * frameWidth );
						$( this ).css( 'left', lastXPos );
					}*/
				} 
			);
			firstTime = false;
		}
		start();
		
		
		
		
		
		//--------------------------------------
		// SLIDER MOVEMENTS
		//--------------------------------------
		
		function sliderMovements()
		{
			// Slider Animation
			var containerPos = -( frameWidth * currentPosition );
			$( slider ).animate( { marginLeft: containerPos }, settings.slideEaseDuration, settings.slideEaseFunction, sliderMovementsComplete );
			
			
			// Carousel Movement Complete
			function sliderMovementsComplete()
			{
				// Carousel Reorganize Right
				sliderCarouselReorganizeRight();
				
				
				// Restart
				if( currentFrame == 0 ) start();
				
				
				// Nav Status
				navControlStatus = true;
			}
			
			
			// Carousel Positions
			var frameLeftPos = frameWidth * currentPosition;
			var frameRightPos = numberOfFrames.length * frameWidth + ( ( currentPosition + sliderDirection ) * frameWidth );
			var currentFrameTemp = currentFrame;
			
			
			// Carousel Left
			if( sliderDirection == 1 ) // Left
			{
				$( numberOfFrames[ currentFrame ] ).css( "left", frameLeftPos );
			}
			
			
			// Carousel Right
			function sliderCarouselReorganizeRight()
			{
				if( sliderDirection < 1 )
				{
					$( numberOfFrames[ currentFrameTemp ] ).css( "left", frameRightPos );
				}
			}
			
			
			// Gallery AutoSlide
			if( settings.galleryAutoSlide ) galleryAutoSlideSet();
			
			
			// Description Animation
			if( settings.galleryFrameDescription ) descriptionMovements();
			
			
			// Return
			return false;
		};
		
		
		
		
		
		//--------------------------------------
		// DESCRIPTION MOVEMENTS
		//--------------------------------------
		
		function descriptionMovements()
		{
			// Carousel Description Animation
			var descriptionContainerPosX = -( descriptionWidth * currentPosition );
			var descriptionContainerPosY = -( descriptionHeight * currentPosition );
			if( settings.galleryFrameDescriptionOrientation == 'horizontal' )
				$( settings.galleryFrameDescriptionContainer ).animate( { marginLeft: descriptionContainerPosX }, settings.slideEaseDuration, settings.slideEaseFunction, descriptionMovementsComplete );
			if( settings.galleryFrameDescriptionOrientation == 'vertical' )
				$( settings.galleryFrameDescriptionContainer ).animate( { marginTop: descriptionContainerPosY }, settings.slideEaseDuration, settings.slideEaseFunction, descriptionMovementsComplete );
			
			
			// Carousel Movement Complete
			function descriptionMovementsComplete()
			{
				// Description Reorganize Right/Bottom
				descriptionCarouselReorganize();
				
				
				// Restart
				if( currentFrame == 0 )
					restartFrameDescription();
			}
			
			
			// Carousel Positions
			var descriptionSize = $( settings.galleryFrameDescriptionContainer ).find( 'div' ).size();
			var descriptionLeftPos = descriptionWidth * currentPosition;
			var descriptionRightPos = descriptionSize * descriptionWidth + ( ( currentPosition + sliderDirection ) * descriptionWidth );
			var descriptionTopPos = descriptionHeight * currentPosition;
			var descriptionBottomPos = descriptionSize * descriptionHeight + ( ( currentPosition + sliderDirection ) * descriptionHeight );
			var currentDescriptionTemp = currentFrame;
			
			
			// Carousel Reorganize Left/Top
			if( sliderDirection == 1 )
			{
				if( settings.galleryFrameDescriptionOrientation == 'horizontal' )
					$( settings.galleryFrameDescriptionContainer ).find( 'div' ).eq( currentDescriptionTemp ).css( 'left', descriptionLeftPos );
				if( settings.galleryFrameDescriptionOrientation == 'vertical' )
					$( settings.galleryFrameDescriptionContainer ).find( 'div' ).eq( currentDescriptionTemp ).css( 'top', descriptionTopPos );
			}
			
			
			// Carousel Reorganize Right/Bottom
			function descriptionCarouselReorganize()
			{
				if( sliderDirection < 1 )
				{
					if( settings.galleryFrameDescriptionOrientation == 'horizontal' )
						$( settings.galleryFrameDescriptionContainer ).find( 'div' ).eq( currentDescriptionTemp ).css( 'left', descriptionRightPos );
					if( settings.galleryFrameDescriptionOrientation == 'vertical' )
						$( settings.galleryFrameDescriptionContainer ).find( 'div' ).eq( currentDescriptionTemp ).css( 'top', descriptionBottomPos );
				}
			}
			
			
			// Return
			return false;
		};
			
	
	
		
		//--------------------------------------
		// ARROWS
		//--------------------------------------
		
		if ( settings.galleryArrowsNavigation )
		{
			// Left Arrow CLICK
			$( settings.galleryArrowsNavigationLeftArrow ).click
			(
				function()
				{
					if( navControlStatus )
					{
						navControlStatus = false;
						navClicks = false;
						galleryArrowsNavigationLeftArrowFnc();
					}
				}
			);
			
			// Left Arrow MOUSE_OVER
			$( settings.galleryArrowsNavigationLeftArrow ).bind
			( 
				'mouseover', function() 
				{
					$( this ).removeClass( settings.galleryArrowsNavigationLeftArrowOut ).addClass( settings.galleryArrowsNavigationLeftArrowOver );
				}
			);
			
			// Left Arrow MOUSE_OUT
			$( settings.galleryArrowsNavigationLeftArrow ).bind
			( 
				'mouseout', function() 
				{
					$( this ).removeClass( settings.galleryArrowsNavigationLeftArrowOver ).addClass( settings.galleryArrowsNavigationLeftArrowOut );
				}
			);
			
			// Left Arrow NAV_FUNCTION
			function galleryArrowsNavigationLeftArrowFnc()
			{	
				// Position
				currentPosition--;
				
				
				// Direction
				sliderDirection = 1; // Left
				
				
				// Current Frame
				currentFrame--;
				if( currentFrame < 0 ) currentFrame = numberOfFrames.length - 1;
				
				
				// Slider Movement
				sliderMovements();
				
				
				// Bullet Menu
				if( settings.galleryMenuNavigation ) 
					$( settings.galleryMenuNavigationContainer ).find( '.bullet' ).removeClass( 'current' ).eq( currentFrame ).addClass( 'current' );
				
				
				// RETURN
				return false;
			};
			
			
			// Right Arrow CLICK
			$( settings.galleryArrowsNavigationRightArrow ).click
			(
				function()
				{
					if( navControlStatus )
					{
						navControlStatus = false;
						navClicks = false;
						galleryArrowsNavigationRightArrowFnc();
					}
				}
			);
			
			// Right Arrow MOUSE_OVER
			$( settings.galleryArrowsNavigationRightArrow ).bind
			( 
				'mouseover', function() 
				{
					$( this ).removeClass( settings.galleryArrowsNavigationRightArrowOut ).addClass( settings.galleryArrowsNavigationRightArrowOver );
				}
			);
			
			// Right Arrow MOUSE_OUT
			$( settings.galleryArrowsNavigationRightArrow ).bind
			(
				'mouseout', function() 
				{
					$( this ).removeClass( settings.galleryArrowsNavigationRightArrowOver ).addClass( settings.galleryArrowsNavigationRightArrowOut );
				}
			);
			
			// Right Arrow NAV_FUNCTION
			function galleryArrowsNavigationRightArrowFnc()
			{
				// Position
				currentPosition++;
				
				
				// Direction
				sliderDirection = -1; // Right
				
				
				// Slider Movement
				sliderMovements();
				
				
				// Current Frame
				currentFrame++;
				if( currentFrame == numberOfFrames.length ) currentFrame = 0;
				
				
				// Bullet Menu
				if( settings.galleryMenuNavigation ) 
					$( settings.galleryMenuNavigationContainer ).find( '.bullet' ).removeClass( 'current' ).eq( currentFrame ).addClass( 'current' );
				
			
				// RETURN
				return false;
			};
		}
	
	
	
	
		//--------------------------------------
		// AUTOSLIDE
		//--------------------------------------
		
		// Trigger galleryAutoSlide
		if ( settings.galleryAutoSlide ) 
		{
			// Ready
			slider.ready( function() { galleryAutoSlideSet(); } );
		};
		
		// Init galleryAutoSlide
		function galleryAutoSlideSet()
		{
			// Clear Timeout
			clearTimeout( sliderTimeout );
			
			// Init Timeout
			sliderTimeout = setTimeout( galleryAutoSlide, settings.galleryAutoSlideInterval );
		}
		
		// Init galleryAutoSlide
		function galleryAutoSlide()
		{
			if ( navClicks || !settings.galleryAutoSlideStopWhenClicked ) 
			{
				galleryArrowsNavigationRightArrowFnc();
			};
		}
		
		
		
		
		
		//--------------------------------------
		// REMOVE PRELOADER
		//--------------------------------------
		
		$( '.frame', slider ).show().end().find( '.loading' ).remove();
		slider.removeClass( 'loading' );
		
		
		
		
		
		//--------------------------------------
		// BULLET MENU
		//--------------------------------------
		
		// Init Bullet Nav
		if ( settings.galleryMenuNavigationContainer ) 
		{
			// Create Bullets
			$( '.frame', slider ).each
			(
				function() 
				{
					$( settings.galleryMenuNavigationContainer ).append( '<div class="bullet"></div>' );
				}
			);
			
			
			// On Click Bullet
			$( 'divh1', settings.galleryMenuNavigationContainer ).each
			( 
				function( index ) 
				{
					$( this ).bind( 'click', function() 
					{
						$( this ).addClass( 'current' ).parent().find( 'div' ).not( $( this ) ).removeClass( 'current' );
	
						if( navControlStatus )
						{
							if( index < currentFrame )
							{
								//alert("LEFT");
								navControlStatus = false;
								navClicks = false;
								galleryArrowsNavigationLeftArrowFnc();
								
								
								// Current Frame
								//currentFrame = index;
								//if( currentFrame == numberOfFrames.length ) currentFrame = 0;
							}
							if( index > currentFrame )
							{
								navControlStatus = false;
								navClicks = false;
								galleryArrowsNavigationRightArrowFnc();
								
								// Current Frame
								//currentFrame = index;
								//if( currentFrame == numberOfFrames.length ) currentFrame = 0;
								
							}
					 	}
					});
				}
			);
			
			
			// Initial Bullet Status
			$( settings.galleryMenuNavigationContainer ).each
			( 
				function() 
				{
					$( this ).find( 'div' ).eq( 0 ).addClass( 'current' );
				}
			);
		}
		
		
		
		
		
		//--------------------------------------
		// FRAME DESCRIPTION
		//--------------------------------------
		
		if ( settings.galleryFrameDescription ) 
		{
			descriptionPos = 0;
			
			// Create Bullets
			$( 'p', slider ).each
			(
				function( index ) 
				{
					// Append Descriptions
					$( settings.galleryFrameDescriptionContainer ).append( '<div class="description">' + $( this ).text() + '</div>' );
					
					// Remove Text
					$( this ).remove().text();
					
					
					if( settings.galleryFrameDescriptionOrientation == 'horizontal' )
					{
						// Positioning
						var descriptionLastXPos = descriptionPos * descriptionWidth;
						$( settings.galleryFrameDescriptionContainer ).find( '.description' ).eq( index ).css( 'top', '0px' );
						$( settings.galleryFrameDescriptionContainer ).find( '.description' ).eq( index ).css( 'left', descriptionLastXPos );
					}
					if( settings.galleryFrameDescriptionOrientation == 'vertical' )
					{
						// Positioning
						var descriptionLastYPos = descriptionPos * descriptionHeight;
						$( settings.galleryFrameDescriptionContainer ).find( '.description' ).eq( index ).css( 'top', descriptionLastYPos );
					}
					
					// Icrement position
					descriptionPos++;
				}
			);
		}
		
		function restartFrameDescription()
		{
			// Description Position
			descriptionPos = 0;
			
			// Container Position
			if( settings.galleryFrameDescriptionOrientation == 'horizontal' )
				$( settings.galleryFrameDescriptionContainer ).css( 'marginLeft', 0 );
			if( settings.galleryFrameDescriptionOrientation == 'vertical' )
				$( settings.galleryFrameDescriptionContainer ).css( 'marginTop', 0 );
			
			// Create Bullets
			$( 'div', settings.galleryFrameDescriptionContainer ).each
			(
				function( index ) 
				{
					if( settings.galleryFrameDescriptionOrientation == 'horizontal' )
					{
						// Positioning
						var descriptionLastXPos = descriptionPos * descriptionWidth;
						$( settings.galleryFrameDescriptionContainer ).find( '.description' ).eq( index ).css( 'top', '0px' );
						$( settings.galleryFrameDescriptionContainer ).find( '.description' ).eq( index ).css( 'left', descriptionLastXPos );
					}
					if( settings.galleryFrameDescriptionOrientation == 'vertical' )
					{
						// Positioning
						var descriptionLastYPos = descriptionPos * descriptionHeight;
						$( settings.galleryFrameDescriptionContainer ).find( '.description' ).eq( index ).css( 'top', descriptionLastYPos );
					}
					
					// Icrement position
					descriptionPos++;
				}
			);
		}
	});
};