@operato/scene-urdf 10.0.0-beta.2 → 10.0.0-beta.22

package/dist/elements/urdf-controller-element.js

@@ -1,283 +0,0 @@
-import { __decorate } from "tslib";
-import { LitElement, css, html } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import * as THREE from 'three';
-import { registerDragEvents } from './drag-n-drop.js';
-import { ScrollbarStyles } from '@operato/styles';
-const DEG2RAD = Math.PI / 180;
-const RAD2DEG = 1 / DEG2RAD;
-let URDFControllerElement = class URDFControllerElement extends LitElement {
-    static styles = [
-        ScrollbarStyles,
-        css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        width: 100%;
-        margin: 15px 0;
-        overflow: hidden;
-        user-select: none;
-      }
-
-      :host > * {
-        margin: 5px 0;
-      }
-
-      input[type='number'] {
-        color: white;
-        border: none;
-        font-weight: 300;
-        background: rgba(255, 255, 255, 0.25);
-        padding: 1px 2px;
-      }
-
-      ul {
-        list-style: none;
-        padding: 0;
-        margin: 0;
-      }
-
-      input[type='range'] {
-        -webkit-appearance: none;
-        border: none;
-        outline: none;
-        width: 100%;
-        flex: 1;
-        height: 16px;
-        background-color: transparent;
-      }
-      input[type='range']::-webkit-slider-runnable-track {
-        width: 100%;
-        height: 1px;
-        background: white;
-        border: none;
-        border-radius: 5px;
-      }
-      input[type='range']::-webkit-slider-thumb {
-        -webkit-appearance: none;
-        border: none;
-        height: 10px;
-        width: 10px;
-        border-radius: 50%;
-        background: white;
-        margin-top: -5px;
-      }
-      input[type='range']:focus {
-        outline: none;
-      }
-      input[type='range']:focus::-webkit-slider-runnable-track {
-        background: white;
-      }
-
-      input[type='range']::-moz-range-track {
-        width: 100%;
-        height: 1px;
-        background: white;
-        border: none;
-        border-radius: 5px;
-      }
-      input[type='range']::-moz-range-thumb {
-        border: none;
-        height: 10px;
-        width: 10px;
-        border-radius: 50%;
-        background: white;
-      }
-
-      input[type='range']:-moz-focusring {
-        outline: 1px solid white;
-        outline-offset: -1px;
-      }
-
-      input[type='range']::-ms-track {
-        width: 100%;
-        height: 1px;
-        background: white;
-        border-radius: 10px;
-        color: transparent;
-        border: none;
-        outline: none;
-      }
-      input[type='range']::-ms-thumb {
-        height: 10px;
-        width: 10px;
-        border-radius: 50%;
-        background: white;
-        border: none;
-        outline: none;
-        margin-top: 2px;
-      }
-
-      input:focus {
-        outline: none;
-        opacity: 1;
-      }
-
-      /* list of joint sliders */
-      ul {
-        flex: 1;
-        overflow-y: auto;
-      }
-
-      li {
-        font-size: 16px;
-        display: flex;
-        align-items: center;
-        padding: 1px 0;
-
-        width: 100%;
-        user-select: text;
-
-        transition: background 0.25s ease;
-      }
-
-      li[robot-hovered] {
-        background: rgba(255, 255, 255, 0.35);
-      }
-
-      li:hover {
-        background: rgba(255, 255, 255, 0.35);
-      }
-
-      li span {
-        padding: 0 5px;
-        max-width: 125px;
-        text-overflow: ellipsis;
-        overflow: hidden;
-      }
-
-      li input[type='number'] {
-        width: 50px;
-        overflow: hidden;
-      }
-    `
-    ];
-    viewer;
-    robot;
-    render() {
-        const { joints = {} } = this.robot || {};
-        const { ignoreLimits = false } = this.viewer || {};
-        const jointsArray = Object.values(joints);
-        return html `
-      <ul>
-        ${jointsArray.map(joint => {
-            var { jointType, name, angle, limit } = joint;
-            var degVal = Number(angle || 0);
-            if (jointType === 'revolute' || jointType === 'continuous') {
-                degVal *= RAD2DEG;
-            }
-            if (Math.abs(degVal) > 1) {
-                degVal = degVal.toFixed(1);
-            }
-            else {
-                degVal = degVal.toPrecision(2);
-            }
-            var sliderMin;
-            var sliderMax;
-            var inputMin;
-            var inputMax;
-            if (ignoreLimits || jointType === 'continuous') {
-                sliderMin = -6.28;
-                sliderMax = 6.28;
-                inputMin = -6.28 * RAD2DEG;
-                inputMax = 6.28 * RAD2DEG;
-            }
-            else {
-                sliderMin = limit.lower;
-                sliderMax = limit.upper;
-                inputMin = Number(limit.lower) * RAD2DEG;
-                inputMax = Number(limit.upper) * RAD2DEG;
-            }
-            return html `
-            <li joint-type=${jointType} joint-name=${name}>
-              <span title=${name}>${name}</span>
-              <input
-                type="range"
-                .value=${String(angle)}
-                step="0.0001"
-                min=${sliderMin}
-                max=${sliderMax}
-                @input=${(e) => {
-                this.viewer?.setJointValue(name, e.target.value);
-            }}
-              />
-              <input
-                type="number"
-                .value=${degVal}
-                step="0.0001"
-                min=${inputMin}
-                max=${inputMax}
-                @change=${(e) => {
-                this.viewer?.setJointValue(name, Number(e.target.value) * DEG2RAD);
-            }}
-              />
-            </li>
-          `;
-        })}
-      </ul>
-    `;
-    }
-    updated(changes) {
-        if (changes.has('viewer')) {
-            this._setupViewer(this.viewer);
-        }
-    }
-    _setupViewer(viewer) {
-        if (!viewer) {
-            return;
-        }
-        this.robot = viewer.robot;
-        viewer.addEventListener('urdf-processed', () => {
-            this.robot = viewer.robot;
-        });
-        viewer.addEventListener('ignore-limits-change', () => {
-            this.requestUpdate();
-        });
-        viewer.addEventListener('angle-change', (e) => {
-            this.requestUpdate();
-        });
-        viewer.addEventListener('joint-mouseover', (e) => {
-            const j = this.renderRoot.querySelector(`li[joint-name="${e.detail}"]`);
-            if (j) {
-                j.setAttribute('robot-hovered', 'true');
-            }
-        });
-        viewer.addEventListener('joint-mouseout', (e) => {
-            const j = this.renderRoot.querySelector(`li[joint-name="${e.detail}"]`);
-            if (j) {
-                j.removeAttribute('robot-hovered');
-            }
-        });
-        let originalNoAutoRecenter;
-        viewer.addEventListener('manipulate-start', (e) => {
-            const j = this.renderRoot.querySelector(`li[joint-name="${e.detail}"]`);
-            if (j) {
-                // ??
-                j.scrollIntoView({ block: 'nearest' });
-                window.scrollTo(0, 0);
-            }
-            originalNoAutoRecenter = viewer.noAutoRecenter;
-            viewer.noAutoRecenter = true;
-        });
-        viewer.addEventListener('manipulate-end', (e) => {
-            viewer.noAutoRecenter = originalNoAutoRecenter;
-        });
-        registerDragEvents(viewer, () => {
-            this.setColor('#263238');
-        });
-    }
-    setColor(color) {
-        this.viewer.highlightColor = '#' + new THREE.Color(0xffffff).lerp(new THREE.Color(color), 0.35).getHexString();
-    }
-};
-__decorate([
-    property({ type: Object })
-], URDFControllerElement.prototype, "viewer", void 0);
-__decorate([
-    property({ type: Object })
-], URDFControllerElement.prototype, "robot", void 0);
-URDFControllerElement = __decorate([
-    customElement('urdf-controller')
-], URDFControllerElement);
-export default URDFControllerElement;
-//# sourceMappingURL=urdf-controller-element.js.map

package/dist/elements/urdf-controller-element.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"urdf-controller-element.js","sourceRoot":"","sources":["../../src/elements/urdf-controller-element.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, css, html, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport * as THREE from 'three'\nimport { registerDragEvents } from './drag-n-drop.js'\nimport { ScrollbarStyles } from '@operato/styles'\nimport { URDFRobot } from 'urdf-loader'\nimport URDFManipulatorElement from './urdf-manipulator-element.js'\n\nconst DEG2RAD = Math.PI / 180\nconst RAD2DEG = 1 / DEG2RAD\n\n@customElement('urdf-controller')\nexport default class URDFControllerElement extends LitElement {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        width: 100%;\n        margin: 15px 0;\n        overflow: hidden;\n        user-select: none;\n      }\n\n      :host > * {\n        margin: 5px 0;\n      }\n\n      input[type='number'] {\n        color: white;\n        border: none;\n        font-weight: 300;\n        background: rgba(255, 255, 255, 0.25);\n        padding: 1px 2px;\n      }\n\n      ul {\n        list-style: none;\n        padding: 0;\n        margin: 0;\n      }\n\n      input[type='range'] {\n        -webkit-appearance: none;\n        border: none;\n        outline: none;\n        width: 100%;\n        flex: 1;\n        height: 16px;\n        background-color: transparent;\n      }\n      input[type='range']::-webkit-slider-runnable-track {\n        width: 100%;\n        height: 1px;\n        background: white;\n        border: none;\n        border-radius: 5px;\n      }\n      input[type='range']::-webkit-slider-thumb {\n        -webkit-appearance: none;\n        border: none;\n        height: 10px;\n        width: 10px;\n        border-radius: 50%;\n        background: white;\n        margin-top: -5px;\n      }\n      input[type='range']:focus {\n        outline: none;\n      }\n      input[type='range']:focus::-webkit-slider-runnable-track {\n        background: white;\n      }\n\n      input[type='range']::-moz-range-track {\n        width: 100%;\n        height: 1px;\n        background: white;\n        border: none;\n        border-radius: 5px;\n      }\n      input[type='range']::-moz-range-thumb {\n        border: none;\n        height: 10px;\n        width: 10px;\n        border-radius: 50%;\n        background: white;\n      }\n\n      input[type='range']:-moz-focusring {\n        outline: 1px solid white;\n        outline-offset: -1px;\n      }\n\n      input[type='range']::-ms-track {\n        width: 100%;\n        height: 1px;\n        background: white;\n        border-radius: 10px;\n        color: transparent;\n        border: none;\n        outline: none;\n      }\n      input[type='range']::-ms-thumb {\n        height: 10px;\n        width: 10px;\n        border-radius: 50%;\n        background: white;\n        border: none;\n        outline: none;\n        margin-top: 2px;\n      }\n\n      input:focus {\n        outline: none;\n        opacity: 1;\n      }\n\n      /* list of joint sliders */\n      ul {\n        flex: 1;\n        overflow-y: auto;\n      }\n\n      li {\n        font-size: 16px;\n        display: flex;\n        align-items: center;\n        padding: 1px 0;\n\n        width: 100%;\n        user-select: text;\n\n        transition: background 0.25s ease;\n      }\n\n      li[robot-hovered] {\n        background: rgba(255, 255, 255, 0.35);\n      }\n\n      li:hover {\n        background: rgba(255, 255, 255, 0.35);\n      }\n\n      li span {\n        padding: 0 5px;\n        max-width: 125px;\n        text-overflow: ellipsis;\n        overflow: hidden;\n      }\n\n      li input[type='number'] {\n        width: 50px;\n        overflow: hidden;\n      }\n    `\n  ]\n\n  @property({ type: Object }) viewer?: URDFManipulatorElement\n  @property({ type: Object }) robot?: URDFRobot\n\n  render() {\n    const { joints = {} } = this.robot || {}\n    const { ignoreLimits = false } = this.viewer || {}\n    const jointsArray = Object.values(joints)\n\n    return html`\n      <ul>\n        ${jointsArray.map(joint => {\n          var { jointType, name, angle, limit } = joint\n          var degVal: number | string = Number(angle || 0)\n\n          if (jointType === 'revolute' || jointType === 'continuous') {\n            degVal *= RAD2DEG\n          }\n\n          if (Math.abs(degVal) > 1) {\n            degVal = degVal.toFixed(1)\n          } else {\n            degVal = degVal.toPrecision(2)\n          }\n\n          var sliderMin\n          var sliderMax\n          var inputMin\n          var inputMax\n\n          if (ignoreLimits || jointType === 'continuous') {\n            sliderMin = -6.28\n            sliderMax = 6.28\n\n            inputMin = -6.28 * RAD2DEG\n            inputMax = 6.28 * RAD2DEG\n          } else {\n            sliderMin = limit.lower\n            sliderMax = limit.upper\n\n            inputMin = Number(limit.lower) * RAD2DEG\n            inputMax = Number(limit.upper) * RAD2DEG\n          }\n\n          return html`\n            <li joint-type=${jointType} joint-name=${name}>\n              <span title=${name}>${name}</span>\n              <input\n                type=\"range\"\n                .value=${String(angle)}\n                step=\"0.0001\"\n                min=${sliderMin}\n                max=${sliderMax}\n                @input=${(e: Event) => {\n                  this.viewer?.setJointValue(name, (e.target as any).value)\n                }}\n              />\n              <input\n                type=\"number\"\n                .value=${degVal}\n                step=\"0.0001\"\n                min=${inputMin}\n                max=${inputMax}\n                @change=${(e: Event) => {\n                  this.viewer?.setJointValue(name, Number((e.target as HTMLInputElement).value) * DEG2RAD)\n                }}\n              />\n            </li>\n          `\n        })}\n      </ul>\n    `\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('viewer')) {\n      this._setupViewer(this.viewer)\n    }\n  }\n\n  _setupViewer(viewer?: URDFManipulatorElement) {\n    if (!viewer) {\n      return\n    }\n\n    this.robot = viewer.robot\n\n    viewer.addEventListener('urdf-processed', () => {\n      this.robot = viewer.robot\n    })\n\n    viewer.addEventListener('ignore-limits-change', () => {\n      this.requestUpdate()\n    })\n\n    viewer.addEventListener('angle-change', (e: Event) => {\n      this.requestUpdate()\n    })\n\n    viewer.addEventListener('joint-mouseover', (e: Event) => {\n      const j = this.renderRoot.querySelector(`li[joint-name=\"${(e as CustomEvent).detail}\"]`)\n      if (j) {\n        j.setAttribute('robot-hovered', 'true')\n      }\n    })\n\n    viewer.addEventListener('joint-mouseout', (e: Event) => {\n      const j = this.renderRoot.querySelector(`li[joint-name=\"${(e as CustomEvent).detail}\"]`)\n      if (j) {\n        j.removeAttribute('robot-hovered')\n      }\n    })\n\n    let originalNoAutoRecenter: boolean\n    viewer.addEventListener('manipulate-start', (e: Event) => {\n      const j = this.renderRoot.querySelector(`li[joint-name=\"${(e as CustomEvent).detail}\"]`)\n      if (j) {\n        // ??\n        j.scrollIntoView({ block: 'nearest' })\n        window.scrollTo(0, 0)\n      }\n\n      originalNoAutoRecenter = viewer.noAutoRecenter\n      viewer.noAutoRecenter = true\n    })\n\n    viewer.addEventListener('manipulate-end', (e: Event) => {\n      viewer.noAutoRecenter = originalNoAutoRecenter\n    })\n\n    registerDragEvents(viewer, () => {\n      this.setColor('#263238')\n    })\n  }\n\n  setColor(color: string) {\n    this.viewer!.highlightColor = '#' + new THREE.Color(0xffffff).lerp(new THREE.Color(color), 0.35).getHexString()\n  }\n}\n"]}

