lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 15:23:44 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

automatically change transformer on shape changes. close #391

Browse Source
This commit is contained in:
Anton Lavrenov 2018-05-17 07:22:21 +09:00
parent 320ec87b2e
commit 74d3a12921
5 changed files with 47 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
konva.js
View File

@ -2,7 +2,7 @@
* Konva JavaScript Framework v2.1.2 * Konva JavaScript Framework v2.1.2
* http://konvajs.github.io/ * http://konvajs.github.io/
* Licensed under the MIT * Licensed under the MIT
* Date: Wed May 16 2018 * Date: Thu May 17 2018
* *
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS) * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva) * Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@ -18647,6 +18647,18 @@
'transformsEnabledChange.resizer' 'transformsEnabledChange.resizer'
].join(' '); ].join(' ');
var REDRAW_CHANGE_STR = [
'widthChange.resizer',
'heightChange.resizer',
'scaleXChange.resizer',
'scaleYChange.resizer',
'skewXChange.resizer',
'skewYChange.resizer',
'rotationChange.resizer',
'offsetXChange.resizer',
'offsetYChange.resizer'
].join(' ');
var ANGLES = { var ANGLES = {
'top-left': -45, 'top-left': -45,
'top-center': 0, 'top-center': 0,
@ -18791,6 +18803,14 @@
this._clearCache(NODE_RECT); this._clearCache(NODE_RECT);
node.on(TRANSFORM_CHANGE_STR, this._resetTransformCache.bind(this)); node.on(TRANSFORM_CHANGE_STR, this._resetTransformCache.bind(this));
node.on(
REDRAW_CHANGE_STR,
function() {
if (!this._transforming) {
this.update();
}
}.bind(this)
);
// TODO: why do we need this? // TODO: why do we need this?
var elementsCreated = !!this.findOne('.top-left'); var elementsCreated = !!this.findOne('.top-left');

4
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

20
src/shapes/Transformer.js
View File

@ -23,6 +23,18 @@
'transformsEnabledChange.resizer' 'transformsEnabledChange.resizer'
].join(' '); ].join(' ');
var REDRAW_CHANGE_STR = [
'widthChange.resizer',
'heightChange.resizer',
'scaleXChange.resizer',
'scaleYChange.resizer',
'skewXChange.resizer',
'skewYChange.resizer',
'rotationChange.resizer',
'offsetXChange.resizer',
'offsetYChange.resizer'
].join(' ');
var ANGLES = { var ANGLES = {
'top-left': -45, 'top-left': -45,
'top-center': 0, 'top-center': 0,
@ -167,6 +179,14 @@
this._clearCache(NODE_RECT); this._clearCache(NODE_RECT);
node.on(TRANSFORM_CHANGE_STR, this._resetTransformCache.bind(this)); node.on(TRANSFORM_CHANGE_STR, this._resetTransformCache.bind(this));
node.on(
REDRAW_CHANGE_STR,
function() {
if (!this._transforming) {
this.update();
}
}.bind(this)
);
// TODO: why do we need this? // TODO: why do we need this?
var elementsCreated = !!this.findOne('.top-left'); var elementsCreated = !!this.findOne('.top-left');

8
test/manual/manual-test.js
View File

@ -315,9 +315,7 @@ suite('Manual', function() {
}); });
// ====================================================== // ======================================================
test('create image hit region with pixelRatio, look at hit, test hit with mouseover', function( test('create image hit region with pixelRatio, look at hit, test hit with mouseover', function(done) {
done
) {
var imageObj = new Image(); var imageObj = new Image();
Konva.pixelRatio = 2; Konva.pixelRatio = 2;
@ -357,9 +355,7 @@ suite('Manual', function() {
}); });
// ====================================================== // ======================================================
test('image hit region with alpha threshold, mouseover circle', function( test('image hit region with alpha threshold, mouseover circle', function(done) {
done
) {
var stage = addStage(); var stage = addStage();
var layer = new Konva.Layer(); var layer = new Konva.Layer();
stage.add(layer); stage.add(layer);

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

@ -100,6 +100,8 @@ suite('Transformer', function() {
assert.equal(tr.y(), rect.y()); assert.equal(tr.y(), rect.y());
assert.equal(tr.width(), rect.width()); assert.equal(tr.width(), rect.width());
assert.equal(tr.height(), rect.height()); assert.equal(tr.height(), rect.height());
assert.equal(tr.findOne('.back').width(), rect.width());
console.log(tr);
}); });
test('add transformer for transformed rect', function() { test('add transformer for transformed rect', function() {