/**
 * Code javascript permettant d'animer une zone en affichant son contenu boîte par boîte
 * -- Ce plugin est utilisé pour rajouter du contenu sur les pages
 * -- La fonction s'applique aux conteneurs marqués -- class="rotateBoxes" -- au chargement de la page.
 */

(function()
{					
	$.fn.rotateBoxes = function(options)
	{
		$.fn.rotateBoxes.defaults = 
		{
			navigation: true, // CREATE LEFT AND RIGHT NAVIGATION IF TRUE, OR DO NOTHING IF FALSE
			previous: 'prev', // HTML TO BE USED FOR THE PREVIOUS ARROW
			next: 'next', // HTML TO BE USED FOR THE NEXT ARROW
			display_time: 5000, // NUMBER OF 1/1000 SECONDS A BOX IS DISPLAYED
			auto_run: true, // AUTOMATICALLY TRANSITIONS THE SLIDES (IF TRUE)
			duration: 200 // DURATION OF EFFECTS IN 1/1000 SECONDS
		};
				
		var opts = $.extend({}, $.fn.rotateBoxes.defaults, options); // PUTS ALL THE DEFAULT VALUES INTO A VARIABLE
		var clicked = false; // TRUE AFTER A PREVIOUS OR NEXT BUTTON HAS BEEN CLICKED, HELPS PREVENT ERRORS
		
		return this.each(function()
		{
			/* VARIABLES */
			var $this = $(this); // SETS A "GLOBAL" VARIABLE FOR THE CURRENT MATCHED OBJECT
			var $parent = $this.parent(); // SETS A "GLOBAL" VARIABLE FOR THE MATCHED OBJECT'S PARENT
			var timer = false; // THE SETINTERVAL FUNCTION IDENTIFIER
			var $boxes = $this.children(); // THE BOXES TO BE ROTATED
			var count = $boxes.size(); // THE TOTAL NUMBER OF BOXES THAT WILL BE ROTATED
			
			/* SETUP THE BOXES */
			setup();			
			
			/* SETS UP THE BOX DISPLAYS */
			function setup()
			{
				/* OVERRIDE THE CSS STYLES */
				$parent.css({"position":"relative"});
				$this.css({"position":"relative", "overflow":"hidden", "width":$boxes.width()});
				$boxes.css({"position":"absolute", "top":0}).hide();
				$this.children(':first').show();
							
				/* CALL THE FUNCTION TO CREATE THE NAVIGATION */
				if(opts.navigation && count > 1)
				{
					createNavigation();
				}
				else
				{
					createHoverEffect();
				}
				
				/* SET THE ROTATOR TO RUN AUTOMATICALLY IF AUTO IS TRUE, AND MORE THAN 1 OBJECT EXISTS TO ROTATE */
				if(opts.auto_run && count > 1)
				{
					initiateInterval();
					
					/* PAUSE THE ROTATOR WHEN THE USER HAS THEIR MOUSE OVER A BOX */
					$parent.hover(function()
					{
						clearInterval(timer);
					},function()
					{
						initiateInterval();
					});
				}
			}
			
			/* CONSTRUCTOR */
			function rotate(direction)
			{
				var $current_box = $this.children(':visible:first') == 'undefined' ? $this.children(':first') : $this.children(':visible:first'),
						$previous_box = $current_box.prev() == 'undefined' || $current_box.prev().html() == null ? $this.children(':last') : $current_box.prev(),
						$next_box = $current_box.next() == 'undefined' || $current_box.next().html() == null ? $this.children(':first') : $current_box.next();
				
				if(count > 1)
				{
					$current_box.fadeOut(opts.duration, function()
					{
						switch(direction)
						{
							case -1:
								$previous_box.fadeIn(opts.duration,function()
								{
									clicked = false;
								});
							
								break;
							default:
								$next_box.fadeIn(opts.duration,function()
								{
									clicked = false;
								});
							
								break;
						}
					});
					/*
					switch(direction)
					{
						case -1:
							$current_box.animate( {opacity: 'hide', left: $this.width()}, opts.duration );
							$next_box.css({left: '-'+$this.width()}).animate( {opacity: 'show', left: '0'}, opts.duration, function(){ clicked = false; } );
							break;
						default:
							$current_box.animate( {opacity: 'hide', left: '-'+$this.width()}, opts.duration );
							$next_box.css({left: $this.width()}).animate( {opacity: 'show', left: '0'}, opts.duration, function(){ clicked = false; } );
							break;
					}
					*/
				}
			}
			
			/* CREATES THE NAVIGATION TO SCROLL */
			function createNavigation()
			{
				var $div = $('<div></div>'); /* CREATE THE DIV OBJECT */
				var $next = $div.clone().addClass('rotateBoxes_nav rotateBoxes_next').html(opts.next).appendTo($parent).hide(); /* CREATE THE NEXT OBJECT */
				var $previous = $div.clone().addClass('rotateBoxes_nav rotateBoxes_previous').html(opts.previous).appendTo($parent).hide(); /* CREATE THE PREVIOUS OBJECT */
				

				$next.css({"position":"absolute", "bottom":0, "right":0});
				$previous.css({"position":"absolute", "bottom":0, "left":0});

				$next.click(function()
				{
					if(!clicked)
					{
						clicked = true;
						rotate(1);
					}
				});
				$previous.click(function()
				{
					if(!clicked)
					{
						clicked = true;
						rotate(-1);
					}
				});
				
				$parent.hover(function()
				{
					$next.fadeIn(opts.duration);
					$previous.fadeIn(opts.duration);
					$parent.addClass( 'boxhover' );
				},function()
				{
					$next.fadeOut(opts.duration);
					$previous.fadeOut(opts.duration);
					$parent.removeClass( 'boxhover' );
				});
			}
			
			/* CREATES THE EFFECT ON MOUSE OVER */
			function createHoverEffect()
			{
				$parent.hover(function()
				{
					$parent.addClass( 'boxhover' );
				},function()
				{
					$parent.removeClass( 'boxhover' );
				});
			}
			
			/* INITIATES THE INTERVAL TIMER */
			function initiateInterval()
			{
				timer = setInterval(function()
				{
					rotate();
				},opts.display_time);
			}
			
		});	
	};
})(jQuery);

$(document).ready(function() {
	$(".rotateBoxes").rotateBoxes({previous: '&lt;', next: '&gt;'});
});