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

fix mouseenter bug. close #119

Browse Source
This commit is contained in:
Anton Lavrenov
2016-04-26 14:12:04 +07:00
parent 2ea86d99c7
commit 0f77dc4f8b
4 changed files with 116 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
konva.js
View File

@@ -3,7 +3,7 @@
* Konva JavaScript Framework v0.12.4
* http://konvajs.github.io/
* Licensed under the MIT or GPL Version 2 licenses.
* Date: Tue Apr 19 2016
* Date: Tue Apr 26 2016
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - 2015 by Anton Lavrenov (Konva)
@@ -4045,7 +4045,7 @@
this._fire(eventType, evt);
// simulate event bubbling
var stopBubble = (eventType === MOUSEENTER || eventType === MOUSELEAVE) && ((compareShape && compareShape.isAncestorOf && compareShape.isAncestorOf(this)) || !!(compareShape && compareShape.isAncestorOf));
var stopBubble = (eventType === MOUSEENTER || eventType === MOUSELEAVE) && ((compareShape && compareShape.isAncestorOf && compareShape.isAncestorOf(this)));
if((evt && !evt.cancelBubble || !evt) && this.parent && this.parent.isListening() && (!stopBubble)) {
if(compareShape && compareShape.parent) {
this._fireAndBubble.call(this.parent, eventType, evt, compareShape.parent);

4
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
src/Node.js
View File

@@ -1811,7 +1811,7 @@
this._fire(eventType, evt);
// simulate event bubbling
var stopBubble = (eventType === MOUSEENTER || eventType === MOUSELEAVE) && ((compareShape && compareShape.isAncestorOf && compareShape.isAncestorOf(this)) || !!(compareShape && compareShape.isAncestorOf));
var stopBubble = (eventType === MOUSEENTER || eventType === MOUSELEAVE) && ((compareShape && compareShape.isAncestorOf && compareShape.isAncestorOf(this)));
if((evt && !evt.cancelBubble || !evt) && this.parent && this.parent.isListening() && (!stopBubble)) {
if(compareShape && compareShape.parent) {
this._fireAndBubble.call(this.parent, eventType, evt, compareShape.parent);

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

@@ -1102,6 +1102,117 @@ suite('MouseEvents', function() {
});
// ======================================================
test('test mouseleave with multiple groups 2', function() {
var stage = addStage();
var layer = new Konva.Layer();
stage.add(layer);
var group1 = new Konva.Group({name: 'group1'});
layer.add(group1);
var bigRect = new Konva.Rect({
x: 0, y: 0, width: 200, height: 200, fill: 'green'
});
group1.add(bigRect);
var group21 = new Konva.Group({name: 'group21'});
layer.add(group21);
var group22 = new Konva.Group({name: 'group22'});
group21.add(group22);
var smallRect = new Konva.Rect({
x: 50, y: 50, width: 100, height: 100, fill: 'red'
});
group22.add(smallRect);
stage.draw();
var group1Mouseenter = 0;
var group1Mouseleave = 0;
var group1Mouseover = 0;
var group1Mouseout = 0;
var group21Mouseenter = 0;
var group21Mouseleave = 0;
var group21Mouseover = 0;
var group21Mouseout = 0;
var group22Mouseenter = 0;
var group22Mouseleave = 0;
var group22Mouseover = 0;
var group22Mouseout = 0;
group1.on('mouseenter', function() {
group1Mouseenter +=1;
});
group1.on('mouseleave', function() {
group1Mouseleave +=1;
});
group1.on('mouseover', function() {
group1Mouseover +=1;
});
group1.on('mouseout', function() {
group1Mouseout +=1;
});
group21.on('mouseenter', function() {
group21Mouseenter +=1;
});
group21.on('mouseleave', function() {
group21Mouseleave +=1;
});
group21.on('mouseover', function() {
group21Mouseover +=1;
});
group21.on('mouseout', function() {
group21Mouseout +=1;
});
group22.on('mouseenter', function() {
group22Mouseenter +=1;
});
group22.on('mouseleave', function() {
group22Mouseleave +=1;
});
group22.on('mouseover', function() {
group22Mouseover +=1;
});
group22.on('mouseout', function() {
group22Mouseout +=1;
});
var top = stage.content.getBoundingClientRect().top;
stage._mousemove({
clientX: 10,
clientY: 10 + top
});
assert.equal(group1Mouseenter, 1, 'move1 : group1 mouseenter should trigger');
stage._mousemove({
clientX: 60,
clientY: 60 + top
});
assert.equal(group21Mouseenter, 1, 'move2 : group21 mouseenter should trigger');
assert.equal(group22Mouseenter, 1, 'move2 : group22 mouseenter should trigger');
assert.equal(group1Mouseleave, 1, 'move2 : group1 mouseleave should trigger');
stage._mousemove({
clientX: 10,
clientY: 10 + top
});
assert.equal(group21Mouseleave, 1, 'move3 : group21 mouseleave should trigger');
assert.equal(group22Mouseleave, 1, 'move3 : group22 mouseleave should trigger');
assert.equal(group1Mouseenter, 2, 'move3 : group1 mouseenter should trigger');
});
// ======================================================
test('test event bubbling', function() {
var stage = addStage();