@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.
@@ -866,31 +866,37 @@ const MarkupMode2Konva = {
866
866
  },
867
867
  Line: {
868
868
  name: "Line",
869
- initializer: ref => new KonvaLine(null, ref)
869
+ initializer: (ref, params = null) => new KonvaLine(params, ref),
870
+ zIndex: 1
870
871
  },
871
872
  Text: {
872
873
  name: "Text",
873
- initializer: ref => new KonvaText(null, ref)
874
+ initializer: (ref, params = null) => new KonvaText(params, ref)
874
875
  },
875
876
  Rectangle: {
876
877
  name: "Rect",
877
- initializer: ref => new KonvaRectangle(null, ref)
878
+ initializer: (ref, params = null) => new KonvaRectangle(params, ref),
879
+ zIndex: 1
878
880
  },
879
881
  Ellipse: {
880
882
  name: "Ellipse",
881
- initializer: ref => new KonvaEllipse(null, ref)
883
+ initializer: (ref, params = null) => new KonvaEllipse(params, ref),
884
+ zIndex: 1
882
885
  },
883
886
  Arrow: {
884
887
  name: "Arrow",
885
- initializer: ref => new KonvaArrow(null, ref)
888
+ initializer: (ref, params = null) => new KonvaArrow(params, ref),
889
+ zIndex: 1
886
890
  },
887
891
  Image: {
888
892
  name: "Image",
889
- initializer: ref => new KonvaImage(null, ref)
893
+ initializer: (ref, params = null) => new KonvaImage(params, ref),
894
+ zIndex: 0
890
895
  },
891
896
  Cloud: {
892
897
  name: "Cloud",
893
- initializer: ref => new KonvaCloud(null, ref)
898
+ initializer: ref => new KonvaCloud(null, ref),
899
+ zIndex: 1
894
900
  }
895
901
  };
896
902
 
