keepProportion attribute for Transformer

This commit is contained in:
Anton Lavrenov
2018-03-14 10:07:55 +07:00
parent 1a45e953c2
commit 921fd70417
4 changed files with 92 additions and 67 deletions

View File

@@ -23,6 +23,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
* Some typescript fixes
* Pixelate filter fixes
* Fixes for path data parsing
* Fixed shadow size calculation
## Removed

View File

@@ -2,7 +2,7 @@
* Konva JavaScript Framework v1.7.6
* http://konvajs.github.io/
* Licensed under the MIT
* Date: Mon Mar 12 2018
* Date: Wed Mar 14 2018
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@@ -18769,7 +18769,10 @@
resizerNode.setAbsolutePosition(newAbsPos);
var keepProportion = this.keepProportion() || e.shiftKey;
if (this.movingResizer === 'top-left') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.bottom-right').x() - resizerNode.x(), 2) +
Math.pow(this.findOne('.bottom-right').y() - resizerNode.y(), 2)
@@ -18780,9 +18783,11 @@
this.findOne('.top-left').x(this.findOne('.bottom-right').x() - x);
this.findOne('.top-left').y(this.findOne('.bottom-right').y() - y);
}
} else if (this.movingResizer === 'top-center') {
this.findOne('.top-left').y(resizerNode.y());
} else if (this.movingResizer === 'top-right') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.bottom-left').x() - resizerNode.x(), 2) +
Math.pow(this.findOne('.bottom-left').y() - resizerNode.y(), 2)
@@ -18793,6 +18798,7 @@
this.findOne('.top-right').x(x);
this.findOne('.top-right').y(this.findOne('.bottom-left').y() - y);
}
var pos = resizerNode.position();
this.findOne('.top-left').y(pos.y);
@@ -18802,6 +18808,7 @@
} else if (this.movingResizer === 'middle-right') {
this.findOne('.bottom-right').x(resizerNode.x());
} else if (this.movingResizer === 'bottom-left') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.top-right').x() - resizerNode.x(), 2) +
Math.pow(this.findOne('.top-right').y() - resizerNode.y(), 2)
@@ -18812,6 +18819,7 @@
this.findOne('.bottom-left').x(this.findOne('.top-right').x() - x);
this.findOne('.bottom-left').y(y);
}
pos = resizerNode.position();
@@ -18820,6 +18828,7 @@
} else if (this.movingResizer === 'bottom-center') {
this.findOne('.bottom-right').y(resizerNode.y());
} else if (this.movingResizer === 'bottom-right') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.bottom-right').x(), 2) +
Math.pow(this.findOne('.bottom-right').y(), 2)
@@ -18830,6 +18839,7 @@
this.findOne('.bottom-right').x(x);
this.findOne('.bottom-right').y(y);
}
} else if (this.movingResizer === 'rotater') {
var attrs = this._getNodeRect();
x = resizerNode.x() - attrs.width / 2;
@@ -19065,6 +19075,8 @@
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotationSnaps', []);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateHandlerOffset', 50);
Konva.Factory.addGetterSetter(Konva.Transformer, 'lineEnabled', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'keepProportion', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'node');
Konva.Collection.mapMethods(Konva.Transformer);

4
konva.min.js vendored

File diff suppressed because one or more lines are too long

View File

@@ -286,7 +286,10 @@
resizerNode.setAbsolutePosition(newAbsPos);
var keepProportion = this.keepProportion() || e.shiftKey;
if (this.movingResizer === 'top-left') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.bottom-right').x() - resizerNode.x(), 2) +
Math.pow(this.findOne('.bottom-right').y() - resizerNode.y(), 2)
@@ -297,9 +300,11 @@
this.findOne('.top-left').x(this.findOne('.bottom-right').x() - x);
this.findOne('.top-left').y(this.findOne('.bottom-right').y() - y);
}
} else if (this.movingResizer === 'top-center') {
this.findOne('.top-left').y(resizerNode.y());
} else if (this.movingResizer === 'top-right') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.bottom-left').x() - resizerNode.x(), 2) +
Math.pow(this.findOne('.bottom-left').y() - resizerNode.y(), 2)
@@ -310,6 +315,7 @@
this.findOne('.top-right').x(x);
this.findOne('.top-right').y(this.findOne('.bottom-left').y() - y);
}
var pos = resizerNode.position();
this.findOne('.top-left').y(pos.y);
@@ -319,6 +325,7 @@
} else if (this.movingResizer === 'middle-right') {
this.findOne('.bottom-right').x(resizerNode.x());
} else if (this.movingResizer === 'bottom-left') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.top-right').x() - resizerNode.x(), 2) +
Math.pow(this.findOne('.top-right').y() - resizerNode.y(), 2)
@@ -329,6 +336,7 @@
this.findOne('.bottom-left').x(this.findOne('.top-right').x() - x);
this.findOne('.bottom-left').y(y);
}
pos = resizerNode.position();
@@ -337,6 +345,7 @@
} else if (this.movingResizer === 'bottom-center') {
this.findOne('.bottom-right').y(resizerNode.y());
} else if (this.movingResizer === 'bottom-right') {
if (keepProportion) {
newHypotenuse = Math.sqrt(
Math.pow(this.findOne('.bottom-right').x(), 2) +
Math.pow(this.findOne('.bottom-right').y(), 2)
@@ -347,6 +356,7 @@
this.findOne('.bottom-right').x(x);
this.findOne('.bottom-right').y(y);
}
} else if (this.movingResizer === 'rotater') {
var attrs = this._getNodeRect();
x = resizerNode.x() - attrs.width / 2;
@@ -582,6 +592,8 @@
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotationSnaps', []);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateHandlerOffset', 50);
Konva.Factory.addGetterSetter(Konva.Transformer, 'lineEnabled', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'keepProportion', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'node');
Konva.Collection.mapMethods(Konva.Transformer);