package/dist/elements/urdf-drag-controls.d.ts

@@ -1,32 +0,0 @@
-import { Raycaster, Vector3, Scene, Camera, Ray } from 'three';
-import { URDFJoint } from 'urdf-loader';
-export declare class URDFDragControls {
-    scene: Scene;
-    enabled: boolean;
-    raycaster: Raycaster;
-    initialGrabPoint: Vector3;
-    hitDistance: number;
-    hovered: any;
-    manipulating: any;
-    constructor(scene: Scene);
-    update(): void;
-    updateJoint(joint: URDFJoint, angle: number): void;
-    onDragStart(joint: URDFJoint): void;
-    onDragEnd(joint: URDFJoint): void;
-    onHover(joint: URDFJoint): void;
-    onUnhover(joint: URDFJoint): void;
-    getRevoluteDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3): number;
-    getPrismaticDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3): number;
-    moveRay(toRay: Ray): void;
-    setGrabbed(grabbed: boolean): void;
-}
-export declare class PointerURDFDragControls extends URDFDragControls {
-    camera: Camera;
-    domElement: HTMLElement;
-    _mouseDown: (e: MouseEvent) => void;
-    _mouseMove: (e: MouseEvent) => void;
-    _mouseUp: (e: MouseEvent) => void;
-    constructor(scene: Scene, camera: Camera, domElement: HTMLElement);
-    getRevoluteDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3): number;
-    dispose(): void;
-}

