text animation

;(function($, window, document, undefined){

	function AnimateText(element, textObjects, options, animations){
		var self = this;

		this.$element = $(element); //ul jQuery object
		this.textObjects = textObjects;
		this.lastTextObject; //last text object to complete its animation
		this.repeated = 0; //# of times the animation sequence has repeated

		//Default options
		this.defaults = {
			repeat: true,
			element: {
				css: {
					position: 'relative',
					overflow: 'hidden',
					margin: 0,
					padding: 0,
					width: function(){
						return $(this).parent().width();
					},
					height: function(){
						return $(this).parent().height();
					},
					'list-style': 'none'
				}
			},
			textObject: {
				css: {
					position: 'absolute',
					margin: 0,
					padding: 0
				},
				offset: 0,
				animation: 'explode'
			},
			position: {
				duration: 1000,
				easing: 'swing'
			}
		};

		//Merge default options with user options
		this.options = $.extend(true, {}, this.defaults, options);

		//Default animations
		this.animations = {
			"fadeIn": {
				positions: {
					start: {
						top: '50%',
						left: '50%',
						opacity: 0
					},
					0: {
						opacity: 1,
						duration: 1200
					},
					1: {
						duration: 1200
					},
					2: {
						opacity: 0,
						duration: 300
					}
				}
			},
			"fadeOut": {
				positions: {
					start: {
						top: '50%',
						left: '50%',
						opacity: 1
					},
					0: {
						duration: 1200
					},
					1: {
						opacity: 0
					}
				}
			},
			"rightToLeft": {
				positions: {
					start: {
						width: '100%',
						left: '100%',
						opacity: 0,
						top: '50%',
						'text-align': 'left'
					},
					0: {
						left: '25%',
						opacity: 1,
						duration: 1200
					},
					1: {
						duration: 1200
					},
					2: {
						opacity: 0,
						duration: 1200
					}
				}
			},
			"leftToRight": {
				positions: {
					start: {
						width: '100%',
						right: '100%',
						opacity: 0,
						top: '50%',
						'text-align': 'right'
					},
					0: {
						right: '25%',
						opacity: 1,
						duration: 1200
					},
					1: {
						duration: 1200
					},
					2: {
						opacity: 0,
						duration: 1200
					}
				}
			},
			"explode": {
				positions: {
					start: {
						top: '40%',
						width: '100%',
						opacity: 0,
						'font-size': '10px',
						'text-align': 'center'
					},
					0: {
						opacity: 1,
						duration: 0
					},
					1: {
						top:'-10%',
						'font-size': '150px',
						opacity: 0,
						duration: 1000
					}
				}
			},
			"implode": {
				positions: {
					start: {
						width: '100%',
						opacity: 0,
						top: '0%',
						'font-size': '150px',
						'text-align': 'center'
					},
					0: {
						top: '30%',
						'font-size': '40px',
						opacity: 1,
						duration: 1000
					},
					1: {
						duration: 1200
					},
					2: {
						opacity: 0,
						duration: 400
					}
				}
			}
		};
		//Merge default animations with user animations
		$.extend(true, this.animations, animations);

		this.init();
	}

	AnimateText.prototype = {

		init: function(){
			var self = this;

			//Hide ul element and set css
			this.$element.hide().css(this.options.element.css);

			//Start animation as soon as animations and textObjects are loaded.
			this.loadAnimations();
			this.loadTextObjects(function(){
				self.$element.show();
				self.startAnimation();
			});
		},

		loadAnimations: function(){
			var self = this;

			//Validate every position in every animation
			$.each(this.animations, function(animationId, animation){
				animation.duration = 0;

				$.each(animation.positions, function(positionId, position){
					if(positionId !== "start"){
						//Make sure position's duration is set
						if(typeof(position.duration) !== "number" || position.duration < 0){
							position.duration = self.options.position.duration;
						}

						//Make sure position's easing property is set
						if(typeof(position.easing) === "undefined"){
							position.easing = self.options.position.easing;
						}

						//Calculate the animation's total duration
						animation.duration += position.duration;
					}
				});
			});
		},

		loadTextObjects: function(callback){
			var self = this;

			//Keep track of the animation sequence's total duration
			totalDuration = 0;

			//Validate every textObject
			$.each(this.textObjects, function(textObjectId, textObject){
				var textObjectDuration = 0;

				textObject.id = textObjectId;

				//Set text object element
				textObject.$element = self.$element.children("li:eq(" + textObjectId + ")");

				//Make sure text object element exists
				if(!textObject.$element.length){
					return;
				}

				//Set textObject to its default style
				textObject.$element.css(self.options.textObject.css).attr('id', textObject.id);

				//Check for valid animation type
				if(typeof(textObject.animation) === "undefined" || (typeof(textObject.animation) === "string" && !textObject.animation in self.animations)){
					textObject.animation = self.options.textObject.animation;
				}

				//Check for valid time offset
				if(typeof(textObject.offset) !== "number" || textObject.offset < 0){
					textObject.offset = self.options.textObject.offset;
				}

				if(typeof(textObject.duration) !== "number" || textObject.duration < 0){
					textObject.duration = 0;
				}

				//Merge textObject's positions with its animation's positions
				textObject.positions = $.extend(true, {}, self.animations[textObject.animation].positions, textObject.positions);

				//Calculate textObject duration
				$.each(textObject.positions, function(positionId, position){
					if(positionId !== "start"){
						if(typeof(textObject.duration) === "number" && textObject.duration > 0){
							position.duration = (position.duration / self.animations[textObject.animation].duration) * textObject.duration;
						}
						else{
							textObjectDuration += position.duration;
						}
					}
				});

				if(textObjectDuration > 0){
					textObject.duration = textObjectDuration;
				}

				//Determine if this textObject will be last to complete its animation
				if((textObject.offset + textObject.duration) > totalDuration){
					totalDuration = (textObject.offset + textObject.duration);
					self.lastTextObject = textObject.id;
				}

				textObject.status = 'ready';
			});

			callback();
		},

		startAnimation: function(){
			var self = this;

			$.each(this.textObjects, function(textObjectId, textObject){
				//Set textObject to its start position
				textObject.$element.css(textObject.positions.start);

				//Start textObject's animation after it's offset time has passed
				setTimeout(function(){
					self.animateTextObject(textObject.id, 0);
				}, textObject.offset);
			});
		},

		stopAnimation: function(){
			this.$element.children("li").stop();
		},

		animateTextObject: function(textObjectId, animationPosition){
			var self = this,
				textObject = this.textObjects[textObjectId],
				animation = this.animations[textObject.animation],
				test = function(){
					var to = textObject;
					console.log(to);
					return 'hey';
				};

			//Finally, animate the textObject
			textObject.$element.animate(
				textObject.positions[animationPosition],
				textObject.positions[animationPosition].duration,
				textObject.positions[animationPosition].easing,
				function(){
					//Does this animation have another position? If so animate it.
					if(typeof(textObject.positions[(animationPosition + 1)]) !== "undefined"){
						self.animateTextObject(textObject.id, (animationPosition + 1));
					}
					//Is this the last text object in the group?
					else if(textObject.id === self.lastTextObject){
						self.stopAnimation();

						//Repeat animations if repeat option is set to true or we're still under the set repeat limit
						if(self.options.repeat === true || (typeof(self.options.repeat) === "number" && self.repeated < self.options.repeat)){
							self.startAnimation();
							self.repeated++;
						}
					}
				}
			);
		}
	};

	$.fn.animateText = function(textObjects, options, animations){
		return this.each(function(){
			new AnimateText(this, textObjects, options, animations);
		});
	};

})( jQuery );