@operato/scene-urdf 9.1.1 → 10.0.0-beta.18

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.
Files changed (49) hide show
  1. package/dist/editors/index.d.ts +6 -0
  2. package/dist/editors/index.js +7 -1
  3. package/dist/editors/index.js.map +1 -1
  4. package/dist/editors/property-editor-urdf-joints.d.ts +54 -0
  5. package/dist/editors/property-editor-urdf-joints.js +242 -0
  6. package/dist/editors/property-editor-urdf-joints.js.map +1 -0
  7. package/dist/index.d.ts +4 -2
  8. package/dist/index.js +16 -2
  9. package/dist/index.js.map +1 -1
  10. package/dist/real-object-urdf.d.ts +75 -0
  11. package/dist/real-object-urdf.js +284 -0
  12. package/dist/real-object-urdf.js.map +1 -0
  13. package/dist/templates/index.d.ts +3 -0
  14. package/dist/templates/index.js +2 -3
  15. package/dist/templates/index.js.map +1 -1
  16. package/dist/templates/{urdf-controller.d.ts → urdf.d.ts} +3 -0
  17. package/dist/templates/urdf.js +19 -0
  18. package/dist/templates/urdf.js.map +1 -0
  19. package/dist/urdf-object.d.ts +264 -0
  20. package/dist/urdf-object.js +163 -0
  21. package/dist/urdf-object.js.map +1 -0
  22. package/icons/urdf.png +0 -0
  23. package/package.json +19 -18
  24. package/dist/elements/drag-n-drop.d.ts +0 -2
  25. package/dist/elements/drag-n-drop.js +0 -126
  26. package/dist/elements/drag-n-drop.js.map +0 -1
  27. package/dist/elements/urdf-controller-element.d.ts +0 -12
  28. package/dist/elements/urdf-controller-element.js +0 -283
  29. package/dist/elements/urdf-controller-element.js.map +0 -1
  30. package/dist/elements/urdf-drag-controls.d.ts +0 -32
  31. package/dist/elements/urdf-drag-controls.js +0 -185
  32. package/dist/elements/urdf-drag-controls.js.map +0 -1
  33. package/dist/elements/urdf-manipulator-element.d.ts +0 -15
  34. package/dist/elements/urdf-manipulator-element.js +0 -110
  35. package/dist/elements/urdf-manipulator-element.js.map +0 -1
  36. package/dist/elements/urdf-viewer-element.d.ts +0 -53
  37. package/dist/elements/urdf-viewer-element.js +0 -402
  38. package/dist/elements/urdf-viewer-element.js.map +0 -1
  39. package/dist/templates/urdf-controller.js +0 -16
  40. package/dist/templates/urdf-controller.js.map +0 -1
  41. package/dist/templates/urdf-viewer.d.ts +0 -14
  42. package/dist/templates/urdf-viewer.js +0 -16
  43. package/dist/templates/urdf-viewer.js.map +0 -1
  44. package/dist/urdf-controller.d.ts +0 -15
  45. package/dist/urdf-controller.js +0 -69
  46. package/dist/urdf-controller.js.map +0 -1
  47. package/dist/urdf-viewer.d.ts +0 -16
  48. package/dist/urdf-viewer.js +0 -202
  49. package/dist/urdf-viewer.js.map +0 -1
