Sprite Animator

Animate.js

var AnimateSprite = new Class({
	Implements: [Options],
	options: {
		size: {
			x: 10,
			y: 10
		},
		src: "",
		element: null,
		updateInterval: 300,
		scenes: {
		}
	},

	initialize: function (options){
		this.setOptions(options);

		if(this.options.element === null){
			this.options.element = new Element("div");
			document.body.appendChild(this.options.element);
		}

		this.options.element.setStyles({
			width: this.options.size.x +"px",
			height: this.options.size.y + "px",
			backgroundImage: "url("+this.options.src+")"
		});

	},

	toggle: function (){
		if(this.i){
			clearInterval(this.i);
			this.i = false;
		} else {
			this.i = this._update.periodical(this.options.updateInterval, this);
		}
	},

	animate: function(pos){
		this.scene = this.options.scenes[pos];
		this.frame = 0;
		this.mode = 0;
		this._update();
	},

	_update: function (){
		if(this.scene){

			var pos =  this.scene[this.frame].x + "px "+ this.scene[this.frame].y + "px";
			this.options.element.style.backgroundPosition = pos;

			if(this.mode === 0){
				this.frame++;
			} else {
				this.frame--;
			}

			if(this.frame >= this.scene.length){
				this.mode = 1;
				this.frame--;	
			} else if (this.frame <= 0) {
				this.mode = 0;
//					this.frame++;
			}
		}
	}
});