diff --git a/client/src/pages/mobile/new-reel.tsx b/client/src/pages/mobile/new-reel.tsx index 1c8e926..6cceb9a 100644 --- a/client/src/pages/mobile/new-reel.tsx +++ b/client/src/pages/mobile/new-reel.tsx @@ -1,4 +1,4 @@ -import { useState, useCallback, useRef } from "react"; +import { useState, useCallback, useRef, useMemo } from "react"; import { CameraRecorder } from "@/components/camera-recorder"; import { useQuery, useMutation } from "@tanstack/react-query"; import { useLocation } from "wouter"; @@ -43,6 +43,22 @@ export default function MobileNewReel() { const [showCamera, setShowCamera] = useState(false); + // Détection iOS pour utiliser la caméra native (meilleure qualité + stabilisation) + const isIOS = useMemo(() => { + if (typeof navigator === 'undefined') return false; + return /iPad|iPhone|iPod/.test(navigator.userAgent) || + (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1); + }, []); + + // Handler pour le bouton caméra - iOS utilise l'input natif, Android utilise WebRTC + const handleCameraButtonClick = useCallback(() => { + if (isIOS) { + cameraInputRef.current?.click(); + } else { + setShowCamera(true); + } + }, [isIOS]); + // État du workflow const [currentStep, setCurrentStep] = useState('video'); @@ -238,15 +254,16 @@ export default function MobileNewReel() {
-
- {showCamera && ( + {/* CameraRecorder pour Android uniquement */} + {showCamera && !isIOS && ( { uploadMutation.mutate(file); @@ -256,6 +273,7 @@ export default function MobileNewReel() { /> )} + {selectedVideo ? (