nartc / angular-three

🧊 THREE.js integration for Angular 🧊
https://angular-three.netlify.app/
MIT License
306 stars 23 forks source link

[Bug] Objects not added to scene after Enter VR on Oculus Quest #134

Closed IRobot1 closed 2 years ago

IRobot1 commented 2 years ago

Using the simple sandbox example, I delayed loading the cubes 10 seconds and added ability to Enter VR. While in VR, the cubes never appear in the scene.

@Component({
  selector: 'sandbox-scene',
  template: `
    <ngt-ambient-light></ngt-ambient-light>
    <ngt-point-light [position]="10"></ngt-point-light>

    <sandbox-cube *ngIf="ready" [position]="[-1.5, 0, 0]"></sandbox-cube>
    <sandbox-cube *ngIf="ready" [position]="[1.5, 0, 0]"></sandbox-cube>

    <sandbox-cube-with-materials  *ngIf="ready"></sandbox-cube-with-materials>

    <ngt-soba-orbit-controls></ngt-soba-orbit-controls>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class Scene {
  ready = false;

  constructor(private cd: ChangeDetectorRef) {
    setTimeout(() => {
      this.ready = true;
      this.cd.detectChanges();
    }, 10000);
  }
}

@Component({
  selector: 'xrsandbox-cubes',
  template: `
    <ngt-canvas initialLog (created)="created($event)" >
      <ngt-color attach="background" color="lightblue"></ngt-color>

      <sandbox-scene></sandbox-scene>
    </ngt-canvas>
    <ngt-stats></ngt-stats>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class SandboxXRCubesComponent {
    created(state: NgtState) {
        document.body.appendChild(VRButton.createButton(state.gl));
    }
}

This problem doesn't happen using Windows Mixed Reality headset in Edge browser.

IRobot1 commented 2 years ago

Hopefully, you have time to integrate pull requests. This can wait until r142 is released if you want.