js animation

/*
src: http://www.arc.id.au/JsAnimation.html
*/
 
//Globals
var tickInt = 25;    // tick interval in msec
var PIon180 = Math.PI / 180;
 
function pos(x, y)
{
  this.x = Math.round(x);
  this.y = Math.round(y);
}
 
function animation(id, path, steps)
{
  this.elem = document.getElementById(id);
  this.active = 0;
  this.timer = null;
  this.path = path;      // pointer to path object
  this.pathIdx = 0;      // step counter
  this.numSteps = steps; // total steps, 0 = go forever
}
 
animation.prototype.start = function()
{
  if (this.active)
    return;
 
  var saveThis = this;   /* save for use in closure */
 
  this.step();
  this.active = 1;
  this.timer = setInterval(function(){saveThis.step()}, tickInt);
}
 
animation.prototype.stop = function()
{
  if (!this.timer)
    return false;
  clearInterval(this.timer);
  this.active = 0;
}
 
animation.prototype.step = function()
{
  var nextPos = this.path.nextStep(this.pathIdx);
 
  this.moveTo(nextPos.x, nextPos.y);
  if ((this.numSteps > 0) && (this.pathIdx >= this.numSteps))
    this.stop();
  else
    this.pathIdx++;
}
 
animation.prototype.moveTo = function(x, y)
{
  this.elem.style.top = y + 'px';
  this.elem.style.left = x + 'px';
}
 
// Circular path object
function circle(initPos, radius, angle0, stepSize)
{
  this.rad = radius;
  this.startAngle = angle0;
  this.aStep = stepSize;        // angle per step
  this.cx = initPos.x - this.rad * Math.cos(angle0 * PIon180);   // coords of centre
  this.cy = initPos.y - this.rad * Math.sin(angle0 * PIon180);
  this.currX = initPos.x;
  this.currY = initPos.y;
}
 
circle.prototype.nextStep = function(index)
{
  var angle = this.startAngle - index * this.aStep;  // +ve angles are cw, we want ccw
  this.currX = this.cx + this.rad * Math.cos(angle * PIon180);
  this.currY = this.cy + this.rad * Math.sin(angle * PIon180);
 
  return new pos(this.currX, this.currY);
}
//y=mx+b
m = slope
b = y-intercept
function slope(intPos, slope, intercept, distance, stepSize)
{
	this.slope = sploe;
	this.intercept = intercept;
	this.distance = distance;
	this.aStep = stepSize;
	this.intX = initPos.x;
  this.intY = initPos.y;
	this.currX = initPos.x;
  this.currY = initPos.y;
}
slope.prototype.nextStep = function(index)
{
 
}
 
//example
/*
 
All that remains is some initialisation code to create the objects. This code is run when the page is has finished loading.
 
function initAnimation3()
{
  var p1 = new pos(160, 90);
  var startAngle = 0;   // in degrees
  var rad = 70;         // radius of circle
  var step = 3;         // step size along the line, in degrees per tick
 
  var circ =  new circle(p1, rad, startAngle, step);
  anim3 = new animation("ball3", circ, 0);   // number of steps, 0 = forever
}
 
The stop and start buttons make the calls anim3.stop() and anim3.start().
 
*/