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

transformer fixes

Browse Source
This commit is contained in:
Anton Lavrenov 2018-02-05 12:10:05 +07:00
parent 39f8685fce
commit 589123126f
3 changed files with 88 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
konva.js
View File

@ -2,7 +2,7 @@
* Konva JavaScript Framework v1.7.6 * Konva JavaScript Framework v1.7.6
* http://konvajs.github.io/ * http://konvajs.github.io/
* Licensed under the MIT or GPL Version 2 licenses. * Licensed under the MIT or GPL Version 2 licenses.
* Date: Thu Feb 01 2018 * Date: Mon Feb 05 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 - 2017 by Anton Lavrenov (Konva) * Modified work Copyright (C) 2014 - 2017 by Anton Lavrenov (Konva)
@ -18261,8 +18261,23 @@
(function(Konva) { (function(Konva) {
'use strict'; 'use strict';
var CHANGE_KONVA = 'Change.konva'; var ATTR_CHANGE_LIST = [
var ATTR_CHANGE_LIST = ['resizeEnabled', 'rotateHandlerOffset']; 'resizeEnabledChange',
'rotateHandlerOffsetChange'
].join(' ');
var TRANSFORM_CHANGE_STR = [
'xChange.resizer',
'yChange.resizer',
'scaleXChange.resizer',
'scaleYChange.resizer',
'skewXChange.resizer',
'skewYChange.resizer',
'rotationChange.resizer',
'offsetXChange.resizer',
'offsetYChange.resizer',
'transformsEnabledChange.resizer'
].join(' ');
Konva.Transformer = function(config) { Konva.Transformer = function(config) {
this.____init(config); this.____init(config);
@ -18291,9 +18306,7 @@
this._update = this._update.bind(this); this._update = this._update.bind(this);
// update transformer data for certain attr changes // update transformer data for certain attr changes
for (var n = 0; n < ATTR_CHANGE_LIST.length; n++) { this.on(ATTR_CHANGE_LIST, this._update);
this.on(ATTR_CHANGE_LIST[n] + CHANGE_KONVA, this._update);
}
}, },
attachTo: function(node) { attachTo: function(node) {
@ -18303,6 +18316,7 @@
this._el = node; this._el = node;
this._update(); this._update();
this._el.on('dragmove.resizer', this._update); this._el.on('dragmove.resizer', this._update);
this._el.on(TRANSFORM_CHANGE_STR, this._update);
}, },
detach: function() { detach: function() {
@ -18338,6 +18352,7 @@
var self = this; var self = this;
anchor.on('mousedown touchstart', function(e) { anchor.on('mousedown touchstart', function(e) {
self.handleResizerMouseDown(e); self.handleResizerMouseDown(e);
console.log('down');
}); });
// add hover styling // add hover styling
@ -18678,7 +18693,8 @@
this.findOne('.back').setAttrs({ this.findOne('.back').setAttrs({
width: width, width: width,
height: height height: height,
visible: this.lineEnabled()
}); });
}, },
destroy: function() { destroy: function() {
@ -18692,6 +18708,24 @@
}; };
Konva.Util.extend(Konva.Transformer, Konva.Group); Konva.Util.extend(Konva.Transformer, Konva.Group);
function validateResizers(val) {
if (!(val instanceof Array)) {
Konva.Util.warn('enabledResizers value should be an array');
}
if (val instanceof Array) {
val.forEach(function(name) {
if (RESIZERS_NAMES.indexOf('name') === -1) {
Konva.Util.warn(
'Unknown resizer name: ' +
name +
'. Available names are: ' +
RESIZERS_NAMES.join(', ')
);
}
});
}
return val || [];
}
Konva.Factory.addGetterSetter( Konva.Factory.addGetterSetter(
Konva.Transformer, Konva.Transformer,
'enabledResizers', 'enabledResizers',
@ -18701,29 +18735,13 @@
Konva.Transformer, Konva.Transformer,
'enabledResizers', 'enabledResizers',
RESIZERS_NAMES, RESIZERS_NAMES,
function(val) { validateResizers
if (!(val instanceof Array)) {
Konva.Util.warn('enabledResizers value should be an array');
}
if (val instanceof Array) {
val.forEach(function(name) {
if (RESIZERS_NAMES.indexOf('name') === -1) {
Konva.Util.warn(
'Unknown resizer name: ' +
name +
'. Available names are: ' +
RESIZERS_NAMES.join(', ')
);
}
});
}
return val || [];
}
); );
Konva.Factory.addGetterSetter(Konva.Transformer, 'resizeEnabled', true); Konva.Factory.addGetterSetter(Konva.Transformer, 'resizeEnabled', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateEnabled', true); Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateEnabled', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotationSnaps', []); Konva.Factory.addGetterSetter(Konva.Transformer, 'rotationSnaps', []);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateHandlerOffset', 50); Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateHandlerOffset', 50);
Konva.Factory.addGetterSetter(Konva.Transformer, 'lineEnabled', true);
Konva.Collection.mapMethods(Konva.Transformer); Konva.Collection.mapMethods(Konva.Transformer);
})(Konva); })(Konva);

