lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 04:42:02 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixed small bug related to animations - if you called .start() multiple times, multiple animation instances would be created. This wasn't desirable. Also beefed up animation unit tests

Browse Source
This commit is contained in:
Eric Rowell 2012-04-28 18:33:05 -07:00
parent e8dcb8e584
commit ff31dcb0ae
4 changed files with 95 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dist/kinetic-core.js vendored
View File

@ -1306,9 +1306,12 @@ Kinetic.Stage.prototype = {
* start animation
*/
start: function() {
if(!this.animRunning) {
var go = Kinetic.GlobalObject;
go._addAnimation(this.anim);
go._handleAnimation();
this.animRunning = true;
}
},
/**
* stop animation
@ -1316,7 +1319,7 @@ Kinetic.Stage.prototype = {
stop: function() {
var go = Kinetic.GlobalObject;
go._removeAnimation(this.anim);
go._handleAnimation();
this.animRunning = false;
},
/**
* draw children
@ -2149,6 +2152,7 @@ Kinetic.Stage.prototype = {
this.ids = {};
this.names = {};
this.anim = undefined;
this.animRunning = false;
}
};
// Extend Container and Node

4
dist/kinetic-core.min.js vendored
View File

File diff suppressed because one or more lines are too long

6
src/Stage.js
View File

@ -67,9 +67,12 @@ Kinetic.Stage.prototype = {
* start animation
*/
start: function() {
if(!this.animRunning) {
var go = Kinetic.GlobalObject;
go._addAnimation(this.anim);
go._handleAnimation();
this.animRunning = true;
}
},
/**
* stop animation
@ -77,7 +80,7 @@ Kinetic.Stage.prototype = {
stop: function() {
var go = Kinetic.GlobalObject;
go._removeAnimation(this.anim);
go._handleAnimation();
this.animRunning = false;
},
/**
* draw children
@ -910,6 +913,7 @@ Kinetic.Stage.prototype = {
this.ids = {};
this.names = {};
this.anim = undefined;
this.animRunning = false;
}
};
// Extend Container and Node

80
tests/js/unitTests.js
View File

@ -2528,7 +2528,7 @@ Test.prototype.tests = {
// ANIMATION tests
////////////////////////////////////////////////////////////////////////
'ANIMATION - stage and global object animation properties': function(containerId) {
'ANIMATION - test start and stop': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@ -2554,14 +2554,88 @@ Test.prototype.tests = {
var centerX = stage.getWidth() / 2 - 100 / 2;
stage.onFrame(function(frame) {
rect.x = amplitude * Math.sin(frame.time * 2 * Math.PI / period) + centerX;
rect.setX(amplitude * Math.sin(frame.time * 2 * Math.PI / period) + centerX);
layer.draw();
});
// TODO: need to re-add support for stop
var go = Kinetic.GlobalObject;
test(go.animations.length === 0, 'should be no animations running');
test(stage.animRunning === false, 'animRunning should be false');
stage.start();
test(go.animations.length === 1, 'should be 1 animation running');
test(stage.animRunning === true, 'animRunning should be true');
stage.start();
test(go.animations.length === 1, 'should be 1 animation running');
test(stage.animRunning === true, 'animRunning should be true');
stage.stop();
test(go.animations.length === 0, 'should be no animations running');
test(stage.animRunning === false, 'animRunning should be false');
stage.stop();
test(go.animations.length === 0, 'should be no animations running');
test(stage.animRunning === false, 'animRunning should be false');
},
////////////////////////////////////////////////////////////////////////
// TRANSITION tests
////////////////////////////////////////////////////////////////////////
'TRANSITION - start animation when transition completes': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: 200,
y: 100,
width: 100,
height: 50,
fill: 'green',
stroke: 'black',
strokeWidth: 4
});
layer.add(rect);
stage.add(layer);
var amplitude = 150;
var period = 1000;
// in ms
var centerX = 200;
stage.onFrame(function(frame) {
rect.setX(amplitude * Math.sin(frame.time * 2 * Math.PI / period) + centerX);
layer.draw();
});
stage.start();
stage.stop();
centerX = 300;
var go = Kinetic.GlobalObject;
test(go.animations.length === 0, 'should be no animations running');
test(stage.animRunning === false, 'animRunning should be false');
rect.transitionTo({
x: 300,
duration: 1,
callback: function() {
test(go.animations.length === 0, 'should be no animations running');
test(stage.animRunning === false, 'animRunning should be false');
stage.start();
test(go.animations.length === 1, 'should be no animations running');
test(stage.animRunning === true, 'animRunning should be false');
}
});
}
};