fix camera view for back camera

index.html

@@ -24,6 +24,8 @@
             width: 100%;
             height: 100%;
             object-fit: cover;
+        }
+        #camera video.mirrored {
             transform: scaleX(-1);
         }
         iframe {
@@ -46,10 +48,6 @@
             font-size: 16px;
             display: none;
         }
-        #switchCamera:disabled {
-            opacity: 0.5;
-            cursor: not-allowed;
-        }
         @media (max-width: 768px) {
             .container {
                 flex-direction: column;
@@ -73,6 +71,15 @@
         let currentStreamTrack = null;
         let isUsingFrontCamera = true;
         let hasMutipleCameras = false;
+        const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
+
+        function updateMirrorEffect() {
+            if (isUsingFrontCamera || !isMobile) {
+                video.classList.add('mirrored');
+            } else {
+                video.classList.remove('mirrored');
+            }
+        }
 
         async function startVideo(useFrontCamera = true) {
             const facingMode = useFrontCamera ? 'user' : 'environment';
@@ -87,6 +94,7 @@
                 video.srcObject = stream;
                 currentStreamTrack = stream.getVideoTracks()[0];
                 isUsingFrontCamera = useFrontCamera;
+                updateMirrorEffect();
             } catch (error) {
                 console.error('Error accessing camera:', error);
             }
@@ -114,6 +122,7 @@
                 hasMutipleCameras = false;
                 switchButton.style.display = 'none';
             }
+            updateMirrorEffect();
         }
 
         initialize();