From 16dd6d2e72347e3422eb3c3b60cba4c9ac2b9f3b Mon Sep 17 00:00:00 2001 From: Tommaso Turchi Date: Sun, 20 Nov 2022 14:17:00 +0100 Subject: [PATCH] new version + refactoring --- package.json | 2 +- src/AR.js | 39 ++++++++++++++++++++++----------------- 2 files changed, 23 insertions(+), 18 deletions(-) diff --git a/package.json b/package.json index 229c452..3df64df 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-three-mind", - "version": "0.1.7", + "version": "0.1.8", "description": "MindAR components for @react-three/fiber", "main": "dist/index.js", "author": "Tommaso Turchi", diff --git a/src/AR.js b/src/AR.js index b987a45..af90a89 100644 --- a/src/AR.js +++ b/src/AR.js @@ -37,6 +37,8 @@ const ARProvider = forwardRef( filterBeta = null, warmupTolerance = null, missTolerance = null, + onReady = null, + onError = null, }, ref ) => { @@ -49,11 +51,6 @@ const ARProvider = forwardRef( const [faceMeshes] = useAtom(faceMeshesAtom); const { width, height } = useWindowSize(); - const isLandscape = useMemo(() => height <= width, [height, width]); - const ratio = useMemo( - () => (isLandscape ? width / height : height / width), - [isLandscape, width, height] - ); useEffect(() => { if (controllerRef.current) { @@ -202,6 +199,8 @@ const ARProvider = forwardRef( controller.processVideo(webcamRef.current.video); controllerRef.current = controller; + + onReady && onReady(); } }, [ ready, @@ -253,20 +252,19 @@ const ARProvider = forwardRef( }, [autoplay, ready, startTracking]); const fixStyle = () => { - let offset = 0 - if(webcamRef.current?.video?.clientWidth>0){ + let offset = 0; + if (webcamRef.current?.video?.clientWidth > 0) { offset = (width - webcamRef.current.video.clientWidth) / 2; } - offset = parseInt(offset+'') - return( - { - width: "auto", - maxWidth: "none", - height: 'inherit', - marginLeft: offset+'px' - } - ) - } + offset = parseInt(offset + ""); + + return { + width: "auto", + maxWidth: "none", + height: "inherit", + marginLeft: offset + "px", + }; + }; return ( <> @@ -279,6 +277,9 @@ const ARProvider = forwardRef( { + onError && onError(e); + }} height={height} width={width} videoConstraints={{ @@ -304,6 +305,8 @@ const ARView = forwardRef( filterBeta, warmupTolerance, missTolerance, + onReady, + onError, ...rest }, ref @@ -333,6 +336,8 @@ const ARView = forwardRef( filterBeta, warmupTolerance, missTolerance, + onReady, + onError, }} ref={ARRef} >