package/dist/elements/urdf-drag-controls.js

@@ -1,197 +0,0 @@
-import { Raycaster, Vector3, Plane, Vector2 } from 'three';
-// Find the nearest parent that is a joint
-function isJoint(j) {
-    return j.isURDFJoint && j.jointType !== 'fixed';
-}
-function findNearestJoint(child) {
-    let curr = child;
-    while (curr) {
-        if (isJoint(curr)) {
-            return curr;
-        }
-        curr = curr.parent;
-    }
-    return curr;
-}
-const prevHitPoint = new Vector3();
-const newHitPoint = new Vector3();
-const pivotPoint = new Vector3();
-const tempVector = new Vector3();
-const tempVector2 = new Vector3();
-const projectedStartPoint = new Vector3();
-const projectedEndPoint = new Vector3();
-const plane = new Plane();
-export class URDFDragControls {
-    scene;
-    enabled;
-    raycaster;
-    initialGrabPoint;
-    hitDistance;
-    hovered;
-    manipulating;
-    constructor(scene) {
-        this.enabled = true;
-        this.scene = scene;
-        this.raycaster = new Raycaster();
-        this.initialGrabPoint = new Vector3();
-        this.hitDistance = -1;
-        this.hovered = null;
-        this.manipulating = null;
-    }
-    update() {
-        const { raycaster, hovered, manipulating, scene } = this;
-        if (manipulating) {
-            return;
-        }
-        let hoveredJoint = null;
-        const intersections = raycaster.intersectObject(scene, true);
-        if (intersections.length !== 0) {
-            const hit = intersections[0];
-            this.hitDistance = hit.distance;
-            hoveredJoint = findNearestJoint(hit.object);
-            this.initialGrabPoint.copy(hit.point);
-        }
-        if (hoveredJoint !== hovered) {
-            if (hovered) {
-                this.onUnhover(hovered);
-            }
-            this.hovered = hoveredJoint;
-            if (hoveredJoint) {
-                this.onHover(hoveredJoint);
-            }
-        }
-    }
-    updateJoint(joint, angle) {
-        joint.setJointValue(angle);
-    }
-    onDragStart(joint) { }
-    onDragEnd(joint) { }
-    onHover(joint) { }
-    onUnhover(joint) { }
-    getRevoluteDelta(joint, startPoint, endPoint) {
-        // set up the plane
-        tempVector.copy(joint.axis).transformDirection(joint.matrixWorld).normalize();
-        pivotPoint.set(0, 0, 0).applyMatrix4(joint.matrixWorld);
-        plane.setFromNormalAndCoplanarPoint(tempVector, pivotPoint);
-        // project the drag points onto the plane
-        plane.projectPoint(startPoint, projectedStartPoint);
-        plane.projectPoint(endPoint, projectedEndPoint);
-        // get the directions relative to the pivot
-        projectedStartPoint.sub(pivotPoint);
-        projectedEndPoint.sub(pivotPoint);
-        tempVector.crossVectors(projectedStartPoint, projectedEndPoint);
-        const direction = Math.sign(tempVector.dot(plane.normal));
-        return direction * projectedEndPoint.angleTo(projectedStartPoint);
-    }
-    getPrismaticDelta(joint, startPoint, endPoint) {
-        tempVector.subVectors(endPoint, startPoint);
-        plane.normal.copy(joint.axis).transformDirection(joint.parent.matrixWorld).normalize();
-        return tempVector.dot(plane.normal);
-    }
-    moveRay(toRay) {
-        const { raycaster, hitDistance, manipulating } = this;
-        const { ray } = raycaster;
-        if (manipulating) {
-            ray.at(hitDistance, prevHitPoint);
-            toRay.at(hitDistance, newHitPoint);
-            let delta = 0;
-            if (manipulating.jointType === 'revolute' || manipulating.jointType === 'continuous') {
-                delta = this.getRevoluteDelta(manipulating, prevHitPoint, newHitPoint);
-            }
-            else if (manipulating.jointType === 'prismatic') {
-                delta = this.getPrismaticDelta(manipulating, prevHitPoint, newHitPoint);
-            }
-            if (delta) {
-                this.updateJoint(manipulating, manipulating.angle + delta);
-            }
-        }
-        this.raycaster.ray.copy(toRay);
-        this.update();
-    }
-    setGrabbed(grabbed) {
-        const { hovered, manipulating } = this;
-        if (grabbed) {
-            if (manipulating !== null || hovered === null) {
-                return;
-            }
-            this.manipulating = hovered;
-            this.onDragStart(hovered);
-        }
-        else {
-            if (this.manipulating === null) {
-                return;
-            }
-            this.onDragEnd(this.manipulating);
-            this.manipulating = null;
-            this.update();
-        }
-    }
-}
-export class PointerURDFDragControls extends URDFDragControls {
-    camera;
-    domElement;
-    _mouseDown;
-    _mouseMove;
-    _mouseUp;
-    constructor(scene, camera, domElement) {
-        super(scene);
-        this.camera = camera;
-        this.domElement = domElement;
-        const raycaster = new Raycaster();
-        const mouse = new Vector2();
-        function updateMouse(e) {
-            mouse.x = (e.offsetX / domElement.offsetWidth) * 2 - 1;
-            mouse.y = -(e.offsetY / domElement.offsetHeight) * 2 + 1;
-        }
-        this._mouseDown = (e) => {
-            updateMouse(e);
-            raycaster.setFromCamera(mouse, this.camera);
-            this.moveRay(raycaster.ray);
-            this.setGrabbed(true);
-        };
-        this._mouseMove = (e) => {
-            updateMouse(e);
-            raycaster.setFromCamera(mouse, this.camera);
-            this.moveRay(raycaster.ray);
-        };
-        this._mouseUp = (e) => {
-            updateMouse(e);
-            raycaster.setFromCamera(mouse, this.camera);
-            this.moveRay(raycaster.ray);
-            this.setGrabbed(false);
-        };
-        domElement.addEventListener('pointerdown', this._mouseDown);
-        domElement.addEventListener('pointermove', this._mouseMove);
-        domElement.addEventListener('pointerup', this._mouseUp);
-    }
-    getRevoluteDelta(joint, startPoint, endPoint) {
-        const { camera, initialGrabPoint } = this;
-        // set up the plane
-        tempVector.copy(joint.axis).transformDirection(joint.matrixWorld).normalize();
-        pivotPoint.set(0, 0, 0).applyMatrix4(joint.matrixWorld);
-        plane.setFromNormalAndCoplanarPoint(tempVector, pivotPoint);
-        tempVector.copy(camera.position).sub(initialGrabPoint).normalize();
-        // if looking into the plane of rotation
-        if (Math.abs(tempVector.dot(plane.normal)) > 0.3) {
-            return super.getRevoluteDelta(joint, startPoint, endPoint);
-        }
-        else {
-            // get the up direction
-            tempVector.set(0, 1, 0).transformDirection(camera.matrixWorld);
-            // get points projected onto the plane of rotation
-            plane.projectPoint(startPoint, projectedStartPoint);
-            plane.projectPoint(endPoint, projectedEndPoint);
-            tempVector.set(0, 0, -1).transformDirection(camera.matrixWorld);
-            tempVector.cross(plane.normal);
-            tempVector2.subVectors(endPoint, startPoint);
-            return tempVector.dot(tempVector2);
-        }
-    }
-    dispose() {
-        const { domElement } = this;
-        domElement.removeEventListener('pointerdown', this._mouseDown);
-        domElement.removeEventListener('pointermove', this._mouseMove);
-        domElement.removeEventListener('pointerup', this._mouseUp);
-    }
-}
-//# sourceMappingURL=urdf-drag-controls.js.map

