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

fix dragend bug, revert back text fill pattern fix

Browse Source
This commit is contained in:
Anton Lavrenov 2019-09-05 13:01:20 -05:00
parent 89e332229b
commit 2988dce492
7 changed files with 87 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
konva.js
View File

@ -8,7 +8,7 @@
* Konva JavaScript Framework v4.0.7
* http://konvajs.org/
* Licensed under the MIT
* Date: Tue Sep 03 2019
* Date: Thu Sep 05 2019
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@ -2035,13 +2035,16 @@
shape._fillFunc(this);
};
SceneContext.prototype._fillPattern = function (shape) {
var fillPatternX = shape.getFillPatternX(), fillPatternY = shape.getFillPatternY(), fillPatternRotation = Konva.getAngle(shape.getFillPatternRotation()), fillPatternOffsetX = shape.getFillPatternOffsetX(), fillPatternOffsetY = shape.getFillPatternOffsetY();
var fillPatternX = shape.getFillPatternX(), fillPatternY = shape.getFillPatternY(), fillPatternRotation = Konva.getAngle(shape.getFillPatternRotation()), fillPatternOffsetX = shape.getFillPatternOffsetX(), fillPatternOffsetY = shape.getFillPatternOffsetY(), fillPatternScaleX = shape.getFillPatternScaleX(), fillPatternScaleY = shape.getFillPatternScaleY();
if (fillPatternX || fillPatternY) {
this.translate(fillPatternX || 0, fillPatternY || 0);
}
if (fillPatternRotation) {
this.rotate(fillPatternRotation);
}
if (fillPatternScaleX || fillPatternScaleY) {
this.scale(fillPatternScaleX, fillPatternScaleY);
}
if (fillPatternOffsetX || fillPatternOffsetY) {
this.translate(-1 * fillPatternOffsetX, -1 * fillPatternOffsetY);
}
@ -2421,8 +2424,8 @@
if (elem.dragStatus === 'dragging') {
DD.justDragged = true;
Konva.listenClickTap = false;
elem.dragStatus = 'stopped';
}
elem.dragStatus = 'stopped';
var drawNode = elem.node.getLayer() ||
(elem.node instanceof Konva['Stage'] && elem.node);
if (drawNode) {
@ -2438,6 +2441,8 @@
target: elem.node,
evt: evt
}, true);
}
if (elem.dragStatus !== 'dragging') {
DD._dragElements.delete(key);
}
});
@ -7052,15 +7057,15 @@
if (this.fillPatternImage()) {
var ctx = getDummyContext();
var pattern = ctx.createPattern(this.fillPatternImage(), this.fillPatternRepeat() || 'repeat');
pattern.setTransform({
a: this.fillPatternScaleX(),
b: 0,
c: 0,
d: this.fillPatternScaleY(),
e: 0,
f: 0 // Vertical translation (moving).
});
// pattern.setTransform
// TODO: how to enable it? It doesn't work in FF...
// pattern.setTransform({
// a: this.fillPatternScaleX(), // Horizontal scaling. A value of 1 results in no scaling.
// b: 0, // Vertical skewing.
// c: 0, // Horizontal skewing.
// d: this.fillPatternScaleY(), // Vertical scaling. A value of 1 results in no scaling.
// e: 0, // Horizontal translation (moving).
// f: 0 // Vertical translation (moving).
// });
return pattern;
}
};

4
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

8
src/Context.ts
View File

@ -666,7 +666,9 @@ export class SceneContext extends Context {
fillPatternY = shape.getFillPatternY(),
fillPatternRotation = Konva.getAngle(shape.getFillPatternRotation()),
fillPatternOffsetX = shape.getFillPatternOffsetX(),
fillPatternOffsetY = shape.getFillPatternOffsetY();
fillPatternOffsetY = shape.getFillPatternOffsetY(),
fillPatternScaleX = shape.getFillPatternScaleX(),
fillPatternScaleY = shape.getFillPatternScaleY();
if (fillPatternX || fillPatternY) {
this.translate(fillPatternX || 0, fillPatternY || 0);
@ -676,6 +678,10 @@ export class SceneContext extends Context {
this.rotate(fillPatternRotation);
}
if (fillPatternScaleX || fillPatternScaleY) {
this.scale(fillPatternScaleX, fillPatternScaleY);
}
if (fillPatternOffsetX || fillPatternOffsetY) {
this.translate(-1 * fillPatternOffsetX, -1 * fillPatternOffsetY);
}

5
src/DragAndDrop.ts
View File

@ -110,10 +110,9 @@ export const DD = {
if (elem.dragStatus === 'dragging') {
DD.justDragged = true;
Konva.listenClickTap = false;
elem.dragStatus = 'stopped';
}
elem.dragStatus = 'stopped';
const drawNode =
elem.node.getLayer() ||
(elem.node instanceof Konva['Stage'] && elem.node);
@ -134,6 +133,8 @@ export const DD = {
},
true
);
}
if (elem.dragStatus !== 'dragging') {
DD._dragElements.delete(key);
}
});

18
src/Shape.ts
View File

@ -265,15 +265,15 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
this.fillPatternImage(),
this.fillPatternRepeat() || 'repeat'
);
pattern.setTransform({
a: this.fillPatternScaleX(), // Horizontal scaling. A value of 1 results in no scaling.
b: 0, // Vertical skewing.
c: 0, // Horizontal skewing.
d: this.fillPatternScaleY(), // Vertical scaling. A value of 1 results in no scaling.
e: 0, // Horizontal translation (moving).
f: 0 // Vertical translation (moving).
});
// pattern.setTransform
// TODO: how to enable it? It doesn't work in FF...
// pattern.setTransform({
// a: this.fillPatternScaleX(), // Horizontal scaling. A value of 1 results in no scaling.
// b: 0, // Vertical skewing.
// c: 0, // Horizontal skewing.
// d: this.fillPatternScaleY(), // Vertical scaling. A value of 1 results in no scaling.
// e: 0, // Horizontal translation (moving).
// f: 0 // Vertical translation (moving).
// });
return pattern;
}
}

48
test/functional/DragAndDropEvents-test.js
View File

@ -474,4 +474,52 @@ suite('DragAndDropEvents', function() {
done();
}, 20);
});
test('drag events should not trigger on a click', function() {
var stage = addStage();
var layer = new Konva.Layer({
draggable: true
});
var circle = new Konva.Circle({
x: 70,
y: 70,
radius: 70,
fill: 'green',
stroke: 'black',
strokeWidth: 4,
name: 'myCircle',
draggable: true
});
layer.add(circle);
stage.add(layer);
var dragstart = 0;
circle.on('dragstart', function() {
dragstart += 1;
});
var dragmove = 0;
circle.on('dragmove', function() {
dragmove += 1;
});
var dragend = 0;
circle.on('dragend', function() {
dragend += 1;
});
var click = 0;
circle.on('click', function() {
click += 1;
});
stage.simulateMouseDown({ x: 70, y: 70 });
stage.simulateMouseUp({ x: 70, y: 70 });
assert.equal(click, 1, 'click triggered');
assert.equal(dragstart, 0, 'dragstart not triggered');
assert.equal(dragmove, 0, 'dragmove not triggered');
assert.equal(dragend, 0, 'dragend not triggered');
});
});

2
test/unit/shapes/Text-test.js
View File

@ -1007,7 +1007,7 @@ suite('Text', function() {
imageObj.src = 'assets/darth-vader.jpg';
});
test('image gradient for text with scale', function(done) {
test.skip('image gradient for text with scale', function(done) {
Konva.pixelRatio = 1;
var imageObj = new Image();
imageObj.onload = function() {