@vertexvis/viewer 0.13.2-canary.9 → 0.14.0

package/dist/collection/components/viewer-pin-tool/viewer-pin-tool.js

@@ -0,0 +1,277 @@
+import { Component, Element, 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+h, Host, Prop, State, Watch, } from '@stencil/core';
+import { PinController } from '../../lib/pins/controller';
+import { PinsInteractionHandler } from '../../lib/pins/interactions';
+import { PinModel, } from '../../lib/pins/model';
+import { getMarkupBoundingClientRect } from '../viewer-markup/dom';
+export class ViewerPinTool {
+  constructor() {
+    /**
+     * The model that contains the entities and outcomes from performing pin annotations
+     */
+    this.pinModel = new PinModel();
+    this.pins = [];
+    /**
+     * The type of pin.
+     *
+     * This property will automatically be set.
+     */
+    this.tool = 'pin';
+    /**
+     * The mode of the pin tool
+     */
+    this.mode = 'view';
+    this.handleSetProjectionMatrix = () => {
+      var _a, _b;
+      this.projectionViewMatrix =
+        (_b = (_a = this.viewer) === null || _a === void 0 ? void 0 : _a.frame) === null || _b === void 0 ? void 0 : _b.scene.camera.projectionViewMatrix;
+    };
+  }
+  /**
+   * @ignore
+   */
+  watchModeChange() {
+    var _a;
+    (_a = this.pinController) === null || _a === void 0 ? void 0 : _a.setToolMode(this.mode);
+    this.setupInteractionHandler();
+  }
+  /**
+   * @ignore
+   */
+  watchTypeChange() {
+    var _a;
+    (_a = this.pinController) === null || _a === void 0 ? void 0 : _a.setToolType(this.tool);
+    this.setupInteractionHandler();
+  }
+  /**
+   * @ignore
+   */
+  connectedCallback() {
+    this.setupInteractionHandler();
+  }
+  /**
+   * @ignore
+   */
+  componentWillLoad() {
+    this.updateViewport();
+    this.setupController();
+    this.setupInteractionHandler();
+    this.pinModel.onEntitiesChanged((entities) => {
+      this.pins = entities;
+    });
+    this.pinModel.onSelectionChange((selectedId) => {
+      this.selectedPinId = selectedId;
+    });
+  }
+  componentDidLoad() {
+    this.resizeObserver = new ResizeObserver(() => this.updateViewport());
+    this.resizeObserver.observe(this.hostEl);
+  }
+  /**
+   * @ignore
+   */
+  disconnectedCallback() {
+    this.clearInteractionHandler();
+    this.clearModelListeners();
+  }
+  /**
+   * @ignore
+   */
+  handleViewerChanged(newViewer, oldViewer) {
+    this.setupInteractionHandler();
+    if (oldViewer != null) {
+      oldViewer.removeEventListener('frameDrawn', this.handleSetProjectionMatrix);
+    }
+    if (newViewer != null) {
+      newViewer.addEventListener('frameDrawn', this.handleSetProjectionMatrix);
+    }
+    this.handleSetProjectionMatrix();
+  }
+  render() {
+    return (h(Host, null,
+      h("vertex-viewer-dom-renderer", { viewer: this.viewer, drawMode: "2d" }, this.pins.map((pin) => {
+        return (h("vertex-viewer-pin-group", { id: `pin-group-${pin.id}`, "data-is-dom-group-element": true, pin: pin, elementBounds: this.elementBounds, pinModel: this.pinModel, pinController: this.pinController, projectionViewMatrix: this.projectionViewMatrix, selected: this.selectedPinId === pin.id }));
+      }))));
+  }
+  setupController() {
+    this.pinController = new PinController(this.pinModel, this.mode, this.tool);
+  }
+  clearInteractionHandler() {
+    var _a;
+    (_a = this.registeredInteractionHandler) === null || _a === void 0 ? void 0 : _a.then((handler) => handler.dispose());
+    this.registeredInteractionHandler = undefined;
+  }
+  setupInteractionHandler() {
+    var _a;
+    this.clearInteractionHandler();
+    if (this.pinController != null) {
+      this.registeredInteractionHandler =
+        (_a = this.viewer) === null || _a === void 0 ? void 0 : _a.registerInteractionHandler(new PinsInteractionHandler(this.pinController));
+    }
+  }
+  clearModelListeners() {
+    var _a, _b;
+    (_a = this.onEntitiesChangedHandler) === null || _a === void 0 ? void 0 : _a.dispose();
+    this.onEntitiesChangedHandler = undefined;
+    (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+  }
+  updateViewport() {
+    const rect = getMarkupBoundingClientRect(this.hostEl);
+    this.elementBounds = rect;
+  }
+  static get is() { return "vertex-viewer-pin-tool"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["viewer-pin-tool.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["viewer-pin-tool.css"]
+  }; }
+  static get properties() { return {
+    "pinController": {
+      "type": "unknown",
+      "mutable": true,
+      "complexType": {
+        "original": "PinController",
+        "resolved": "PinController | undefined",
+        "references": {
+          "PinController": {
+            "location": "import",
+            "path": "../../lib/pins/controller"
+          }
+        }
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "The controller that is responsible for drawing pins and updating the model"
+      }
+    },
+    "pinModel": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "PinModel",
+        "resolved": "PinModel",
+        "references": {
+          "PinModel": {
+            "location": "import",
+            "path": "../../lib/pins/model"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The model that contains the entities and outcomes from performing pin annotations"
+      },
+      "defaultValue": "new PinModel()"
+    },
+    "pins": {
+      "type": "unknown",
+      "mutable": true,
+      "complexType": {
+        "original": "Pin[]",
+        "resolved": "Pin[]",
+        "references": {
+          "Pin": {
+            "location": "import",
+            "path": "../../lib/pins/model"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "defaultValue": "[]"
+    },
+    "viewer": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "HTMLVertexViewerElement",
+        "resolved": "HTMLVertexViewerElement | undefined",
+        "references": {
+          "HTMLVertexViewerElement": {
+            "location": "global"
+          }
+        }
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "The viewer that this component is bound to. This is automatically assigned\nif added to the light-dom of a parent viewer element."
+      }
+    },
+    "tool": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "ViewerPinToolType",
+        "resolved": "\"pin\" | \"pin-label\"",
+        "references": {
+          "ViewerPinToolType": {
+            "location": "import",
+            "path": "../../lib/pins/model"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The type of pin.\n\nThis property will automatically be set."
+      },
+      "attribute": "tool",
+      "reflect": false,
+      "defaultValue": "'pin'"
+    },
+    "mode": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "ViewerPinToolMode",
+        "resolved": "\"edit\" | \"view\"",
+        "references": {
+          "ViewerPinToolMode": {
+            "location": "import",
+            "path": "../../lib/pins/model"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The mode of the pin tool"
+      },
+      "attribute": "mode",
+      "reflect": false,
+      "defaultValue": "'view'"
+    }
+  }; }
+  static get states() { return {
+    "selectedPinId": {},
+    "elementBounds": {},
+    "projectionViewMatrix": {}
+  }; }
+  static get elementRef() { return "hostEl"; }
+  static get watchers() { return [{
+      "propName": "mode",
+      "methodName": "watchModeChange"
+    }, {
+      "propName": "tool",
+      "methodName": "watchTypeChange"
+    }, {
+      "propName": "viewer",
+      "methodName": "handleViewerChanged"
+    }]; }
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmlld2VyLXBpbi10b29sLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdmlld2VyLXBpbi10b29sL3ZpZXdlci1waW4tdG9vbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxPQUFPO0FBQ1AsNkRBQTZEO0FBQzdELENBQUMsRUFDRCxJQUFJLEVBQ0osSUFBSSxFQUNKLEtBQUssRUFDTCxLQUFLLEdBQ04sTUFBTSxlQUFlLENBQUM7QUFJdkIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzFELE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBQ3JFLE9BQU8sRUFFTCxRQUFRLEdBR1QsTUFBTSxzQkFBc0IsQ0FBQztBQUM5QixPQUFPLEVBQUUsMkJBQTJCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQztBQU9uRSxNQUFNLE9BQU8sYUFBYTtFQUwxQjtJQVlFOztPQUVHO0lBRUksYUFBUSxHQUFhLElBQUksUUFBUSxFQUFFLENBQUM7SUFHcEMsU0FBSSxHQUFVLEVBQUUsQ0FBQztJQVl4Qjs7OztPQUlHO0lBRUksU0FBSSxHQUFzQixLQUFLLENBQUM7SUFFdkM7O09BRUc7SUFFSSxTQUFJLEdBQXNCLE1BQU0sQ0FBQztJQStGaEMsOEJBQXlCLEdBQUcsR0FBUyxFQUFFOztNQUM3QyxJQUFJLENBQUMsb0JBQW9CO1FBQ3ZCLE1BQUEsTUFBQSxJQUFJLENBQUMsTUFBTSwwQ0FBRSxLQUFLLDBDQUFFLEtBQUssQ0FBQyxNQUFNLENBQUMsb0JBQW9CLENBQUM7SUFDMUQsQ0FBQyxDQUFDO0dBdURIO0VBeklDOztLQUVHO0VBRU8sZUFBZTs7SUFDdkIsTUFBQSxJQUFJLENBQUMsYUFBYSwwQ0FBRSxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzNDLElBQUksQ0FBQyx1QkFBdUIsRUFBRSxDQUFDO0VB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

package/dist/collection/components/viewer-transform-widget/__mocks__/widget.js

@@ -0,0 +1,21 @@
+const mockTransformWidgetConstructor = jest.fn();
+const mockBoundsContainsPoint = jest.fn();
+const mockOnHoveredChanged = jest.fn();
+const mockUpdateTransform = jest.fn();
+const mockUpdateFrame = jest.fn();
+const mockUpdateCursor = jest.fn();
+const mockUpdateColors = jest.fn();
+const mockUpdateDimensions = jest.fn();
+export class TransformWidget {
+  constructor(...args) {
+    this.boundsContainsPoint = mockBoundsContainsPoint;
+    this.onHoveredChanged = mockOnHoveredChanged;
+    this.updateTransform = mockUpdateTransform;
+    this.updateFrame = mockUpdateFrame;
+    this.updateCursor = mockUpdateCursor;
+    this.updateColors = mockUpdateColors;
+    this.updateDimensions = mockUpdateDimensions;
+    mockTransformWidgetConstructor(...args);
+  }
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdmlld2VyLXRyYW5zZm9ybS13aWRnZXQvX19tb2Nrc19fL3dpZGdldC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxNQUFNLDhCQUE4QixHQUFHLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztBQUNqRCxNQUFNLHVCQUF1QixHQUFHLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztBQUMxQyxNQUFNLG9CQUFvQixHQUFHLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztBQUN2QyxNQUFNLG1CQUFtQixHQUFHLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztBQUN0QyxNQUFNLGVBQWUsR0FBRyxJQUFJLENBQUMsRUFBRSxFQUFFLENBQUM7QUFDbEMsTUFBTSxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsRUFBRSxFQUFFLENBQUM7QUFDbkMsTUFBTSxnQkFBZ0IsR0FBRyxJQUFJLENBQUMsRUFBRSxFQUFFLENBQUM7QUFDbkMsTUFBTSxvQkFBb0IsR0FBRyxJQUFJLENBQUMsRUFBRSxFQUFFLENBQUM7QUFFdkMsTUFBTSxPQUFPLGVBQWU7RUFTMUIsWUFBbUIsR0FBRyxJQUFlO0lBUjlCLHdCQUFtQixHQUFHLHVCQUF1QixDQUFDO0lBQzlDLHFCQUFnQixHQUFHLG9CQUFvQixDQUFDO0lBQ3hDLG9CQUFlLEdBQUcsbUJBQW1CLENBQUM7SUFDdEMsZ0JBQVcsR0FBRyxlQUFlLENBQUM7SUFDOUIsaUJBQVksR0FBRyxnQkFBZ0IsQ0FBQztJQUNoQyxpQkFBWSxHQUFHLGdCQUFnQixDQUFDO0lBQ2hDLHFCQUFnQixHQUFHLG9CQUFvQixDQUFDO0lBRzdDLDhCQUE4QixDQUFDLEdBQUcsSUFBSSxDQUFDLENBQUM7RUFDMUMsQ0FBQztDQUNGIn0=

package/dist/collection/components/viewer-transform-widget/util.js

@@ -0,0 +1,78 @@
+import { Matrix4, Plane, Point, Quaternion, Ray, Vector3, } from '@vertexvis/geometry';
+export function convertPointToCanvas(point, bounds) {
+  return bounds != null
+    ? Point.create(point.x - bounds.left, point.y - bounds.top)
+    : undefined;
+}
+export function convertCanvasPointToWorld(point, frame, viewport, transform) {
+  const position = transform != null ? Vector3.fromMatrixPosition(transform) : undefined;
+  if (point != null && frame != null && viewport != null && position != null) {
+    if (frame.scene.camera.isOrthographic()) {
+      const ray = viewport.transformPointToOrthographicRay(point, frame.image, frame.scene.camera);
+      // Offset the point to past the bounding sphere of the model to
+      // adjust the position plane location.
+      const offsetPoint = Ray.at(Ray.create({
+        origin: position,
+        direction: frame.scene.camera.direction,
+      }), Vector3.magnitude(frame.scene.camera.viewVector) * 2);
+      return Ray.intersectPlane(ray, Plane.fromNormalAndCoplanarPoint(frame.scene.camera.direction, offsetPoint));
+    }
+    else {
+      const ray = viewport.transformPointToRay(point, frame.image, frame.scene.camera);
+      return Ray.intersectPlane(ray, Plane.fromNormalAndCoplanarPoint(frame.scene.camera.direction, position));
+    }
+  }
+  return undefined;
+}
+export function computeUpdatedTransform(current, previous, next, viewVector, angle, identifier) {
+  switch (identifier) {
+    case 'x-translate': {
+      return Matrix4.multiply(current, Matrix4.makeTranslation(Vector3.create(computeTranslation(current, previous, next, Vector3.right()), 0, 0)));
+    }
+    case 'y-translate':
+      return Matrix4.multiply(current, Matrix4.makeTranslation(Vector3.create(0, computeTranslation(current, previous, next, Vector3.up()), 0)));
+    case 'z-translate':
+      return Matrix4.multiply(current, Matrix4.makeTranslation(Vector3.create(0, 0, computeTranslation(current, previous, next, Vector3.back()))));
+    case 'x-rotate': {
+      const rotation = Quaternion.fromMatrixRotation(current);
+      const rotatedRight = Vector3.transformMatrix(Vector3.right(), Matrix4.makeRotation(rotation));
+      const rotatedLeft = Vector3.transformMatrix(Vector3.left(), Matrix4.makeRotation(rotation));
+      const rotationAxis = Vector3.dot(viewVector, rotatedRight) >
+        Vector3.dot(viewVector, rotatedLeft)
+        ? rotatedRight
+        : rotatedLeft;
+      return computeRotation(Quaternion.fromAxisAngle(rotationAxis, angle), current);
+    }
+    case 'y-rotate': {
+      const rotation = Quaternion.fromMatrixRotation(current);
+      const rotatedUp = Vector3.transformMatrix(Vector3.up(), Matrix4.makeRotation(rotation));
+      const rotatedDown = Vector3.transformMatrix(Vector3.down(), Matrix4.makeRotation(rotation));
+      const rotationAxis = Vector3.dot(viewVector, rotatedUp) >
+        Vector3.dot(viewVector, rotatedDown)
+        ? rotatedUp
+        : rotatedDown;
+      return computeRotation(Quaternion.fromAxisAngle(rotationAxis, angle), current);
+    }
+    case 'z-rotate': {
+      const rotation = Quaternion.fromMatrixRotation(current);
+      const rotatedForward = Vector3.transformMatrix(Vector3.forward(), Matrix4.makeRotation(rotation));
+      const rotatedBack = Vector3.transformMatrix(Vector3.back(), Matrix4.makeRotation(rotation));
+      const rotationAxis = Vector3.dot(viewVector, rotatedForward) >
+        Vector3.dot(viewVector, rotatedBack)
+        ? rotatedForward
+        : rotatedBack;
+      return computeRotation(Quaternion.fromAxisAngle(rotationAxis, angle), current);
+    }
+    default:
+      return current;
+  }
+}
+function computeTranslation(current, previous, next, direction) {
+  const rotatedTranslationAxis = Vector3.transformMatrix(direction, Matrix4.makeRotation(Quaternion.fromMatrixRotation(current)));
+  const rotatedDelta = Vector3.multiply(rotatedTranslationAxis, Vector3.subtract(next, previous));
+  return rotatedDelta.x + rotatedDelta.y + rotatedDelta.z;
+}
+function computeRotation(rotationAxis, current) {
+  return Matrix4.multiply(Matrix4.multiply(Matrix4.multiply(Matrix4.makeTranslation(Vector3.fromMatrixPosition(current)), Matrix4.makeRotation(rotationAxis)), Matrix4.makeTranslation(Vector3.negate(Vector3.fromMatrixPosition(current)))), current);
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXRpbC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3ZpZXdlci10cmFuc2Zvcm0td2lkZ2V0L3V0aWwudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLE9BQU8sRUFDUCxLQUFLLEVBQ0wsS0FBSyxFQUNMLFVBQVUsRUFDVixHQUFHLEVBQ0gsT0FBTyxHQUNSLE1BQU0scUJBQXFCLENBQUM7QUFJN0IsTUFBTSxVQUFVLG9CQUFvQixDQUNsQyxLQUFrQixFQUNsQixNQUFnQjtFQUVoQixPQUFPLE1BQU0sSUFBSSxJQUFJO0lBQ25CLENBQUMsQ0FBQyxLQUFLLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDLEdBQUcsTUFBTSxDQUFDLElBQUksRUFBRSxLQUFLLENBQUMsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUM7SUFDM0QsQ0FBQyxDQUFDLFNBQVMsQ0FBQztBQUNoQixDQUFDO0FBRUQsTUFBTSxVQUFVLHlCQUF5QixDQUN2QyxLQUFtQixFQUNuQixLQUFhLEVBQ2IsUUFBbUIsRUFDbkIsU0FBMkI7RUFFM0IsTUFBTSxRQUFRLEdBQ1osU0FBUyxJQUFJLElBQUksQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLGtCQUFrQixDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7RUFFeEUsSUFBSSxLQUFLLElBQUksSUFBSSxJQUFJLEtBQUssSUFBSSxJQUFJLElBQUksUUFBUSxJQUFJLElBQUksSUFBSSxRQUFRLElBQUksSUFBSSxFQUFFO0lBQzFFLElBQUksS0FBSyxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsY0FBYyxFQUFFLEVBQUU7TUFDdkMsTUFBTSxHQUFHLEdBQUcsUUFBUSxDQUFDLCtCQUErQixDQUNsRCxLQUFLLEVBQ0wsS0FBSyxDQUFDLEtBQUssRUFDWCxLQUFLLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FDbkIsQ0FBQztNQUNGLCtEQUEr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

package/dist/collection/components/viewer-transform-widget/viewer-transform-widget.css

@@ -0,0 +1,48 @@
+:host {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  pointer-events: none;
+  /**
+  * @prop --viewer-transform-widget-x-axis-arrow-color: A CSS color for the arrow
+  * at the end of the X axis on this widget. Defaults to `#ea3324`.
+  */
+  --viewer-transform-widget-x-axis-arrow-color: var(--x-axis-color);
+
+  /**
+  * @prop --viewer-transform-widget-y-axis-arrow-color: A CSS color for the arrow
+  * at the end of the Y axis on this widget. Defaults to `#4faf32`.
+  */
+  --viewer-transform-widget-y-axis-arrow-color: var(--y-axis-color);
+
+  /**
+  * @prop --viewer-transform-widget-z-axis-arrow-color: A CSS color for the arrow
+  * at the end of the Z axis on this widget. Defaults to `#0000ff`.
+  */
+  --viewer-transform-widget-z-axis-arrow-color: var(--z-axis-color);
+
+
+  /**
+  * @prop --viewer-transform-widget-hovered-arrow-color: A CSS color for the arrow
+  * when it is hovered. Defaults to `#ffff00`.
+  */
+  --viewer-transform-widget-hovered-arrow-color: #ffff00;
+
+  /**
+  * @prop --viewer-transform-widget-disabled-arrow-color: A CSS color for the arrow
+  * when it is disabled. Defaults to `#cccccc`.
+  */
+  --viewer-transform-widget-disabled-arrow-color: #cccccc;
+}
+
+.widget {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.widget.hovered {
+  pointer-events: auto;
+}