fix: disabling pushing more than one camera on nodeOpts

Tresjs · May 9, 2023 · 57a07bf · 57a07bf
1 parent da28abc
commit 57a07bf
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 2 deletions.
diff --git a/playground/src/components/TheExperience.vue b/playground/src/components/TheExperience.vue
@@ -47,5 +47,6 @@ watchEffect(() => {
     <TheSphere />
     <TresAxesHelper :args="[1]" />
     <TresDirectionalLight :position="[0, 2, 4]" :intensity="2" cast-shadow />
+    <TresOrthographicCamera />
   </TresCanvas>
 </template>
diff --git a/src/composables/useCamera/index.ts b/src/composables/useCamera/index.ts
@@ -85,6 +85,7 @@ interface UseCameraReturn {
   updateCamera: () => void
   pushCamera: (camera: Camera) => void
   clearCameras: () => void
+  setFirstCamera: (camera: Camera) => void
 }
 
 const VERTICAL_FIELD_OF_VIEW = 45
@@ -175,6 +176,12 @@ export function useCamera(): UseCameraReturn {
     setState('camera', camera)
   }
 
+  function setFirstCamera(camera: Camera): void {
+    if (state.cameras?.length === 0) {
+      pushCamera(camera)
+    }
+  }
+
   /**
    * Clear cameras array
    *
@@ -195,5 +202,6 @@ export function useCamera(): UseCameraReturn {
     updateCamera,
     pushCamera,
     clearCameras,
+    setFirstCamera,
   }
 }
diff --git a/src/core/nodeOps.ts b/src/core/nodeOps.ts
@@ -22,6 +22,7 @@ const OBJECT_3D_USER_DATA_KEYS = {
 
 const { logError } = useLogger()
 
+let firstCamera = true
 export const nodeOps: RendererOptions<TresObject, TresObject> = {
   createElement(tag, _isSVG, _anchor, props) {
     if (!props) props = {}
@@ -54,8 +55,11 @@ export const nodeOps: RendererOptions<TresObject, TresObject> = {
       if (!props?.lookAt) {
         instance.lookAt(0, 0, 0)
       }
-      const { pushCamera } = useCamera()
-      pushCamera(instance)
+      if (firstCamera) {
+        const { setFirstCamera } = useCamera()
+        setFirstCamera(instance)
+        firstCamera = false
+      }
     }
 
     if (props?.attach === undefined) {