lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-09-19 10:47:59 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

optimized animation code

Browse Source
This commit is contained in:
Eric Rowell
2013-01-07 19:36:12 -08:00
parent ae103710d3
commit 590889f898
2 changed files with 18 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/Animation.js
View File

@@ -40,8 +40,7 @@
stop: function() {
Kinetic.Animation._removeAnimation(this);
},
_updateFrameObject: function() {
var time = new Date().getTime();
_updateFrameObject: function(time) {
this.frame.timeDiff = time - this.frame.lastTime;
this.frame.lastTime = time;
this.frame.time += this.frame.timeDiff;
@@ -72,7 +71,7 @@
};
Kinetic.Animation._runFrames = function() {
var nodes = {};
var nodes = {}, animations = this.animations, len = animations.length;
/*
* loop through all animations and execute animation
* function. if the animation object has specified node,
@@ -80,15 +79,15 @@
* drawing the same node multiple times. The node property
* can be the stage itself or a layer
*/
for(var n = 0; n < this.animations.length; n++) {
var anim = this.animations[n];
anim._updateFrameObject();
if(anim.node && anim.node._id !== undefined) {
nodes[anim.node._id] = anim.node;
for(var n = 0; n < len; n++) {
var anim = animations[n], node = anim.node, func = anim.func;
anim._updateFrameObject(new Date().getTime());
if(node && node._id !== undefined) {
nodes[node._id] = node;
}
// if animation object has a function, execute it
if(anim.func) {
anim.func(anim.frame);
if(func) {
func(anim.frame);
}
}
@@ -97,9 +96,9 @@
}
};
Kinetic.Animation._animationLoop = function() {
var that = this;
if(this.animations.length > 0) {
this._runFrames();
var that = this;
Kinetic.Animation.requestAnimFrame(function() {
that._animationLoop();
});
@@ -115,9 +114,11 @@
that._animationLoop();
}
};
Kinetic.Animation.requestAnimFrame = function(callback) {
var raf = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || Kinetic.Animation.fixedRequestAnimFrame;
RAF = (function() {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || Kinetic.Animation.fixedRequestAnimFrame;
})();
raf(callback);
Kinetic.Animation.requestAnimFrame = function(callback) {
RAF(callback);
};
})();

6
tests/js/manualTests.js
View File

@@ -142,7 +142,7 @@ Test.Modules.MANUAL = {
stage.add(layer);
},
'ANIMATION - start and stop animation': function(containerId) {
'*ANIMATION - start and stop animation': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@@ -174,7 +174,7 @@ Test.Modules.MANUAL = {
anim.start();
setTimeout(function() {
anim.stop();
//anim.stop();
}, 3000);
},
'ANIMATION - test multiple animations': function(containerId) {
@@ -774,7 +774,7 @@ Test.Modules.MANUAL = {
layer.add(redCircle);
stage.add(layer);
},
'*DRAG AND DROP - drag and drop elastic star with shadow': function(containerId) {
'DRAG AND DROP - drag and drop elastic star with shadow': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,