lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-11-24 16:53:06 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

pass native events into transform events

Browse Source
This commit is contained in:
Anton Lavrenov
2018-09-11 16:39:48 +03:00
parent 3cf4707e1a
commit 5fcf600a4d
3 changed files with 87 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
konva.js
View File

@@ -19826,8 +19826,8 @@
this._transforming = true;
this.fire('transformstart');
this.getNode().fire('transformstart');
this._fire('transformstart', { evt: e });
this.getNode()._fire('transformstart', { evt: e });
},
_handleMouseMove: function(e) {
@@ -19959,27 +19959,30 @@
var dx = padding;
var dy = padding;
this._fitNodeInto({
rotation: Konva.angleDeg
? newRotation
: Konva.Util._degToRad(newRotation),
x:
attrs.x +
(attrs.width / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.height / 2 + padding) *
(Math.sin(-alpha) - Math.sin(-newAlpha)) -
(dx * Math.cos(rot) + dy * Math.sin(-rot)),
y:
attrs.y +
(attrs.height / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.width / 2 + padding) *
(Math.sin(alpha) - Math.sin(newAlpha)) -
(dy * Math.cos(rot) + dx * Math.sin(rot)),
width: attrs.width + padding * 2,
height: attrs.height + padding * 2
});
this._fitNodeInto(
{
rotation: Konva.angleDeg
? newRotation
: Konva.Util._degToRad(newRotation),
x:
attrs.x +
(attrs.width / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.height / 2 + padding) *
(Math.sin(-alpha) - Math.sin(-newAlpha)) -
(dx * Math.cos(rot) + dy * Math.sin(-rot)),
y:
attrs.y +
(attrs.height / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.width / 2 + padding) *
(Math.sin(alpha) - Math.sin(newAlpha)) -
(dy * Math.cos(rot) + dx * Math.sin(rot)),
width: attrs.width + padding * 2,
height: attrs.height + padding * 2
},
e
);
} else {
console.error(
new Error(
@@ -20027,34 +20030,37 @@
var height =
this.findOne('.bottom-right').y() - this.findOne('.top-left').y();
this._fitNodeInto({
x: x + this.offsetX(),
y: y + this.offsetY(),
width: width,
height: height
});
this._fitNodeInto(
{
x: x + this.offsetX(),
y: y + this.offsetY(),
width: width,
height: height
},
e
);
},
_handleMouseUp: function() {
this._removeEvents();
_handleMouseUp: function(e) {
this._removeEvents(e);
},
_removeEvents: function() {
_removeEvents: function(e) {
if (this._transforming) {
this._transforming = false;
window.removeEventListener('mousemove', this._handleMouseMove);
window.removeEventListener('touchmove', this._handleMouseMove);
window.removeEventListener('mouseup', this._handleMouseUp, true);
window.removeEventListener('touchend', this._handleMouseUp, true);
this.fire('transformend');
this._fire('transformend', { evt: e });
var node = this.getNode();
if (node) {
node.fire('transformend');
node.fire('transformend', { evt: e });
}
}
},
_fitNodeInto: function(newAttrs) {
_fitNodeInto: function(newAttrs, evt) {
// waring! in this attrs padding may be included
var boundBoxFunc = this.getBoundBoxFunc();
if (boundBoxFunc) {
@@ -20083,8 +20089,8 @@
});
this._settings = false;
this.fire('transform');
this.getNode().fire('transform');
this._fire('transform', { evt: evt });
this.getNode()._fire('transform', { evt: evt });
this.update();
this.getLayer().batchDraw();
},

2
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

80
src/shapes/Transformer.js
View File

@@ -401,8 +401,8 @@
this._transforming = true;
this.fire('transformstart');
this.getNode().fire('transformstart');
this._fire('transformstart', { evt: e });
this.getNode()._fire('transformstart', { evt: e });
},
_handleMouseMove: function(e) {
@@ -534,27 +534,30 @@
var dx = padding;
var dy = padding;
this._fitNodeInto({
rotation: Konva.angleDeg
? newRotation
: Konva.Util._degToRad(newRotation),
x:
attrs.x +
(attrs.width / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.height / 2 + padding) *
(Math.sin(-alpha) - Math.sin(-newAlpha)) -
(dx * Math.cos(rot) + dy * Math.sin(-rot)),
y:
attrs.y +
(attrs.height / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.width / 2 + padding) *
(Math.sin(alpha) - Math.sin(newAlpha)) -
(dy * Math.cos(rot) + dx * Math.sin(rot)),
width: attrs.width + padding * 2,
height: attrs.height + padding * 2
});
this._fitNodeInto(
{
rotation: Konva.angleDeg
? newRotation
: Konva.Util._degToRad(newRotation),
x:
attrs.x +
(attrs.width / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.height / 2 + padding) *
(Math.sin(-alpha) - Math.sin(-newAlpha)) -
(dx * Math.cos(rot) + dy * Math.sin(-rot)),
y:
attrs.y +
(attrs.height / 2 + padding) *
(Math.cos(alpha) - Math.cos(newAlpha)) +
(attrs.width / 2 + padding) *
(Math.sin(alpha) - Math.sin(newAlpha)) -
(dy * Math.cos(rot) + dx * Math.sin(rot)),
width: attrs.width + padding * 2,
height: attrs.height + padding * 2
},
e
);
} else {
console.error(
new Error(
@@ -602,34 +605,37 @@
var height =
this.findOne('.bottom-right').y() - this.findOne('.top-left').y();
this._fitNodeInto({
x: x + this.offsetX(),
y: y + this.offsetY(),
width: width,
height: height
});
this._fitNodeInto(
{
x: x + this.offsetX(),
y: y + this.offsetY(),
width: width,
height: height
},
e
);
},
_handleMouseUp: function() {
this._removeEvents();
_handleMouseUp: function(e) {
this._removeEvents(e);
},
_removeEvents: function() {
_removeEvents: function(e) {
if (this._transforming) {
this._transforming = false;
window.removeEventListener('mousemove', this._handleMouseMove);
window.removeEventListener('touchmove', this._handleMouseMove);
window.removeEventListener('mouseup', this._handleMouseUp, true);
window.removeEventListener('touchend', this._handleMouseUp, true);
this.fire('transformend');
this._fire('transformend', { evt: e });
var node = this.getNode();
if (node) {
node.fire('transformend');
node.fire('transformend', { evt: e });
}
}
},
_fitNodeInto: function(newAttrs) {
_fitNodeInto: function(newAttrs, evt) {
// waring! in this attrs padding may be included
var boundBoxFunc = this.getBoundBoxFunc();
if (boundBoxFunc) {
@@ -658,8 +664,8 @@
});
this._settings = false;
this.fire('transform');
this.getNode().fire('transform');
this._fire('transform', { evt: evt });
this.getNode()._fire('transform', { evt: evt });
this.update();
this.getLayer().batchDraw();
},