@tiny-codes/react-easy 1.4.12 → 1.4.14

package/es/utils/AudioPlayer.js

@@ -29,6 +29,12 @@ var AudioPlayer = /*#__PURE__*/function () {
     _defineProperty(this, "gainNode", null);
     _defineProperty(this, "sourceNode", null);
     _defineProperty(this, "options", void 0);
+    _defineProperty(this, "mediaSource", null);
+    _defineProperty(this, "sourceBuffer", null);
+    _defineProperty(this, "chunkQueue", []);
+    _defineProperty(this, "appending", false);
+    _defineProperty(this, "streamEnded", false);
+    _defineProperty(this, "stopLoadingSource", false);
     _defineProperty(this, "onPlayEnd", void 0);
     /**
      * - **EN:** Add audio event listener
@@ -77,8 +83,7 @@ var AudioPlayer = /*#__PURE__*/function () {
   _createClass(AudioPlayer, [{
     key: "isPlaying",
     get: function get() {
-      var _this$audioContext;
-      return ((_this$audioContext = this.audioContext) === null || _this$audioContext === void 0 ? void 0 : _this$audioContext.state) === 'running';
+      return !this.audio.paused && !this.audio.ended;
     }
     /**
      * - **EN:** Get current playback time (seconds)
@@ -116,7 +121,7 @@ var AudioPlayer = /*#__PURE__*/function () {
     key: "play",
     value: (function () {
       var _play = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var _this$audioContext2;
+        var _this$audioContext;
         var _this$options2, _this$options2$onPlay, _this$options3, _this$options3$onErro;
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
@@ -124,7 +129,7 @@ var AudioPlayer = /*#__PURE__*/function () {
               if (!this.audioContext) {
                 this.initAudioContext();
               }
-              if (!(((_this$audioContext2 = this.audioContext) === null || _this$audioContext2 === void 0 ? void 0 : _this$audioContext2.state) === 'suspended')) {
+              if (!(((_this$audioContext = this.audioContext) === null || _this$audioContext === void 0 ? void 0 : _this$audioContext.state) === 'suspended')) {
                 _context.next = 4;
                 break;
               }
@@ -247,17 +252,23 @@ var AudioPlayer = /*#__PURE__*/function () {
             case 0:
               this.audio.pause();
               this.audio.src = '';
+              this.disposeMediaSourceInternal();
               if (!(typeof source === 'string')) {
-                _context2.next = 6;
+                _context2.next = 8;
                 break;
               }
               this.audio.src = source;
-              _context2.next = 8;
-              break;
-            case 6:
-              _context2.next = 8;
-              return this.handleStreamSource(source);
+              return _context2.abrupt("return", {
+                stopLoading: function stopLoading() {
+                  // empty function
+                }
+              });
             case 8:
+              _context2.next = 10;
+              return this.handleStreamSource(source);
+            case 10:
+              return _context2.abrupt("return", _context2.sent);
+            case 11:
             case "end":
               return _context2.stop();
           }
@@ -331,97 +342,81 @@ var AudioPlayer = /*#__PURE__*/function () {
       this.sourceNode = null;
       this.gainNode = null;
     }
+  }, {
+    key: "disposeMediaSourceInternal",
+    value: function disposeMediaSourceInternal() {
+      this.mediaSource = null;
+      this.sourceBuffer = null;
+      this.chunkQueue = [];
+      this.appending = false;
+      this.streamEnded = false;
+    }
 
-    /** Process streaming data source */
+    /** Process streaming data source /ArrayBuffer/Uint8Array/Blob */
   }, {
     key: "handleStreamSource",
     value: (function () {
-      var _handleStreamSource = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(source) {
-        var blob, stream, response, url;
-        return _regeneratorRuntime().wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
+      var _handleStreamSource = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(source) {
+        var _this2 = this;
+        var result, url, blob, _url, _this$options6, mime, _this$options7, _this$options7$onErro;
+        return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
             case 0:
+              result = {
+                stopLoading: function stopLoading() {
+                  // empty function
+                }
+              };
               if (source) {
-                _context4.next = 2;
+                _context3.next = 3;
                 break;
               }
-              return _context4.abrupt("return");
-            case 2:
-              _context4.prev = 2;
+              return _context3.abrupt("return", result);
+            case 3:
+              _context3.prev = 3;
               if (!(source instanceof Blob)) {
-                _context4.next = 7;
+                _context3.next = 10;
                 break;
               }
-              blob = source;
-              _context4.next = 16;
-              break;
-            case 7:
+              url = URL.createObjectURL(source);
+              this.audio.src = url;
+              return _context3.abrupt("return", result);
+            case 10:
               if (!(source instanceof ArrayBuffer || source instanceof Uint8Array)) {
-                _context4.next = 11;
+                _context3.next = 18;
                 break;
               }
-              blob = new Blob([source]);
-              _context4.next = 16;
-              break;
-            case 11:
+              blob = source instanceof Uint8Array ? new Blob([source]) : new Blob([new Uint8Array(source)]);
+              _url = URL.createObjectURL(blob);
+              this.audio.src = _url;
+              this.audio.onloadeddata = function () {
+                return URL.revokeObjectURL(_url);
+              };
+              return _context3.abrupt("return", result);
+            case 18:
               // Create a new ReadableStream to read data from the reader
-              stream = new ReadableStream({
-                pull: function pull(controller) {
-                  return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
-                    var _yield$source$read, done, value;
-                    return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-                      while (1) switch (_context3.prev = _context3.next) {
-                        case 0:
-                          _context3.prev = 0;
-                          _context3.next = 3;
-                          return source.read();
-                        case 3:
-                          _yield$source$read = _context3.sent;
-                          done = _yield$source$read.done;
-                          value = _yield$source$read.value;
-                          if (done) {
-                            controller.close();
-                          } else {
-                            controller.enqueue(value);
-                          }
-                          _context3.next = 12;
-                          break;
-                        case 9:
-                          _context3.prev = 9;
-                          _context3.t0 = _context3["catch"](0);
-                          controller.error(_context3.t0);
-                        case 12:
-                        case "end":
-                          return _context3.stop();
-                      }
-                    }, _callee3, null, [[0, 9]]);
-                  }))();
-                }
-              }); // Convert stream to Blob and create URL
-              response = new Response(stream);
-              _context4.next = 15;
-              return response.blob();
-            case 15:
-              blob = _context4.sent;
-            case 16:
-              url = URL.createObjectURL(blob);
-              this.audio.src = url;
-
-              // Release Blob URL after audio loads
-              this.audio.onload = function () {
-                URL.revokeObjectURL(url);
+              mime = ((_this$options6 = this.options) === null || _this$options6 === void 0 ? void 0 : _this$options6.mimeType) || 'audio/mpeg';
+              result.stopLoading = function () {
+                _this2.stopLoadingSource = true;
               };
-              _context4.next = 24;
+              _context3.next = 22;
+              return this.initMediaSourceForReader(source, mime);
+            case 22:
+              return _context3.abrupt("return", result);
+            case 23:
+              _context3.next = 30;
               break;
-            case 21:
-              _context4.prev = 21;
-              _context4.t0 = _context4["catch"](2);
-              console.error('Error processing audio stream:', _context4.t0);
-            case 24:
+            case 25:
+              _context3.prev = 25;
+              _context3.t0 = _context3["catch"](3);
+              console.error('Error processing audio stream:', _context3.t0);
+              (_this$options7 = this.options) === null || _this$options7 === void 0 || (_this$options7$onErro = _this$options7.onError) === null || _this$options7$onErro === void 0 || _this$options7$onErro.call(_this$options7, _context3.t0);
+              throw _context3.t0;
+            case 30:
             case "end":
-              return _context4.stop();
+              return _context3.stop();
           }
-        }, _callee4, this, [[2, 21]]);
+        }, _callee3, this, [[3, 25]]);
       }));
       function handleStreamSource(_x2) {
         return _handleStreamSource.apply(this, arguments);
@@ -450,6 +445,224 @@ var AudioPlayer = /*#__PURE__*/function () {
         this.audio.volume = this._volume;
       }
     }
+
+    /** Initialize MediaSource and push reader chunks into SourceBuffer */
+  }, {
+    key: "initMediaSourceForReader",
+    value: (function () {
+      var _initMediaSourceForReader = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(reader, mime) {
+        var _this3 = this;
+        var objectURL;
+        return _regeneratorRuntime().wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              if (!(typeof MediaSource === 'undefined')) {
+                _context4.next = 5;
+                break;
+              }
+              console.warn('MediaSource is not supported, falling back to one-time buffering.');
+              _context4.next = 4;
+              return this.fallbackReaderToBlob(reader);
+            case 4:
+              return _context4.abrupt("return");
+            case 5:
+              if (!(typeof MediaSource !== 'undefined' && !MediaSource.isTypeSupported(mime))) {
+                _context4.next = 10;
+                break;
+              }
+              console.warn('MIME type is not supported, falling back to one-time buffering.');
+              _context4.next = 9;
+              return this.fallbackReaderToBlob(reader);
+            case 9:
+              return _context4.abrupt("return");
+            case 10:
+              this.mediaSource = new MediaSource();
+              objectURL = URL.createObjectURL(this.mediaSource);
+              this.audio.src = objectURL;
+              this.stopLoadingSource = false;
+              this.mediaSource.addEventListener('sourceopen', function () {
+                if (!_this3.mediaSource) return;
+                _this3.sourceBuffer = _this3.mediaSource.addSourceBuffer(mime);
+                _this3.sourceBuffer.addEventListener('updateend', function () {
+                  _this3.appending = false;
+                  _this3.tryAppendNext();
+                  _this3.finalizeMediaSourceIfPossible();
+                });
+
+                // Start reading loop
+                _this3.readLoop(reader);
+              });
+            case 15:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4, this);
+      }));
+      function initMediaSourceForReader(_x3, _x4) {
+        return _initMediaSourceForReader.apply(this, arguments);
+      }
+      return initMediaSourceForReader;
+    }() /** Loop to read data from the reader */)
+  }, {
+    key: "readLoop",
+    value: (function () {
+      var _readLoop = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5(reader) {
+        var _yield$reader$read, done, value, _this$options8, _this$options8$onErro;
+        return _regeneratorRuntime().wrap(function _callee5$(_context5) {
+          while (1) switch (_context5.prev = _context5.next) {
+            case 0:
+              _context5.prev = 0;
+              // Auto play (optional)
+              if (this.audio.paused) {
+                void this.play();
+              }
+              // eslint-disable-next-line no-constant-condition
+            case 2:
+              if (!true) {
+                _context5.next = 16;
+                break;
+              }
+              _context5.next = 5;
+              return reader.read();
+            case 5:
+              _yield$reader$read = _context5.sent;
+              done = _yield$reader$read.done;
+              value = _yield$reader$read.value;
+              if (!(done || this.stopLoadingSource)) {
+                _context5.next = 11;
+                break;
+              }
+              this.streamEnded = true;
+              return _context5.abrupt("break", 16);
+            case 11:
+              if (value && value.byteLength) {
+                this.chunkQueue.push(value);
+                this.tryAppendNext();
+              }
+              _context5.next = 14;
+              return new Promise(function (resolve) {
+                return setTimeout(resolve, 100);
+              });
+            case 14:
+              _context5.next = 2;
+              break;
+            case 16:
+              // Try to finalize after the loop exits (including 0 chunk case)
+              this.finalizeMediaSourceIfPossible();
+              _context5.next = 23;
+              break;
+            case 19:
+              _context5.prev = 19;
+              _context5.t0 = _context5["catch"](0);
+              console.error('Error reading stream:', _context5.t0);
+              (_this$options8 = this.options) === null || _this$options8 === void 0 || (_this$options8$onErro = _this$options8.onError) === null || _this$options8$onErro === void 0 || _this$options8$onErro.call(_this$options8, _context5.t0);
+            case 23:
+            case "end":
+              return _context5.stop();
+          }
+        }, _callee5, this, [[0, 19]]);
+      }));
+      function readLoop(_x5) {
+        return _readLoop.apply(this, arguments);
+      }
+      return readLoop;
+    }() /** Try to append the next chunk from the queue to the SourceBuffer */)
+  }, {
+    key: "tryAppendNext",
+    value: function tryAppendNext() {
+      if (!this.sourceBuffer || this.appending) return;
+      if (!this.chunkQueue.length) return;
+      var chunk = this.chunkQueue.shift();
+      this.appending = true;
+      try {
+        this.sourceBuffer.appendBuffer(chunk);
+      } catch (e) {
+        var _this$options9, _this$options9$onErro;
+        console.error('Error appending buffer:', e);
+        this.appending = false;
+        (_this$options9 = this.options) === null || _this$options9 === void 0 || (_this$options9$onErro = _this$options9.onError) === null || _this$options9$onErro === void 0 || _this$options9$onErro.call(_this$options9, e);
+        this.finalizeMediaSourceIfPossible();
+      }
+    }
+
+    /** Finalize MediaSource if possible (stream ended, no pending chunks, and not updating) */
+  }, {
+    key: "finalizeMediaSourceIfPossible",
+    value: function finalizeMediaSourceIfPossible() {
+      var _this$sourceBuffer;
+      var receivedAnyChunk = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+      if (this.mediaSource && this.mediaSource.readyState === 'open' && this.streamEnded && !((_this$sourceBuffer = this.sourceBuffer) !== null && _this$sourceBuffer !== void 0 && _this$sourceBuffer.updating) && this.chunkQueue.length === 0) {
+        try {
+          this.mediaSource.endOfStream();
+        } catch (e) {
+          console.warn('endOfStream error:', e);
+        }
+      }
+    }
+
+    /** Fallback to one-time Blob synthesis when streaming is not supported */
+  }, {
+    key: "fallbackReaderToBlob",
+    value: (function () {
+      var _fallbackReaderToBlob = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(reader) {
+        var stream, response, blob, url;
+        return _regeneratorRuntime().wrap(function _callee7$(_context7) {
+          while (1) switch (_context7.prev = _context7.next) {
+            case 0:
+              stream = new ReadableStream({
+                pull: function pull(controller) {
+                  return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
+                    var _yield$reader$read2, done, value;
+                    return _regeneratorRuntime().wrap(function _callee6$(_context6) {
+                      while (1) switch (_context6.prev = _context6.next) {
+                        case 0:
+                          _context6.prev = 0;
+                          _context6.next = 3;
+                          return reader.read();
+                        case 3:
+                          _yield$reader$read2 = _context6.sent;
+                          done = _yield$reader$read2.done;
+                          value = _yield$reader$read2.value;
+                          if (done) {
+                            controller.close();
+                          } else {
+                            controller.enqueue(value);
+                          }
+                          _context6.next = 12;
+                          break;
+                        case 9:
+                          _context6.prev = 9;
+                          _context6.t0 = _context6["catch"](0);
+                          controller.error(_context6.t0);
+                        case 12:
+                        case "end":
+                          return _context6.stop();
+                      }
+                    }, _callee6, null, [[0, 9]]);
+                  }))();
+                }
+              }); // Convert stream to Blob and create URL
+              response = new Response(stream);
+              _context7.next = 4;
+              return response.blob();
+            case 4:
+              blob = _context7.sent;
+              url = URL.createObjectURL(blob);
+              this.audio.src = url;
+              this.audio.onloadeddata = function () {
+                return URL.revokeObjectURL(url);
+              };
+            case 8:
+            case "end":
+              return _context7.stop();
+          }
+        }, _callee7, this);
+      }));
+      function fallbackReaderToBlob(_x6) {
+        return _fallbackReaderToBlob.apply(this, arguments);
+      }
+      return fallbackReaderToBlob;
+    }())
   }]);
   return AudioPlayer;
 }();