fabric 5.1.0 → 5.2.1-browser
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/HEADER.js +1 -1
- package/dist/fabric.js +39 -29
- package/dist/fabric.min.js +1 -1
- package/lib/event.js +2 -2
- package/package.json +88 -90
- package/src/canvas.class.js +9 -1
- package/src/mixins/animation.mixin.js +2 -2
- package/src/mixins/eraser_brush.mixin.js +4 -0
- package/src/parser.js +3 -4
- package/src/shapes/object.class.js +7 -8
- package/src/shapes/path.class.js +1 -4
- package/src/static_canvas.class.js +15 -8
- package/src/util/misc.js +1 -1
package/HEADER.js
CHANGED
package/dist/fabric.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* build: `node build.js modules=ALL exclude=gestures,accessors,erasing requirejs minifier=uglifyjs` */
|
|
2
2
|
/*! Fabric.js Copyright 2008-2015, Printio (Juriy Zaytsev, Maxim Chernyak) */
|
|
3
3
|
|
|
4
|
-
var fabric = fabric || { version: '5.1
|
|
4
|
+
var fabric = fabric || { version: '5.2.1' };
|
|
5
5
|
if (typeof exports !== 'undefined') {
|
|
6
6
|
exports.fabric = fabric;
|
|
7
7
|
}
|
|
@@ -1304,7 +1304,7 @@ fabric.CommonMethods = {
|
|
|
1304
1304
|
* @return {Array} properties Properties names to include
|
|
1305
1305
|
*/
|
|
1306
1306
|
populateWithProperties: function(source, destination, properties) {
|
|
1307
|
-
if (properties &&
|
|
1307
|
+
if (properties && Array.isArray(properties)) {
|
|
1308
1308
|
for (var i = 0, len = properties.length; i < len; i++) {
|
|
1309
1309
|
if (properties[i] in source) {
|
|
1310
1310
|
destination[properties[i]] = source[properties[i]];
|
|
@@ -4382,8 +4382,7 @@ fabric.warn = console.warn;
|
|
|
4382
4382
|
}
|
|
4383
4383
|
|
|
4384
4384
|
function normalizeValue(attr, value, parentAttributes, fontSize) {
|
|
4385
|
-
var isArray =
|
|
4386
|
-
parsed;
|
|
4385
|
+
var isArray = Array.isArray(value), parsed;
|
|
4387
4386
|
|
|
4388
4387
|
if ((attr === 'fill' || attr === 'stroke') && value === 'none') {
|
|
4389
4388
|
value = '';
|
|
@@ -4781,7 +4780,7 @@ fabric.warn = console.warn;
|
|
|
4781
4780
|
return;
|
|
4782
4781
|
}
|
|
4783
4782
|
|
|
4784
|
-
var xlink = xlinkAttribute.
|
|
4783
|
+
var xlink = xlinkAttribute.slice(1),
|
|
4785
4784
|
x = el.getAttribute('x') || 0,
|
|
4786
4785
|
y = el.getAttribute('y') || 0,
|
|
4787
4786
|
el2 = elementById(doc, xlink).cloneNode(true),
|
|
@@ -5053,7 +5052,7 @@ fabric.warn = console.warn;
|
|
|
5053
5052
|
function recursivelyParseGradientsXlink(doc, gradient) {
|
|
5054
5053
|
var gradientsAttrs = ['gradientTransform', 'x1', 'x2', 'y1', 'y2', 'gradientUnits', 'cx', 'cy', 'r', 'fx', 'fy'],
|
|
5055
5054
|
xlinkAttr = 'xlink:href',
|
|
5056
|
-
xLink = gradient.getAttribute(xlinkAttr).
|
|
5055
|
+
xLink = gradient.getAttribute(xlinkAttr).slice(1),
|
|
5057
5056
|
referencedGradient = elementById(doc, xLink);
|
|
5058
5057
|
if (referencedGradient && referencedGradient.getAttribute(xlinkAttr)) {
|
|
5059
5058
|
recursivelyParseGradientsXlink(doc, referencedGradient);
|
|
@@ -9793,6 +9792,7 @@ fabric.ElementsParser = function(elements, callback, options, reviver, parsingOp
|
|
|
9793
9792
|
* Returns coordinates of a center of canvas.
|
|
9794
9793
|
* Returned value is an object with top and left properties
|
|
9795
9794
|
* @return {Object} object with "top" and "left" number values
|
|
9795
|
+
* @deprecated migrate to `getCenterPoint`
|
|
9796
9796
|
*/
|
|
9797
9797
|
getCenter: function () {
|
|
9798
9798
|
return {
|
|
@@ -9801,13 +9801,21 @@ fabric.ElementsParser = function(elements, callback, options, reviver, parsingOp
|
|
|
9801
9801
|
};
|
|
9802
9802
|
},
|
|
9803
9803
|
|
|
9804
|
+
/**
|
|
9805
|
+
* Returns coordinates of a center of canvas.
|
|
9806
|
+
* @return {fabric.Point}
|
|
9807
|
+
*/
|
|
9808
|
+
getCenterPoint: function () {
|
|
9809
|
+
return new fabric.Point(this.width / 2, this.height / 2);
|
|
9810
|
+
},
|
|
9811
|
+
|
|
9804
9812
|
/**
|
|
9805
9813
|
* Centers object horizontally in the canvas
|
|
9806
9814
|
* @param {fabric.Object} object Object to center horizontally
|
|
9807
9815
|
* @return {fabric.Canvas} thisArg
|
|
9808
9816
|
*/
|
|
9809
9817
|
centerObjectH: function (object) {
|
|
9810
|
-
return this._centerObject(object, new fabric.Point(this.
|
|
9818
|
+
return this._centerObject(object, new fabric.Point(this.getCenterPoint().x, object.getCenterPoint().y));
|
|
9811
9819
|
},
|
|
9812
9820
|
|
|
9813
9821
|
/**
|
|
@@ -9817,7 +9825,7 @@ fabric.ElementsParser = function(elements, callback, options, reviver, parsingOp
|
|
|
9817
9825
|
* @chainable
|
|
9818
9826
|
*/
|
|
9819
9827
|
centerObjectV: function (object) {
|
|
9820
|
-
return this._centerObject(object, new fabric.Point(object.getCenterPoint().x, this.
|
|
9828
|
+
return this._centerObject(object, new fabric.Point(object.getCenterPoint().x, this.getCenterPoint().y));
|
|
9821
9829
|
},
|
|
9822
9830
|
|
|
9823
9831
|
/**
|
|
@@ -9827,9 +9835,8 @@ fabric.ElementsParser = function(elements, callback, options, reviver, parsingOp
|
|
|
9827
9835
|
* @chainable
|
|
9828
9836
|
*/
|
|
9829
9837
|
centerObject: function(object) {
|
|
9830
|
-
var center = this.
|
|
9831
|
-
|
|
9832
|
-
return this._centerObject(object, new fabric.Point(center.left, center.top));
|
|
9838
|
+
var center = this.getCenterPoint();
|
|
9839
|
+
return this._centerObject(object, center);
|
|
9833
9840
|
},
|
|
9834
9841
|
|
|
9835
9842
|
/**
|
|
@@ -9840,7 +9847,6 @@ fabric.ElementsParser = function(elements, callback, options, reviver, parsingOp
|
|
|
9840
9847
|
*/
|
|
9841
9848
|
viewportCenterObject: function(object) {
|
|
9842
9849
|
var vpCenter = this.getVpCenter();
|
|
9843
|
-
|
|
9844
9850
|
return this._centerObject(object, vpCenter);
|
|
9845
9851
|
},
|
|
9846
9852
|
|
|
@@ -9874,9 +9880,9 @@ fabric.ElementsParser = function(elements, callback, options, reviver, parsingOp
|
|
|
9874
9880
|
* @chainable
|
|
9875
9881
|
*/
|
|
9876
9882
|
getVpCenter: function() {
|
|
9877
|
-
var center = this.
|
|
9883
|
+
var center = this.getCenterPoint(),
|
|
9878
9884
|
iVpt = invertTransform(this.viewportTransform);
|
|
9879
|
-
return transformPoint(
|
|
9885
|
+
return transformPoint(center, iVpt);
|
|
9880
9886
|
},
|
|
9881
9887
|
|
|
9882
9888
|
/**
|
|
@@ -12033,7 +12039,7 @@ fabric.PatternBrush = fabric.util.createClass(fabric.PencilBrush, /** @lends fab
|
|
|
12033
12039
|
_isSelectionKeyPressed: function(e) {
|
|
12034
12040
|
var selectionKeyPressed = false;
|
|
12035
12041
|
|
|
12036
|
-
if (
|
|
12042
|
+
if (Array.isArray(this.selectionKey)) {
|
|
12037
12043
|
selectionKeyPressed = !!this.selectionKey.find(function(key) { return e[key] === true; });
|
|
12038
12044
|
}
|
|
12039
12045
|
else {
|
|
@@ -12459,6 +12465,14 @@ fabric.PatternBrush = fabric.util.createClass(fabric.PencilBrush, /** @lends fab
|
|
|
12459
12465
|
this.contextTop = upperCanvasEl.getContext('2d');
|
|
12460
12466
|
},
|
|
12461
12467
|
|
|
12468
|
+
/**
|
|
12469
|
+
* Returns context of top canvas where interactions are drawn
|
|
12470
|
+
* @returns {CanvasRenderingContext2D}
|
|
12471
|
+
*/
|
|
12472
|
+
getTopContext: function () {
|
|
12473
|
+
return this.contextTop;
|
|
12474
|
+
},
|
|
12475
|
+
|
|
12462
12476
|
/**
|
|
12463
12477
|
* @private
|
|
12464
12478
|
*/
|
|
@@ -15236,11 +15250,9 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
15236
15250
|
if (object[prop] === prototype[prop]) {
|
|
15237
15251
|
delete object[prop];
|
|
15238
15252
|
}
|
|
15239
|
-
var isArray = Object.prototype.toString.call(object[prop]) === '[object Array]' &&
|
|
15240
|
-
Object.prototype.toString.call(prototype[prop]) === '[object Array]';
|
|
15241
|
-
|
|
15242
15253
|
// basically a check for [] === []
|
|
15243
|
-
if (isArray
|
|
15254
|
+
if (Array.isArray(object[prop]) && Array.isArray(prototype[prop])
|
|
15255
|
+
&& object[prop].length === 0 && prototype[prop].length === 0) {
|
|
15244
15256
|
delete object[prop];
|
|
15245
15257
|
}
|
|
15246
15258
|
});
|
|
@@ -15416,7 +15428,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
15416
15428
|
|
|
15417
15429
|
renderCache: function(options) {
|
|
15418
15430
|
options = options || {};
|
|
15419
|
-
if (!this._cacheCanvas) {
|
|
15431
|
+
if (!this._cacheCanvas || !this._cacheContext) {
|
|
15420
15432
|
this._createCacheCanvas();
|
|
15421
15433
|
}
|
|
15422
15434
|
if (this.isCacheDirty()) {
|
|
@@ -15431,6 +15443,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
15431
15443
|
*/
|
|
15432
15444
|
_removeCacheCanvas: function() {
|
|
15433
15445
|
this._cacheCanvas = null;
|
|
15446
|
+
this._cacheContext = null;
|
|
15434
15447
|
this.cacheWidth = 0;
|
|
15435
15448
|
this.cacheHeight = 0;
|
|
15436
15449
|
},
|
|
@@ -15589,7 +15602,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
15589
15602
|
if (this.isNotVisible()) {
|
|
15590
15603
|
return false;
|
|
15591
15604
|
}
|
|
15592
|
-
if (this._cacheCanvas && !skipCanvas && this._updateCacheCanvas()) {
|
|
15605
|
+
if (this._cacheCanvas && this._cacheContext && !skipCanvas && this._updateCacheCanvas()) {
|
|
15593
15606
|
// in this case the context is already cleared.
|
|
15594
15607
|
return true;
|
|
15595
15608
|
}
|
|
@@ -15598,7 +15611,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
15598
15611
|
(this.clipPath && this.clipPath.absolutePositioned) ||
|
|
15599
15612
|
(this.statefullCache && this.hasStateChanged('cacheProperties'))
|
|
15600
15613
|
) {
|
|
15601
|
-
if (this._cacheCanvas && !skipCanvas) {
|
|
15614
|
+
if (this._cacheCanvas && this._cacheContext && !skipCanvas) {
|
|
15602
15615
|
var width = this.cacheWidth / this.zoomX;
|
|
15603
15616
|
var height = this.cacheHeight / this.zoomY;
|
|
15604
15617
|
this._cacheContext.clearRect(-width / 2, -height / 2, width, height);
|
|
@@ -16132,7 +16145,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
16132
16145
|
* @return {Boolean}
|
|
16133
16146
|
*/
|
|
16134
16147
|
isType: function(type) {
|
|
16135
|
-
return this.type === type;
|
|
16148
|
+
return arguments.length > 1 ? Array.from(arguments).includes(this.type) : this.type === type;
|
|
16136
16149
|
},
|
|
16137
16150
|
|
|
16138
16151
|
/**
|
|
@@ -18070,7 +18083,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
18070
18083
|
return fabric.util.animate({
|
|
18071
18084
|
target: this,
|
|
18072
18085
|
startValue: object.left,
|
|
18073
|
-
endValue: this.
|
|
18086
|
+
endValue: this.getCenterPoint().x,
|
|
18074
18087
|
duration: this.FX_DURATION,
|
|
18075
18088
|
onChange: function(value) {
|
|
18076
18089
|
object.set('left', value);
|
|
@@ -18103,7 +18116,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
|
|
|
18103
18116
|
return fabric.util.animate({
|
|
18104
18117
|
target: this,
|
|
18105
18118
|
startValue: object.top,
|
|
18106
|
-
endValue: this.
|
|
18119
|
+
endValue: this.getCenterPoint().y,
|
|
18107
18120
|
duration: this.FX_DURATION,
|
|
18108
18121
|
onChange: function(value) {
|
|
18109
18122
|
object.set('top', value);
|
|
@@ -19642,7 +19655,6 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
|
|
|
19642
19655
|
max = fabric.util.array.max,
|
|
19643
19656
|
extend = fabric.util.object.extend,
|
|
19644
19657
|
clone = fabric.util.object.clone,
|
|
19645
|
-
_toString = Object.prototype.toString,
|
|
19646
19658
|
toFixed = fabric.util.toFixed;
|
|
19647
19659
|
|
|
19648
19660
|
if (fabric.Path) {
|
|
@@ -19696,10 +19708,8 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
|
|
|
19696
19708
|
* @param {Object} [options] Options object
|
|
19697
19709
|
*/
|
|
19698
19710
|
_setPath: function (path, options) {
|
|
19699
|
-
var fromArray = _toString.call(path) === '[object Array]';
|
|
19700
|
-
|
|
19701
19711
|
this.path = fabric.util.makePathSimpler(
|
|
19702
|
-
|
|
19712
|
+
Array.isArray(path) ? path : fabric.util.parsePath(path)
|
|
19703
19713
|
);
|
|
19704
19714
|
|
|
19705
19715
|
fabric.Polyline.prototype._setPositionDimensions.call(this, options || {});
|