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

new haveIntersection method

Browse Source
This commit is contained in:
Anton Lavrenov 2018-02-06 08:55:29 +07:00
parent fa2db3ed1a
commit 52f1b91387
5 changed files with 299 additions and 360 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -10,6 +10,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
* new `Konva.Transformer` group that allow simple resize, and rotate of a shape. * new `Konva.Transformer` group that allow simple resize, and rotate of a shape.
* Add ability to remove event by callback `node.off('event', callback)`. * Add ability to remove event by callback `node.off('event', callback)`.
* new `Konva.Filters.Contrast`. * new `Konva.Filters.Contrast`.
* new `Konva.Util.haveIntersection()` to detect collusion
## Changed ## Changed

327
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 * Licensed under the MIT
* Date: Mon Feb 05 2018 * Date: Tue Feb 06 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)
@ -247,11 +247,11 @@
(function() { (function() {
'use strict'; 'use strict';
/** /**
* Collection constructor. Collection extends * Collection constructor. Collection extends
* Array. This class is used in conjunction with {@link Konva.Container#get} * Array. This class is used in conjunction with {@link Konva.Container#get}
* @constructor * @constructor
* @memberof Konva * @memberof Konva
*/ */
Konva.Collection = function() { Konva.Collection = function() {
var args = [].slice.call(arguments), var args = [].slice.call(arguments),
length = args.length, length = args.length,
@ -265,27 +265,27 @@
}; };
Konva.Collection.prototype = []; Konva.Collection.prototype = [];
/** /**
* iterate through node array and run a function for each node. * iterate through node array and run a function for each node.
* The node and index is passed into the function * The node and index is passed into the function
* @method * @method
* @memberof Konva.Collection.prototype * @memberof Konva.Collection.prototype
* @param {Function} func * @param {Function} func
* @example * @example
* // get all nodes with name foo inside layer, and set x to 10 for each * // get all nodes with name foo inside layer, and set x to 10 for each
* layer.get('.foo').each(function(shape, n) { * layer.get('.foo').each(function(shape, n) {
* shape.setX(10); * shape.setX(10);
* }); * });
*/ */
Konva.Collection.prototype.each = function(func) { Konva.Collection.prototype.each = function(func) {
for (var n = 0; n < this.length; n++) { for (var n = 0; n < this.length; n++) {
func(this[n], n); func(this[n], n);
} }
}; };
/** /**
* convert collection into an array * convert collection into an array
* @method * @method
* @memberof Konva.Collection.prototype * @memberof Konva.Collection.prototype
*/ */
Konva.Collection.prototype.toArray = function() { Konva.Collection.prototype.toArray = function() {
var arr = [], var arr = [],
len = this.length, len = this.length,
@ -297,11 +297,11 @@
return arr; return arr;
}; };
/** /**
* convert array into a collection * convert array into a collection
* @method * @method
* @memberof Konva.Collection * @memberof Konva.Collection
* @param {Array} arr * @param {Array} arr
*/ */
Konva.Collection.toCollection = function(arr) { Konva.Collection.toCollection = function(arr) {
var collection = new Konva.Collection(), var collection = new Konva.Collection(),
len = arr.length, len = arr.length,
@ -352,32 +352,32 @@
*/ */
/** /**
* Transform constructor * Transform constructor
* @constructor * @constructor
* @param {Array} [m] Optional six-element matrix * @param {Array} [m] Optional six-element matrix
* @memberof Konva * @memberof Konva
*/ */
Konva.Transform = function(m) { Konva.Transform = function(m) {
this.m = (m && m.slice()) || [1, 0, 0, 1, 0, 0]; this.m = (m && m.slice()) || [1, 0, 0, 1, 0, 0];
}; };
Konva.Transform.prototype = { Konva.Transform.prototype = {
/** /**
* Copy Konva.Transform object * Copy Konva.Transform object
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
copy: function() { copy: function() {
return new Konva.Transform(this.m); return new Konva.Transform(this.m);
}, },
/** /**
* Transform point * Transform point
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Object} point 2D point(x, y) * @param {Object} point 2D point(x, y)
* @returns {Object} 2D point(x, y) * @returns {Object} 2D point(x, y)
*/ */
point: function(point) { point: function(point) {
var m = this.m; var m = this.m;
return { return {
@ -386,26 +386,26 @@
}; };
}, },
/** /**
* Apply translation * Apply translation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} x * @param {Number} x
* @param {Number} y * @param {Number} y
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
translate: function(x, y) { translate: function(x, y) {
this.m[4] += this.m[0] * x + this.m[2] * y; this.m[4] += this.m[0] * x + this.m[2] * y;
this.m[5] += this.m[1] * x + this.m[3] * y; this.m[5] += this.m[1] * x + this.m[3] * y;
return this; return this;
}, },
/** /**
* Apply scale * Apply scale
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} sx * @param {Number} sx
* @param {Number} sy * @param {Number} sy
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
scale: function(sx, sy) { scale: function(sx, sy) {
this.m[0] *= sx; this.m[0] *= sx;
this.m[1] *= sx; this.m[1] *= sx;
@ -414,12 +414,12 @@
return this; return this;
}, },
/** /**
* Apply rotation * Apply rotation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} rad Angle in radians * @param {Number} rad Angle in radians
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
rotate: function(rad) { rotate: function(rad) {
var c = Math.cos(rad); var c = Math.cos(rad);
var s = Math.sin(rad); var s = Math.sin(rad);
@ -434,11 +434,11 @@
return this; return this;
}, },
/** /**
* Returns the translation * Returns the translation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Object} 2D point(x, y) * @returns {Object} 2D point(x, y)
*/ */
getTranslation: function() { getTranslation: function() {
return { return {
x: this.m[4], x: this.m[4],
@ -446,13 +446,13 @@
}; };
}, },
/** /**
* Apply skew * Apply skew
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} sx * @param {Number} sx
* @param {Number} sy * @param {Number} sy
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
skew: function(sx, sy) { skew: function(sx, sy) {
var m11 = this.m[0] + this.m[2] * sy; var m11 = this.m[0] + this.m[2] * sy;
var m12 = this.m[1] + this.m[3] * sy; var m12 = this.m[1] + this.m[3] * sy;
@ -465,12 +465,12 @@
return this; return this;
}, },
/** /**
* Transform multiplication * Transform multiplication
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Konva.Transform} matrix * @param {Konva.Transform} matrix
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
multiply: function(matrix) { multiply: function(matrix) {
var m11 = this.m[0] * matrix.m[0] + this.m[2] * matrix.m[1]; var m11 = this.m[0] * matrix.m[0] + this.m[2] * matrix.m[1];
var m12 = this.m[1] * matrix.m[0] + this.m[3] * matrix.m[1]; var m12 = this.m[1] * matrix.m[0] + this.m[3] * matrix.m[1];
@ -490,11 +490,11 @@
return this; return this;
}, },
/** /**
* Invert the matrix * Invert the matrix
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
invert: function() { invert: function() {
var d = 1 / (this.m[0] * this.m[3] - this.m[1] * this.m[2]); var d = 1 / (this.m[0] * this.m[3] - this.m[1] * this.m[2]);
var m0 = this.m[3] * d; var m0 = this.m[3] * d;
@ -512,20 +512,20 @@
return this; return this;
}, },
/** /**
* return matrix * return matrix
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
*/ */
getMatrix: function() { getMatrix: function() {
return this.m; return this.m;
}, },
/** /**
* set to absolute position via translation * set to absolute position via translation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Konva.Transform} * @returns {Konva.Transform}
* @author ericdrowell * @author ericdrowell
*/ */
setAbsolutePosition: function(x, y) { setAbsolutePosition: function(x, y) {
var m0 = this.m[0], var m0 = this.m[0],
m1 = this.m[1], m1 = this.m[1],
@ -707,13 +707,13 @@
RGB_REGEX = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/; RGB_REGEX = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/;
/** /**
* @namespace Util * @namespace Util
* @memberof Konva * @memberof Konva
*/ */
Konva.Util = { Konva.Util = {
/* /*
* cherry-picked utilities from underscore.js * cherry-picked utilities from underscore.js
*/ */
_isElement: function(obj) { _isElement: function(obj) {
return !!(obj && obj.nodeType == 1); return !!(obj && obj.nodeType == 1);
}, },
@ -732,59 +732,6 @@
_isString: function(obj) { _isString: function(obj) {
return Object.prototype.toString.call(obj) === OBJECT_STRING; return Object.prototype.toString.call(obj) === OBJECT_STRING;
}, },
// Returns a function, that, when invoked, will only be triggered at most once
// during a given window of time. Normally, the throttled function will run
// as much as it can, without ever going more than once per `wait` duration;
// but if you'd like to disable the execution on the leading edge, pass
// `{leading: false}`. To disable execution on the trailing edge, ditto.
_throttle: function(func, wait, opts) {
var context, args, result;
var timeout = null;
var previous = 0;
var options = opts || {};
var later = function() {
previous = options.leading === false ? 0 : new Date().getTime();
timeout = null;
result = func.apply(context, args);
context = args = null;
};
return function() {
var now = new Date().getTime();
if (!previous && options.leading === false) {
previous = now;
}
var remaining = wait - (now - previous);
context = this;
args = arguments;
if (remaining <= 0) {
clearTimeout(timeout);
timeout = null;
previous = now;
result = func.apply(context, args);
context = args = null;
} else if (!timeout && options.trailing !== false) {
timeout = setTimeout(later, remaining);
}
return result;
};
},
/*
* other utils
*/
_hasMethods: function(obj) {
var names = [],
key;
for (key in obj) {
if (!obj.hasOwnProperty(key)) {
continue;
}
if (this._isFunction(obj[key])) {
names.push(key);
}
}
return names.length > 0;
},
isValidSelector: function(selector) { isValidSelector: function(selector) {
if (typeof selector !== 'string') { if (typeof selector !== 'string') {
return false; return false;
@ -835,8 +782,8 @@
return retArr; return retArr;
}, },
/* /*
* arg can be an image object or image data * arg can be an image object or image data
*/ */
_getImage: function(arg, callback) { _getImage: function(arg, callback) {
var imageObj, canvas; var imageObj, canvas;
@ -888,10 +835,10 @@
}; };
}, },
/** /**
* return random hex color * return random hex color
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
*/ */
getRandomColor: function() { getRandomColor: function() {
var randColor = ((Math.random() * 0xffffff) << 0).toString(16); var randColor = ((Math.random() * 0xffffff) << 0).toString(16);
while (randColor.length < 6) { while (randColor.length < 6) {
@ -900,10 +847,10 @@
return HASH + randColor; return HASH + randColor;
}, },
/** /**
* return value with default fallback * return value with default fallback
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
*/ */
get: function(val, def) { get: function(val, def) {
if (val === undefined) { if (val === undefined) {
return def; return def;
@ -912,16 +859,16 @@
} }
}, },
/** /**
* get RGB components of a color * get RGB components of a color
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
* @param {String} color * @param {String} color
* @example * @example
* // each of the following examples return {r:0, g:0, b:255} * // each of the following examples return {r:0, g:0, b:255}
* var rgb = Konva.Util.getRGB('blue'); * var rgb = Konva.Util.getRGB('blue');
* var rgb = Konva.Util.getRGB('#0000ff'); * var rgb = Konva.Util.getRGB('#0000ff');
* var rgb = Konva.Util.getRGB('rgb(0,0,255)'); * var rgb = Konva.Util.getRGB('rgb(0,0,255)');
*/ */
getRGB: function(color) { getRGB: function(color) {
var rgb; var rgb;
// color string // color string
@ -1037,6 +984,19 @@
} }
return retObj; return retObj;
}, },
/**
* check intersection of two client rectangles
* @method
* @memberof Konva.Util.prototype
*/
haveIntersection: function(r1, r2) {
return !(
r2.x > r1.x + r1.width ||
r2.x + r2.width < r1.x ||
r2.y > r1.y + r1.height ||
r2.y + r2.height < r1.y
);
},
cloneObject: function(obj) { cloneObject: function(obj) {
var retObj = {}; var retObj = {};
for (var key in obj) { for (var key in obj) {
@ -1094,12 +1054,12 @@
child.super = parent; child.super = parent;
}, },
/** /**
* adds methods to a constructor prototype * adds methods to a constructor prototype
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
* @param {Function} constructor * @param {Function} constructor
* @param {Object} methods * @param {Object} methods
*/ */
addMethods: function(constructor, methods) { addMethods: function(constructor, methods) {
var key; var key;
@ -18348,6 +18308,8 @@
'bottom-right' 'bottom-right'
]; ];
var warningShowed = false;
Konva.Transformer.prototype = { Konva.Transformer.prototype = {
_centroid: false, _centroid: false,
____init: function(config) { ____init: function(config) {
@ -18361,6 +18323,13 @@
// update transformer data for certain attr changes // update transformer data for certain attr changes
this.on(ATTR_CHANGE_LIST, this._update); this.on(ATTR_CHANGE_LIST, this._update);
if (!warningShowed) {
Konva.Util.warn(
'Konva.Transformer is currently experimental and may have many bugs. Please report any bugs to GitHub repo.'
);
warningShowed = true;
}
}, },
attachTo: function(node) { attachTo: function(node) {

6
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

316
src/Util.js
View File

@ -2,11 +2,11 @@
(function() { (function() {
'use strict'; 'use strict';
/** /**
* Collection constructor. Collection extends * Collection constructor. Collection extends
* Array. This class is used in conjunction with {@link Konva.Container#get} * Array. This class is used in conjunction with {@link Konva.Container#get}
* @constructor * @constructor
* @memberof Konva * @memberof Konva
*/ */
Konva.Collection = function() { Konva.Collection = function() {
var args = [].slice.call(arguments), var args = [].slice.call(arguments),
length = args.length, length = args.length,
@ -20,27 +20,27 @@
}; };
Konva.Collection.prototype = []; Konva.Collection.prototype = [];
/** /**
* iterate through node array and run a function for each node. * iterate through node array and run a function for each node.
* The node and index is passed into the function * The node and index is passed into the function
* @method * @method
* @memberof Konva.Collection.prototype * @memberof Konva.Collection.prototype
* @param {Function} func * @param {Function} func
* @example * @example
* // get all nodes with name foo inside layer, and set x to 10 for each * // get all nodes with name foo inside layer, and set x to 10 for each
* layer.get('.foo').each(function(shape, n) { * layer.get('.foo').each(function(shape, n) {
* shape.setX(10); * shape.setX(10);
* }); * });
*/ */
Konva.Collection.prototype.each = function(func) { Konva.Collection.prototype.each = function(func) {
for (var n = 0; n < this.length; n++) { for (var n = 0; n < this.length; n++) {
func(this[n], n); func(this[n], n);
} }
}; };
/** /**
* convert collection into an array * convert collection into an array
* @method * @method
* @memberof Konva.Collection.prototype * @memberof Konva.Collection.prototype
*/ */
Konva.Collection.prototype.toArray = function() { Konva.Collection.prototype.toArray = function() {
var arr = [], var arr = [],
len = this.length, len = this.length,
@ -52,11 +52,11 @@
return arr; return arr;
}; };
/** /**
* convert array into a collection * convert array into a collection
* @method * @method
* @memberof Konva.Collection * @memberof Konva.Collection
* @param {Array} arr * @param {Array} arr
*/ */
Konva.Collection.toCollection = function(arr) { Konva.Collection.toCollection = function(arr) {
var collection = new Konva.Collection(), var collection = new Konva.Collection(),
len = arr.length, len = arr.length,
@ -107,32 +107,32 @@
*/ */
/** /**
* Transform constructor * Transform constructor
* @constructor * @constructor
* @param {Array} [m] Optional six-element matrix * @param {Array} [m] Optional six-element matrix
* @memberof Konva * @memberof Konva
*/ */
Konva.Transform = function(m) { Konva.Transform = function(m) {
this.m = (m && m.slice()) || [1, 0, 0, 1, 0, 0]; this.m = (m && m.slice()) || [1, 0, 0, 1, 0, 0];
}; };
Konva.Transform.prototype = { Konva.Transform.prototype = {
/** /**
* Copy Konva.Transform object * Copy Konva.Transform object
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
copy: function() { copy: function() {
return new Konva.Transform(this.m); return new Konva.Transform(this.m);
}, },
/** /**
* Transform point * Transform point
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Object} point 2D point(x, y) * @param {Object} point 2D point(x, y)
* @returns {Object} 2D point(x, y) * @returns {Object} 2D point(x, y)
*/ */
point: function(point) { point: function(point) {
var m = this.m; var m = this.m;
return { return {
@ -141,26 +141,26 @@
}; };
}, },
/** /**
* Apply translation * Apply translation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} x * @param {Number} x
* @param {Number} y * @param {Number} y
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
translate: function(x, y) { translate: function(x, y) {
this.m[4] += this.m[0] * x + this.m[2] * y; this.m[4] += this.m[0] * x + this.m[2] * y;
this.m[5] += this.m[1] * x + this.m[3] * y; this.m[5] += this.m[1] * x + this.m[3] * y;
return this; return this;
}, },
/** /**
* Apply scale * Apply scale
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} sx * @param {Number} sx
* @param {Number} sy * @param {Number} sy
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
scale: function(sx, sy) { scale: function(sx, sy) {
this.m[0] *= sx; this.m[0] *= sx;
this.m[1] *= sx; this.m[1] *= sx;
@ -169,12 +169,12 @@
return this; return this;
}, },
/** /**
* Apply rotation * Apply rotation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} rad Angle in radians * @param {Number} rad Angle in radians
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
rotate: function(rad) { rotate: function(rad) {
var c = Math.cos(rad); var c = Math.cos(rad);
var s = Math.sin(rad); var s = Math.sin(rad);
@ -189,11 +189,11 @@
return this; return this;
}, },
/** /**
* Returns the translation * Returns the translation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Object} 2D point(x, y) * @returns {Object} 2D point(x, y)
*/ */
getTranslation: function() { getTranslation: function() {
return { return {
x: this.m[4], x: this.m[4],
@ -201,13 +201,13 @@
}; };
}, },
/** /**
* Apply skew * Apply skew
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Number} sx * @param {Number} sx
* @param {Number} sy * @param {Number} sy
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
skew: function(sx, sy) { skew: function(sx, sy) {
var m11 = this.m[0] + this.m[2] * sy; var m11 = this.m[0] + this.m[2] * sy;
var m12 = this.m[1] + this.m[3] * sy; var m12 = this.m[1] + this.m[3] * sy;
@ -220,12 +220,12 @@
return this; return this;
}, },
/** /**
* Transform multiplication * Transform multiplication
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @param {Konva.Transform} matrix * @param {Konva.Transform} matrix
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
multiply: function(matrix) { multiply: function(matrix) {
var m11 = this.m[0] * matrix.m[0] + this.m[2] * matrix.m[1]; var m11 = this.m[0] * matrix.m[0] + this.m[2] * matrix.m[1];
var m12 = this.m[1] * matrix.m[0] + this.m[3] * matrix.m[1]; var m12 = this.m[1] * matrix.m[0] + this.m[3] * matrix.m[1];
@ -245,11 +245,11 @@
return this; return this;
}, },
/** /**
* Invert the matrix * Invert the matrix
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Konva.Transform} * @returns {Konva.Transform}
*/ */
invert: function() { invert: function() {
var d = 1 / (this.m[0] * this.m[3] - this.m[1] * this.m[2]); var d = 1 / (this.m[0] * this.m[3] - this.m[1] * this.m[2]);
var m0 = this.m[3] * d; var m0 = this.m[3] * d;
@ -267,20 +267,20 @@
return this; return this;
}, },
/** /**
* return matrix * return matrix
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
*/ */
getMatrix: function() { getMatrix: function() {
return this.m; return this.m;
}, },
/** /**
* set to absolute position via translation * set to absolute position via translation
* @method * @method
* @memberof Konva.Transform.prototype * @memberof Konva.Transform.prototype
* @returns {Konva.Transform} * @returns {Konva.Transform}
* @author ericdrowell * @author ericdrowell
*/ */
setAbsolutePosition: function(x, y) { setAbsolutePosition: function(x, y) {
var m0 = this.m[0], var m0 = this.m[0],
m1 = this.m[1], m1 = this.m[1],
@ -462,13 +462,13 @@
RGB_REGEX = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/; RGB_REGEX = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/;
/** /**
* @namespace Util * @namespace Util
* @memberof Konva * @memberof Konva
*/ */
Konva.Util = { Konva.Util = {
/* /*
* cherry-picked utilities from underscore.js * cherry-picked utilities from underscore.js
*/ */
_isElement: function(obj) { _isElement: function(obj) {
return !!(obj && obj.nodeType == 1); return !!(obj && obj.nodeType == 1);
}, },
@ -487,59 +487,6 @@
_isString: function(obj) { _isString: function(obj) {
return Object.prototype.toString.call(obj) === OBJECT_STRING; return Object.prototype.toString.call(obj) === OBJECT_STRING;
}, },
// Returns a function, that, when invoked, will only be triggered at most once
// during a given window of time. Normally, the throttled function will run
// as much as it can, without ever going more than once per `wait` duration;
// but if you'd like to disable the execution on the leading edge, pass
// `{leading: false}`. To disable execution on the trailing edge, ditto.
_throttle: function(func, wait, opts) {
var context, args, result;
var timeout = null;
var previous = 0;
var options = opts || {};
var later = function() {
previous = options.leading === false ? 0 : new Date().getTime();
timeout = null;
result = func.apply(context, args);
context = args = null;
};
return function() {
var now = new Date().getTime();
if (!previous && options.leading === false) {
previous = now;
}
var remaining = wait - (now - previous);
context = this;
args = arguments;
if (remaining <= 0) {
clearTimeout(timeout);
timeout = null;
previous = now;
result = func.apply(context, args);
context = args = null;
} else if (!timeout && options.trailing !== false) {
timeout = setTimeout(later, remaining);
}
return result;
};
},
/*
* other utils
*/
_hasMethods: function(obj) {
var names = [],
key;
for (key in obj) {
if (!obj.hasOwnProperty(key)) {
continue;
}
if (this._isFunction(obj[key])) {
names.push(key);
}
}
return names.length > 0;
},
isValidSelector: function(selector) { isValidSelector: function(selector) {
if (typeof selector !== 'string') { if (typeof selector !== 'string') {
return false; return false;
@ -590,8 +537,8 @@
return retArr; return retArr;
}, },
/* /*
* arg can be an image object or image data * arg can be an image object or image data
*/ */
_getImage: function(arg, callback) { _getImage: function(arg, callback) {
var imageObj, canvas; var imageObj, canvas;
@ -643,10 +590,10 @@
}; };
}, },
/** /**
* return random hex color * return random hex color
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
*/ */
getRandomColor: function() { getRandomColor: function() {
var randColor = ((Math.random() * 0xffffff) << 0).toString(16); var randColor = ((Math.random() * 0xffffff) << 0).toString(16);
while (randColor.length < 6) { while (randColor.length < 6) {
@ -655,10 +602,10 @@
return HASH + randColor; return HASH + randColor;
}, },
/** /**
* return value with default fallback * return value with default fallback
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
*/ */
get: function(val, def) { get: function(val, def) {
if (val === undefined) { if (val === undefined) {
return def; return def;
@ -667,16 +614,16 @@
} }
}, },
/** /**
* get RGB components of a color * get RGB components of a color
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
* @param {String} color * @param {String} color
* @example * @example
* // each of the following examples return {r:0, g:0, b:255} * // each of the following examples return {r:0, g:0, b:255}
* var rgb = Konva.Util.getRGB('blue'); * var rgb = Konva.Util.getRGB('blue');
* var rgb = Konva.Util.getRGB('#0000ff'); * var rgb = Konva.Util.getRGB('#0000ff');
* var rgb = Konva.Util.getRGB('rgb(0,0,255)'); * var rgb = Konva.Util.getRGB('rgb(0,0,255)');
*/ */
getRGB: function(color) { getRGB: function(color) {
var rgb; var rgb;
// color string // color string
@ -792,6 +739,19 @@
} }
return retObj; return retObj;
}, },
/**
* check intersection of two client rectangles
* @method
* @memberof Konva.Util.prototype
*/
haveIntersection: function(r1, r2) {
return !(
r2.x > r1.x + r1.width ||
r2.x + r2.width < r1.x ||
r2.y > r1.y + r1.height ||
r2.y + r2.height < r1.y
);
},
cloneObject: function(obj) { cloneObject: function(obj) {
var retObj = {}; var retObj = {};
for (var key in obj) { for (var key in obj) {
@ -849,12 +809,12 @@
child.super = parent; child.super = parent;
}, },
/** /**
* adds methods to a constructor prototype * adds methods to a constructor prototype
* @method * @method
* @memberof Konva.Util.prototype * @memberof Konva.Util.prototype
* @param {Function} constructor * @param {Function} constructor
* @param {Object} methods * @param {Object} methods
*/ */
addMethods: function(constructor, methods) { addMethods: function(constructor, methods) {
var key; var key;

9
src/shapes/Transformer.js
View File

@ -34,6 +34,8 @@
'bottom-right' 'bottom-right'
]; ];
var warningShowed = false;
Konva.Transformer.prototype = { Konva.Transformer.prototype = {
_centroid: false, _centroid: false,
____init: function(config) { ____init: function(config) {
@ -47,6 +49,13 @@
// update transformer data for certain attr changes // update transformer data for certain attr changes
this.on(ATTR_CHANGE_LIST, this._update); this.on(ATTR_CHANGE_LIST, this._update);
if (!warningShowed) {
Konva.Util.warn(
'Konva.Transformer is currently experimental and may have many bugs. Please report any bugs to GitHub repo.'
);
warningShowed = true;
}
}, },
attachTo: function(node) { attachTo: function(node) {