@inweb/markup 25.7.10 → 25.8.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.
package/dist/markup.js CHANGED
@@ -12347,31 +12347,37 @@
12347
12347
  },
12348
12348
  Line: {
12349
12349
  name: "Line",
12350
- initializer: (ref) => new KonvaLine(null, ref),
12350
+ initializer: (ref, params = null) => new KonvaLine(params, ref),
12351
+ zIndex: 1,
12351
12352
  },
12352
12353
  Text: {
12353
12354
  name: "Text",
12354
- initializer: (ref) => new KonvaText(null, ref),
12355
+ initializer: (ref, params = null) => new KonvaText(params, ref),
12355
12356
  },
12356
12357
  Rectangle: {
12357
12358
  name: "Rect",
12358
- initializer: (ref) => new KonvaRectangle(null, ref),
12359
+ initializer: (ref, params = null) => new KonvaRectangle(params, ref),
12360
+ zIndex: 1,
12359
12361
  },
12360
12362
  Ellipse: {
12361
12363
  name: "Ellipse",
12362
- initializer: (ref) => new KonvaEllipse(null, ref),
12364
+ initializer: (ref, params = null) => new KonvaEllipse(params, ref),
12365
+ zIndex: 1,
12363
12366
  },
12364
12367
  Arrow: {
12365
12368
  name: "Arrow",
12366
- initializer: (ref) => new KonvaArrow(null, ref),
12369
+ initializer: (ref, params = null) => new KonvaArrow(params, ref),
12370
+ zIndex: 1,
12367
12371
  },
12368
12372
  Image: {
12369
12373
  name: "Image",
12370
- initializer: (ref) => new KonvaImage(null, ref),
12374
+ initializer: (ref, params = null) => new KonvaImage(params, ref),
12375
+ zIndex: 0,
12371
12376
  },
12372
12377
  Cloud: {
12373
12378
  name: "Cloud",
12374
12379
  initializer: (ref) => new KonvaCloud(null, ref),
12380
+ zIndex: 1,
12375
12381
  },
12376
12382
  };
