@inweb/viewer-visualize 27.4.7 → 27.6.0

package/dist/viewer-visualize.module.js

@@ -121,6 +121,7 @@ const INTERACTIVITY_FPS = 24;
 class OdBaseDragger extends OdaGeAction {
     constructor(subject) {
         super(subject.visualizeJs);
+        this.name = "";
         this.beginInteractivity = () => {
             const viewer = this.getViewer();
             const view = viewer.activeView;
@@ -147,6 +148,8 @@ class OdBaseDragger extends OdaGeAction {
         this.needInputText = false;
         this.mouseDownPosition = { x: 0, y: 0 };
         this.autoSelect = false;
+        this.isDragging = false;
+        this.press = false;
         this.pointerdown = this.pointerdown.bind(this);
         this.pointerup = this.pointerup.bind(this);
         this.pointercancel = this.pointercancel.bind(this);
@@ -650,16 +653,16 @@ class MeasureLineDragger extends OdBaseDragger {
         this.m_overlayElement.style.zIndex = "1";
         this.m_overlayElement.style.pointerEvents = "none";
         document.body.appendChild(this.m_overlayElement);
-        this.optionsChange = this.optionsChange.bind(this);
+        this.updateUnits = this.updateUnits.bind(this);
         this.updatePreview = this.updatePreview.bind(this);
-        this.subject.addEventListener("optionschange", this.optionsChange);
+        this.subject.addEventListener("optionschange", this.updateUnits);
         this.subject.addEventListener("render", this.updatePreview);
         this.resize();
     }
     dispose() {
         super.dispose();
         this.m_overlayElement.remove();
-        this.subject.removeEventListener("optionschange", this.optionsChange);
+        this.subject.removeEventListener("optionschange", this.updateUnits);
         this.subject.removeEventListener("render", this.updatePreview);
     }
     updatePreview() {
@@ -761,7 +764,7 @@ class MeasureLineDragger extends OdBaseDragger {
         this.items.push(item);
         return item;
     }
-    optionsChange(event) {
+    updateUnits(event) {
         var _a, _b;
         const options = event.data;
         const toUnitName = (_a = options.rulerUnit) !== null && _a !== void 0 ? _a : "Default";
@@ -1544,9 +1547,8 @@ class OdBaseCuttingPlaneDragger extends OdBaseDragger {
         plane.set(this.toGePoint(this.m_center), this.m_normal);
         avp.addCuttingPlane(plane);
         this.index = avp.numCuttingPlanes() - 1;
-        const { red, green, blue } = this.subject.options.cuttingPlaneFillColor;
-        avp.setEnableCuttingPlaneFill(true, red, green, blue);
-        avp.setCuttingPlaneFillPatternEnabled(true, this.m_module.CuttingPlaneFillStyle.kSlantRight, 0x0, 0x0, 0x0);
+        this.subject.syncOptions();
+        this.subject.emitEvent({ type: "changecuttingplanes" });
         this.m_model = this.getModel();
         this.createPreview();
         this.deleteAll([ext, avp, plane]);
@@ -1586,6 +1588,7 @@ class OdBaseCuttingPlaneDragger extends OdBaseDragger {
             const plane = this.createPlane();
             plane.set(this.toGePoint(this.m_center), this.m_normal);
             avp.updateCuttingPlane(this.index, plane);
+            this.subject.emitEvent({ type: "changecuttingplanes" });
             this.drawPreview();
             this.deleteAll([avp, plane, oldCenter, delta, oldLast]);
             const device = this.getViewer().getActiveDevice();
@@ -1601,6 +1604,7 @@ class OdBaseCuttingPlaneDragger extends OdBaseDragger {
         const plane = this.createPlane();
         plane.set(this.toGePoint(this.m_center), this.m_normal);
         avp.updateCuttingPlane(this.index, plane);
+        this.subject.emitEvent({ type: "changecuttingplanes" });
         this.deleteAll([avp, plane, this.m_last]);
         const device = this.getViewer().getActiveDevice();
         device.invalidate(device.getSize());
@@ -1686,7 +1690,7 @@ class OdCuttingPlaneYAxisDragger extends OdBaseCuttingPlaneDragger {
 
 class OdCuttingPlaneZAxisDragger extends OdBaseCuttingPlaneDragger {
     createNormal() {
-        return [0, 0, 1];
+        return [0, 0, -1];
     }
     handleDelta(delta) {
         delta.x = 0.0;
@@ -2331,16 +2335,16 @@ class OdaLineDragger extends OdBaseDragger {
     constructor(subject) {
         super(subject);
         this.press = false;
+        this.drawPoints = [];
     }
     dispose() {
         super.dispose();
         this.end();
-        this.points = null;
-        this.drawPoints = null;
+        this.drawPoints.length = 0;
     }
     start(x, y) {
         const point = this.getViewer().screenToWorld(x, y);
-        this.drawPoints = [point[0], point[1], point[2]];
+        this.drawPoints.push(point[0], point[1], point[2]);
     }
     drag(x, y) {
         if (this.isDragging) {
@@ -2352,7 +2356,7 @@ class OdaLineDragger extends OdBaseDragger {
     end() {
         if (this.entity) {
             this.entity.delete();
-            this.drawPoints = null;
+            this.drawPoints.length = 0;
             this.entity = null;
         }
     }
@@ -2851,24 +2855,34 @@ commands.registerCommand("zoomToExtents", zoomToExtents);
 commands.registerCommand("zoomToObjects", zoomToObjects);
 commands.registerCommand("zoomToSelected", zoomToSelected);
 commands.registerCommand("autoTransformAllModelsToCentralPoint", autoTransformAllModelsToCentralPoint);
-commands.registerCommand("k3DViewTop", (viewer) => setDefaultViewPosition(viewer, "k3DViewTop"));
-commands.registerCommand("k3DViewBottom", (viewer) => setDefaultViewPosition(viewer, "k3DViewBottom"));
-commands.registerCommand("k3DViewLeft", (viewer) => setDefaultViewPosition(viewer, "k3DViewLeft"));
-commands.registerCommand("k3DViewRight", (viewer) => setDefaultViewPosition(viewer, "k3DViewRight"));
-commands.registerCommand("k3DViewFront", (viewer) => setDefaultViewPosition(viewer, "k3DViewFront"));
-commands.registerCommand("k3DViewBack", (viewer) => setDefaultViewPosition(viewer, "k3DViewBack"));
-commands.registerCommand("k3DViewSE", (viewer) => setDefaultViewPosition(viewer, "k3DViewSE"));
-commands.registerCommand("k3DViewSW", (viewer) => setDefaultViewPosition(viewer, "k3DViewSW"));
-commands.registerCommand("k3DViewNE", (viewer) => setDefaultViewPosition(viewer, "k3DViewNE"));
-commands.registerCommand("k3DViewNW", (viewer) => setDefaultViewPosition(viewer, "k3DViewNW"));
+commands.registerCommand("top", (viewer) => setDefaultViewPosition(viewer, "k3DViewTop"));
+commands.registerCommand("bottom", (viewer) => setDefaultViewPosition(viewer, "k3DViewBottom"));
+commands.registerCommand("left", (viewer) => setDefaultViewPosition(viewer, "k3DViewLeft"));
+commands.registerCommand("right", (viewer) => setDefaultViewPosition(viewer, "k3DViewRight"));
+commands.registerCommand("front", (viewer) => setDefaultViewPosition(viewer, "k3DViewFront"));
+commands.registerCommand("back", (viewer) => setDefaultViewPosition(viewer, "k3DViewBack"));
+commands.registerCommand("se", (viewer) => setDefaultViewPosition(viewer, "k3DViewSE"));
+commands.registerCommand("sw", (viewer) => setDefaultViewPosition(viewer, "k3DViewSW"));
+commands.registerCommand("ne", (viewer) => setDefaultViewPosition(viewer, "k3DViewNE"));
+commands.registerCommand("nw", (viewer) => setDefaultViewPosition(viewer, "k3DViewNW"));
 commands.registerCommandAlias("clearMarkup", "clearOverlay");
 commands.registerCommandAlias("clearSelected", "unselect");
 commands.registerCommandAlias("getSnapshot", "createPreview");
 commands.registerCommandAlias("zoomToExtents", "zoomExtents");
+commands.registerCommandAlias("top", "k3DViewTop");
+commands.registerCommandAlias("bottom", "k3DViewBottom");
+commands.registerCommandAlias("left", "k3DViewLeft");
+commands.registerCommandAlias("right", "k3DViewRight");
+commands.registerCommandAlias("front", "k3DViewFront");
+commands.registerCommandAlias("back", "k3DViewBack");
+commands.registerCommandAlias("se", "k3DViewSE");
+commands.registerCommandAlias("sw", "k3DViewSW");
+commands.registerCommandAlias("ne", "k3DViewNE");
+commands.registerCommandAlias("nw", "k3DViewNW");
 
 class CameraComponent {
     constructor(viewer) {
-        this.optionsChange = () => {
+        this.syncOptions = () => {
             this.switchCameraMode(this.viewer.options.cameraMode);
         };
         this.geometryEnd = () => {
@@ -2881,14 +2895,14 @@ class CameraComponent {
         this.viewer = viewer;
         this.viewer.addEventListener("databasechunk", this.geometryEnd);
         this.viewer.addEventListener("clear", this.geometryEnd);
-        this.viewer.addEventListener("optionschange", this.optionsChange);
-        this.viewer.addEventListener("initialize", this.optionsChange);
+        this.viewer.addEventListener("optionschange", this.syncOptions);
+        this.viewer.addEventListener("initialize", this.syncOptions);
     }
     dispose() {
         this.viewer.removeEventListener("databasechunk", this.geometryEnd);
         this.viewer.removeEventListener("clear", this.geometryEnd);
-        this.viewer.removeEventListener("optionschange", this.optionsChange);
-        this.viewer.removeEventListener("initialize", this.optionsChange);
+        this.viewer.removeEventListener("optionschange", this.syncOptions);
+        this.viewer.removeEventListener("initialize", this.syncOptions);
     }
     getCameraMode(view) {
         return view.perspective ? "perspective" : "orthographic";
@@ -3038,7 +3052,6 @@ class CanvasRemoveComponent {
     }
     dispose() {
         this.mutationObserver.disconnect();
-        this.mutationObserver = undefined;
     }
 }
 
@@ -3064,7 +3077,6 @@ class ZoomWheelComponent {
     }
     dispose() {
         this.zoomWheelDragger.dispose();
-        this.zoomWheelDragger = undefined;
     }
 }
 
@@ -3258,7 +3270,6 @@ class GestureManagerComponent {
     }
     dispose() {
         this.gestureManager.dispose();
-        this.gestureManager = undefined;
     }
 }
 
@@ -3321,6 +3332,9 @@ components.registerComponent("GestureManagerComponent", (viewer) => new GestureM
 components.registerComponent("ResetComponent", (viewer) => new ResetComponent(viewer));
 
 class ModelImpl {
+    constructor() {
+        this.id = "";
+    }
     dispose() { }
 }
 
@@ -3328,7 +3342,6 @@ class FileLoader {
     constructor() {
         this.requestHeader = {};
         this.withCredentials = false;
-        this.abortSignal = undefined;
     }
     setRequestHeader(requestHeader) {
         this.requestHeader = requestHeader;
@@ -3350,12 +3363,15 @@ class FileLoader {
                 .then((response) => {
                 if (!response.ok)
                     throw new Error(`Failed to fetch "${response.url}", status ${response.status}`);
+                const body = response.body;
+                if (!body)
+                    return response;
                 const contentLength = response.headers.get("X-File-Size") || response.headers.get("Content-Length");
                 const total = parseInt(contentLength || "", 10) || 0;
                 const lengthComputable = total > 0;
                 const stream = new ReadableStream({
                     async start(controller) {
-                        const reader = response.body.getReader();
+                        const reader = body.getReader();
                         let loaded = 0;
                         try {
                             while (true) {
@@ -3384,7 +3400,7 @@ class FileLoader {
                 const reader = new FileReader();
                 reader.onload = () => resolve(reader.result);
                 reader.onerror = () => reject(reader.error);
-                reader.onprogress = onProgress;
+                reader.onprogress = onProgress || null;
                 reader.readAsArrayBuffer(new Blob([file]));
             });
         }
@@ -3403,7 +3419,7 @@ class VSFFileLoader extends Loader {
         super();
         this.viewer = viewer;
     }
-    isSupport(file, format) {
+    isSupport(file, format = "") {
         return ((typeof file === "string" || file instanceof globalThis.File || file instanceof ArrayBuffer) &&
             /vsf$/i.test(format));
     }
@@ -3498,7 +3514,7 @@ class VSFXFileLoader extends Loader {
         super();
         this.viewer = viewer;
     }
-    isSupport(file, format) {
+    isSupport(file, format = "") {
         return ((typeof file === "string" || file instanceof globalThis.File || file instanceof ArrayBuffer) &&
             /vsfx$/i.test(format));
     }
@@ -3627,7 +3643,7 @@ class VSFXCloudStreamingLoader extends Loader {
             }
             else {
                 this.viewer.emitEvent({ type: "geometrychunk", data: chunk, file: model.file, model });
-                this.viewer.update();
+                this.viewer.update(500);
             }
         };
         await model.downloadResource(model.database, chunkLoadHandler, this.abortController.signal);
@@ -3685,7 +3701,7 @@ class VSFXCloudPartialLoader extends Loader {
             }
             else {
                 this.viewer.emitEvent({ type: "geometrychunk", data: chunk, file: model.file, model });
-                this.viewer.update();
+                this.viewer.update(500);
             }
         };
         const downloadResourceRange = async (dataId, requestId, ranges) => {
@@ -3808,7 +3824,7 @@ function loadScript(url, params = {}) {
         const script = document.createElement("script");
         script.src = url;
         script.async = true;
-        script.crossOrigin = params.crossOrigin;
+        script.crossOrigin = params.crossOrigin || null;
         script.onload = () => resolve(script);
         script.onerror = () => {
             script.remove();
@@ -3850,6 +3866,7 @@ class VisualizeMarkup {
     constructor() {
         this._markupColor = { r: 255, g: 0, b: 0 };
         this.lineWidth = 4;
+        this.lineType = "solid";
         this.fontSize = 34;
     }
     initialize(container, containerEvents, viewer, worldTransformer) {
@@ -4058,9 +4075,9 @@ class Viewer extends EventEmitter2 {
         this.info = new Info();
         this.canvasEvents = CANVAS_EVENTS.slice();
         this.canvaseventlistener = (event) => this.emit(event);
+        this._visualizeTimestamp = 0;
         this._activeDragger = null;
         this._components = [];
-        this._updateDelay = 1000;
         this._renderNeeded = false;
         this._renderTime = 0;
         this._enableAutoUpdate = (_a = params.enableAutoUpdate) !== null && _a !== void 0 ? _a : true;
@@ -4085,7 +4102,7 @@ class Viewer extends EventEmitter2 {
         return this._markup;
     }
     configure(params) {
-        this._visualizeJsUrl = params.visualizeJsUrl || "https://public-fhemb7e3embacwec.z02.azurefd.net/libs/visualizejs/27.4/Visualize.js";
+        this._visualizeJsUrl = params.visualizeJsUrl || "https://public-fhemb7e3embacwec.z02.azurefd.net/libs/visualizejs/master/Visualize.js";
         this._crossOrigin = params.crossOrigin;
         return this;
     }
@@ -4125,7 +4142,9 @@ class Viewer extends EventEmitter2 {
         this.canvasEvents.forEach((x) => canvas.addEventListener(x, this.canvaseventlistener));
         this._markup.initialize(this.canvas, this.canvasEvents, this, this);
         for (const name of components.getComponents().keys()) {
-            this._components.push(components.createComponent(name, this));
+            const component = components.createComponent(name, this);
+            if (component)
+                this._components.push(component);
         }
         this.syncOptions();
         this.syncOverlay();
@@ -4141,7 +4160,7 @@ class Viewer extends EventEmitter2 {
         this.removeAllListeners();
         this.setActiveDragger();
         this._components.forEach((component) => component.dispose());
-        this._components = [];
+        this._components.length = 0;
         this._markup.dispose();
         if (this.canvas) {
             this.canvasEvents.forEach((x) => this.canvas.removeEventListener(x, this.canvaseventlistener));
@@ -4150,7 +4169,7 @@ class Viewer extends EventEmitter2 {
         if (this._viewer)
             this._viewer.clear();
         this._visualizeJs = undefined;
-        this._visualizeTimestamp = undefined;
+        this._visualizeTimestamp = 0;
         this._viewer = undefined;
         return this;
     }
@@ -4172,13 +4191,14 @@ class Viewer extends EventEmitter2 {
     }
     update(force = false) {
         const time = performance.now();
-        force = force || time - this._renderTime >= this._updateDelay;
+        if (typeof force === "number" && time - this._renderTime >= force)
+            force = true;
         if (this._enableAutoUpdate) {
             this._renderNeeded = true;
             if (force)
                 this.render(time);
         }
-        this.emitEvent({ type: "update", force });
+        this.emitEvent({ type: "update", force: !!force });
     }
     render(time) {
         if (!this.visualizeJs)
@@ -4292,9 +4312,9 @@ class Viewer extends EventEmitter2 {
         this.clearOverlay();
         this.clearSelected();
         this.loaders.forEach((loader) => loader.dispose());
-        this.loaders = [];
+        this.loaders.length = 0;
         this.models.forEach((model) => model.dispose());
-        this.models = [];
+        this.models.length = 0;
         visViewer.clear();
         visViewer.createLocalDatabase();
         this.syncOptions();
@@ -4384,6 +4404,8 @@ class Viewer extends EventEmitter2 {
             visualStyleId.delete();
             activeView.delete();
         }
+        view.setEnableCuttingPlaneFill(options.enableSectionFill, options.sectionFillColor.r, options.sectionFillColor.g, options.sectionFillColor.b);
+        view.setCuttingPlaneFillPatternEnabled(options.enableSectionHatch, visLib.CuttingPlaneFillStyle.kSlantRight, options.sectionHatchColor.r, options.sectionHatchColor.g, options.sectionHatchColor.b);
         const params = options.enableCustomHighlight ? options : Options.defaults();
         const { Entry, OdTvRGBColorDef } = visLib;
         const highlightStyleId = visViewer.findHighlightStyle("Web_Default");
@@ -4455,6 +4477,7 @@ class Viewer extends EventEmitter2 {
         const activeView = visViewer.activeView;
         activeView.removeCuttingPlanes();
         activeView.delete();
+        this.emitEvent({ type: "changecuttingplanes" });
         this.emitEvent({ type: "clearslices" });
         this.update();
     }
@@ -4523,7 +4546,7 @@ class Viewer extends EventEmitter2 {
         }
     }
     getComponent(name) {
-        return this._components.find((component) => component.name === name);
+        return this._components.find((component) => component.name === name) || null;
     }
     drawViewpoint(viewpoint) {
         var _a, _b;
@@ -4566,6 +4589,7 @@ class Viewer extends EventEmitter2 {
                     activeView.addCuttingPlane(cuttingPlane);
                     activeView.setEnableCuttingPlaneFill(true, 0x66, 0x66, 0x66);
                 }
+                this.emitEvent({ type: "changecuttingplanes" });
             }
         };
         const setSelection = (selection) => {