SLAnimator=function(object,type){
	this.object=object;
	this.type=type;
	if(this.types[type]){
		for(name in this.types[type]){
			this[name]=this.types[type][name];
		}
	}
	this.timer=new SLTimer(this.loop,0,true,this);
	this.useTransitions=(document.browser.engine=='webkit' || (document.browser.engine=='presto' && document.browser.engineVersion>2.2))?true:false;
	this.cssPrefix='';
	switch(document.browser.engine){
		case 'webkit':
			this.cssPrefix='-webkit-';
			break;
		case 'presto':
			this.cssPrefix='-o-';
			break;
		case 'gecko':
			this.cssPrefix='-moz-';
			break;
		case 'khtml':
			this.cssPrefix='-khtml-';
			break;
	}
}


SLAnimator.prototype={
	object:false,
	duration:500,
	from:0,
	to:0,
	type:'',
	timer:false,
	types:Array(),
	interval:10,
	stepSize:0,
	steps:50,
	step:0,
	arguments:false,
	onfinish:false,
	running:false,
	run:function(arguments){
	},
	cancel:function(){
	},
	finish:function(){
		this.running=false;
		if(this.useTransitions){
			var style=this.object.getAttribute('style');
			this.object.setAttribute('style',style.replace(this.cssCode,''));
		}
		if(this.onfinish){
			this.onfinish.call();
		}
	}
}

//browser independent opacity, value from 0-1
function setOpacity(obj,value){
	if(obj.filters){
		obj.filters[0].opacity=value*100;
	}
	obj.style.opacity=value;
}

SLAnimator.prototype.types.fade={
	run:function(){
		this.running=true;
		if(this.useTransitions){
			this.object.style.opacity=this.from;
			this.cssCode=';'+this.cssPrefix+'transition: opacity '+(this.duration/1000)+'s;'
			var style=this.object.getAttribute('style');
			this.object.setAttribute('style',style+this.cssCode);
			this.object.style.opacity=this.to;
			new SLTimer(this.finish,this.duration,false,this);
		}else{
			this.steps=this.duration/this.interval;
			this.stepSize=(this.to-this.from)/this.steps;
			this.step=0;
			setOpacity(this.object,this.from);
			this.timer.time=this.interval;
			this.timer.start();
		}
	},
	cancel:function(){
		this.running=false;
		this.timer.stop();
	},
	loop:function(){
		this.step++;
		if(this.step>this.steps){
			this.timer.stop();
			this.finish();
		}
		var newValue=this.from+(this.step*this.stepSize);
		if(this.stepSize<0){
			if(newValue<this.to){
				newValue=this.to;
			}
		}else{
			if(newValue>this.to){
				newValue=this.to;
			}
		}
		setOpacity(this.object,newValue);
	}
}

SLAnimator.prototype.types.move={
	run:function(){
		this.running=true;
		if(this.useTransitions){
			this.object.style.left=this.from.x+'px';
			this.object.style.top=this.from.y+'px';
			this.cssCode=';'+this.cssPrefix+'transition: all '+(this.duration/1000)+'s;'
			var style=this.object.getAttribute('style');
			this.object.setAttribute('style',style+this.cssCode);
			this.object.style.left=this.to.x+'px';
			this.object.style.top=this.to.y+'px';
			new SLTimer(this.finish,this.duration,false,this);
		}else{
			this.steps=this.duration/this.interval;
			this.stepSizeX=(this.to.x-this.from.x)/this.steps;
			this.stepSizeY=(this.to.y-this.from.y)/this.steps;
			this.step=0;
			this.object.style.top=this.from.y+'px';
			this.object.style.left=this.from.x+'px';
			this.timer.time=this.interval;
			this.timer.start();
		}
	},
	cancel:function(){
		this.running=false;
		this.timer.stop();
	},
	loop:function(){
		this.step++;
		if(this.step>this.steps){
			this.timer.stop();
			this.finish();
		}
		var newValueX=this.from.x+(this.step*this.stepSizeX);
		var newValueY=this.from.y+(this.step*this.stepSizeY);
		if(this.stepSizeX<0){
			if(newValueX<this.to){
				newValueX=this.to.x;
			}
		}else{
			if(newValueX>this.to){
				newValueX=this.to.x;
			}
		}
		if(this.stepSizeY<0){
			if(newValueY<this.to){
				newValueY=this.to.y;
			}
		}else{
			if(newValueY>this.to){
				newValueY=this.to.y;
			}
		}
		this.object.style.top=newValueY+'px';
		this.object.style.left=newValueX+'px';
	}
}

SLAnimator.prototype.types.resize={
	run:function(){
		this.running=true;
		if(this.useTransitions){
			this.object.style.height=this.from.height+'px';
			this.object.style.width=this.from.width+'px';
			this.cssCode=';'+this.cssPrefix+'transition: all '+(this.duration/1000)+'s;'
			var style=this.object.getAttribute('style');
			this.object.setAttribute('style',style+this.cssCode);
			this.object.style.height=this.to.height+'px';
			this.object.style.width=this.to.width+'px';
			new SLTimer(this.finish,this.duration,false,this);
		}else{
			this.steps=this.duration/this.interval;
			this.stepSizeY=(this.to.height-this.from.height)/this.steps;
			this.stepSizeX=(this.to.width-this.from.width)/this.steps;
			this.step=0;
			this.object.style.height=this.from.height+'px';
			this.object.style.width=this.from.width+'px';
			this.timer.time=this.interval;
			this.timer.start();
		}
	},
	cancel:function(){
		this.running=false;
		this.timer.stop();
	},
	loop:function(){
		this.step++;
		if(this.step>this.steps){
			this.timer.stop();
			this.finish();
		}
		var newValueX=this.from.width+(this.step*this.stepSizeX);
		var newValueY=this.from.height+(this.step*this.stepSizeY);
		if(this.stepSizeX<0){
			if(newValueX<this.to){
				newValueX=this.to.width;
			}
		}else{
			if(newValueX>this.to){
				newValueX=this.to.width;
			}
		}
		if(this.stepSizeY<0){
			if(newValueY<this.to){
				newValueY=this.to.height;
			}
		}else{
			if(newValueY>this.to){
				newValueY=this.to.height;
			}
		}
		this.object.style.height=newValueY+'px';
		this.object.style.width=newValueX+'px';
	}
}

function runFadeTest(){
	var test=new SLAnimator(document.getElementById('debug'),'resize');
	test.from={height:10,width:10};
	test.to={height:100,width:100};
	test.onfinish=new callBack(backFadeTest);
	test.run();
}

function backFadeTest(){
	var test=new SLAnimator(document.getElementById('debug'),'resize');
	test.from={height:100,width:100};
	test.to={height:10,width:10};
	test.run();
}