Skip to content

Instantly share code, notes, and snippets.

@timknip
Created August 16, 2011 02:59
Show Gist options
  • Save timknip/1148359 to your computer and use it in GitHub Desktop.
Save timknip/1148359 to your computer and use it in GitHub Desktop.
animation proposal
var curve = new THREE.DaeAnimationCurve();
curve.addKey(new THREE.DaeAnimationKey(0, 0));
curve.addKey(new THREE.DaeAnimationKey(1, Math.PI*0.5));
curve.addKey(new THREE.DaeAnimationKey(2, Math.PI));
curve.addKey(new THREE.DaeAnimationKey(3, Math.PI*1.5));
curve.addKey(new THREE.DaeAnimationKey(4, Math.PI*2));
var channel = new THREE.DaeAnimationChannel(dae.rotation, "x");
channel.addCurve(curve);
animation = new THREE.DaeAnimation();
animation.addChannel(channel);
/// and in render() ...
function render() {
if (t >= animation.endTime) {
t = 0;
}
animation.update(t);
t += 0.01;
renderer.render( scene, camera );
}
/**
*
*/
THREE.DaeAnimation = function() {
this.channels = [];
this.startTime = 0;
this.endTime = 0;
this.duration = 0;
};
THREE.DaeAnimation.prototype.update = function(t) {
for (var i = 0; i < this.channels.length; i++) {
this.channels[i].update(t);
}
};
THREE.DaeAnimation.prototype.addChannel = function(channel) {
this.channels.push(channel);
this.startTime = 1000000;
this.endTime = -this.startTime;
for (var i = 0; i < this.channels.length; i++) {
this.startTime = Math.min(this.startTime, this.channels[i].startTime);
this.endTime = Math.max(this.endTime, this.channels[i].endTime);
}
this.duration = this.endTime - this.startTime;
};
THREE.DaeAnimationChannel = function(target, property) {
this.target = target;
this.property = property;
this.curves = [];
this.startTime = 0;
this.endTime = 0;
this.duration = 0;
};
THREE.DaeAnimationChannel.prototype.addCurve = function(curve) {
if (curve.keys.length > 1) {
this.curves.push(curve);
this.startTime = 1000000;
this.endTime = -this.startTime;
for (var i = 0; i < this.curves.length; i++) {
this.startTime = Math.min(this.startTime, this.curves[i].startTime);
this.endTime = Math.max(this.endTime, this.curves[i].endTime);
}
this.duration = this.endTime - this.startTime;
} else {
console.log("DaeAnimationChannel::addCurve: curve needs at least two keys!");
}
};
THREE.DaeAnimationChannel.prototype.update = function(t) {
for (var i = 0; i < this.curves.length; i++) {
if (this.property !== undefined) {
this.target[this.property] = this.curves[i].update(t);
} else {
this.target = this.curves[i].update(t);
}
}
};
THREE.DaeAnimationCurve = function() {
this.keys = [];
this.startTime = 0;
this.endTime = 0;
this.duration = 0;
this.prevKeyS;
this.prevKeyE;
};
THREE.DaeAnimationCurve.prototype.addKey = function(key) {
if (key.time > this.endTime || this.keys.length == 0) {
this.keys.push(key);
for (var i = 0; i < this.keys.length; i++) {
this.startTime = Math.min(this.startTime, this.keys[i].time);
this.endTime = Math.max(this.endTime, this.keys[i].time);
}
this.duration = this.endTime - this.startTime;
this.prevKeyS = this.keys[0];
this.prevKeyE = this.keys.length > 1 ? this.keys[0] : this.keys[0];
} else {
console.log("DaeAnimationCurve::addKey: animation keys should be add in time order!");
}
};
THREE.DaeAnimationCurve.prototype.clone = function(t) {
var c = new THREE.DaeAnimationCurve();
for (var i = 0; i < this.keys.length; i++) {
c.addKey(this.keys[i]);
}
return c;
};
THREE.DaeAnimationCurve.prototype.update = function(t) {
var numKeys = this.keys.length;
if (numKeys == 1 || t <= this.startTime) {
return this.keys[0].value;
}
if (t >= this.endTime) {
return this.keys[this.keys.length-1].value;
}
var keyS = this.keys[0];
var keyE = this.keys[1];
if (t > this.prevKeyS.time && this.prevKeyE.time >= t) {
// t still within the cached interval
keyS = this.prevKeyS;
keyE = this.prevKeyE;
} else {
// find current interval
// TODO: speed it up...
for (var i = 1; i < numKeys; i++) {
if (this.keys[i].time >= t) {
keyS = this.keys[i-1];
keyE = this.keys[i];
break;
}
}
}
var dt = keyE.time - keyS.time;
var value = keyS.value;
if (keyS.interpolation == 'LINEAR') {
var elapsed = (t - keyS.time);
if (elapsed > 0) {
value = keyS.value + (elapsed / dt) * (keyE.value - keyS.value);
}
}
this.prevKeyS = keyS;
this.prevKeyE = keyE;
return value;
};
THREE.DaeAnimationKey = function(time, value, interpolation) {
this.time = time;
this.value = value;
this.interpolation = interpolation || 'LINEAR';
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment