refactored attr event change logic a bit. added delete operator in a couple places to fix memory leaks. added better event unit tests.

This commit is contained in:
Eric Rowell 2012-06-09 10:53:47 -07:00
parent 12b61b3621
commit e64024d3bd
6 changed files with 96 additions and 35 deletions

22
dist/kinetic-core.js vendored
View File

@ -453,14 +453,15 @@ Kinetic.Node.prototype = {
if(this.eventListeners[baseEvent][i].name === name) {
this.eventListeners[baseEvent].splice(i, 1);
if(this.eventListeners[baseEvent].length === 0) {
this.eventListeners[baseEvent] = undefined;
delete this.eventListeners[baseEvent];
break;
}
break;
i--;
}
}
}
else {
this.eventListeners[baseEvent] = undefined;
delete this.eventListeners[baseEvent];
}
}
},
@ -535,15 +536,14 @@ Kinetic.Node.prototype = {
*/
case 'draggable':
that.draggable(c[key]);
that._fireChangeEvent(key);
break;
case 'listening':
that.listen(c[key]);
that._fireChangeEvent(key);
break;
case 'rotationDeg':
that._setAttr(obj, 'rotation', c[key] * Math.PI / 180);
that._fireChangeEvent('rotation');
// override key for change event
key = 'rotation';
break;
/*
* config objects
@ -552,7 +552,6 @@ Kinetic.Node.prototype = {
var pos = go._getXY(val);
that._setAttr(obj[key], 'x', pos.x);
that._setAttr(obj[key], 'y', pos.y);
that._fireChangeEvent(key);
break;
/*
* includes:
@ -563,17 +562,14 @@ Kinetic.Node.prototype = {
var pos = go._getXY(val);
that._setAttr(obj[key], 'x', pos.x);
that._setAttr(obj[key], 'y', pos.y);
that._fireChangeEvent(key);
break;
case 'scale':
var pos = go._getXY(val);
that._setAttr(obj[key], 'x', pos.x);
that._setAttr(obj[key], 'y', pos.y);
that._fireChangeEvent(key);
break;
case 'points':
that._setAttr(obj, key, go._getPoints(val));
that._fireChangeEvent(key);
break;
case 'crop':
var pos = go._getXY(val);
@ -582,13 +578,13 @@ Kinetic.Node.prototype = {
that._setAttr(obj[key], 'y', pos.y);
that._setAttr(obj[key], 'width', size.width);
that._setAttr(obj[key], 'height', size.height);
that._fireChangeEvent(key);
break;
default:
that._setAttr(obj, key, c[key]);
that._fireChangeEvent(key);
break;
}
that._fireChangeEvent(key);
}
}
}
@ -2424,7 +2420,7 @@ else if(!isDragging && this.touchMove) {
}
}
if(nodes.length === 0) {
this.names[node.attrs.name] = undefined;
delete this.names[node.attrs.name];
}
}
}

File diff suppressed because one or more lines are too long

View File

@ -98,14 +98,15 @@ Kinetic.Node.prototype = {
if(this.eventListeners[baseEvent][i].name === name) {
this.eventListeners[baseEvent].splice(i, 1);
if(this.eventListeners[baseEvent].length === 0) {
this.eventListeners[baseEvent] = undefined;
delete this.eventListeners[baseEvent];
break;
}
break;
i--;
}
}
}
else {
this.eventListeners[baseEvent] = undefined;
delete this.eventListeners[baseEvent];
}
}
},
@ -180,15 +181,14 @@ Kinetic.Node.prototype = {
*/
case 'draggable':
that.draggable(c[key]);
that._fireChangeEvent(key);
break;
case 'listening':
that.listen(c[key]);
that._fireChangeEvent(key);
break;
case 'rotationDeg':
that._setAttr(obj, 'rotation', c[key] * Math.PI / 180);
that._fireChangeEvent('rotation');
// override key for change event
key = 'rotation';
break;
/*
* config objects
@ -197,7 +197,6 @@ Kinetic.Node.prototype = {
var pos = go._getXY(val);
that._setAttr(obj[key], 'x', pos.x);
that._setAttr(obj[key], 'y', pos.y);
that._fireChangeEvent(key);
break;
/*
* includes:
@ -208,17 +207,14 @@ Kinetic.Node.prototype = {
var pos = go._getXY(val);
that._setAttr(obj[key], 'x', pos.x);
that._setAttr(obj[key], 'y', pos.y);
that._fireChangeEvent(key);
break;
case 'scale':
var pos = go._getXY(val);
that._setAttr(obj[key], 'x', pos.x);
that._setAttr(obj[key], 'y', pos.y);
that._fireChangeEvent(key);
break;
case 'points':
that._setAttr(obj, key, go._getPoints(val));
that._fireChangeEvent(key);
break;
case 'crop':
var pos = go._getXY(val);
@ -227,13 +223,13 @@ Kinetic.Node.prototype = {
that._setAttr(obj[key], 'y', pos.y);
that._setAttr(obj[key], 'width', size.width);
that._setAttr(obj[key], 'height', size.height);
that._fireChangeEvent(key);
break;
default:
that._setAttr(obj, key, c[key]);
that._fireChangeEvent(key);
break;
}
that._fireChangeEvent(key);
}
}
}

View File

@ -939,7 +939,7 @@ else if(!isDragging && this.touchMove) {
}
}
if(nodes.length === 0) {
this.names[node.attrs.name] = undefined;
delete this.names[node.attrs.name];
}
}
}

View File

@ -6,7 +6,7 @@ function test(condition, message) {
throw new Error(message);
}
numTests++;
testCounter.innerHTML = numTests;
}
function log(message) {
@ -16,10 +16,7 @@ function log(message) {
* Test constructor
*/
function Test() {
//this.testOnly = 'EVENTS - mousedown mouseup mouseover mouseout mousemove click dblclick / touchstart touchend touchmove tap dbltap';
this.testOnly = '';
this.counter = 0;
testCounter = document.createElement('div');
testCounter.id = 'testCounter';
document.getElementsByTagName('body')[0].appendChild(testCounter);
@ -47,8 +44,22 @@ Test.prototype = {
run: function() {
var tests = this.tests;
var testOnlySpecial = false;
/*
* if a test key has a star in front of it, then
* only run special tests. This lets us easily run
* specific tests without running all of them
*/
for(var key in tests) {
if(!this.testOnly || (this.testOnly && this.testOnly == key)) {
if(key.charAt(0) === '*') {
testOnlySpecial = true;
break;
}
}
for(var key in tests) {
if(!testOnlySpecial || key.charAt(0) === '*') {
var obj = this.addTestContainer(key);
this.counter++;
console.log(this.counter + ") " + key);

View File

@ -2925,11 +2925,11 @@ Test.prototype.tests = {
var triggered = false;
rect.on('widthChange', function() {
triggered = true;
triggered = true;
});
rect.setSize(210);
test(triggered, 'width change event not triggered');
},
'NODE - test setting shadow offset': function(containerId) {
@ -3614,6 +3614,64 @@ Test.prototype.tests = {
test(foo === 'bar', 'foo should equal bar');
},
'EVENTS - add remove event': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'green',
stroke: 'black',
strokeWidth: 4,
name: 'myCircle'
});
/*
* test regular on and off
*/
test(circle.eventListeners['click'] === undefined, 'circle should have no click listeners');
circle.on('click', function() {
});
test(circle.eventListeners['click'].length === 1, 'circle should have 1 click listener');
circle.on('click', function() {
});
test(circle.eventListeners['click'].length === 2, 'circle should have 2 click listeners');
circle.off('click');
test(circle.eventListeners['click'] === undefined, 'circle should have no click listeners');
/*
* test name spacing
*/
circle.on('click.foo', function() {
});
test(circle.eventListeners['click'].length === 1, 'circle should have 1 click listener');
circle.on('click.foo', function() {
});
test(circle.eventListeners['click'].length === 2, 'circle should have 2 click listeners');
circle.on('click.bar', function() {
});
test(circle.eventListeners['click'].length === 3, 'circle should have 3 click listeners');
circle.off('click.foo');
test(circle.eventListeners['click'].length === 1, 'circle should have 1 click listener');
circle.off('click.bar');
test(circle.eventListeners['click'] === undefined, 'circle should have no click listeners');
stage.add(layer);
layer.add(circle);
layer.draw();
},
'NODE - simulate event bubble': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,