package/dist/elements/urdf-drag-controls.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"urdf-drag-controls.js","sourceRoot":"","sources":["../../src/elements/urdf-drag-controls.ts"],"names":[],"mappings":"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","sourcesContent":["import { Raycaster, Vector3, Plane, Vector2, Scene, Camera, Object3D, Ray } from 'three'\nimport { URDFJoint } from 'urdf-loader'\n\n// Find the nearest parent that is a joint\nfunction isJoint(j: URDFJoint) {\n  return j.isURDFJoint && j.jointType !== 'fixed'\n}\n\nfunction findNearestJoint(child: Object3D) {\n  let curr: Object3D | null = child\n  while (curr) {\n    if (isJoint(curr as URDFJoint)) {\n      return curr\n    }\n\n    curr = curr.parent\n  }\n\n  return curr\n}\n\nconst prevHitPoint = new Vector3()\nconst newHitPoint = new Vector3()\nconst pivotPoint = new Vector3()\nconst tempVector = new Vector3()\nconst tempVector2 = new Vector3()\nconst projectedStartPoint = new Vector3()\nconst projectedEndPoint = new Vector3()\nconst plane = new Plane()\nexport class URDFDragControls {\n  scene: Scene\n\n  enabled: boolean\n  raycaster: Raycaster\n  initialGrabPoint: Vector3\n  hitDistance: number\n\n  hovered: any\n  manipulating: any\n\n  constructor(scene: Scene) {\n    this.enabled = true\n    this.scene = scene\n\n    this.raycaster = new Raycaster()\n    this.initialGrabPoint = new Vector3()\n\n    this.hitDistance = -1\n    this.hovered = null\n    this.manipulating = null\n  }\n\n  update() {\n    const { raycaster, hovered, manipulating, scene } = this\n\n    if (manipulating) {\n      return\n    }\n\n    let hoveredJoint = null\n    const intersections = raycaster.intersectObject(scene, true)\n    if (intersections.length !== 0) {\n      const hit = intersections[0]\n      this.hitDistance = hit.distance\n      hoveredJoint = findNearestJoint(hit.object)\n      this.initialGrabPoint.copy(hit.point)\n    }\n\n    if (hoveredJoint !== hovered) {\n      if (hovered) {\n        this.onUnhover(hovered)\n      }\n\n      this.hovered = hoveredJoint\n\n      if (hoveredJoint) {\n        this.onHover(hoveredJoint as URDFJoint)\n      }\n    }\n  }\n\n  updateJoint(joint: URDFJoint, angle: number) {\n    joint.setJointValue(angle)\n  }\n\n  onDragStart(joint: URDFJoint) {}\n\n  onDragEnd(joint: URDFJoint) {}\n\n  onHover(joint: URDFJoint) {}\n\n  onUnhover(joint: URDFJoint) {}\n\n  getRevoluteDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3) {\n    // set up the plane\n    tempVector.copy(joint.axis).transformDirection(joint.matrixWorld).normalize()\n    pivotPoint.set(0, 0, 0).applyMatrix4(joint.matrixWorld)\n    plane.setFromNormalAndCoplanarPoint(tempVector, pivotPoint)\n\n    // project the drag points onto the plane\n    plane.projectPoint(startPoint, projectedStartPoint)\n    plane.projectPoint(endPoint, projectedEndPoint)\n\n    // get the directions relative to the pivot\n    projectedStartPoint.sub(pivotPoint)\n    projectedEndPoint.sub(pivotPoint)\n\n    tempVector.crossVectors(projectedStartPoint, projectedEndPoint)\n\n    const direction = Math.sign(tempVector.dot(plane.normal))\n    return direction * projectedEndPoint.angleTo(projectedStartPoint)\n  }\n\n  getPrismaticDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3) {\n    tempVector.subVectors(endPoint, startPoint)\n    plane.normal.copy(joint.axis).transformDirection(joint.parent!.matrixWorld).normalize()\n\n    return tempVector.dot(plane.normal)\n  }\n\n  moveRay(toRay: Ray) {\n    const { raycaster, hitDistance, manipulating } = this\n    const { ray } = raycaster\n\n    if (manipulating) {\n      ray.at(hitDistance, prevHitPoint)\n      toRay.at(hitDistance, newHitPoint)\n\n      let delta = 0\n      if (manipulating.jointType === 'revolute' || manipulating.jointType === 'continuous') {\n        delta = this.getRevoluteDelta(manipulating, prevHitPoint, newHitPoint)\n      } else if (manipulating.jointType === 'prismatic') {\n        delta = this.getPrismaticDelta(manipulating, prevHitPoint, newHitPoint)\n      }\n\n      if (delta) {\n        this.updateJoint(manipulating, manipulating.angle + delta)\n      }\n    }\n\n    this.raycaster.ray.copy(toRay)\n    this.update()\n  }\n\n  setGrabbed(grabbed: boolean) {\n    const { hovered, manipulating } = this\n    if (grabbed) {\n      if (manipulating !== null || hovered === null) {\n        return\n      }\n\n      this.manipulating = hovered\n      this.onDragStart(hovered)\n    } else {\n      if (this.manipulating === null) {\n        return\n      }\n\n      this.onDragEnd(this.manipulating)\n      this.manipulating = null\n      this.update()\n    }\n  }\n}\n\nexport class PointerURDFDragControls extends URDFDragControls {\n  camera: Camera\n  domElement: HTMLElement\n\n  _mouseDown: (e: MouseEvent) => void\n  _mouseMove: (e: MouseEvent) => void\n  _mouseUp: (e: MouseEvent) => void\n\n  constructor(scene: Scene, camera: Camera, domElement: HTMLElement) {\n    super(scene)\n\n    this.camera = camera\n    this.domElement = domElement\n\n    const raycaster = new Raycaster()\n    const mouse = new Vector2()\n\n    function updateMouse(e: MouseEvent) {\n      mouse.x = (e.offsetX / domElement.offsetWidth) * 2 - 1\n      mouse.y = -(e.offsetY / domElement.offsetHeight) * 2 + 1\n    }\n\n    this._mouseDown = (e: MouseEvent) => {\n      updateMouse(e)\n      raycaster.setFromCamera(mouse, this.camera)\n      this.moveRay(raycaster.ray)\n      this.setGrabbed(true)\n    }\n\n    this._mouseMove = (e: MouseEvent) => {\n      updateMouse(e)\n      raycaster.setFromCamera(mouse, this.camera)\n      this.moveRay(raycaster.ray)\n    }\n\n    this._mouseUp = (e: MouseEvent) => {\n      updateMouse(e)\n      raycaster.setFromCamera(mouse, this.camera)\n      this.moveRay(raycaster.ray)\n      this.setGrabbed(false)\n    }\n\n    domElement.addEventListener('pointerdown', this._mouseDown)\n    domElement.addEventListener('pointermove', this._mouseMove)\n    domElement.addEventListener('pointerup', this._mouseUp)\n  }\n\n  getRevoluteDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3) {\n    const { camera, initialGrabPoint } = this\n\n    // set up the plane\n    tempVector.copy(joint.axis).transformDirection(joint.matrixWorld).normalize()\n    pivotPoint.set(0, 0, 0).applyMatrix4(joint.matrixWorld)\n    plane.setFromNormalAndCoplanarPoint(tempVector, pivotPoint)\n\n    tempVector.copy(camera.position).sub(initialGrabPoint).normalize()\n\n    // if looking into the plane of rotation\n    if (Math.abs(tempVector.dot(plane.normal)) > 0.3) {\n      return super.getRevoluteDelta(joint, startPoint, endPoint)\n    } else {\n      // get the up direction\n      tempVector.set(0, 1, 0).transformDirection(camera.matrixWorld)\n\n      // get points projected onto the plane of rotation\n      plane.projectPoint(startPoint, projectedStartPoint)\n      plane.projectPoint(endPoint, projectedEndPoint)\n\n      tempVector.set(0, 0, -1).transformDirection(camera.matrixWorld)\n      tempVector.cross(plane.normal)\n      tempVector2.subVectors(endPoint, startPoint)\n\n      return tempVector.dot(tempVector2)\n    }\n  }\n\n  dispose() {\n    const { domElement } = this\n    domElement.removeEventListener('pointerdown', this._mouseDown)\n    domElement.removeEventListener('pointermove', this._mouseMove)\n    domElement.removeEventListener('pointerup', this._mouseUp)\n  }\n}\n"]}

package/dist/elements/urdf-manipulator-element.d.ts

@@ -1,15 +0,0 @@
-import { PointerURDFDragControls } from './urdf-drag-controls.js';
-import { MeshPhongMaterial } from 'three';
-import URDFViewerElement from './urdf-viewer-element.js';
-export default class URDFManipulatorElement extends URDFViewerElement {
-    static get observedAttributes(): string[];
-    highlightMaterial: MeshPhongMaterial;
-    dragControls: PointerURDFDragControls;
-    get disableDragging(): boolean;
-    set disableDragging(val: boolean);
-    get highlightColor(): string;
-    set highlightColor(val: string);
-    constructor();
-    disconnectedCallback(): void;
-    attributeChangedCallback(attr: string, oldval: any, newval: any): void;
-}