@leapfrog/interactive-canvas 2.0.13 → 2.0.15-beta-0

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.
@@ -1,29 +1,28 @@
1
- import * as _ from 'lodash';
2
- import { round, each, values, reduce, clone, replace, find, isEqual } from 'lodash';
1
+ import _, { round, each, values, reduce, clone, isEqual } from 'lodash';
3
2
  import { oc } from 'ts-optchain';
4
3
  import { BehaviorSubject, Subject } from 'rxjs';
5
4
  import { fabric } from 'fabric';
6
5
 
7
- var PIXELS_PER_MM = 3.937;
6
+ var PIXELS_PER_MM$2 = 3.937;
8
7
  var MillimeterDimensions = /** @class */ (function () {
9
8
  function MillimeterDimensions(width, height) {
10
9
  this.widthUnit = "mm";
11
10
  this.heightUnit = "mm";
12
11
  this.width = width;
13
12
  this.widthMm = Math.max(0, width);
14
- this.widthPx = round(this.widthMm * PIXELS_PER_MM);
13
+ this.widthPx = round(this.widthMm * PIXELS_PER_MM$2);
15
14
  this.height = height;
16
15
  this.heightMm = Math.max(0, height);
17
- this.heightPx = round(this.heightMm * PIXELS_PER_MM);
16
+ this.heightPx = round(this.heightMm * PIXELS_PER_MM$2);
18
17
  }
19
18
  MillimeterDimensions.prototype.withSize = function (width, height) {
20
19
  return new MillimeterDimensions(width, height);
21
20
  };
22
21
  MillimeterDimensions.prototype.widthPxToMm = function (px) {
23
- return px / PIXELS_PER_MM;
22
+ return px / PIXELS_PER_MM$2;
24
23
  };
25
24
  MillimeterDimensions.prototype.heightPxToMm = function (px) {
26
- return px / PIXELS_PER_MM;
25
+ return px / PIXELS_PER_MM$2;
27
26
  };
28
27
  return MillimeterDimensions;
29
28
  }());
@@ -49,8 +48,8 @@ var PixelCanvasDimensions = /** @class */ (function () {
49
48
  return PixelCanvasDimensions;
50
49
  }());
51
50
 
52
- var COLUMN_WIDTH_MM = 41;
53
- var GUTTER_WIDTH_MM = 3;
51
+ var COLUMN_WIDTH_MM$1 = 41;
52
+ var GUTTER_WIDTH_MM$1 = 3;
54
53
  var PIXELS_PER_MM$1 = 3.937;
