diff --git a/packages/model-viewer/src/three-components/ARRenderer.ts b/packages/model-viewer/src/three-components/ARRenderer.ts index 89be981849..dccfde7778 100644 --- a/packages/model-viewer/src/three-components/ARRenderer.ts +++ b/packages/model-viewer/src/three-components/ARRenderer.ts @@ -445,7 +445,7 @@ export class ARRenderer extends EventDispatcher< const intersection = this.placementBox!.controllerIntersection(scene, controller); if (intersection != null) { - const bbox = new Box3().setFromObject(scene.pivot); + const bbox = new Box3().setFromObject(scene.scenePivot); const footprintY = bbox.min.y + FOOTPRINT__INTERSECT_THRESHOLD; // Small threshold above base @@ -456,11 +456,11 @@ export class ARRenderer extends EventDispatcher< this.selectedXRController.userData.line.visible = false; if (scene.canScale && this.isWorldSpaceReady()) { this.isTwoHandInteraction = true; - this.firstRatio = this.controllerSeparation() / scene.pivot.scale.x; + this.firstRatio = this.controllerSeparation() / scene.scenePivot.scale.x; this.scaleLine.visible = true; } } else { - controller.attach(scene.pivot); + controller.attach(scene.scenePivot); } this.selectedXRController = controller; scene.setShadowIntensity(0.01); @@ -475,7 +475,7 @@ export class ARRenderer extends EventDispatcher< this.xrController2?.userData.isSelected) { if (scene.canScale && this.isWorldSpaceReady()) { this.isTwoHandInteraction = true; - this.firstRatio = this.controllerSeparation() / scene.pivot.scale.x; + this.firstRatio = this.controllerSeparation() / scene.scenePivot.scale.x; this.scaleLine.visible = true; } } else { @@ -510,16 +510,16 @@ export class ARRenderer extends EventDispatcher< } const scene = this.presentedScene!; // drop on floor - scene.attach(scene.pivot); + scene.attach(scene.scenePivot); this.selectedXRController = null; this.goalYaw = Math.atan2( - scene.pivot.matrix.elements[8], scene.pivot.matrix.elements[10]); - this.goalPosition.x = scene.pivot.position.x; - this.goalPosition.z = scene.pivot.position.z; + scene.scenePivot.matrix.elements[8], scene.scenePivot.matrix.elements[10]); + this.goalPosition.x = scene.scenePivot.position.x; + this.goalPosition.z = scene.scenePivot.position.z; // For world-space mode after initial placement, preserve Y position if (this.isWorldSpaceReady()) { - this.goalPosition.y = scene.pivot.position.y; + this.goalPosition.y = scene.scenePivot.position.y; } const menuPanel = this.menuPanel; @@ -632,10 +632,10 @@ export class ARRenderer extends EventDispatcher< this.menuPanel = null; } - scene.add(scene.pivot); - scene.pivot.quaternion.set(0, 0, 0, 1); - scene.pivot.position.set(0, 0, 0); - scene.pivot.scale.set(1, 1, 1); + scene.add(scene.scenePivot); + scene.scenePivot.quaternion.set(0, 0, 0, 1); + scene.scenePivot.position.set(0, 0, 0); + scene.scenePivot.scale.set(1, 1, 1); scene.setShadowOffset(0); const yaw = this.turntableRotation; if (yaw != null) { @@ -753,8 +753,8 @@ export class ARRenderer extends EventDispatcher< private placeInitially() { const scene = this.presentedScene!; - const {pivot, element} = scene; - const {position} = pivot; + const {scenePivot, element} = scene; + const {position} = scenePivot; const xrCamera = scene.getCamera(); const {width, height} = this.overlay!.getBoundingClientRect(); @@ -786,7 +786,7 @@ export class ARRenderer extends EventDispatcher< // Set initial position and scale immediately for world-space position.copy(optimalPosition); - pivot.scale.set(optimalScale, optimalScale, optimalScale); + scenePivot.scale.set(optimalScale, optimalScale, optimalScale); // Mark that initial placement is done this.worldSpaceInitialPlacementDone = true; @@ -926,7 +926,7 @@ export class ARRenderer extends EventDispatcher< const {separation, angle} = this.fingerPolar(fingers); this.lastAngle = angle; // Initialize lastAngle, do not update goalYaw if (this.firstRatio === 0) { - this.firstRatio = separation / scene.pivot.scale.x; + this.firstRatio = separation / scene.scenePivot.scale.x; } if (scene.canScale) { this.setScale(separation); @@ -982,7 +982,7 @@ export class ARRenderer extends EventDispatcher< } const fingers = frame.getHitTestResultsForTransientInput(hitSource); const scene = this.presentedScene!; - const scale = scene.pivot.scale.x; + const scale = scene.scenePivot.scale.x; // Robust two-finger gesture handling if (fingers.length === 2) { @@ -1072,14 +1072,14 @@ export class ARRenderer extends EventDispatcher< } } - private applyXRControllerRotation(controller: XRController, pivot: Object3D) { + private applyXRControllerRotation(controller: XRController, scenePivot: Object3D) { if (!controller.userData.turning) { return; } const angle = (controller.position.x - controller.userData.initialX) * ROTATION_SENSIVITY; this.deltaRotation.setFromAxisAngle(AXIS_Y, angle); - pivot.quaternion.multiplyQuaternions(this.deltaRotation, pivot.quaternion); + scenePivot.quaternion.multiplyQuaternions(this.deltaRotation, scenePivot.quaternion); } private handleScalingInXR(scene: ModelScene, delta: number) { @@ -1095,20 +1095,20 @@ export class ARRenderer extends EventDispatcher< this.scaleLine.scale.z = -dist; this.scaleLine.lookAt(this.xrController2.position); } - const oldScale = scene.pivot.scale.x; + const oldScale = scene.scenePivot.scale.x; if (this.goalScale !== oldScale) { const newScale = this.scaleDamper.update(oldScale, this.goalScale, delta, 1); - scene.pivot.scale.set(newScale, newScale, newScale); + scene.scenePivot.scale.set(newScale, newScale, newScale); } } private updatePivotPosition(scene: ModelScene, delta: number) { - const {pivot} = scene; + const {scenePivot} = scene; const box = this.placementBox!; const boundingRadius = scene.boundingSphere.radius; const goal = this.goalPosition; - const position = pivot.position; + const position = scenePivot.position; let source = ChangeSource.NONE; if (!goal.equals(position)) { @@ -1122,7 +1122,7 @@ export class ARRenderer extends EventDispatcher< if (this.xrMode === XRMode.SCREEN_SPACE && !this.isTranslating) { const offset = goal.y - y; if (this.placementComplete && this.placeOnWall === false) { - box.offsetHeight = offset / scene.pivot.scale.x; + box.offsetHeight = offset / scene.scenePivot.scale.x; scene.setShadowOffset(offset); } else if (offset === 0) { this.placementComplete = true; @@ -1146,10 +1146,10 @@ export class ARRenderer extends EventDispatcher< // placement if (this.xrMode === XRMode.WORLD_SPACE && !this.worldSpaceInitialPlacementDone && - this.goalScale !== pivot.scale.x) { + this.goalScale !== scenePivot.scale.x) { const newScale = - this.scaleDamper.update(pivot.scale.x, this.goalScale, delta, 1); - pivot.scale.set(newScale, newScale, newScale); + this.scaleDamper.update(scenePivot.scale.x, this.goalScale, delta, 1); + scenePivot.scale.set(newScale, newScale, newScale); } scene.updateTarget(delta); @@ -1161,9 +1161,9 @@ export class ARRenderer extends EventDispatcher< private updateYaw(scene: ModelScene, delta: number) { // yaw must be updated last, since this also updates the shadow position. quaternion.setFromAxisAngle(vector3.set(0, 1, 0), this.goalYaw); - const angle = scene.pivot.quaternion.angleTo(quaternion); + const angle = scene.scenePivot.quaternion.angleTo(quaternion); const angleStep = angle - this.yawDamper.update(angle, 0, delta, Math.PI); - scene.pivot.quaternion.rotateTowards(quaternion, angleStep); + scene.scenePivot.quaternion.rotateTowards(quaternion, angleStep); } private updateMenuPanel(scene: ModelScene, box: PlacementBox, delta: number) { @@ -1175,15 +1175,15 @@ export class ARRenderer extends EventDispatcher< private applyXRInputToScene(delta: number) { const scene = this.presentedScene!; - const pivot = scene.pivot; + const scenePivot = scene.scenePivot; const box = this.placementBox!; this.updatePlacementBoxOpacity(box, delta); this.updateTwoHandInteractionState(); - this.applyXRControllerRotations(pivot); + this.applyXRControllerRotations(scenePivot); this.handleScalingInXR(scene, delta); - if (pivot.parent !== scene) { + if (scenePivot.parent !== scene) { // attached to controller instead // when moving the model, the menu panel should disapear this.updateMenuPanel(scene, box, delta); @@ -1217,12 +1217,12 @@ export class ARRenderer extends EventDispatcher< this.isTwoHandInteraction = !!bothSelected; } - private applyXRControllerRotations(pivot: Object3D) { + private applyXRControllerRotations(scenePivot: Object3D) { if (!this.isTwoHandInteraction) { if (this.xrController1) - this.applyXRControllerRotation(this.xrController1, pivot); + this.applyXRControllerRotation(this.xrController1, scenePivot); if (this.xrController2) - this.applyXRControllerRotation(this.xrController2, pivot); + this.applyXRControllerRotation(this.xrController2, scenePivot); } } diff --git a/packages/model-viewer/src/three-components/ModelScene.ts b/packages/model-viewer/src/three-components/ModelScene.ts index fc9793d8db..8a682f34ca 100644 --- a/packages/model-viewer/src/three-components/ModelScene.ts +++ b/packages/model-viewer/src/three-components/ModelScene.ts @@ -90,7 +90,7 @@ export class ModelScene extends Scene { url: string|null = null; extraUrls: string[] = []; - pivot = new Object3D(); + scenePivot = new Object3D(); target = new Object3D(); animationNames: Array = []; boundingBox = new Box3(); @@ -139,10 +139,10 @@ export class ModelScene extends Scene { this.camera = new PerspectiveCamera(45, 1, 0.1, 100); this.camera.name = 'MainCamera'; - this.add(this.pivot); - this.pivot.name = 'Pivot'; + this.add(this.scenePivot); + this.scenePivot.name = 'Pivot'; - this.pivot.add(this.target); + this.scenePivot.add(this.target); this.setSize(width, height); @@ -793,13 +793,13 @@ export class ModelScene extends Scene { * center. */ set yaw(radiansY: number) { - this.pivot.rotation.y = radiansY; + this.scenePivot.rotation.y = radiansY; this.groundedSkybox.rotation.y = -radiansY; this.queueRender(); } get yaw(): number { - return this.pivot.rotation.y; + return this.scenePivot.rotation.y; } set animationTime(value: number) {