6
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

66
src/shapes/Transformer.js
View File

@ -1,8 +1,23 @@
(function(Konva) { (function(Konva) {
'use strict'; 'use strict';
var CHANGE_KONVA = 'Change.konva'; var ATTR_CHANGE_LIST = [
var ATTR_CHANGE_LIST = ['resizeEnabled', 'rotateHandlerOffset']; 'resizeEnabledChange',
'rotateHandlerOffsetChange'
].join(' ');
var TRANSFORM_CHANGE_STR = [
'xChange.resizer',
'yChange.resizer',
'scaleXChange.resizer',
'scaleYChange.resizer',
'skewXChange.resizer',
'skewYChange.resizer',
'rotationChange.resizer',
'offsetXChange.resizer',
'offsetYChange.resizer',
'transformsEnabledChange.resizer'
].join(' ');
Konva.Transformer = function(config) { Konva.Transformer = function(config) {
this.____init(config); this.____init(config);
@ -31,9 +46,7 @@
this._update = this._update.bind(this); this._update = this._update.bind(this);
// update transformer data for certain attr changes // update transformer data for certain attr changes
for (var n = 0; n < ATTR_CHANGE_LIST.length; n++) { this.on(ATTR_CHANGE_LIST, this._update);
this.on(ATTR_CHANGE_LIST[n] + CHANGE_KONVA, this._update);
}
}, },
attachTo: function(node) { attachTo: function(node) {
@ -43,6 +56,7 @@
this._el = node; this._el = node;
this._update(); this._update();
this._el.on('dragmove.resizer', this._update); this._el.on('dragmove.resizer', this._update);
this._el.on(TRANSFORM_CHANGE_STR, this._update);
}, },
detach: function() { detach: function() {
@ -78,6 +92,7 @@
var self = this; var self = this;
anchor.on('mousedown touchstart', function(e) { anchor.on('mousedown touchstart', function(e) {
self.handleResizerMouseDown(e); self.handleResizerMouseDown(e);
console.log('down');
}); });
// add hover styling // add hover styling
@ -418,7 +433,8 @@
this.findOne('.back').setAttrs({ this.findOne('.back').setAttrs({
width: width, width: width,
height: height height: height,
visible: this.lineEnabled()
}); });
}, },
destroy: function() { destroy: function() {
@ -432,6 +448,24 @@
}; };
Konva.Util.extend(Konva.Transformer, Konva.Group); Konva.Util.extend(Konva.Transformer, Konva.Group);
function validateResizers(val) {
if (!(val instanceof Array)) {
Konva.Util.warn('enabledResizers value should be an array');
}
if (val instanceof Array) {
val.forEach(function(name) {
if (RESIZERS_NAMES.indexOf('name') === -1) {
Konva.Util.warn(
'Unknown resizer name: ' +
name +
'. Available names are: ' +
RESIZERS_NAMES.join(', ')
);
}
});
}
return val || [];
}
Konva.Factory.addGetterSetter( Konva.Factory.addGetterSetter(
Konva.Transformer, Konva.Transformer,
'enabledResizers', 'enabledResizers',
@ -441,29 +475,13 @@
Konva.Transformer, Konva.Transformer,
'enabledResizers', 'enabledResizers',
RESIZERS_NAMES, RESIZERS_NAMES,
function(val) { validateResizers
if (!(val instanceof Array)) {
Konva.Util.warn('enabledResizers value should be an array');
}
if (val instanceof Array) {
val.forEach(function(name) {
if (RESIZERS_NAMES.indexOf('name') === -1) {
Konva.Util.warn(
'Unknown resizer name: ' +
name +
'. Available names are: ' +
RESIZERS_NAMES.join(', ')
);
}
});
}
return val || [];
}
); );
Konva.Factory.addGetterSetter(Konva.Transformer, 'resizeEnabled', true); Konva.Factory.addGetterSetter(Konva.Transformer, 'resizeEnabled', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateEnabled', true); Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateEnabled', true);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotationSnaps', []); Konva.Factory.addGetterSetter(Konva.Transformer, 'rotationSnaps', []);
Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateHandlerOffset', 50); Konva.Factory.addGetterSetter(Konva.Transformer, 'rotateHandlerOffset', 50);
Konva.Factory.addGetterSetter(Konva.Transformer, 'lineEnabled', true);
Konva.Collection.mapMethods(Konva.Transformer); Konva.Collection.mapMethods(Konva.Transformer);
})(Konva); })(Konva);