55
54
  var Print6ColCanvasDimensions = /** @class */ (function () {
56
55
  function Print6ColCanvasDimensions(width, height) {
@@ -58,13 +57,14 @@ var Print6ColCanvasDimensions = /** @class */ (function () {
58
57
  this.heightUnit = "cm";
59
58
  this.width = width;
60
59
  this.gutterCount = Math.max(0, width - 1);
61
- this.gutterTotalMm = this.gutterCount * GUTTER_WIDTH_MM;
62
- this.columnsTotalMm = width * COLUMN_WIDTH_MM;
60
+ this.gutterTotalMm = this.gutterCount * GUTTER_WIDTH_MM$1;
61
+ this.columnsTotalMm = width * COLUMN_WIDTH_MM$1;
63
62
  this.widthMm = Math.max(0, this.columnsTotalMm + this.gutterTotalMm);
64
63
  this.widthPx = round(this.widthMm * PIXELS_PER_MM$1);
65
64
  this.height = height;
66
65
  this.heightMm = Math.max(0, height * 10);
67
66
  this.heightPx = round(this.heightMm * PIXELS_PER_MM$1);
67
+ console.log("interactive canvas");
68
68
  }
69
69
  Print6ColCanvasDimensions.prototype.withSize = function (width, height) {
70
70
  return new Print6ColCanvasDimensions(width, height);
@@ -78,110 +78,119 @@ var Print6ColCanvasDimensions = /** @class */ (function () {
78
78
  return Print6ColCanvasDimensions;
79
79
  }());
80
80
 
81
- var COLUMN_WIDTH_MM$1 = 30.8772;
82
- var GUTTER_WIDTH_MM$1 = 2.1053;
83
- var PIXELS_PER_MM$2 = 3.937;
81
+ var COLUMN_WIDTH_MM = 30.8772;
82
+ var GUTTER_WIDTH_MM = 2.1053;
83
+ var PIXELS_PER_MM = 3.937;
84
84
  var Print8ColCanvasDimensions = /** @class */ (function () {
85
85
  function Print8ColCanvasDimensions(width, height) {
86
86
  this.widthUnit = "column(s)";
87
87
  this.heightUnit = "cm";
88
88
  this.width = width;
89
89
  this.gutterCount = Math.max(0, width - 1);
90
- this.gutterTotalMm = this.gutterCount * GUTTER_WIDTH_MM$1;
91
- this.columnsTotalMm = width * COLUMN_WIDTH_MM$1;
90
+ this.gutterTotalMm = this.gutterCount * GUTTER_WIDTH_MM;
91
+ this.columnsTotalMm = width * COLUMN_WIDTH_MM;
92
92
  this.widthMm = Math.max(0, this.columnsTotalMm + this.gutterTotalMm);
93
- this.widthPx = round(this.widthMm * PIXELS_PER_MM$2);
93
+ this.widthPx = round(this.widthMm * PIXELS_PER_MM);
94
94
  this.height = height;
95
95
  this.heightMm = Math.max(0, height * 10);
96
- this.heightPx = round(this.heightMm * PIXELS_PER_MM$2);
96
+ this.heightPx = round(this.heightMm * PIXELS_PER_MM);
97
97
  }
98
98
  Print8ColCanvasDimensions.prototype.withSize = function (width, height) {
99
99
  return new Print8ColCanvasDimensions(width, height);
100
100
  };
101
101
  Print8ColCanvasDimensions.prototype.widthPxToMm = function (px) {
102
- return px / PIXELS_PER_MM$2;
102
+ return px / PIXELS_PER_MM;
103
103
  };
104
104
  Print8ColCanvasDimensions.prototype.heightPxToMm = function (px) {
105
- return px / PIXELS_PER_MM$2;
105
+ return px / PIXELS_PER_MM;
106
106
  };
107
107
  return Print8ColCanvasDimensions;
108
108
  }());
109
109
 
110
- /*! *****************************************************************************
111
- Copyright (c) Microsoft Corporation.
112
-
113
- Permission to use, copy, modify, and/or distribute this software for any
114
- purpose with or without fee is hereby granted.
115
-
116
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
117
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
118
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
119
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
120
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
121
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
122
- PERFORMANCE OF THIS SOFTWARE.
123
- ***************************************************************************** */
124
- /* global Reflect, Promise */
125
-
126
- var extendStatics = function(d, b) {
127
- extendStatics = Object.setPrototypeOf ||
128
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
129
- function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
130
- return extendStatics(d, b);
110
+ /******************************************************************************
111
+ Copyright (c) Microsoft Corporation.
112
+
113
+ Permission to use, copy, modify, and/or distribute this software for any
114
+ purpose with or without fee is hereby granted.
115
+
116
+ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
117
+ REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
118
+ AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
119
+ INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
120
+ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
121
+ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
122
+ PERFORMANCE OF THIS SOFTWARE.
123
+ ***************************************************************************** */
124
+ /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
125
+
126
+ var extendStatics = function(d, b) {
127
+ extendStatics = Object.setPrototypeOf ||
128
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
129
+ function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
130
+ return extendStatics(d, b);
131
+ };
132
+
133
+ function __extends(d, b) {
134
+ if (typeof b !== "function" && b !== null)
135
+ throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
136
+ extendStatics(d, b);
137
+ function __() { this.constructor = d; }
138
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
139
+ }
140
+
141
+ function __awaiter(thisArg, _arguments, P, generator) {
142
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
143
+ return new (P || (P = Promise))(function (resolve, reject) {
144
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
145
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
146
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
147
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
148
+ });
149
+ }
150
+
151
+ function __generator(thisArg, body) {
152
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
153
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
154
+ function verb(n) { return function (v) { return step([n, v]); }; }
155
+ function step(op) {
156
+ if (f) throw new TypeError("Generator is already executing.");
157
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
158
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
159
+ if (y = 0, t) op = [op[0] & 2, t.value];
160
+ switch (op[0]) {
161
+ case 0: case 1: t = op; break;
162
+ case 4: _.label++; return { value: op[1], done: false };
163
+ case 5: _.label++; y = op[1]; op = [0]; continue;
164
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
165
+ default:
166
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
167
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
168
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
169
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
170
+ if (t[2]) _.ops.pop();
171
+ _.trys.pop(); continue;
172
+ }
173
+ op = body.call(thisArg, _);
174
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
175
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
176
+ }
177
+ }
178
+
179
+ function __spreadArray(to, from, pack) {
180
+ if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
181
+ if (ar || !(i in from)) {
182
+ if (!ar) ar = Array.prototype.slice.call(from, 0, i);
183
+ ar[i] = from[i];
184
+ }
185
+ }
186
+ return to.concat(ar || Array.prototype.slice.call(from));
187
+ }
188
+
189
+ typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
190
+ var e = new Error(message);
191
+ return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
131
192
  };
132
193
 
133
- function __extends(d, b) {
134
- extendStatics(d, b);
135
- function __() { this.constructor = d; }
136
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
137
- }
138
-
139
- function __awaiter(thisArg, _arguments, P, generator) {
140
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
141
- return new (P || (P = Promise))(function (resolve, reject) {
142
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
143
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
144
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
145
- step((generator = generator.apply(thisArg, _arguments || [])).next());
146
- });
147
- }
148
-
149
- function __generator(thisArg, body) {
150
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
151
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
152
- function verb(n) { return function (v) { return step([n, v]); }; }
153
- function step(op) {
154
- if (f) throw new TypeError("Generator is already executing.");
155
- while (_) try {
156
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
157
- if (y = 0, t) op = [op[0] & 2, t.value];
158
- switch (op[0]) {
159
- case 0: case 1: t = op; break;
160
- case 4: _.label++; return { value: op[1], done: false };
161
- case 5: _.label++; y = op[1]; op = [0]; continue;
162
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
163
- default:
164
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
165
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
166
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
167
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
168
- if (t[2]) _.ops.pop();
169
- _.trys.pop(); continue;
170
- }
171
- op = body.call(thisArg, _);
172
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
173
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
174
- }
175
- }
176
-
177
- function __spreadArrays() {
178
- for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
179
- for (var r = Array(s), k = 0, i = 0; i < il; i++)
180
- for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
181
- r[k] = a[j];
182
- return r;
183
- }
184
-
185
194
  var Font = /** @class */ (function () {
186
195
  function Font() {
187
196
  }
@@ -284,6 +293,63 @@ var RedrawAllLayoutFunction = /** @class */ (function () {
284
293
  return RedrawAllLayoutFunction;
285
294
  }());
286
295
 
296
+ var RepositionCutoffsLayoutFunction = /** @class */ (function () {
297
+ function RepositionCutoffsLayoutFunction() {
298
+ }
299
+ RepositionCutoffsLayoutFunction.prototype.execute = function (canvas) {
300
+ canvas.getObjectsByTypeInternal(ObjectType.CUTOFF)
301
+ .forEach(function (cutoff) { return cutoff.updatePosition(); });
302
+ };
303
+ return RepositionCutoffsLayoutFunction;
304
+ }());
305
+
306
+ var RepositionBordersLayoutFunction = /** @class */ (function () {
307
+ function RepositionBordersLayoutFunction() {
308
+ }
309
+ RepositionBordersLayoutFunction.prototype.execute = function (canvas) {
310
+ canvas.getObjectsByTypeInternal(ObjectType.BORDER)
311
+ .forEach(function (border) { return border.updatePosition(); });
312
+ };
313
+ return RepositionBordersLayoutFunction;
314
+ }());
315
+
316
+ var PinToBottomLayoutFunction = /** @class */ (function () {
317
+ function PinToBottomLayoutFunction() {
318
+ }
319
+ PinToBottomLayoutFunction.prototype.execute = function (canvas) {
320
+ canvas.getObjectsInternal()
321
+ .forEach(function (object) { return object.moveToPinnedPosition(); });
322
+ };
323
+ return PinToBottomLayoutFunction;
324
+ }());
325
+
326
+ var ResizeCanvasLayoutFunction = /** @class */ (function () {
327
+ function ResizeCanvasLayoutFunction() {
328
+ }
329
+ ResizeCanvasLayoutFunction.prototype.execute = function (canvas) {
330
+ if (canvas.getLayoutManager().isEnforcedPositioning)
331
+ return;
332
+ if (oc(canvas.getDimensionsRestrictions()).fixed(false))
333
+ return;
334
+ var currentDimensions = canvas.getDimensions();
335
+ var baseDimensions = canvas.getBaseDimensions();
336
+ var textHeightIncreasePx = _(canvas.getObjectsByTypeInternal(ObjectType.TEXT))
337
+ .filter(function (text) { return text.isResizeCanvas(); })
338
+ .reduce(function (x, text) { return x + text.getSizeIncreaseSinceCreation(); }, 0);
339
+ var increase = baseDimensions.withSize(currentDimensions.width, 0);
340
+ while (increase.heightPx < textHeightIncreasePx) {
341
+ increase = increase.withSize(increase.width, increase.height + 1);
342
+ }
343
+ var targetHeight = increase.withSize(increase.width, baseDimensions.height + increase.height);
344
+ if (currentDimensions.height !== targetHeight.height) {
345
+ canvas.setDimensions(targetHeight);
346
+ }
347
+ canvas.getObjectsInternal().forEach(function (object) { return object.setCoords(); });
348
+ canvas.redraw();
349
+ };
350
+ return ResizeCanvasLayoutFunction;
351
+ }());
352
+
287
353
  var LayoutManager;
288
354
  (function (LayoutManager) {
289
355
  LayoutManager["LEGACY"] = "LEGACY";
@@ -291,6 +357,45 @@ var LayoutManager;
291
357
  LayoutManager["ADVANCED"] = "ADVANCED";
292
358
  })(LayoutManager || (LayoutManager = {}));
293
359
 
360
+ var RepositionBackgroundsLayoutFunction = /** @class */ (function () {
361
+ function RepositionBackgroundsLayoutFunction() {
362
+ }
363
+ RepositionBackgroundsLayoutFunction.prototype.execute = function (canvas) {
364
+ canvas.getObjectsByTypeInternal(ObjectType.BACKGROUND_IMAGE)
365
+ .forEach(function (border) { return border.updatePosition(); });
366
+ };
367
+ return RepositionBackgroundsLayoutFunction;
368
+ }());
369
+
370
+ var AdvancedLayoutManager = /** @class */ (function (_super) {
371
+ __extends(AdvancedLayoutManager, _super);
372
+ function AdvancedLayoutManager(canvas) {
373
+ var _this = _super.call(this, canvas) || this;
374
+ _this.key = LayoutManager.ADVANCED;
375
+ _this.pinToBottom = new PinToBottomLayoutFunction();
376
+ _this.redrawAll = new RedrawAllLayoutFunction();
377
+ _this.repositionBorders = new RepositionBordersLayoutFunction();
378
+ _this.repositionCutoffs = new RepositionCutoffsLayoutFunction();
379
+ _this.repositionBackgrounds = new RepositionBackgroundsLayoutFunction();
380
+ _this.resizeCanvas = new ResizeCanvasLayoutFunction();
381
+ return _this;
382
+ }
383
+ AdvancedLayoutManager.prototype.onCanvasDimensionsChange = function () {
384
+ this.pinToBottom.execute(this.canvas);
385
+ this.repositionCutoffs.execute(this.canvas);
386
+ this.repositionBorders.execute(this.canvas);
387
+ this.repositionBackgrounds.execute(this.canvas);
388
+ this.redrawAll.execute(this.canvas);
389
+ };
390
+ AdvancedLayoutManager.prototype.onTextChange = function () {
391
+ this.resizeCanvas.execute(this.canvas);
392
+ };
393
+ AdvancedLayoutManager.prototype.onObjectListChange = function () {
394
+ this.redrawAll.execute(this.canvas);
395
+ };
396
+ return AdvancedLayoutManager;
397
+ }(AbstractLayoutManager));
398
+
294
399
  var UpdateObjectDimensionsLayoutFunction = /** @class */ (function () {
295
400
  function UpdateObjectDimensionsLayoutFunction() {
296
401
  }
@@ -459,26 +564,6 @@ var StackObjectsLayoutFunction = /** @class */ (function () {
459
564
  return StackObjectsLayoutFunction;
460
565
  }());
461
566
 
462
- var RepositionBordersLayoutFunction = /** @class */ (function () {
463
- function RepositionBordersLayoutFunction() {
464
- }
465
- RepositionBordersLayoutFunction.prototype.execute = function (canvas) {
466
- canvas.getObjectsByTypeInternal(ObjectType.BORDER)
467
- .forEach(function (border) { return border.updatePosition(); });
468
- };
469
- return RepositionBordersLayoutFunction;
470
- }());
471
-
472
- var RepositionBackgroundsLayoutFunction = /** @class */ (function () {
473
- function RepositionBackgroundsLayoutFunction() {
474
- }
475
- RepositionBackgroundsLayoutFunction.prototype.execute = function (canvas) {
476
- canvas.getObjectsByTypeInternal(ObjectType.BACKGROUND_IMAGE)
477
- .forEach(function (border) { return border.updatePosition(); });
478
- };
479
- return RepositionBackgroundsLayoutFunction;
480
- }());
481
-
482
567
  var StandardLayoutManager = /** @class */ (function (_super) {
483
568
  __extends(StandardLayoutManager, _super);
484
569
  function StandardLayoutManager(canvas) {
@@ -1984,7 +2069,7 @@ var Text = /** @class */ (function (_super) {
1984
2069
  Text.prototype.setBoldRegion = function (start, end, bold) {
1985
2070
  if (bold === void 0) { bold = true; }
1986
2071
  if (start > end)
1987
- throw Error("Bad region specified: [" + start + " - " + end + "]");
2072
+ throw Error("Bad region specified: [".concat(start, " - ").concat(end, "]"));
1988
2073
  for (var i = start; i < end; i++) {
1989
2074
  var style = this.fabricObject.getStyleAtPosition(i, true);
1990
2075
  var font = this.fontLibrary.getFont(style.fontFamily);
@@ -2015,7 +2100,7 @@ var Text = /** @class */ (function (_super) {
2015
2100
  Text.prototype.setItalicRegion = function (start, end, italic) {
2016
2101
  if (italic === void 0) { italic = true; }
2017
2102
  if (start > end)
2018
- throw Error("Bad region specified: [" + start + " - " + end + "]");
2103
+ throw Error("Bad region specified: [".concat(start, " - ").concat(end, "]"));
2019
2104
  this.fabricObject.setSelectionStyles({ fontStyle: italic ? "italic" : "" }, start, end);
2020
2105
  this.redraw();
2021
2106
  };
@@ -2166,7 +2251,7 @@ var Text = /** @class */ (function (_super) {
2166
2251
  if (!this.isBulleted())
2167
2252
  return 0;
2168
2253
  var fontSize = 0;
2169
- each(this.fabricObject._textLines, function (textLine, lineIndex) {
2254
+ _.each(this.fabricObject._textLines, function (textLine, lineIndex) {
2170
2255
  fontSize = Math.max(fontSize, _this_1.fabricObject.getValueOfPropertyAt(lineIndex, 0, "fontSize"));
2171
2256
  });
2172
2257
  return fontSize * 0.6;
@@ -2314,7 +2399,7 @@ var Text = /** @class */ (function (_super) {
2314
2399
  if (this.data.bulleted) {
2315
2400
  var bullets = this.fabricObject["_bullets"];
2316
2401
  delete this.fabricObject["_bullets"];
2317
- each(bullets, function (bullet) { return _this_1.canvas.removeFabricObject(bullet); });
2402
+ _.each(bullets, function (bullet) { return _this_1.canvas.removeFabricObject(bullet); });
2318
2403
  this.fabricObject["objectCaching"] = true;
2319
2404
  }
2320
2405
  };
@@ -2323,7 +2408,7 @@ var Text = /** @class */ (function (_super) {
2323
2408
  if (this.fabricObject._isOrderedList) {
2324
2409
  var markerEntities = this.fabricObject._orderedListMarkerEntities;
2325
2410
  delete this.fabricObject._orderedListMarkerEntities;
2326
- each(markerEntities, function (marker) { return _this_1.canvas.removeFabricObject(marker); });
2411
+ _.each(markerEntities, function (marker) { return _this_1.canvas.removeFabricObject(marker); });
2327
2412
  this.fabricObject["objectCaching"] = true;
2328
2413
  }
2329
2414
  };
@@ -2337,11 +2422,12 @@ var Text = /** @class */ (function (_super) {
2337
2422
  var fabric = this.canvas.fabric;
2338
2423
  this.fabricObject["_render"] = function (ctx) {
2339
2424
  var fabricText = this;
2425
+ console.log('fabricText 123', fabricText);
2340
2426
  if (fabricText["_bullets"]) {
2341
2427
  // Determine list of active bullets
2342
2428
  var currentBullets_1 = fabricText["_bullets"];
2343
2429
  var activeBullets_1 = {};
2344
- each(fabricText._textLines, function (textLine, lineIndex) {
2430
+ _.each(fabricText._textLines, function (textLine, lineIndex) {
2345
2431
  if (textLine.length) {
2346
2432
  // Start of real lines will have offset 0 in styleMap
2347
2433
  var styleMap = fabricText._styleMap[lineIndex];
@@ -2375,13 +2461,13 @@ var Text = /** @class */ (function (_super) {
2375
2461
  var canvas_1 = fabricText.canvas;
2376
2462
  var canvasDirty_1 = false;
2377
2463
  canvas_1.renderOnAddRemove = false;
2378
- each(activeBullets_1, function (bullet) {
2464
+ _.each(activeBullets_1, function (bullet) {
2379
2465
  if (!canvas_1.contains(bullet)) {
2380
2466
  canvas_1.add(bullet);
2381
2467
  canvasDirty_1 = true;
2382
2468
  }
2383
2469
  });
2384
- each(currentBullets_1, function (bullet, key) {
2470
+ _.each(currentBullets_1, function (bullet, key) {
2385
2471
  if (!activeBullets_1[key]) {
2386
2472
  canvas_1.remove(bullet);
2387
2473
  canvasDirty_1 = true;
@@ -2397,7 +2483,7 @@ var Text = /** @class */ (function (_super) {
2397
2483
  if (fabricText._isOrderedList) {
2398
2484
  var existingMarkers_1 = fabricText._orderedListMarkerEntities || [];
2399
2485
  var activeMarkers_1 = [];
2400
- each(fabricText._textLines, function (textLine, lineIndex) {
2486
+ _.each(fabricText._textLines, function (textLine, lineIndex) {
2401
2487
  if (textLine.length) {
2402
2488
  // Start of real lines will have offset 0 in styleMap
2403
2489
  var styleMap = fabricText._styleMap[lineIndex];
@@ -2408,7 +2494,7 @@ var Text = /** @class */ (function (_super) {
2408
2494
  }
2409
2495
  else {
2410
2496
  // Create new marker for this line
2411
- var textbox = new fabric.Textbox(lineIndex + ".", {
2497
+ var textbox = new fabric.Textbox("".concat(lineIndex, "."), {
2412
2498
  left: 0,
2413
2499
  top: 0,
2414
2500
  fill: fabricText.fill,
@@ -2430,7 +2516,7 @@ var Text = /** @class */ (function (_super) {
2430
2516
  var canvas_2 = fabricText.canvas;
2431
2517
  var canvasDirty_2 = false;
2432
2518
  canvas_2.renderOnAddRemove = false;
2433
- each(activeMarkers_1, function (marker) {
2519
+ _.each(activeMarkers_1, function (marker) {
2434
2520
  if (!marker)
2435
2521
  return;
2436
2522
  if (!canvas_2.contains(marker)) {
@@ -2438,7 +2524,7 @@ var Text = /** @class */ (function (_super) {
2438
2524
  canvasDirty_2 = true;
2439
2525
  }
2440
2526
  });
2441
- each(existingMarkers_1, function (marker, key) {
2527
+ _.each(existingMarkers_1, function (marker, key) {
2442
2528
  if (!marker)
2443
2529
  return;
2444
2530
  if (!activeMarkers_1[key]) {
@@ -2507,7 +2593,7 @@ var Text = /** @class */ (function (_super) {
2507
2593
  left: fabricText.left + xOffset,
2508
2594
  top: fabricText.top + yOffset,
2509
2595
  angle: fabricText.angle,
2510
- text: lineNumber + "."
2596
+ text: "".concat(lineNumber, ".")
2511
2597
  });
2512
2598
  }
2513
2599
  originalRenderTextLine.apply(fabricText, [method, ctx, line, left, top, lineIndex]);
@@ -2747,6 +2833,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
2747
2833
  this.devicePixelRatio = devicePixelRatio;
2748
2834
  this.fontLibrary = new FontLibrary();
2749
2835
  this.dimensionChangeRejections$ = new Subject();
2836
+ console.log(" **** Hello world");
2750
2837
  this.IMAGE_CAPTURE_COEFFICIENT = this.calculateImageCaptureCoefficient();
2751
2838
  /**
2752
2839
  * Fabric defaults to only 2 decimal places when saving, which causes havoc on the scaling of large images.
@@ -3342,7 +3429,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3342
3429
  var objectsToLayout = _(this.getObjectsByTypesInternal(ObjectType.TEXT, ObjectType.IMAGE))
3343
3430
  .sortBy(function (x) { return x.getBoundingBox().top; })
3344
3431
  .value();
3345
- var objectsHeight = reduce(objectsToLayout, function (total, element) { return total + element.getBoundingBox().height; }, 0);
3432
+ var objectsHeight = _.reduce(objectsToLayout, function (total, element) { return total + element.getBoundingBox().height; }, 0);
3346
3433
  var workableHeight = canvasHeight - margin.top - margin.bottom;
3347
3434
  var requiredPadding = workableHeight - objectsHeight;
3348
3435
  var spaceBetween = requiredPadding / (objectsToLayout.length - 1);
@@ -3438,6 +3525,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3438
3525
  if (!(canvasState.canvasJson != undefined)) return [3 /*break*/, 2];
3439
3526
  json_1 = JSON.parse(canvasState.canvasJson);
3440
3527
  return [4 /*yield*/, new Promise(function (resolve) {
3528
+ console.log('resolve', resolve);
3441
3529
  _this.fabricCanvas.loadFromJSON(json_1, function () { return resolve(); });
3442
3530
  })];
3443
3531
  case 1:
@@ -3504,7 +3592,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3504
3592
  */
3505
3593
  AbstractInteractiveCanvas.prototype.toImage = function (multiplier) {
3506
3594
  var _this = this;
3507
- console.log("Multiplier in interactive canvas : %s", multiplier);
3595
+ console.log("Multiplier in interactive canvas !!! : %s", multiplier);
3508
3596
  var activeObject = this.fabricCanvas.getActiveObject();
3509
3597
  this.fabricCanvas.discardActiveObject().renderAll();
3510
3598
  var options = {
@@ -3516,7 +3604,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3516
3604
  if (activeObject) {
3517
3605
  this.fabricCanvas.setActiveObject(activeObject);
3518
3606
  }
3519
- return replace(base64, /^data:.*;base64,/, "");
3607
+ return _.replace(base64, /^data:.*;base64,/, "");
3520
3608
  };
3521
3609
  /**
3522
3610
  * @override
@@ -3638,20 +3726,20 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3638
3726
  case ObjectType.BACKGROUND_IMAGE:
3639
3727
  return new BackgroundImage(this, fabricObject, persistedField);
3640
3728
  default:
3641
- throw new Error("Unknown field type: [" + persistedField.type + "]");
3729
+ throw new Error("Unknown field type: [".concat(persistedField.type, "]"));
3642
3730
  }
3643
3731
  };
3644
3732
  AbstractInteractiveCanvas.prototype.findFabricObject = function (id) {
3645
3733
  var objects = this.fabricCanvas.getObjects();
3646
- var fabricObject = find(objects, function (o) { return o.id == id; });
3734
+ var fabricObject = _.find(objects, function (o) { return o.id == id; });
3647
3735
  if (!fabricObject) {
3648
- throw new Error("Cannot find fabric object with id [" + id + "]");
3736
+ throw new Error("Cannot find fabric object with id [".concat(id, "]"));
3649
3737
  }
3650
3738
  return fabricObject;
3651
3739
  };
3652
3740
  AbstractInteractiveCanvas.prototype.findObject = function (id) {
3653
3741
  //Don't use strict compare here. fabric ids are numbers while ad builder ids are strings... mostly.
3654
- return find(this.objects$.value, function (object) { return object.getId() == id; });
3742
+ return _.find(this.objects$.value, function (object) { return object.getId() == id; });
3655
3743
  };
3656
3744
  /**
3657
3745
  * Reset zoom and canvas dimensions to 1:1 scale, execute a function, then return the canvas to
@@ -3689,7 +3777,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3689
3777
  if (!object) {
3690
3778
  return null;
3691
3779
  }
3692
- return find(this.objects$.value, function (field) { return field.getId() == object.id; });
3780
+ return _.find(this.objects$.value, function (field) { return field.getId() == object.id; });
3693
3781
  };
3694
3782
  AbstractInteractiveCanvas.prototype.getFieldsByCanvasObject = function (objects) {
3695
3783
  var _this = this;
@@ -3701,7 +3789,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3701
3789
  AbstractInteractiveCanvas.prototype.calculateImageCaptureCoefficient = function () {
3702
3790
  var precision = 3;
3703
3791
  var devicePixelRatio = this.devicePixelRatio || 1;
3704
- return round(2 / devicePixelRatio, precision);
3792
+ return _.round(2 / devicePixelRatio, precision);
3705
3793
  };
3706
3794
  AbstractInteractiveCanvas.prototype.randomId = function () {
3707
3795
  var min = 0;
@@ -3716,7 +3804,7 @@ var AbstractInteractiveCanvas = /** @class */ (function () {
3716
3804
  .reduce(function (x, y) { return Math.max(x, y); }, 0);
3717
3805
  };
3718
3806
  AbstractInteractiveCanvas.prototype.trackNewObject = function (object) {
3719
- this.objects$.next(__spreadArrays(this.objects$.value, [object]));
3807
+ this.objects$.next(__spreadArray(__spreadArray([], this.objects$.value, true), [object], false));
3720
3808
  };
3721
3809
  AbstractInteractiveCanvas.prototype.dimensionsExceedRestrictions = function (dimensions) {
3722
3810
  var restrictions = this.dimensionRestrictions$.value;
@@ -3737,7 +3825,11 @@ var SelectionData = /** @class */ (function () {
3737
3825
  this.isText = selectedObject
3738
3826
  && selectedObject.getType() === ObjectType.TEXT
3739
3827
  && selectedObject.isEditing();
3828
+ this.event = {};
3740
3829
  }
3830
+ SelectionData.prototype.setEvent = function (event) {
3831
+ this.event = event;
3832
+ };
3741
3833
  return SelectionData;
3742
3834
  }());
3743
3835
 
@@ -3849,9 +3941,9 @@ var InteractiveCanvas = /** @class */ (function (_super) {
3849
3941
  _this.headless = false;
3850
3942
  _this.undoStack = new UndoStack(_this);
3851
3943
  //Initialize watchers
3852
- _this.fabricCanvas.on("selection:updated", function () { return _this.onFabricSelectionChanged(); });
3853
- _this.fabricCanvas.on("selection:created", function () { return _this.onFabricSelectionChanged(); });
3854
- _this.fabricCanvas.on("selection:cleared", function () { return _this.onFabricSelectionChanged(); });
3944
+ _this.fabricCanvas.on("selection:updated", function (event) { return _this.onFabricSelectionChanged(event); });
3945
+ _this.fabricCanvas.on("selection:created", function (event) { return _this.onFabricSelectionChanged(event); });
3946
+ _this.fabricCanvas.on("selection:cleared", function (event) { return _this.onFabricSelectionChanged(event); });
3855
3947
  _this.fabricCanvas.on("text:editing:entered", function () { return _this.onTextEditing(); });
3856
3948
  _this.fabricCanvas.on("text:editing:exited", function () { return _this.onTextEditing(); });
3857
3949
  _this.fabricCanvas.on("text:changed", function () { return _this.onTextChange(); });
@@ -3896,9 +3988,11 @@ var InteractiveCanvas = /** @class */ (function (_super) {
3896
3988
  });
3897
3989
  });
3898
3990
  };
3899
- InteractiveCanvas.prototype.onFabricSelectionChanged = function () {
3991
+ InteractiveCanvas.prototype.onFabricSelectionChanged = function (event) {
3900
3992
  var selected = this.getFieldsByCanvasObject(this.fabricCanvas.getActiveObjects());
3901
- this.selection$.next(new SelectionData(selected));
3993
+ var selection = new SelectionData(selected);
3994
+ selection.setEvent(event);
3995
+ this.selection$.next(selection);
3902
3996
  this.enterTextSelectionModeIfRequired();
3903
3997
  };
3904
3998
  InteractiveCanvas.prototype.enterTextSelectionModeIfRequired = function () {
@@ -3916,80 +4010,4 @@ var InteractiveCanvas = /** @class */ (function (_super) {
3916
4010
  return InteractiveCanvas;
3917
4011
  }(AbstractInteractiveCanvas));
3918
4012
 
3919
- var RepositionCutoffsLayoutFunction = /** @class */ (function () {
3920
- function RepositionCutoffsLayoutFunction() {
3921
- }
3922
- RepositionCutoffsLayoutFunction.prototype.execute = function (canvas) {
3923
- canvas.getObjectsByTypeInternal(ObjectType.CUTOFF)
3924
- .forEach(function (cutoff) { return cutoff.updatePosition(); });
3925
- };
3926
- return RepositionCutoffsLayoutFunction;
3927
- }());
3928
-
3929
- var PinToBottomLayoutFunction = /** @class */ (function () {
3930
- function PinToBottomLayoutFunction() {
3931
- }
3932
- PinToBottomLayoutFunction.prototype.execute = function (canvas) {
3933
- canvas.getObjectsInternal()
3934
- .forEach(function (object) { return object.moveToPinnedPosition(); });
3935
- };
3936
- return PinToBottomLayoutFunction;
3937
- }());
3938
-
3939
- var ResizeCanvasLayoutFunction = /** @class */ (function () {
3940
- function ResizeCanvasLayoutFunction() {
3941
- }
3942
- ResizeCanvasLayoutFunction.prototype.execute = function (canvas) {
3943
- if (canvas.getLayoutManager().isEnforcedPositioning)
3944
- return;
3945
- if (oc(canvas.getDimensionsRestrictions()).fixed(false))
3946
- return;
3947
- var currentDimensions = canvas.getDimensions();
3948
- var baseDimensions = canvas.getBaseDimensions();
3949
- var textHeightIncreasePx = _(canvas.getObjectsByTypeInternal(ObjectType.TEXT))
3950
- .filter(function (text) { return text.isResizeCanvas(); })
3951
- .reduce(function (x, text) { return x + text.getSizeIncreaseSinceCreation(); }, 0);
3952
- var increase = baseDimensions.withSize(currentDimensions.width, 0);
3953
- while (increase.heightPx < textHeightIncreasePx) {
3954
- increase = increase.withSize(increase.width, increase.height + 1);
3955
- }
3956
- var targetHeight = increase.withSize(increase.width, baseDimensions.height + increase.height);
3957
- if (currentDimensions.height !== targetHeight.height) {
3958
- canvas.setDimensions(targetHeight);
3959
- }
3960
- canvas.getObjectsInternal().forEach(function (object) { return object.setCoords(); });
3961
- canvas.redraw();
3962
- };
3963
- return ResizeCanvasLayoutFunction;
3964
- }());
3965
-
3966
- var AdvancedLayoutManager = /** @class */ (function (_super) {
3967
- __extends(AdvancedLayoutManager, _super);
3968
- function AdvancedLayoutManager(canvas) {
3969
- var _this = _super.call(this, canvas) || this;
3970
- _this.key = LayoutManager.ADVANCED;
3971
- _this.pinToBottom = new PinToBottomLayoutFunction();
3972
- _this.redrawAll = new RedrawAllLayoutFunction();
3973
- _this.repositionBorders = new RepositionBordersLayoutFunction();
3974
- _this.repositionCutoffs = new RepositionCutoffsLayoutFunction();
3975
- _this.repositionBackgrounds = new RepositionBackgroundsLayoutFunction();
3976
- _this.resizeCanvas = new ResizeCanvasLayoutFunction();
3977
- return _this;
3978
- }
3979
- AdvancedLayoutManager.prototype.onCanvasDimensionsChange = function () {
3980
- this.pinToBottom.execute(this.canvas);
3981
- this.repositionCutoffs.execute(this.canvas);
3982
- this.repositionBorders.execute(this.canvas);
3983
- this.repositionBackgrounds.execute(this.canvas);
3984
- this.redrawAll.execute(this.canvas);
3985
- };
3986
- AdvancedLayoutManager.prototype.onTextChange = function () {
3987
- this.resizeCanvas.execute(this.canvas);
3988
- };
3989
- AdvancedLayoutManager.prototype.onObjectListChange = function () {
3990
- this.redrawAll.execute(this.canvas);
3991
- };
3992
- return AdvancedLayoutManager;
3993
- }(AbstractLayoutManager));
3994
-
3995
4013
  export { AbstractCanvasObject, AbstractInteractiveCanvas, AbstractLayoutManager, AdvancedLayoutManager, BackgroundImage, Border, CanvasObjectData, Cutoff, DefaultCanvasProfile, Font, FontLibrary, HeadlessInteractiveCanvas, HorizontalRule, Image, ImageType, InteractiveCanvas, LayoutManager, MillimeterDimensions, ObjectType, PixelCanvasDimensions, Print6ColCanvasDimensions, Print8ColCanvasDimensions, Rectangle, RichText, SelectionData, StandardLayoutManager, Text, UNKNOWN_FONT, UnknownFont, VerticalRule, isMutableBackgroundColor, isMutableColor, isMutableImage, isMutablePosition, isMutableStroke, isMutableText, isMutableTextStyle };