/*****************************************************************************************
**																						**
**  iFModules/ScrollDiv.js: A Class for the ScrollDiv animation.         				**
**																						**
**  This module defines a class within the IF.iFModules.ScrollDiv namespace.    		**
**  This module defines the constructor function IF.iFModules.ScrollDiv().				**
**																						**
**	Copyright (c) 2009. WebPower, Inc.													**
**  All rights reserved.																**
**																						**
**  Class Author: Mike Puglisi															**
**  Module Author: Frank Pérez															**
**  Created: 9.14.09																	**
**																						**
** 	CONSTRUCTOR:																		**
**		new IF.iFModules.ScrollDiv(String 'cElementID', Object {opts});					**
**																						**
**	ARGUMENTS:																			**
**  	This class accepts three optional arguments and one required argument.			**
**																						**
**  	REQUIRED:   IF.iFModules.ScrollDiv = function([String cElementID],	opts)		**
**					DESCRIPTION: cElementID is the id of the element to animate 		**
**								 that holds	our images.									**
**																						**
**		OPTIONAL:   IF.iFModules.ScrollDiv = function(cElementID, [Object opts])		**
**					DESCRIPTION: opts is an object that holds our optional arguments.	**
**							 	Currently we are using 3 args:							**
**							 	1.Name: imageDurationInSeconds; Type: Number;			**
**							   	  Default Value: 3; DESC: Duration of the current		**
**							   	  image in seconds.										**
**							 	2.Name: animationSpeedInMilliSeconds; Type: Number;		**
**							   	  default value = 200; DESC: Duration of animation		**
**							   	  in milliseconds.										**
**							 	3.Name: animationImageSize;  Type: String;				**
**							   	  default value = '200'; DESC: The width of the			**
**							   	  images being animated.								**
**																						**
**	RETURNS: nothing																	**
**																						**
**	PROPERTIES: none																	**
**																						**
**	METHODS:																			**
**		This class has no public methods or properties.									**
**																						**
**		This class has 3 private methods of it's prototype.								**
**			init()																		**
**				Initiates our class by assigning the mouse event handlers.				**
**			play()																		**
**				Restarts our animation.													**
**			pause()																		**
**				Pauses our animation.													**
**																						**
**	NOTES:																				**
**		This class should be instantiated from the $(document).ready() event as a 		**
**		passed function. 																**
**		e.g. $(document).ready(function(){												**
**								new IF.iFModules.ScrollDiv('divProfileImages',			**
**									{imageDurationInSeconds: 3 ,						**
**									animationSpeedInMilliSeconds: 200,					**
**									animationImageSize: '200'} );						**
**				});																		**
**																						**
*****************************************************************************************/

//create the global symbol IF if it doesn't exist
//throw an error if it does exist but is not an object
var IF;
if(!IF) IF = {};
else if (typeof IF != "object")
	throw new Error("ERROR:IF.iFModules.ScrollDiv");

//create  the global symbol IF.iFModules if it doesn't exist
//throw an error if it does exist but is not an object
if(!IF.iFModules) IF.iFModules = {};
else if (typeof IF.iFModules != "object")
	throw new Error("ERROR:IF.iFModules.ScrollDiv");

//otherwise, create and populate the namespace with one big object literal
//this is our constructor function
IF.iFModules.ScrollDiv = function(cElementID, opts){
	opts = opts || {};
	this.imageDurationInSeconds = opts.imageDurationInSeconds || 3;
	this.animationSpeedInMilliSeconds = opts.animationSpeedInMilliSeconds || 200;
	this.animationImageSize = opts.animationImageSize || '200';
	this.id = cElementID;
	this.currentImage = 1;
	this.interval = null;
	this.init();
};

//add to our class prototype
//this function initiates the animation by assigning
//mouseover and mouseout event handlers to our class
IF.iFModules.ScrollDiv.prototype.init = function(){
	var obj = this;
	
	var jCurrentNode = $("#divProfileImages :nth-child("+obj.currentImage+")").clone();		
	jCurrentNode.insertAfter("#"+obj.id+" :last");
	
	$("#"+obj.id).mouseover(function(){
		obj.pause();
	}).mouseout(function(){
		obj.play();
	})
	this.play();
};

//this function will pause the animation onmouse over
//it is the event handler function for mouseover
IF.iFModules.ScrollDiv.prototype.play = function(){
	var obj = this;
	
	//REFERENCE TO THE DIV THAT HOLDS OUR IMAGES
	var imageDiv = document.getElementById(obj.id);
	
	this.interval = setInterval(function(){
			
			//THIS CONTROLS THE LOOP
			//ONCE IT REACHES THE LAST IMAGE IN THE GROUP
			//IT WILL RESET AND START AT THE BEGINNING AGAIN
			if(obj.currentImage == (imageDiv.childNodes.length+1))
			{

				obj.currentImage = 1;
				clearInterval(obj.interval);
				imageDiv.scrollLeft = 0;
				obj.play();
			}							 

			$("#"+obj.id).animate({scrollLeft: '+='+obj.animationImageSize+'px'}, obj.animationSpeedInMilliSeconds, function(){

				obj.currentImage++;

			});
	} , this.imageDurationInSeconds * 1000);
	

};

//this function will restart the animation onmouse out
//it is the event handler function for mouseout
IF.iFModules.ScrollDiv.prototype.pause = function(){
	clearInterval(this.interval);
};