@@ -921,10 +927,10 @@ class KonvaMarkup {
921
927
  this.pan = event => {
922
928
  const dX = event.dX / window.devicePixelRatio;
923
929
  const dY = event.dY / window.devicePixelRatio;
924
- Object.keys(MarkupMode2Konva).forEach((mode => this.konvaLayerFind(mode).forEach((ref => ref.move({
930
+ this.getObjects().forEach((obj => obj.ref().move({
925
931
  x: dX,
926
932
  y: dY
927
- })))));
933
+ })));
928
934
  };
929
935
  this.redirectToViewer = event => {
930
936
  if (this._viewer) this._viewer.emit(event);
@@ -977,8 +983,8 @@ class KonvaMarkup {
977
983
  clearOverlay() {
978
984
  this.removeTextInput();
979
985
  this.removeImageInput();
980
- this._konvaTransformer.nodes([]);
981
- Object.keys(MarkupMode2Konva).forEach((mode => this.konvaLayerFind(mode).forEach((ref => ref.destroy()))));
986
+ this.clearSelected();
987
+ this.getObjects().forEach((obj => obj.ref().destroy()));
982
988
  }
983
989
  getMarkupColor() {
984
990
  return this._markupColor.RGB;
@@ -986,23 +992,19 @@ class KonvaMarkup {
986
992
  setMarkupColor(r, g, b) {
987
993
  this._markupColor.setColor(r, g, b);
988
994
  }
989
- colorizeAllMarkup(r = 255, g = 0, b = 0) {
990
- const hex = new MarkupColor(r, g, b).HexColor;
991
- Object.keys(MarkupMode2Konva).forEach((mode => {
992
- this.konvaLayerFind(mode).forEach((ref => {
993
- const konvaShape = MarkupMode2Konva[mode];
994
- const konvaObj = konvaShape.initializer(ref);
995
- if (konvaObj.setColor) konvaObj.setColor(hex);
996
- }));
995
+ colorizeAllMarkup(r, g, b) {
996
+ const hexColor = new MarkupColor(r, g, b).HexColor;
997
+ this.getObjects().forEach((obj => {
998
+ const colorable = obj;
999
+ if (colorable && colorable.setColor) colorable.setColor(hexColor);
997
1000
  }));
998
1001
  this._konvaLayer.draw();
999
1002
  }
1000
1003
  colorizeSelectedMarkups(r, g, b) {
1004
+ const hexColor = new MarkupColor(r, g, b).HexColor;
1001
1005
  this.getSelectedObjects().forEach((obj => {
1002
1006
  const colorable = obj;
1003
- if (colorable && colorable.setColor) {
1004
- colorable.setColor(new MarkupColor(r, g, b).HexColor);
1005
- }
1007
+ if (colorable && colorable.setColor) colorable.setColor(hexColor);
1006
1008
  }));
1007
1009
  }
1008
1010
  setViewpoint(viewpoint) {
@@ -1045,110 +1047,29 @@ class KonvaMarkup {
1045
1047
  return this;
1046
1048
  }
1047
1049
  createObject(type, params) {
1048
- let object = null;
1049
- let zIndex = this._zIndex;
1050
- switch (type.toLocaleLowerCase()) {
1051
- case "line":
1052
- object = new KonvaLine(params);
1053
- zIndex = 1;
1054
- break;
1055
-
1056
- case "text":
1057
- object = new KonvaText(params);
1058
- break;
1059
-
1060
- case "rectangle":
1061
- object = new KonvaRectangle(params);
1062
- zIndex = 1;
1063
- break;
1064
-
1065
- case "ellipse":
1066
- object = new KonvaEllipse(params);
1067
- zIndex = 1;
1068
- break;
1069
-
1070
- case "arrow":
1071
- object = new KonvaArrow(params);
1072
- break;
1073
-
1074
- case "image":
1075
- object = new KonvaImage(params);
1076
- zIndex = 0;
1077
- break;
1078
-
1079
- case "cloud":
1080
- object = new KonvaCloud(params);
1081
- zIndex = 1;
1082
- break;
1083
-
1084
- default:
1085
- throw new Error("Markup CreateObject - unsupported type has been detected.");
1086
- }
1050
+ var _a;
1051
+ const konvaShape = MarkupMode2Konva[type];
1052
+ if (!konvaShape || !konvaShape.initializer) throw new Error(`Markup CreateObject - unsupported markup type ${type}`);
1053
+ const object = konvaShape.initializer(null, params);
1087
1054
  this.addObject(object);
1088
- object.setZIndex(zIndex);
1055
+ object.setZIndex((_a = konvaShape.zIndex) !== null && _a !== void 0 ? _a : this._zIndex);
1089
1056
  this._zIndex++;
1090
1057
  return object;
1091
1058
  }
1092
1059
  getObjects() {
1093
1060
  const objects = [];
1094
- this.konvaLayerFind("Line").forEach((line => {
1095
- objects.push(new KonvaLine(null, line));
1096
- }));
1097
- this.konvaLayerFind("Text").forEach((text => {
1098
- objects.push(new KonvaText(null, text));
1099
- }));
1100
- this.konvaLayerFind("Rectangle").forEach((rectangle => {
1101
- objects.push(new KonvaRectangle(null, rectangle));
1102
- }));
1103
- this.konvaLayerFind("Ellipse").forEach((ellipse => {
1104
- objects.push(new KonvaEllipse(null, ellipse));
1105
- }));
1106
- this.konvaLayerFind("Arrow").forEach((arrow => {
1107
- objects.push(new KonvaArrow(null, arrow));
1108
- }));
1109
- this.konvaLayerFind("Image").forEach((image => {
1110
- objects.push(new KonvaImage(null, image));
1111
- }));
1112
- this.konvaLayerFind("Cloud").forEach((cloud => {
1113
- objects.push(new KonvaCloud(null, cloud));
1061
+ Object.keys(MarkupMode2Konva).forEach((type => {
1062
+ const konvaShape = MarkupMode2Konva[type];
1063
+ this.konvaLayerFind(type).forEach((ref => objects.push(konvaShape.initializer(ref))));
1114
1064
  }));
1115
1065
  return objects;
1116
1066
  }
1117
1067
  getSelectedObjects() {
1118
- const objects = [];
1119
- this._konvaTransformer.nodes().forEach((obj => {
1120
- const konvaShapeName = obj.className;
1121
- switch (konvaShapeName) {
1122
- case "Line":
1123
- objects.push(new KonvaLine(null, obj));
1124
- break;
1125
-
1126
- case "Text":
1127
- objects.push(new KonvaText(null, obj));
1128
- break;
1129
-
1130
- case "Rect":
1131
- objects.push(new KonvaRectangle(null, obj));
1132
- break;
1133
-
1134
- case "Ellipse":
1135
- objects.push(new KonvaEllipse(null, obj));
1136
- break;
1137
-
1138
- case "Arrow":
1139
- objects.push(new KonvaArrow(null, obj));
1140
- break;
1141
-
1142
- case "Image":
1143
- objects.push(new KonvaImage(null, obj));
1144
- break;
1145
-
1146
- case "Cloud":
1147
- objects.push(new KonvaCloud(null, obj));
1148
- break;
1149
- }
1150
- }));
1151
- return objects;
1068
+ return this._konvaTransformer.nodes().map((ref => {
1069
+ const name = ref.className;
1070
+ const konvaShape = Object.values(MarkupMode2Konva).find((shape => shape.name === name));
1071
+ return konvaShape ? konvaShape.initializer(ref) : null;
1072
+ })).filter((x => x));
1152
1073
  }
1153
1074
  selectObjects(objects) {
1154
1075
  const selectedObjs = this._konvaTransformer.nodes().concat(objects.map((x => x.ref())));
@@ -1211,8 +1132,8 @@ class KonvaMarkup {
1211
1132
  addObject(object) {
1212
1133
  this._konvaLayer.add(object.ref());
1213
1134
  }
1214
- konvaLayerFind(markupShape) {
1215
- const konvaShape = MarkupMode2Konva[markupShape];
1135
+ konvaLayerFind(type) {
1136
+ const konvaShape = MarkupMode2Konva[type];
1216
1137
  if (konvaShape && konvaShape.initializer) {
1217
1138
  return this._konvaLayer.find(konvaShape.name).filter((ref => ref.parent === this._konvaLayer));
1218
1139
  }