@@ -1,283 +0,0 @@
1
- import { __decorate } from "tslib";
2
- import { LitElement, css, html } from 'lit';
3
- import { customElement, property } from 'lit/decorators.js';
4
- import * as THREE from 'three';
5
- import { registerDragEvents } from './drag-n-drop.js';
6
- import { ScrollbarStyles } from '@operato/styles';
7
- const DEG2RAD = Math.PI / 180;
8
- const RAD2DEG = 1 / DEG2RAD;
9
- let URDFControllerElement = class URDFControllerElement extends LitElement {
10
- render() {
11
- const { joints = {} } = this.robot || {};
12
- const { ignoreLimits = false } = this.viewer || {};
13
- const jointsArray = Object.values(joints);
14
- return html `
15
- <ul>
16
- ${jointsArray.map(joint => {
17
- var { jointType, name, angle, limit } = joint;
18
- var degVal = Number(angle || 0);
19
- if (jointType === 'revolute' || jointType === 'continuous') {
20
- degVal *= RAD2DEG;
21
- }
22
- if (Math.abs(degVal) > 1) {
23
- degVal = degVal.toFixed(1);
24
- }
25
- else {
26
- degVal = degVal.toPrecision(2);
27
- }
28
- var sliderMin;
29
- var sliderMax;
30
- var inputMin;
31
- var inputMax;
32
- if (ignoreLimits || jointType === 'continuous') {
33
- sliderMin = -6.28;
34
- sliderMax = 6.28;
35
- inputMin = -6.28 * RAD2DEG;
36
- inputMax = 6.28 * RAD2DEG;
37
- }
38
- else {
39
- sliderMin = limit.lower;
40
- sliderMax = limit.upper;
41
- inputMin = Number(limit.lower) * RAD2DEG;
42
- inputMax = Number(limit.upper) * RAD2DEG;
43
- }
44
- return html `
45
- <li joint-type=${jointType} joint-name=${name}>
46
- <span title=${name}>${name}</span>
47
- <input
48
- type="range"
49
- .value=${String(angle)}
50
- step="0.0001"
51
- min=${sliderMin}
52
- max=${sliderMax}
53
- @input=${(e) => {
54
- var _a;
55
- (_a = this.viewer) === null || _a === void 0 ? void 0 : _a.setJointValue(name, e.target.value);
56
- }}
57
- />
58
- <input
59
- type="number"
60
- .value=${degVal}
61
- step="0.0001"
62
- min=${inputMin}
63
- max=${inputMax}
64
- @change=${(e) => {
65
- var _a;
66
- (_a = this.viewer) === null || _a === void 0 ? void 0 : _a.setJointValue(name, Number(e.target.value) * DEG2RAD);
67
- }}
68
- />
69
- </li>
70
- `;
71
- })}
72
- </ul>
73
- `;
74
- }
75
- updated(changes) {
76
- if (changes.has('viewer')) {
77
- this._setupViewer(this.viewer);
78
- }
79
- }
80
- _setupViewer(viewer) {
81
- if (!viewer) {
82
- return;
83
- }
84
- this.robot = viewer.robot;
85
- viewer.addEventListener('urdf-processed', () => {
86
- this.robot = viewer.robot;
87
- });
88
- viewer.addEventListener('ignore-limits-change', () => {
89
- this.requestUpdate();
90
- });
91
- viewer.addEventListener('angle-change', (e) => {
92
- this.requestUpdate();
93
- });
94
- viewer.addEventListener('joint-mouseover', (e) => {
95
- const j = this.renderRoot.querySelector(`li[joint-name="${e.detail}"]`);
96
- if (j) {
97
- j.setAttribute('robot-hovered', 'true');
98
- }
99
- });
100
- viewer.addEventListener('joint-mouseout', (e) => {
101
- const j = this.renderRoot.querySelector(`li[joint-name="${e.detail}"]`);
102
- if (j) {
103
- j.removeAttribute('robot-hovered');
104
- }
105
- });
106
- let originalNoAutoRecenter;
107
- viewer.addEventListener('manipulate-start', (e) => {
108
- const j = this.renderRoot.querySelector(`li[joint-name="${e.detail}"]`);
109
- if (j) {
110
- // ??
111
- j.scrollIntoView({ block: 'nearest' });
112
- window.scrollTo(0, 0);
113
- }
114
- originalNoAutoRecenter = viewer.noAutoRecenter;
115
- viewer.noAutoRecenter = true;
116
- });
117
- viewer.addEventListener('manipulate-end', (e) => {
118
- viewer.noAutoRecenter = originalNoAutoRecenter;
119
- });
120
- registerDragEvents(viewer, () => {
121
- this.setColor('#263238');
122
- });
123
- }
124
- setColor(color) {
125
- this.viewer.highlightColor = '#' + new THREE.Color(0xffffff).lerp(new THREE.Color(color), 0.35).getHexString();
126
- }
127
- };
128
- URDFControllerElement.styles = [
129
- ScrollbarStyles,
130
- css `
131
- :host {
132
- display: flex;
133
- flex-direction: column;
134
- width: 100%;
135
- margin: 15px 0;
136
- overflow: hidden;
137
- user-select: none;
138
- }
139
-
140
- :host > * {
141
- margin: 5px 0;
142
- }
143
-
144
- input[type='number'] {
145
- color: white;
146
- border: none;
147
- font-weight: 300;
148
- background: rgba(255, 255, 255, 0.25);
149
- padding: 1px 2px;
150
- }
151
-
152
- ul {
153
- list-style: none;
154
- padding: 0;
155
- margin: 0;
156
- }
157
-
158
- input[type='range'] {
159
- -webkit-appearance: none;
160
- border: none;
161
- outline: none;
162
- width: 100%;
163
- flex: 1;
164
- height: 16px;
165
- background-color: transparent;
166
- }
167
- input[type='range']::-webkit-slider-runnable-track {
168
- width: 100%;
169
- height: 1px;
170
- background: white;
171
- border: none;
172
- border-radius: 5px;
173
- }
174
- input[type='range']::-webkit-slider-thumb {
175
- -webkit-appearance: none;
176
- border: none;
177
- height: 10px;
178
- width: 10px;
179
- border-radius: 50%;
180
- background: white;
181
- margin-top: -5px;
182
- }
183
- input[type='range']:focus {
184
- outline: none;
185
- }
186
- input[type='range']:focus::-webkit-slider-runnable-track {
187
- background: white;
188
- }
189
-
190
- input[type='range']::-moz-range-track {
191
- width: 100%;
192
- height: 1px;
193
- background: white;
194
- border: none;
195
- border-radius: 5px;
196
- }
197
- input[type='range']::-moz-range-thumb {
198
- border: none;
199
- height: 10px;
200
- width: 10px;
201
- border-radius: 50%;
202
- background: white;
203
- }
204
-
205
- input[type='range']:-moz-focusring {
206
- outline: 1px solid white;
207
- outline-offset: -1px;
208
- }
209
-
210
- input[type='range']::-ms-track {
211
- width: 100%;
212
- height: 1px;
213
- background: white;
214
- border-radius: 10px;
215
- color: transparent;
216
- border: none;
217
- outline: none;
218
- }
219
- input[type='range']::-ms-thumb {
220
- height: 10px;
221
- width: 10px;
222
- border-radius: 50%;
223
- background: white;
224
- border: none;
225
- outline: none;
226
- margin-top: 2px;
227
- }
228
-
229
- input:focus {
230
- outline: none;
231
- opacity: 1;
232
- }
233
-
234
- /* list of joint sliders */
235
- ul {
236
- flex: 1;
237
- overflow-y: auto;
238
- }
239
-
240
- li {
241
- font-size: 16px;
242
- display: flex;
243
- align-items: center;
244
- padding: 1px 0;
245
-
246
- width: 100%;
247
- user-select: text;
248
-
249
- transition: background 0.25s ease;
250
- }
251
-
252
- li[robot-hovered] {
253
- background: rgba(255, 255, 255, 0.35);
254
- }
255
-
256
- li:hover {
257
- background: rgba(255, 255, 255, 0.35);
258
- }
259
-
260
- li span {
261
- padding: 0 5px;
262
- max-width: 125px;
263
- text-overflow: ellipsis;
264
- overflow: hidden;
265
- }
266
-
267
- li input[type='number'] {
268
- width: 50px;
269
- overflow: hidden;
270
- }
271
- `
272
- ];
273
- __decorate([
274
- property({ type: Object })
275
- ], URDFControllerElement.prototype, "viewer", void 0);
276
- __decorate([
277
- property({ type: Object })
278
- ], URDFControllerElement.prototype, "robot", void 0);
279
- URDFControllerElement = __decorate([
280
- customElement('urdf-controller')
281
- ], URDFControllerElement);
282
- export default URDFControllerElement;
283
- //# sourceMappingURL=urdf-controller-element.js.map
@@ -1 +0,0 @@
1
- {"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"]}
@@ -1,32 +0,0 @@
1
- import { Raycaster, Vector3, Scene, Camera, Ray } from 'three';
2
- import { URDFJoint } from 'urdf-loader';
3
- export declare class URDFDragControls {
4
- scene: Scene;
5
- enabled: boolean;
6
- raycaster: Raycaster;
7
- initialGrabPoint: Vector3;
8
- hitDistance: number;
9
- hovered: any;
10
- manipulating: any;
11
- constructor(scene: Scene);
12
- update(): void;
13
- updateJoint(joint: URDFJoint, angle: number): void;
14
- onDragStart(joint: URDFJoint): void;
15
- onDragEnd(joint: URDFJoint): void;
16
- onHover(joint: URDFJoint): void;
17
- onUnhover(joint: URDFJoint): void;
18
- getRevoluteDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3): number;
19
- getPrismaticDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3): number;
20
- moveRay(toRay: Ray): void;
21
- setGrabbed(grabbed: boolean): void;
22
- }
23
- export declare class PointerURDFDragControls extends URDFDragControls {
24
- camera: Camera;
25
- domElement: HTMLElement;
26
- _mouseDown: (e: MouseEvent) => void;
27
- _mouseMove: (e: MouseEvent) => void;
28
- _mouseUp: (e: MouseEvent) => void;
29
- constructor(scene: Scene, camera: Camera, domElement: HTMLElement);
30
- getRevoluteDelta(joint: URDFJoint, startPoint: Vector3, endPoint: Vector3): number;
31
- dispose(): void;
32
- }
@@ -1,185 +0,0 @@
1
- import { Raycaster, Vector3, Plane, Vector2 } from 'three';
2
- // Find the nearest parent that is a joint
3
- function isJoint(j) {
4
- return j.isURDFJoint && j.jointType !== 'fixed';
5
- }
6
- function findNearestJoint(child) {
7
- let curr = child;
8
- while (curr) {
9
- if (isJoint(curr)) {
10
- return curr;
11
- }
12
- curr = curr.parent;
13
- }
14
- return curr;
15
- }
16
- const prevHitPoint = new Vector3();
17
- const newHitPoint = new Vector3();
18
- const pivotPoint = new Vector3();
19
- const tempVector = new Vector3();
20
- const tempVector2 = new Vector3();
21
- const projectedStartPoint = new Vector3();
22
- const projectedEndPoint = new Vector3();
23
- const plane = new Plane();
24
- export class URDFDragControls {
25
- constructor(scene) {
26
- this.enabled = true;
27
- this.scene = scene;
28
- this.raycaster = new Raycaster();
29
- this.initialGrabPoint = new Vector3();
30
- this.hitDistance = -1;
31
- this.hovered = null;
32
- this.manipulating = null;
33
- }
34
- update() {
35
- const { raycaster, hovered, manipulating, scene } = this;
36
- if (manipulating) {
37
- return;
38
- }
39
- let hoveredJoint = null;
40
- const intersections = raycaster.intersectObject(scene, true);
41
- if (intersections.length !== 0) {
42
- const hit = intersections[0];
43
- this.hitDistance = hit.distance;
44
- hoveredJoint = findNearestJoint(hit.object);
45
- this.initialGrabPoint.copy(hit.point);
46
- }
47
- if (hoveredJoint !== hovered) {
48
- if (hovered) {
49
- this.onUnhover(hovered);
50
- }
51
- this.hovered = hoveredJoint;
52
- if (hoveredJoint) {
53
- this.onHover(hoveredJoint);
54
- }
55
- }
56
- }
57
- updateJoint(joint, angle) {
58
- joint.setJointValue(angle);
59
- }
60
- onDragStart(joint) { }
61
- onDragEnd(joint) { }
62
- onHover(joint) { }
63
- onUnhover(joint) { }
64
- getRevoluteDelta(joint, startPoint, endPoint) {
65
- // set up the plane
66
- tempVector.copy(joint.axis).transformDirection(joint.matrixWorld).normalize();
67
- pivotPoint.set(0, 0, 0).applyMatrix4(joint.matrixWorld);
68
- plane.setFromNormalAndCoplanarPoint(tempVector, pivotPoint);
69
- // project the drag points onto the plane
70
- plane.projectPoint(startPoint, projectedStartPoint);
71
- plane.projectPoint(endPoint, projectedEndPoint);
72
- // get the directions relative to the pivot
73
- projectedStartPoint.sub(pivotPoint);
74
- projectedEndPoint.sub(pivotPoint);
75
- tempVector.crossVectors(projectedStartPoint, projectedEndPoint);
76
- const direction = Math.sign(tempVector.dot(plane.normal));
77
- return direction * projectedEndPoint.angleTo(projectedStartPoint);
78
- }
79
- getPrismaticDelta(joint, startPoint, endPoint) {
80
- tempVector.subVectors(endPoint, startPoint);
81
- plane.normal.copy(joint.axis).transformDirection(joint.parent.matrixWorld).normalize();
82
- return tempVector.dot(plane.normal);
83
- }
84
- moveRay(toRay) {
85
- const { raycaster, hitDistance, manipulating } = this;
86
- const { ray } = raycaster;
87
- if (manipulating) {
88
- ray.at(hitDistance, prevHitPoint);
89
- toRay.at(hitDistance, newHitPoint);
90
- let delta = 0;
91
- if (manipulating.jointType === 'revolute' || manipulating.jointType === 'continuous') {
92
- delta = this.getRevoluteDelta(manipulating, prevHitPoint, newHitPoint);
93
- }
94
- else if (manipulating.jointType === 'prismatic') {
95
- delta = this.getPrismaticDelta(manipulating, prevHitPoint, newHitPoint);
96
- }
97
- if (delta) {
98
- this.updateJoint(manipulating, manipulating.angle + delta);
99
- }
100
- }
101
- this.raycaster.ray.copy(toRay);
102
- this.update();
103
- }
104
- setGrabbed(grabbed) {
105
- const { hovered, manipulating } = this;
106
- if (grabbed) {
107
- if (manipulating !== null || hovered === null) {
108
- return;
109
- }
110
- this.manipulating = hovered;
111
- this.onDragStart(hovered);
112
- }
113
- else {
114
- if (this.manipulating === null) {
115
- return;
116
- }
117
- this.onDragEnd(this.manipulating);
118
- this.manipulating = null;
119
- this.update();
120
- }
121
- }
122
- }
123
- export class PointerURDFDragControls extends URDFDragControls {
124
- constructor(scene, camera, domElement) {
125
- super(scene);
126
- this.camera = camera;
127
- this.domElement = domElement;
128
- const raycaster = new Raycaster();
129
- const mouse = new Vector2();
130
- function updateMouse(e) {
131
- mouse.x = (e.offsetX / domElement.offsetWidth) * 2 - 1;
132
- mouse.y = -(e.offsetY / domElement.offsetHeight) * 2 + 1;
133
- }
134
- this._mouseDown = (e) => {
135
- updateMouse(e);
136
- raycaster.setFromCamera(mouse, this.camera);
137
- this.moveRay(raycaster.ray);
138
- this.setGrabbed(true);
139
- };
140
- this._mouseMove = (e) => {
141
- updateMouse(e);
142
- raycaster.setFromCamera(mouse, this.camera);
143
- this.moveRay(raycaster.ray);
144
- };
145
- this._mouseUp = (e) => {
146
- updateMouse(e);
147
- raycaster.setFromCamera(mouse, this.camera);
148
- this.moveRay(raycaster.ray);
149
- this.setGrabbed(false);
150
- };
151
- domElement.addEventListener('pointerdown', this._mouseDown);
152
- domElement.addEventListener('pointermove', this._mouseMove);
153
- domElement.addEventListener('pointerup', this._mouseUp);
154
- }
155
- getRevoluteDelta(joint, startPoint, endPoint) {
156
- const { camera, initialGrabPoint } = this;
157
- // set up the plane
158
- tempVector.copy(joint.axis).transformDirection(joint.matrixWorld).normalize();
159
- pivotPoint.set(0, 0, 0).applyMatrix4(joint.matrixWorld);
160
- plane.setFromNormalAndCoplanarPoint(tempVector, pivotPoint);
161
- tempVector.copy(camera.position).sub(initialGrabPoint).normalize();
162
- // if looking into the plane of rotation
163
- if (Math.abs(tempVector.dot(plane.normal)) > 0.3) {
164
- return super.getRevoluteDelta(joint, startPoint, endPoint);
165
- }
166
- else {
167
- // get the up direction
168
- tempVector.set(0, 1, 0).transformDirection(camera.matrixWorld);
169
- // get points projected onto the plane of rotation
170
- plane.projectPoint(startPoint, projectedStartPoint);
171
- plane.projectPoint(endPoint, projectedEndPoint);
172
- tempVector.set(0, 0, -1).transformDirection(camera.matrixWorld);
173
- tempVector.cross(plane.normal);
174
- tempVector2.subVectors(endPoint, startPoint);
175
- return tempVector.dot(tempVector2);
176
- }
177
- }
178
- dispose() {
179
- const { domElement } = this;
180
- domElement.removeEventListener('pointerdown', this._mouseDown);
181
- domElement.removeEventListener('pointermove', this._mouseMove);
182
- domElement.removeEventListener('pointerup', this._mouseUp);
183
- }
184
- }
185
- //# sourceMappingURL=urdf-drag-controls.js.map
@@ -1 +0,0 @@
1
- {"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"]}
@@ -1,15 +0,0 @@
1
- import { PointerURDFDragControls } from './urdf-drag-controls.js';
2
- import { MeshPhongMaterial } from 'three';
3
- import URDFViewerElement from './urdf-viewer-element.js';
4
- export default class URDFManipulatorElement extends URDFViewerElement {
5
- static get observedAttributes(): string[];
6
- highlightMaterial: MeshPhongMaterial;
7
- dragControls: PointerURDFDragControls;
8
- get disableDragging(): boolean;
9
- set disableDragging(val: boolean);
10
- get highlightColor(): string;
11
- set highlightColor(val: string);
12
- constructor();
13
- disconnectedCallback(): void;
14
- attributeChangedCallback(attr: string, oldval: any, newval: any): void;
15
- }