12377
12383
  /**
@@ -12410,7 +12416,7 @@
12410
12416
  this.pan = (event) => {
12411
12417
  const dX = event.dX / window.devicePixelRatio;
12412
12418
  const dY = event.dY / window.devicePixelRatio;
12413
- Object.keys(MarkupMode2Konva).forEach((mode) => this.konvaLayerFind(mode).forEach((ref) => ref.move({ x: dX, y: dY })));
12419
+ this.getObjects().forEach((obj) => obj.ref().move({ x: dX, y: dY }));
12414
12420
  };
12415
12421
  this.redirectToViewer = (event) => {
12416
12422
  if (this._viewer)
@@ -12467,8 +12473,8 @@
12467
12473
  clearOverlay() {
12468
12474
  this.removeTextInput();
12469
12475
  this.removeImageInput();
12470
- this._konvaTransformer.nodes([]);
12471
- Object.keys(MarkupMode2Konva).forEach((mode) => this.konvaLayerFind(mode).forEach((ref) => ref.destroy()));
12476
+ this.clearSelected();
12477
+ this.getObjects().forEach((obj) => obj.ref().destroy());
12472
12478
  }
12473
12479
  getMarkupColor() {
12474
12480
  return this._markupColor.RGB;
@@ -12476,24 +12482,21 @@
12476
12482
  setMarkupColor(r, g, b) {
12477
12483
  this._markupColor.setColor(r, g, b);
12478
12484
  }
12479
- colorizeAllMarkup(r = 255, g = 0, b = 0) {
12480
- const hex = new MarkupColor(r, g, b).HexColor;
12481
- Object.keys(MarkupMode2Konva).forEach((mode) => {
12482
- this.konvaLayerFind(mode).forEach((ref) => {
12483
- const konvaShape = MarkupMode2Konva[mode];
12484
- const konvaObj = konvaShape.initializer(ref);
12485
- if (konvaObj.setColor)
12486
- konvaObj.setColor(hex);
12487
- });
12485
+ colorizeAllMarkup(r, g, b) {
12486
+ const hexColor = new MarkupColor(r, g, b).HexColor;
12487
+ this.getObjects().forEach((obj) => {
12488
+ const colorable = obj;
12489
+ if (colorable && colorable.setColor)
12490
+ colorable.setColor(hexColor);
12488
12491
  });
12489
12492
  this._konvaLayer.draw();
12490
12493
  }
12491
12494
  colorizeSelectedMarkups(r, g, b) {
12495
+ const hexColor = new MarkupColor(r, g, b).HexColor;
12492
12496
  this.getSelectedObjects().forEach((obj) => {
12493
12497
  const colorable = obj;
12494
- if (colorable && colorable.setColor) {
12495
- colorable.setColor(new MarkupColor(r, g, b).HexColor);
12496
- }
12498
+ if (colorable && colorable.setColor)
12499
+ colorable.setColor(hexColor);
12497
12500
  });
12498
12501
  }
12499
12502
  setViewpoint(viewpoint) {
@@ -12533,99 +12536,35 @@
12533
12536
  return this;
12534
12537
  }
12535
12538
  createObject(type, params) {
12536
- let object = null;
12537
- let zIndex = this._zIndex;
12538
- // TODO: factory?
12539
- switch (type.toLocaleLowerCase()) {
12540
- case "line":
12541
- object = new KonvaLine(params);
12542
- zIndex = 1;
12543
- break;
12544
- case "text":
12545
- object = new KonvaText(params);
12546
- break;
12547
- case "rectangle":
12548
- object = new KonvaRectangle(params);
12549
- zIndex = 1;
12550
- break;
12551
- case "ellipse":
12552
- object = new KonvaEllipse(params);
12553
- zIndex = 1;
12554
- break;
12555
- case "arrow":
12556
- object = new KonvaArrow(params);
12557
- break;
12558
- case "image":
12559
- object = new KonvaImage(params);
12560
- zIndex = 0;
12561
- break;
12562
- case "cloud":
12563
- object = new KonvaCloud(params);
12564
- zIndex = 1;
12565
- break;
12566
- default:
12567
- throw new Error("Markup CreateObject - unsupported type has been detected.");
12568
- }
12539
+ var _a;
12540
+ const konvaShape = MarkupMode2Konva[type];
12541
+ if (!konvaShape || !konvaShape.initializer)
12542
+ throw new Error(`Markup CreateObject - unsupported markup type ${type}`);
12543
+ const object = konvaShape.initializer(null, params);
12569
12544
  this.addObject(object);
12570
- // Set zIndex only when shape has been added to Layer else we will get "Konva warning: Node has no parent. zIndex parameter is ignored."
12571
- object.setZIndex(zIndex);
12545
+ // Set zIndex only when shape has been added to Layer else we will get
12546
+ // "Konva warning: Node has no parent. zIndex parameter is ignored."
12547
+ object.setZIndex((_a = konvaShape.zIndex) !== null && _a !== void 0 ? _a : this._zIndex);
12572
12548
  this._zIndex++;
12573
12549
  return object;
12574
12550
  }
12575
12551
  getObjects() {
12576
12552
  const objects = [];
12577
- this.konvaLayerFind("Line").forEach((line) => {
12578
- objects.push(new KonvaLine(null, line));
12579
- });
12580
- this.konvaLayerFind("Text").forEach((text) => {
12581
- objects.push(new KonvaText(null, text));
12582
- });
12583
- this.konvaLayerFind("Rectangle").forEach((rectangle) => {
12584
- objects.push(new KonvaRectangle(null, rectangle));
12585
- });
12586
- this.konvaLayerFind("Ellipse").forEach((ellipse) => {
12587
- objects.push(new KonvaEllipse(null, ellipse));
12588
- });
12589
- this.konvaLayerFind("Arrow").forEach((arrow) => {
12590
- objects.push(new KonvaArrow(null, arrow));
12591
- });
12592
- this.konvaLayerFind("Image").forEach((image) => {
12593
- objects.push(new KonvaImage(null, image));
12594
- });
12595
- this.konvaLayerFind("Cloud").forEach((cloud) => {
12596
- objects.push(new KonvaCloud(null, cloud));
12553
+ Object.keys(MarkupMode2Konva).forEach((type) => {
12554
+ const konvaShape = MarkupMode2Konva[type];
12555
+ this.konvaLayerFind(type).forEach((ref) => objects.push(konvaShape.initializer(ref)));
12597
12556
  });
12598
12557
  return objects;
12599
12558
  }
12600
12559
  getSelectedObjects() {
12601
- const objects = [];
12602
- this._konvaTransformer.nodes().forEach((obj) => {
12603
- const konvaShapeName = obj.className;
12604
- switch (konvaShapeName) {
12605
- case "Line":
12606
- objects.push(new KonvaLine(null, obj));
12607
- break;
12608
- case "Text":
12609
- objects.push(new KonvaText(null, obj));
12610
- break;
12611
- case "Rect":
12612
- objects.push(new KonvaRectangle(null, obj));
12613
- break;
12614
- case "Ellipse":
12615
- objects.push(new KonvaEllipse(null, obj));
12616
- break;
12617
- case "Arrow":
12618
- objects.push(new KonvaArrow(null, obj));
12619
- break;
12620
- case "Image":
12621
- objects.push(new KonvaImage(null, obj));
12622
- break;
12623
- case "Cloud":
12624
- objects.push(new KonvaCloud(null, obj));
12625
- break;
12626
- }
12627
- });
12628
- return objects;
12560
+ return this._konvaTransformer
12561
+ .nodes()
12562
+ .map((ref) => {
12563
+ const name = ref.className;
12564
+ const konvaShape = Object.values(MarkupMode2Konva).find((shape) => shape.name === name);
12565
+ return konvaShape ? konvaShape.initializer(ref) : null;
12566
+ })
12567
+ .filter((x) => x);
12629
12568
  }
12630
12569
  selectObjects(objects) {
12631
12570
  const selectedObjs = this._konvaTransformer.nodes().concat(objects.map((x) => x.ref()));
@@ -12684,8 +12623,8 @@
12684
12623
  addObject(object) {
12685
12624
  this._konvaLayer.add(object.ref());
12686
12625
  }
12687
- konvaLayerFind(markupShape) {
12688
- const konvaShape = MarkupMode2Konva[markupShape];
12626
+ konvaLayerFind(type) {
12627
+ const konvaShape = MarkupMode2Konva[type];
12689
12628
  if (konvaShape && konvaShape.initializer) {
12690
12629
  // for "draggable" Konva uses Rectangles in Transformer. We need only Shapes from layer.
12691
12630
  return this._konvaLayer.find(konvaShape.name).filter((ref) => ref.parent === this._konvaLayer);