@give-tech/ec-player 0.0.1-beta.0 → 0.0.1-beta.2

package/dist/index.js

@@ -147,6 +147,7 @@ class BasePlayer {
       droppedFrames: 0,
       isPrefetching: false,
       segmentIndex: 0,
+      fetchedSegmentCount: 0,
       totalSegments: 0,
       downloadSpeed: 0,
       currentTime: 0,
@@ -227,6 +228,7 @@ class BasePlayer {
       droppedFrames: 0,
       isPrefetching: false,
       segmentIndex: 0,
+      fetchedSegmentCount: 0,
       totalSegments: 0,
       downloadSpeed: 0,
       currentTime: 0,
@@ -973,6 +975,7 @@ class SegmentPrefetcher extends BasePrefetcher {
     this.prefetchQueue = [];
     this.segments = [];
     this.currentSegmentIndex = 0;
+    this.fetchedSegmentCount = 0;
     this.baseUrl = "";
     this.isPrefetchingSegment = false;
   }
@@ -984,7 +987,8 @@ class SegmentPrefetcher extends BasePrefetcher {
       ...super.createInitialState(),
       currentSegmentIndex: 0,
       totalSegments: 0,
-      prefetchQueueSize: 0
+      prefetchQueueSize: 0,
+      fetchedSegmentCount: 0
     };
   }
   /**
@@ -998,7 +1002,8 @@ class SegmentPrefetcher extends BasePrefetcher {
     this.updateStatus({
       totalSegments: segments.length,
       currentSegmentIndex: 0,
-      prefetchQueueSize: 0
+      prefetchQueueSize: 0,
+      fetchedSegmentCount: 0
     });
     console.log(`[SegmentPrefetcher] Set ${segments.length} segments, baseUrl: ${baseUrl}`);
   }
@@ -1010,7 +1015,8 @@ class SegmentPrefetcher extends BasePrefetcher {
     this.prefetchQueue = [];
     this.updateStatus({
       currentSegmentIndex: index,
-      prefetchQueueSize: 0
+      prefetchQueueSize: 0,
+      fetchedSegmentCount: 0
     });
     console.log(`[SegmentPrefetcher] Current segment index set to ${index}`);
   }
@@ -1052,7 +1058,11 @@ class SegmentPrefetcher extends BasePrefetcher {
         segmentIndex: nextIndex,
         fetchTime
       });
-      this.updateStatus({ prefetchQueueSize: this.prefetchQueue.length });
+      this.fetchedSegmentCount++;
+      this.updateStatus({
+        prefetchQueueSize: this.prefetchQueue.length,
+        fetchedSegmentCount: this.fetchedSegmentCount
+      });
       const callbacks = this.callbacks;
       callbacks.onSegmentFetched?.(nextIndex, data);
       console.log(`[SegmentPrefetcher] Fetched segment #${nextIndex}: ${data.length} bytes, ${fetchTime.toFixed(0)}ms`);
@@ -1378,16 +1388,12 @@ class HLSPlayer extends BasePlayer {
     this._nalQueue = [];
     this._sampleQueue = [];
     this.prefetcher = null;
-    this.renderLoop = () => {
+    this.lastRenderTime = 0;
+    this.renderLoop = (timestamp = 0) => {
       if (!this.isPlaying) return;
       const downloaded = this.isFMP4 ? this.sampleQueue.length : this.nalQueue.length;
       const segments = this.isFMP4 ? this.fmp4Segments : this.segments;
       const totalSegments = segments.length;
-      let currentTime = 0;
-      for (let i = 0; i < this.currentSegmentIndex && i < segments.length; i++) {
-        currentTime += segments[i].duration * 1e3;
-      }
-      this.setCurrentTime(currentTime);
       this.updateState({
         decoded: this.frameBuffer.length,
         downloaded,
@@ -1398,10 +1404,17 @@ class HLSPlayer extends BasePlayer {
       if (this.frameBuffer.length > 0 && this.renderer) {
         const frame = this.frameBuffer.shift();
         this.renderer.render(frame);
+        if (this.lastRenderTime > 0) {
+          const elapsed = timestamp - this.lastRenderTime;
+          this.setCurrentTime(this._currentTime + elapsed);
+        }
+        this.lastRenderTime = timestamp;
         this.updateState({ resolution: `${frame.width}x${frame.height}` });
         const fps = this.renderer.updateFps();
         this.updateState({ fps });
         this.callbacks.onFrameRender?.(frame);
+      } else {
+        this.lastRenderTime = 0;
       }
       this.frameTimer = requestAnimationFrame(this.renderLoop);
     };
@@ -1475,8 +1488,11 @@ class HLSPlayer extends BasePlayer {
   async play() {
     this.isPlaying = true;
     this.decodeLoopAbort = false;
+    this.lastRenderTime = 0;
     this.updateState({ isPlaying: true });
-    this.initPrefetcher();
+    if (!this.prefetcher) {
+      this.initPrefetcher();
+    }
     this.prefetcher?.start();
     this.decodeLoop();
     this.frameTimer = requestAnimationFrame(this.renderLoop);
@@ -1569,9 +1585,11 @@ class HLSPlayer extends BasePlayer {
       HLS_PREFETCHER_CONFIG,
       {
         onStatusChange: (status) => {
+          const segStatus = status;
           this.updateState({
             isPrefetching: status.isPrefetching,
-            downloadSpeed: status.downloadSpeed
+            downloadSpeed: status.downloadSpeed,
+            fetchedSegmentCount: segStatus.fetchedSegmentCount ?? 0
           });
         },
         onSegmentParsed: (segmentIndex, itemCount) => {
@@ -2537,7 +2555,7 @@ class FLVPlayer extends BasePlayer {
       const isLive = this.config.isLive;
       if (this._timedFrameBuffer.length > 0 && this.renderer) {
         this.consecutiveEmptyBuffer = 0;
-        if (this.firstFrameDts < 0) {
+        if (this.playStartTime <= 0) {
           this.firstFrameDts = this._timedFrameBuffer[0].dts;
           this.playStartTime = now;
           this.playStartTimeOffset = 0;
@@ -2792,24 +2810,22 @@ class FLVPlayer extends BasePlayer {
     }
     let newCount = 0;
     for (const tag of result.videoTags) {
-      if (tag.timestamp > this._lastQueuedTimestamp) {
-        let annexBData = this.flvDemuxer.videoTagToAnnexB(tag, lengthSize);
-        if (!annexBData) {
-          for (const trySize of [4, 2, 1]) {
-            if (trySize !== lengthSize) {
-              annexBData = this.flvDemuxer.videoTagToAnnexB(tag, trySize);
-              if (annexBData) {
-                lengthSize = trySize;
-                break;
-              }
+      let annexBData = this.flvDemuxer.videoTagToAnnexB(tag, lengthSize);
+      if (!annexBData) {
+        for (const trySize of [4, 2, 1]) {
+          if (trySize !== lengthSize) {
+            annexBData = this.flvDemuxer.videoTagToAnnexB(tag, trySize);
+            if (annexBData) {
+              lengthSize = trySize;
+              break;
             }
           }
         }
-        if (annexBData) {
-          this._videoTagQueue.push({ tag, annexBData });
-          this._lastQueuedTimestamp = tag.timestamp;
-          newCount++;
-        }
+      }
+      if (annexBData) {
+        this._videoTagQueue.push({ tag, annexBData });
+        this._lastQueuedTimestamp = tag.timestamp;
+        newCount++;
       }
     }
     if (newCount > 0) {
@@ -3476,6 +3492,7 @@ class EcPlayerCore {
         droppedFrames: 0,
         isPrefetching: false,
         segmentIndex: 0,
+        fetchedSegmentCount: 0,
         totalSegments: 0,
         downloadSpeed: 0,
         currentTime: 0,