From dbfe3523a521008d33397a089d02a79742d09201 Mon Sep 17 00:00:00 2001
From: an-lee <an.lee.work@gmail.com>
Date: Sat, 7 Dec 2024 12:53:21 +0800
Subject: [PATCH] fix media player

---
 .../media-player-controls.tsx                 | 36 ++++++++++---------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/enjoy/src/renderer/components/medias/media-bottom-panel/media-player-controls.tsx b/enjoy/src/renderer/components/medias/media-bottom-panel/media-player-controls.tsx
index 4f9b8381..8afe4824 100644
--- a/enjoy/src/renderer/components/medias/media-bottom-panel/media-player-controls.tsx
+++ b/enjoy/src/renderer/components/medias/media-bottom-panel/media-player-controls.tsx
@@ -303,31 +303,32 @@ export const MediaPlayerControls = () => {
       }),
 
       regions.on("region-out", (region) => {
-        if (region !== activeRegion && region !== segmentRegion) return;
+        if (region.id !== activeRegion?.id) return;
         if (playMode === "all" || isLoopPausing.current) return;
 
         // Pause immediately
         wavesurfer.pause();
 
-        // Use a more reliable loop mechanism
-        if (playMode === "loop") {
-          // Ensure we're at the start before playing
-          wavesurfer.setTime(parseFloat(region.start.toFixed(6)));
-          isLoopPausing.current = true;
+        // Use requestAnimationFrame to prevent recursion
+        requestAnimationFrame(() => {
+          if (playMode === "loop") {
+            // Set time and play with proper guards
+            if (!isLoopPausing.current) {
+              isLoopPausing.current = true;
+              wavesurfer.setTime(parseFloat(region.start.toFixed(6)));
 
-          // Small delay to ensure time is set before playing
-          setTimeout(() => {
-            isLoopPausing.current = false;
-            if (playMode === "loop") {
-              wavesurfer.play();
+              setTimeout(() => {
+                isLoopPausing.current = false;
+                if (playMode === "loop") {
+                  wavesurfer.play();
+                }
+              }, 500);
             }
-          }, 500);
-        } else if (playMode === "single") {
-          requestAnimationFrame(() => {
+          } else if (playMode === "single") {
             wavesurfer.setTime(parseFloat(region.start.toFixed(6)));
             wavesurfer.setScrollTime(parseFloat(region.start.toFixed(6)));
-          });
-        }
+          }
+        });
       }),
     ];
 
@@ -488,6 +489,9 @@ export const MediaPlayerControls = () => {
       activeRegion.id.startsWith("word-region") ||
       activeRegion.id.startsWith("segment-region")
     ) {
+      if (!wavesurfer.isPlaying()) {
+        wavesurfer.setTime(parseFloat(activeRegion.start.toFixed(6)));
+      }
       setZoomRatio(fitZoomRatio);
     }
   }, [activeRegion, fitZoomRatio]);