spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column34


The Code for the Animation Library

Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

var NS4 = (document.layers) ? 1 : 0;
var IE4 = (document.all) ? 1 : 0;

if (NS4) onload = init;

function init() {
  setTimeout("onresize = redo", 1000);
}

function redo() {
  location.reload();
}

function animation_toolbox() {
  this.show = show;
  this.hide = hide;
  this.left = left;
  this.top = top;
  this.moveTo = moveTo;
  this.slideBy = slideBy;
  this.lineSlide = lineSlide;
  this.slideTo = slideTo;
  this.circle = circle;
  this.circleSlide = circleSlide;
}

function animation_simple(id) {
  this.element = (NS4) ? document[id] : document.all[id].style;
  this.active = 0;
  this.timer = null;
  this.name = id + "Var";
  eval(this.name + " = this"); 
}

function animation_nested() {
  var args = animation_nested.arguments;
  if (NS4) {
    this.element = window; // the window object
    for (var i = 0; i < args.length; i++) {
      this.element = this.element.document[args[i]];
    }
  } else {
    this.element = document.all[args[args.length - 1]].style;
  }
  this.active = 0;
  this.timer = null;

  this.name = args[args.length - 1] + "Var";
  eval(this.name + " = this");
}

animation_nested.prototype = new animation_toolbox;
animation_simple.prototype = new animation_toolbox;

function show() {
  this.element.visibility = (NS4) ? "show" : "visible";
}

function hide() {
  this.element.visibility = (NS4) ? "hide" : "hidden";
}

function left() {
  return parseInt(this.element.left);
}

function top() {
  return parseInt(this.element.top);
}

function moveTo(x, y) {
  this.element.left = x;
  this.element.top = y;
}

function shift(ar) {
  var first = ar[0];
  for (var i = 1; i < ar.length; i++) {
    ar[i - 1] = ar[i];
  }
  ar.length--;
  return first;
}

function slideBy(dx, dy, increment, interval, statement) {
  var fx = this.left();
  var fy = this.top();
  var tx = fx + dx;
  var ty = fy + dy;
  this.slideTo(tx, ty, increment, interval, statement);
}

function slideTo(tx, ty, increment, interval, statement) {
  var fx = this.left();
  var fy = this.top();
  var dx = tx - fx;
  var dy = ty - fy;
  var steps = Math.round(Math.sqrt(dx * dx + dy * dy) / increment);
  var sx = dx / steps;
  var sy = dy / steps;
  if (this.active) return;
  this.active = 1;
  this.statement = statement;
  this.lineSlide(0, fx, fy, tx, ty, sx, sy, interval);
}

function lineSlide(num, fx, fy, tx, ty, sx, sy, interval) {
  num++;
  this.moveTo(fx + sx * num, fy + sy * num);
  if (this.left() == tx) {
    this.active = 0;
    if (this.statement) {
      var ar = eval(this.statement);
      if (ar.length > 0)
        eval(shift(ar));
    }
    return;
  }
  this.timer = setTimeout(this.name + ".lineSlide(" + 
    num + ", " + fx + ", " + fy + ", " + tx + ", " + 
    ty + ", " + sx + ", " + sy + ", " + interval + ")", 
    interval);
}

function getAngle(angle) {
  var small = angle % 360;
  if (small < 0) small += 360;
  return small;
}

function circle(radius, angle0, angle1, full, increment, interval, statement) {
  this.statement = statement;
  angle0 = getAngle(angle0);
  if (angle1 != null) {
    angle1 = getAngle(angle1);
    var dangle = 360 * full + ((increment < 0) ? 
                 360 - Math.abs(angle1 - angle0) : 
                 Math.abs(angle1 - angle0));
    increment = dangle / Math.round(dangle / increment);
    angle1 = (increment < 0) ? angle0 - dangle : angle0 + dangle;
  }
  var x = this.left();
  var y = this.top();
  var cx = x - radius * Math.cos(angle0 * Math.PI / 180);
  var cy = y + radius * Math.sin(angle0 * Math.PI / 180);
  if (this.active) return;
  this.active = 1;
  this.circleSlide(cx, cy, radius, angle0, angle1, increment, interval);
}

function circleSlide(cx, cy, radius, angle0, angle1, increment, interval) {
  angle0 += increment;
  var x = cx + radius * Math.cos(angle0 * Math.PI / 180);
  var y = cy - radius * Math.sin(angle0 * Math.PI / 180);
  this.moveTo(x, y);
  if ((angle1 != null) && (Math.abs(angle1 - angle0) < 0.001)) {
    this.active = 0;
    if (this.statement) {
      var ar = eval(this.statement);
      if (ar.length > 0)
        eval(shift(ar));
    }
    return;
  }
  this.timer = setTimeout(this.name + ".circleSlide(" + 
    cx + ", " + cy + ", " + radius + ", " + angle0 + ", " + 
    angle1 + ", " + increment + ", " + interval + ")", interval);

http://www.internet.com

Produced by Yehuda Shiran and Tomer Shiran

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint


Created: January 18, 1999
Revised: January 18, 1999

URL: http://www.webreference.com/js/column34/code3.html