fix(camera): zoom

evandrododo · Dec 10, 2023 · 793631a · 793631a
1 parent cfea205
commit 793631a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 4 deletions.
diff --git a/src/components/VideoPlane/VideoPlane.tsx b/src/components/VideoPlane/VideoPlane.tsx
@@ -1,5 +1,5 @@
 import { useAspect } from "@react-three/drei";
-import { Suspense } from "react";
+import { Suspense, useEffect, useState } from "react";
 import { FilterMaterialVideoChroma } from "../../materials/FilterMaterialVideoChroma";
 import { FilterMaterialVideoEdge } from "../../materials/FilterMaterialVideoEdge";
 import { useControls } from "leva";
@@ -18,8 +18,7 @@ export const VideoPlane = ({ userMedia }: { userMedia: MediaStream }) => {
   const mediaAspect = mediaWidth / mediaHeight;
   const size = useAspect(mediaAspect, 1);
 
-  console.log("size", size)
-
+
   return (
     <mesh scale={size} position={[0, 0, 0]}>
       <planeGeometry />

diff --git a/src/components/WebCamVideoPlane/WebCamVideoPlane.tsx b/src/components/WebCamVideoPlane/WebCamVideoPlane.tsx
@@ -3,6 +3,17 @@ import { VideoPlane } from "../VideoPlane/VideoPlane";
 
 export const WebCamVideoPlane = () => {
   const [userMedia, setUserMedia] = useState<MediaStream>();
+  const [renderizado, setRenderizado] = useState(false);
+
+  useEffect(() => {
+    const timeout = setTimeout(() => {
+      setRenderizado(true);
+    }, 100);
+
+    // Limpa o timeout para evitar execuções extras
+    return () => clearTimeout(timeout);
+  }, []);
+
   // Gets user webcam
   useEffect(() => {
     navigator.mediaDevices
@@ -31,5 +42,5 @@ export const WebCamVideoPlane = () => {
   if (!userMedia || !userMedia.getVideoTracks().length) {
     return null;
   }
-  return <VideoPlane userMedia={userMedia} />;
+  return <>{renderizado && <VideoPlane userMedia={userMedia} />};</>;
 };