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

began refactoring layer getIntersection method and added unit tests

Browse Source
This commit is contained in:
Eric Rowell 2013-11-27 16:05:35 -08:00
parent 4d35d38c2d
commit bc9bd291fc
5 changed files with 82 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/Layer.js
View File

@ -29,8 +29,9 @@
var pos = Kinetic.Util._getXY(Array.prototype.slice.call(arguments)),
p, colorKey, shape;
if(this.isVisible() && this.isListening()) {
if(this.isVisible()) {
p = this.hitCanvas.context._context.getImageData(pos.x | 0, pos.y | 0, 1, 1).data;
// this indicates that a hit pixel may have been found
if(p[3] === 255) {
colorKey = Kinetic.Util._rgbToHex(p[0], p[1], p[2]);
@ -40,15 +41,16 @@
pixel: p
};
}
// if no shape mapped to that pixel, return pixel array
else if(p[0] > 0 || p[1] > 0 || p[2] > 0 || p[3] > 0) {
else {
// if no shape mapped to that pixel, just return the pixel array
return {
pixel: p
};
}
}
return null;
else {
return null;
}
},
drawScene: function(canvas) {
canvas = canvas || this.getCanvas();

12
src/Stage.js
View File

@ -358,7 +358,7 @@
obj = this.getIntersection(this.getPointerPosition()),
shape = obj && obj.shape ? obj.shape : undefined;
if(shape) {
if(shape && shape.isListening()) {
if(!Kinetic.isDragging() && obj.pixel[3] === 255 && (!this.targetShape || this.targetShape._id !== shape._id)) {
if(this.targetShape) {
this.targetShape._fireAndBubble(MOUSEOUT, evt, shape);
@ -405,7 +405,7 @@
Kinetic.listenClickTap = true;
if (shape) {
if (shape && shape.isListening()) {
this.clickStartShape = shape;
shape._fireAndBubble(MOUSEDOWN, evt);
}
@ -438,7 +438,7 @@
Kinetic.inDblClickWindow = false;
}, Kinetic.dblClickWindow);
if (shape) {
if (shape && shape.isListening()) {
shape._fireAndBubble(MOUSEUP, evt);
// detect if click or double click occurred
@ -474,7 +474,7 @@
Kinetic.listenClickTap = true;
if (shape) {
if (shape && shape.isListening()) {
this.tapStartShape = shape;
shape._fireAndBubble(TOUCHSTART, evt);
@ -505,7 +505,7 @@
Kinetic.inDblClickWindow = false;
}, Kinetic.dblClickWindow);
if (shape) {
if (shape && shape.isListening()) {
shape._fireAndBubble(TOUCHEND, evt);
// detect if tap or double tap occurred
@ -537,7 +537,7 @@
obj = this.getIntersection(this.getPointerPosition()),
shape = obj && obj.shape ? obj.shape : undefined;
if (shape) {
if (shape && shape.isListening()) {
shape._fireAndBubble(TOUCHMOVE, evt);
// only call preventDefault if the shape is listening for events

67
test/functional/MouseEvents-test.js
View File

@ -180,6 +180,73 @@ suite('MouseEvents', function() {
Kinetic.DD._endDragAfter({dragEndNode:circle});
});
// ======================================================
test('test listening true/false with clicks', function() {
var stage = addStage();
var top = stage.content.getBoundingClientRect().top;
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'
});
var clickCount = 0;
circle.on('click', function() {
clickCount++;
});
layer.add(circle);
stage.add(layer);
// -----------------------------------
stage._mousedown({
clientX: 291,
clientY: 112 + top
});
Kinetic.DD._endDragBefore();
stage._mouseup({
clientX: 291,
clientY: 112 + top
});
assert.equal(clickCount, 1, 'should be 1 click');
// -----------------------------------
circle.setListening(false);
stage._mousedown({
clientX: 291,
clientY: 112 + top
});
Kinetic.DD._endDragBefore();
stage._mouseup({
clientX: 291,
clientY: 112 + top
});
assert.equal(clickCount, 1, 'should be 1 click even though another click occurred');
// -----------------------------------
circle.setListening(true);
stage._mousedown({
clientX: 291,
clientY: 112 + top
});
Kinetic.DD._endDragBefore();
stage._mouseup({
clientX: 291,
clientY: 112 + top
});
assert.equal(clickCount, 2, 'should be 2 clicks');
});
// ======================================================
test('click mapping', function() {
var stage = addStage();

2
test/unit/Layer-test.js
View File

@ -132,7 +132,7 @@ suite('Layer', function() {
assert.equal(layer.getIntersection(300, 100).shape.getId(), 'greenCircle', 'shape should be greenCircle');
assert.equal(layer.getIntersection(380, 100).shape.getId(), 'redCircle', 'shape should be redCircle');
assert.equal(layer.getIntersection(100, 100), null, 'shape should be null');
assert.equal(layer.getIntersection(100, 100).shape, null, 'shape should be null');
});

2
test/unit/Stage-test.js
View File

@ -171,7 +171,7 @@ suite('Stage', function() {
assert.equal(stage.getIntersection(300, 100).shape.getId(), 'greenCircle', 'shape should be greenCircle');
assert.equal(stage.getIntersection(380, 100).shape.getId(), 'redCircle', 'shape should be redCircle');
assert.equal(stage.getIntersection(100, 100), null, 'shape should be null');
assert.equal(stage.getIntersection(100, 100).shape, null, 'shape should be null');
});