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

Fix wrong double tap trigger

Browse Source
This commit is contained in:
Anton Lavrenov 2019-07-18 07:55:22 +07:00
parent 494666d070
commit 9cef088d24
6 changed files with 85 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@ -5,7 +5,9 @@ This project adheres to [Semantic Versioning](http://semver.org/).
## Not released:
--
## [3.4.1][2019-07-18]
* Fix wrong double tap trigger
## [3.4.0][2019-07-12]

1
konva-node/demo.js
View File

@ -64,6 +64,7 @@ setTimeout(function() {
});
// now try to create image from url
Konva.Image.fromURL(data, () => {
console.log('image loaded');
// shoul'd throw
});
}

9
konva.js
View File

@ -8,7 +8,7 @@
* Konva JavaScript Framework v3.4.0
* http://konvajs.org/
* Licensed under the MIT
* Date: Fri Jul 12 2019
* Date: Thu Jul 18 2019
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@ -5975,7 +5975,7 @@
clickStartShape &&
clickStartShape._id === shape._id) {
shape._fireAndBubble(CLICK, { evt: evt });
if (fireDblClick && clickEndShape && clickEndShape._id === shape._id) {
if (fireDblClick && clickEndShape && clickEndShape === shape) {
shape._fireAndBubble(DBL_CLICK, { evt: evt });
}
}
@ -6047,7 +6047,7 @@
};
Stage.prototype._touchend = function (evt) {
this.setPointersPositions(evt);
var shape = this.getIntersection(this.getPointerPosition()), fireDblClick = false;
var shape = this.getIntersection(this.getPointerPosition()), clickEndShape = this.clickEndShape, fireDblClick = false;
if (Konva.inDblClickWindow) {
fireDblClick = true;
clearTimeout(this.dblTimeout);
@ -6061,13 +6061,14 @@
Konva.inDblClickWindow = false;
}, Konva.dblClickWindow);
if (shape && shape.isListening()) {
this.clickEndShape = shape;
shape._fireAndBubble(TOUCHEND, { evt: evt });
// detect if tap or double tap occurred
if (Konva.listenClickTap &&
this.tapStartShape &&
shape._id === this.tapStartShape._id) {
shape._fireAndBubble(TAP, { evt: evt });
if (fireDblClick) {
if (fireDblClick && clickEndShape && clickEndShape === shape) {
shape._fireAndBubble(DBL_TAP, { evt: evt });
}
}

4
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

6
src/Stage.ts
View File

@ -565,7 +565,7 @@ export class Stage extends Container<BaseLayer> {
) {
shape._fireAndBubble(CLICK, { evt: evt });
if (fireDblClick && clickEndShape && clickEndShape._id === shape._id) {
if (fireDblClick && clickEndShape && clickEndShape === shape) {
shape._fireAndBubble(DBL_CLICK, { evt: evt });
}
}
@ -642,6 +642,7 @@ export class Stage extends Container<BaseLayer> {
_touchend(evt) {
this.setPointersPositions(evt);
var shape = this.getIntersection(this.getPointerPosition()),
clickEndShape = this.clickEndShape,
fireDblClick = false;
if (Konva.inDblClickWindow) {
@ -658,6 +659,7 @@ export class Stage extends Container<BaseLayer> {
}, Konva.dblClickWindow);
if (shape && shape.isListening()) {
this.clickEndShape = shape;
shape._fireAndBubble(TOUCHEND, { evt: evt });
// detect if tap or double tap occurred
@ -668,7 +670,7 @@ export class Stage extends Container<BaseLayer> {
) {
shape._fireAndBubble(TAP, { evt: evt });
if (fireDblClick) {
if (fireDblClick && clickEndShape && clickEndShape === shape) {
shape._fireAndBubble(DBL_TAP, { evt: evt });
}
}

72
test/functional/TouchEvents-test.js
View File

@ -105,8 +105,8 @@ suite('TouchEvents', function() {
var dbltap = false;
/*
* mobile
*/
* mobile
*/
circle.on('touchstart', function() {
touchstart = true;
//log('touchstart');
@ -283,4 +283,72 @@ suite('TouchEvents', function() {
assert.equal(stageContentTouchend, 1);
assert.equal(circleTouchend, 1);
});
test('tap on one shape, then fast tap on another shape should no trigger double tap', function() {
var stage = addStage();
var layer = new Konva.Layer();
stage.add(layer);
var circle1 = new Konva.Circle({
x: 100,
y: 100,
radius: 70,
fill: 'green',
stroke: 'black',
strokeWidth: 4,
name: 'myCircle'
});
layer.add(circle1);
var circle2 = new Konva.Circle({
x: 200,
y: 100,
radius: 70,
fill: 'green',
stroke: 'black',
strokeWidth: 4,
name: 'myCircle'
});
layer.add(circle2);
layer.draw();
var circle1Tap = 0;
var circle2Tap = 0;
var circle2DoubleTap = 0;
circle1.on('tap', function() {
circle1Tap++;
});
circle2.on('tap', function() {
circle2Tap++;
});
circle2.on('dbltap', function() {
circle2DoubleTap++;
});
stage.simulateTouchStart({ x: 100, y: 100 });
stage.simulateTouchEnd({ x: 100, y: 100 });
assert.equal(circle1Tap, 1, 'should trigger tap on first circle');
assert.equal(circle2Tap, 0, 'should NOT trigger tap on second circle');
assert.equal(
circle2DoubleTap,
0,
'should NOT trigger dbltap on second circle'
);
stage.simulateTouchStart({ x: 200, y: 100 });
stage.simulateTouchEnd({ x: 200, y: 100 });
assert.equal(circle1Tap, 1, 'should trigger tap on first circle');
assert.equal(circle2Tap, 1, 'should trigger tap on second circle');
assert.equal(
circle2DoubleTap,
0,
'should NOT trigger dbltap on second circle'
);
});
});