﻿/*	Slider Version 1.0
**	Autor: asset new media - Oliver Kruse
**	URL: http://www.anm.biz
**	Beschreibung:
**	Slided Elemente von links nach rechts in einem Container
**	Getestet auf FF4

** Changelog **
==============================
==============================
==============================
*/
(function( $ )
{
	var settings = 
	{
		'autostart'	:	false,		//Soll der Animate gleich stattfinden?
		'pause' : 2000,				//Pause, wenn das Element links bzw rechts am Rand ist
		'speed' : 4000				//Animationsdauer des Slideeffektes
		//'speedPerElement', true	Speed pro 100px
	};
	
	var methods = 
	{
		init : function( options ) 
		{
			
			return this.each(function() 
			{
				
				if ( options ) 
				{ 
					$.extend( settings, options );
				}
				var curElem = jQuery(this);
				
				/*
				**	Berechnen der Gesamtbreite der inneren Elemente
				*/
				var innerWidth = 0;
				curElem.children().each(function()
				{
					innerWidth += parseInt(jQuery(this).width());
					innerWidth += parseInt(jQuery(this).css("margin-left").split("px")[0]);
					innerWidth += parseInt(jQuery(this).css("margin-right").split("px")[0]);
					jQuery(this).css({"float" : "left", "cursor" : "pointer"});
				});
				innerWidth += "px";
				/*
				**	Berechnen der maximalen Linkspositionierung
				*/
				var maxLeft = parseInt(innerWidth.split("px")[0]) - parseInt(curElem.width());
				if(maxLeft < 0)
				{
					maxLeft = 0;
				}
				maxLeft += "px";
				
				/*
				**	Erstellen eines Divs um den Inhalt, damit dieses animiert werden kann.
				*/
				var sliderDiv = jQuery("<div>")
									.addClass("anmSlideDiv")
									.css({"width" : innerWidth,
											"height" : curElem.height(),
											"position" : "relative",
											"margin" : "0px",
											"padding" : "0px"})
									.html(curElem.html())
									.data("maxLeft", maxLeft)
									.data("pause", settings["pause"])
									.data("speed", settings["speed"])
									.bind("mouseenter", function()
									{
										methods.pauseAnimation(curElem);
									})
									.bind("mouseleave", function()
									{
										methods.continueAnimation(curElem);
									});
									
				/*
				**	Hinzufügen des Sliderdivs in das momentane Element
				*/
				curElem.html("")
						.css({"overflow" : "hidden",
								"position" : "relative"});
				sliderDiv.appendTo(curElem);
				//sliderDiv.find("img").onMouseover(methods.pauseAnimation(curElem));
				
				/*
				**	Auf los gehts los...
				*/
				if(settings["autostart"])
				{
					methods.startAnimation(curElem);
				}
			});
		},
		
		/*
		**	Starten der Animation
		*/
		startAnimation : function($this) 
		{
			if($this == undefined)
			{
				$this = this;
			}
			return jQuery($this).each(function()
			{
				var curElem = jQuery(this);
				var curSlider = curElem.find(".anmSlideDiv");
				if(curSlider.css("left") == "auto")
				{
					curSlider.css("left", "0px");
				}
				curSlider.animate({"left" : curSlider.css("left")}, curSlider.data("pause"), function()
				{
					curSlider.data("direction", "left");
					var animationTime = methods.getAnimationTime(curElem);
					curSlider.animate({"left" : "-" + curSlider.data("maxLeft")}, animationTime, function()
					{
						methods.reverseAnimation(curElem); 
					});
				});
			});
		}, 
		
		/*
		**	Rückwärslauf der Animation
		*/
		reverseAnimation : function($this)
		{
			if($this == undefined)
			{
				$this = this;
			}
			return jQuery($this).each(function()
			{
				var curElem = jQuery(this);
				var curSlider = curElem.find(".anmSlideDiv");
				curSlider.animate({"left" : curSlider.css("left")}, curSlider.data("pause"), function()
				{
					curSlider.data("direction", "right");
					curSlider.animate({"left" : "0"}, curSlider.data("speed"), function()
					{
						methods.startAnimation(curElem);
					});
				});
			});
		},
		
		/*
		**	Anhalten der Animation
		*/
		pauseAnimation : function($this)
		{
			if($this == undefined)
			{
				$this = this;
			}
			return jQuery($this).each(function()
			{
				var curElem = jQuery(this);
				var curSlider = curElem.find(".anmSlideDiv");
				curSlider.stop();
			});
		},
		
		/*
		**	Weiterlaufen der Animation
		*/
		continueAnimation : function($this)
		{
			if($this == undefined)
			{
				$this = this;
			}
			return jQuery($this).each(function()
			{
				var curElem = jQuery(this);
				var curSlider = curElem.find(".anmSlideDiv");
				if(curSlider.data("direction") == "right")
				{
					methods.reverseAnimation(curElem);
				}
				else
				{
					methods.startAnimation(curElem);
				}
			});
		},
		
		/*
		**	Holen der restlichen Animationszeit
		*/
		getAnimationTime : function($this)
		{
			if($this == undefined)
			{
				$this = this;
			}
			var animationTime = 0;
			jQuery($this).each(function() 
			{
				var curElem = jQuery(this);
				curSlider = curElem.find(".anmSlideDiv");
				animationTime = curSlider.data("speed");
				var maxLeft = parseInt(curSlider.data("maxLeft").split("px")[0]);
				var posDifference =  maxLeft + parseInt(curSlider.css("left").split("px")[0]);
				if(curSlider.data("direction") == "right")
				{
					animationTime = animationTime * (maxLeft - posDifference) / maxLeft;
				}
				else
				{
					animationTime = animationTime * posDifference / maxLeft;
				}
			});
			return animationTime;
		}
	};
  
  
	$.fn.slide = function(method) 
	{
		if ( methods[method] ) 
		{
			return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
		} 
		else if ( typeof method === 'object' || ! method ) 
		{
			return methods.init.apply( this, arguments );
		} 
		else 
		{
			$.error( 'Die Funktion ' +  method + ' gibt es in slider.js nicht!' );
		} 
	};
})( jQuery );
