@inweb/viewer-visualize 25.7.9 → 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/viewer-visualize.js +53 -126
- package/dist/viewer-visualize.js.map +1 -1
- package/dist/viewer-visualize.min.js +1 -1
- package/dist/viewer-visualize.module.js +53 -126
- package/dist/viewer-visualize.module.js.map +1 -1
- package/lib/Viewer/Markup/Visualize/VisualizeMarkup.d.ts +2 -1
- package/package.json +5 -5
- package/src/Viewer/Markup/Visualize/VisualizeMarkup.ts +5 -1
package/dist/viewer-visualize.js
CHANGED
|
@@ -13009,31 +13009,37 @@
|
|
|
13009
13009
|
},
|
|
13010
13010
|
Line: {
|
|
13011
13011
|
name: "Line",
|
|
13012
|
-
initializer: ref => new KonvaLine(
|
|
13012
|
+
initializer: (ref, params = null) => new KonvaLine(params, ref),
|
|
13013
|
+
zIndex: 1
|
|
13013
13014
|
},
|
|
13014
13015
|
Text: {
|
|
13015
13016
|
name: "Text",
|
|
13016
|
-
initializer: ref => new KonvaText(
|
|
13017
|
+
initializer: (ref, params = null) => new KonvaText(params, ref)
|
|
13017
13018
|
},
|
|
13018
13019
|
Rectangle: {
|
|
13019
13020
|
name: "Rect",
|
|
13020
|
-
initializer: ref => new KonvaRectangle(
|
|
13021
|
+
initializer: (ref, params = null) => new KonvaRectangle(params, ref),
|
|
13022
|
+
zIndex: 1
|
|
13021
13023
|
},
|
|
13022
13024
|
Ellipse: {
|
|
13023
13025
|
name: "Ellipse",
|
|
13024
|
-
initializer: ref => new KonvaEllipse(
|
|
13026
|
+
initializer: (ref, params = null) => new KonvaEllipse(params, ref),
|
|
13027
|
+
zIndex: 1
|
|
13025
13028
|
},
|
|
13026
13029
|
Arrow: {
|
|
13027
13030
|
name: "Arrow",
|
|
13028
|
-
initializer: ref => new KonvaArrow(
|
|
13031
|
+
initializer: (ref, params = null) => new KonvaArrow(params, ref),
|
|
13032
|
+
zIndex: 1
|
|
13029
13033
|
},
|
|
13030
13034
|
Image: {
|
|
13031
13035
|
name: "Image",
|
|
13032
|
-
initializer: ref => new KonvaImage(
|
|
13036
|
+
initializer: (ref, params = null) => new KonvaImage(params, ref),
|
|
13037
|
+
zIndex: 0
|
|
13033
13038
|
},
|
|
13034
13039
|
Cloud: {
|
|
13035
13040
|
name: "Cloud",
|
|
13036
|
-
initializer: ref => new KonvaCloud(null, ref)
|
|
13041
|
+
initializer: ref => new KonvaCloud(null, ref),
|
|
13042
|
+
zIndex: 1
|
|
13037
13043
|
}
|
|
13038
13044
|
};
|
|
13039
13045
|
|
|
@@ -13052,14 +13058,7 @@
|
|
|
13052
13058
|
this._markupContainer.className = this._container.className.split(" ").filter((x => !x.startsWith("oda-cursor-"))).filter((x => x)).concat(`oda-cursor-${draggerName.toLowerCase()}`).join(" ");
|
|
13053
13059
|
this.removeTextInput();
|
|
13054
13060
|
this.removeImageInput();
|
|
13055
|
-
|
|
13056
|
-
if (konvaShape) {
|
|
13057
|
-
this._markupMode = draggerName;
|
|
13058
|
-
this._markupIsActive = true;
|
|
13059
|
-
} else {
|
|
13060
|
-
this._markupIsActive = false;
|
|
13061
|
-
this._konvaTransformer.nodes([]);
|
|
13062
|
-
}
|
|
13061
|
+
this.enableEditMode(draggerName);
|
|
13063
13062
|
};
|
|
13064
13063
|
this.resizeContainer = entries => {
|
|
13065
13064
|
var _a, _b;
|
|
@@ -13071,10 +13070,10 @@
|
|
|
13071
13070
|
this.pan = event => {
|
|
13072
13071
|
const dX = event.dX / window.devicePixelRatio;
|
|
13073
13072
|
const dY = event.dY / window.devicePixelRatio;
|
|
13074
|
-
|
|
13073
|
+
this.getObjects().forEach((obj => obj.ref().move({
|
|
13075
13074
|
x: dX,
|
|
13076
13075
|
y: dY
|
|
13077
|
-
})))
|
|
13076
|
+
})));
|
|
13078
13077
|
};
|
|
13079
13078
|
this.redirectToViewer = event => {
|
|
13080
13079
|
if (this._viewer) this._viewer.emit(event);
|
|
@@ -13127,8 +13126,8 @@
|
|
|
13127
13126
|
clearOverlay() {
|
|
13128
13127
|
this.removeTextInput();
|
|
13129
13128
|
this.removeImageInput();
|
|
13130
|
-
this.
|
|
13131
|
-
|
|
13129
|
+
this.clearSelected();
|
|
13130
|
+
this.getObjects().forEach((obj => obj.ref().destroy()));
|
|
13132
13131
|
}
|
|
13133
13132
|
getMarkupColor() {
|
|
13134
13133
|
return this._markupColor.RGB;
|
|
@@ -13136,23 +13135,19 @@
|
|
|
13136
13135
|
setMarkupColor(r, g, b) {
|
|
13137
13136
|
this._markupColor.setColor(r, g, b);
|
|
13138
13137
|
}
|
|
13139
|
-
colorizeAllMarkup(r
|
|
13140
|
-
const
|
|
13141
|
-
|
|
13142
|
-
|
|
13143
|
-
|
|
13144
|
-
const konvaObj = konvaShape.initializer(ref);
|
|
13145
|
-
if (konvaObj.setColor) konvaObj.setColor(hex);
|
|
13146
|
-
}));
|
|
13138
|
+
colorizeAllMarkup(r, g, b) {
|
|
13139
|
+
const hexColor = new MarkupColor(r, g, b).HexColor;
|
|
13140
|
+
this.getObjects().forEach((obj => {
|
|
13141
|
+
const colorable = obj;
|
|
13142
|
+
if (colorable && colorable.setColor) colorable.setColor(hexColor);
|
|
13147
13143
|
}));
|
|
13148
13144
|
this._konvaLayer.draw();
|
|
13149
13145
|
}
|
|
13150
13146
|
colorizeSelectedMarkups(r, g, b) {
|
|
13147
|
+
const hexColor = new MarkupColor(r, g, b).HexColor;
|
|
13151
13148
|
this.getSelectedObjects().forEach((obj => {
|
|
13152
13149
|
const colorable = obj;
|
|
13153
|
-
if (colorable && colorable.setColor)
|
|
13154
|
-
colorable.setColor(new MarkupColor(r, g, b).HexColor);
|
|
13155
|
-
}
|
|
13150
|
+
if (colorable && colorable.setColor) colorable.setColor(hexColor);
|
|
13156
13151
|
}));
|
|
13157
13152
|
}
|
|
13158
13153
|
setViewpoint(viewpoint) {
|
|
@@ -13184,111 +13179,40 @@
|
|
|
13184
13179
|
viewpoint.description = (new Date).toDateString();
|
|
13185
13180
|
return viewpoint;
|
|
13186
13181
|
}
|
|
13187
|
-
|
|
13188
|
-
|
|
13189
|
-
|
|
13190
|
-
|
|
13191
|
-
|
|
13192
|
-
|
|
13193
|
-
|
|
13194
|
-
break;
|
|
13195
|
-
|
|
13196
|
-
case "text":
|
|
13197
|
-
object = new KonvaText(params);
|
|
13198
|
-
break;
|
|
13199
|
-
|
|
13200
|
-
case "rectangle":
|
|
13201
|
-
object = new KonvaRectangle(params);
|
|
13202
|
-
zIndex = 1;
|
|
13203
|
-
break;
|
|
13204
|
-
|
|
13205
|
-
case "ellipse":
|
|
13206
|
-
object = new KonvaEllipse(params);
|
|
13207
|
-
zIndex = 1;
|
|
13208
|
-
break;
|
|
13209
|
-
|
|
13210
|
-
case "arrow":
|
|
13211
|
-
object = new KonvaArrow(params);
|
|
13212
|
-
break;
|
|
13213
|
-
|
|
13214
|
-
case "image":
|
|
13215
|
-
object = new KonvaImage(params);
|
|
13216
|
-
zIndex = 0;
|
|
13217
|
-
break;
|
|
13218
|
-
|
|
13219
|
-
case "cloud":
|
|
13220
|
-
object = new KonvaCloud(params);
|
|
13221
|
-
zIndex = 1;
|
|
13222
|
-
break;
|
|
13223
|
-
|
|
13224
|
-
default:
|
|
13225
|
-
throw new Error("Markup CreateObject - unsupported type has been detected.");
|
|
13182
|
+
enableEditMode(mode) {
|
|
13183
|
+
if (!mode || !MarkupMode2Konva[mode]) {
|
|
13184
|
+
this.clearSelected();
|
|
13185
|
+
this._markupIsActive = false;
|
|
13186
|
+
} else {
|
|
13187
|
+
this._markupMode = mode;
|
|
13188
|
+
this._markupIsActive = true;
|
|
13226
13189
|
}
|
|
13190
|
+
return this;
|
|
13191
|
+
}
|
|
13192
|
+
createObject(type, params) {
|
|
13193
|
+
var _a;
|
|
13194
|
+
const konvaShape = MarkupMode2Konva[type];
|
|
13195
|
+
if (!konvaShape || !konvaShape.initializer) throw new Error(`Markup CreateObject - unsupported markup type ${type}`);
|
|
13196
|
+
const object = konvaShape.initializer(null, params);
|
|
13227
13197
|
this.addObject(object);
|
|
13228
|
-
object.setZIndex(zIndex);
|
|
13198
|
+
object.setZIndex((_a = konvaShape.zIndex) !== null && _a !== void 0 ? _a : this._zIndex);
|
|
13229
13199
|
this._zIndex++;
|
|
13230
13200
|
return object;
|
|
13231
13201
|
}
|
|
13232
13202
|
getObjects() {
|
|
13233
13203
|
const objects = [];
|
|
13234
|
-
|
|
13235
|
-
|
|
13236
|
-
|
|
13237
|
-
this.konvaLayerFind("Text").forEach((text => {
|
|
13238
|
-
objects.push(new KonvaText(null, text));
|
|
13239
|
-
}));
|
|
13240
|
-
this.konvaLayerFind("Rectangle").forEach((rectangle => {
|
|
13241
|
-
objects.push(new KonvaRectangle(null, rectangle));
|
|
13242
|
-
}));
|
|
13243
|
-
this.konvaLayerFind("Ellipse").forEach((ellipse => {
|
|
13244
|
-
objects.push(new KonvaEllipse(null, ellipse));
|
|
13245
|
-
}));
|
|
13246
|
-
this.konvaLayerFind("Arrow").forEach((arrow => {
|
|
13247
|
-
objects.push(new KonvaArrow(null, arrow));
|
|
13248
|
-
}));
|
|
13249
|
-
this.konvaLayerFind("Image").forEach((image => {
|
|
13250
|
-
objects.push(new KonvaImage(null, image));
|
|
13251
|
-
}));
|
|
13252
|
-
this.konvaLayerFind("Cloud").forEach((cloud => {
|
|
13253
|
-
objects.push(new KonvaCloud(null, cloud));
|
|
13204
|
+
Object.keys(MarkupMode2Konva).forEach((type => {
|
|
13205
|
+
const konvaShape = MarkupMode2Konva[type];
|
|
13206
|
+
this.konvaLayerFind(type).forEach((ref => objects.push(konvaShape.initializer(ref))));
|
|
13254
13207
|
}));
|
|
13255
13208
|
return objects;
|
|
13256
13209
|
}
|
|
13257
13210
|
getSelectedObjects() {
|
|
13258
|
-
|
|
13259
|
-
|
|
13260
|
-
const
|
|
13261
|
-
|
|
13262
|
-
|
|
13263
|
-
objects.push(new KonvaLine(null, obj));
|
|
13264
|
-
break;
|
|
13265
|
-
|
|
13266
|
-
case "Text":
|
|
13267
|
-
objects.push(new KonvaText(null, obj));
|
|
13268
|
-
break;
|
|
13269
|
-
|
|
13270
|
-
case "Rect":
|
|
13271
|
-
objects.push(new KonvaRectangle(null, obj));
|
|
13272
|
-
break;
|
|
13273
|
-
|
|
13274
|
-
case "Ellipse":
|
|
13275
|
-
objects.push(new KonvaEllipse(null, obj));
|
|
13276
|
-
break;
|
|
13277
|
-
|
|
13278
|
-
case "Arrow":
|
|
13279
|
-
objects.push(new KonvaArrow(null, obj));
|
|
13280
|
-
break;
|
|
13281
|
-
|
|
13282
|
-
case "Image":
|
|
13283
|
-
objects.push(new KonvaImage(null, obj));
|
|
13284
|
-
break;
|
|
13285
|
-
|
|
13286
|
-
case "Cloud":
|
|
13287
|
-
objects.push(new KonvaCloud(null, obj));
|
|
13288
|
-
break;
|
|
13289
|
-
}
|
|
13290
|
-
}));
|
|
13291
|
-
return objects;
|
|
13211
|
+
return this._konvaTransformer.nodes().map((ref => {
|
|
13212
|
+
const name = ref.className;
|
|
13213
|
+
const konvaShape = Object.values(MarkupMode2Konva).find((shape => shape.name === name));
|
|
13214
|
+
return konvaShape ? konvaShape.initializer(ref) : null;
|
|
13215
|
+
})).filter((x => x));
|
|
13292
13216
|
}
|
|
13293
13217
|
selectObjects(objects) {
|
|
13294
13218
|
const selectedObjs = this._konvaTransformer.nodes().concat(objects.map((x => x.ref())));
|
|
@@ -13351,8 +13275,8 @@
|
|
|
13351
13275
|
addObject(object) {
|
|
13352
13276
|
this._konvaLayer.add(object.ref());
|
|
13353
13277
|
}
|
|
13354
|
-
konvaLayerFind(
|
|
13355
|
-
const konvaShape = MarkupMode2Konva[
|
|
13278
|
+
konvaLayerFind(type) {
|
|
13279
|
+
const konvaShape = MarkupMode2Konva[type];
|
|
13356
13280
|
if (konvaShape && konvaShape.initializer) {
|
|
13357
13281
|
return this._konvaLayer.find(konvaShape.name).filter((ref => ref.parent === this._konvaLayer));
|
|
13358
13282
|
}
|
|
@@ -16618,6 +16542,9 @@
|
|
|
16618
16542
|
viewpoint.description = new Date().toDateString();
|
|
16619
16543
|
return viewpoint;
|
|
16620
16544
|
}
|
|
16545
|
+
enableEditMode(mode) {
|
|
16546
|
+
throw new Error("Not implemented yet");
|
|
16547
|
+
}
|
|
16621
16548
|
createObject(type, params) {
|
|
16622
16549
|
throw new Error("Not implemented yet");
|
|
16623
16550
|
}
|