SKEL.EFFECTS.Slide = {
	counter: 0,
	fps: 50,

	//This effect is based on mootools.net's effect, check them out
	shiftIn: function(className,element,min,max){
		var duration = 200;
		var transition = SKEL.Transitions.quadOut;
		var elements = $(className);

		//stop any current animations
		elements.each(function(){
			if(element.skel_animate_id){
				SKEL.EFFECTS.Slide.stopByIntervalId(element.skel_animate_id);
				element.skel_animate_id = 0;
			}
		});

		elements.each(function(){
			//for some reason the css for these elements will often times misreport their widths
			// it means that we must always tell them to animate to the new width every time even
			// if it says it's already there
			if(element.id != this.id){
				SKEL.EFFECTS.Slide.animate(this,'width',$(this).css('width'),min,duration,transition);
			} else {
				SKEL.EFFECTS.Slide.animate(this,'width',$(this).css('width'),max,duration,transition);
			}

		});
	},

	shiftReset: function(className,restWidth){
		var duration = 125;
		var transition = SKEL.Transitions.quadOut;
		elements = $(className);

		elements.each(function(){
			var tmpWidth = parseInt($(this).css('width'));

			if(tmpWidth != restWidth){
				SKEL.EFFECTS.Slide.animate(this,'width',$(this).css('width'),restWidth,duration,transition);
			}

		});
	},


	//bounce of 0 means infinite loop
	jiggle: function(element,cssAttribute,from,to,bounces,duration,transition){
		//SKEL.UTIL.EFFECTS.Slide.animate();
	},


	//handles
	animate: function(element,cssAttribute,from,to,duration,transition){

		if(element.css('display') != 'block'){
			element.skel_old_display = element.css('display');
		}

		//if there isn't a default transition set one
		if(!transition){
			transition = SKEL.Transitions.quadOut;
		}

		//cancel any current animation
		SKEL.EFFECTS.Slide.stop(element);

		var startTime = new Date().getTime();

		//IE doesn't support arguments, so make a function that explicitly calls with those arguments
		// setInterval(SKEL.EFFECTS.Slide.shiftStep,0,this,tmpWidth,125,200,startTime);
		//element.skel_animate_id = setInterval(SKEL.EFFECTS.Slide.step,0,element,cssAttribute,from,to,duration,startTime,transition);
		element.skel_animate_id = setInterval(function(){
			SKEL.EFFECTS.Slide.step(element,cssAttribute,from,to,duration,startTime,transition);
		},(1000/SKEL.EFFECTS.Slide.fps));

		return element.skel_animate_id;
	},

	//cancels any animation event
	stop: function(element){
		//console.log(this,element,element.skel_animate_id);
		//console.log(element.skel_animate_id);
		if(element.skel_animate_id){
			clearInterval(element.skel_animate_id);
			element.skel_animate_id = 0;
			if(element.skel_old_display){
				element.css('display',element.skel_old_display);
			}
		}

	},

	//cancels any animation event
	stopByIntervalId: function(id){
		if(id){
			clearInterval(id);
		}
	},

	step: function(element,cssAttribute,from,to,duration,start,transition){
		var curTime = new Date().getTime();

		if(cssAttribute == 'color' || cssAttribute == 'background-color'){
			//from = SKEL.UTIL.hexToRgb(from);
			//to = SKEL.UTIL.hexToRgb(to);
			//var tmpFrom = SKEL.UTIL.splitValue(from);
			//var tmpTo = SKEL.UTIL.splitValue(to);

			from = SKEL.UTIL.hexToRgb(from);
			to = SKEL.UTIL.hexToRgb(to);

			//split the string into 3 pieces

		} else {

				//what we use to finalize the unit
				var result = SKEL.UTIL.splitValue(from);
				var prefix = result.prefix;
				if(prefix == '-')
					prefix = '';
				var postfix = result.postfix;

			from = parseInt(from);
			to = parseInt(to);
		}

		//compute the new property
		var newValue = SKEL.EFFECTS.Slide.compute(curTime,from,to,duration,start,transition);

		var finished = false;

		//var curTime = new Date().getTime();


		if(curTime > (start+duration)){
			finished = true;
		}

		//$('#debugme').val((finished ? 'done' : 'running' + Math.random(0,9)));



		//newValue = "#"+newValue.toString(16);
		//newValue = newValue + 'px';
		if(cssAttribute == 'color' || cssAttribute == 'background-color'){
			newValue = SKEL.UTIL.rgbToHex(newValue);
		} else {
			newValue = prefix+Math.round(newValue)+postfix;
		}



		if(finished){
			//$(element).css(cssAttribute,newValue);
			//console.log('finished',newValue);
			SKEL.EFFECTS.Slide.stop(element);
		}

		element.css(cssAttribute,newValue);
	},

	//thanks to mootools and Robert Penner
	compute: function(time,from,to,duration,startTime,transitionFunc){
		var deltaTime = time-startTime;
		if(time > (startTime + duration)){
			//we're past our point, return max
			return to;
		} else {
			//if (time < this.time + this.options.duration)
			if(typeof(from) == 'object'){
				//if we have an object, compute all the transitions\
				var tmpObject = Array();
				from.forEach(function(value,index){
					newFrom = value;
					newTo = to[index];
					newValue = transitionFunc(deltaTime,newFrom,(newTo-newFrom),duration);
					tmpObject[index] = Math.round(newValue);
				});
				return tmpObject;
			} else {
				return transitionFunc(deltaTime,from,(to-from),duration);
			}
		}
	}

}