From 01f7a58f88e0087b2c5d1471f1e9058bd01f4d09 Mon Sep 17 00:00:00 2001
From: Igor Zolotarenko <zolotarenko.i.r@gmail.com>
Date: Mon, 27 Nov 2023 23:08:47 +0200
Subject: [PATCH 01/17] Add clappr player.

---
 p2p-media-loader-demo/package.json            |  1 +
 p2p-media-loader-demo/src/App.tsx             | 79 +++++++++++++++----
 p2p-media-loader-demo/src/declarations.d.ts   |  1 +
 packages/p2p-media-loader-hlsjs/src/engine.ts |  4 +-
 pnpm-lock.yaml                                | 15 +++-
 5 files changed, 77 insertions(+), 23 deletions(-)

diff --git a/p2p-media-loader-demo/package.json b/p2p-media-loader-demo/package.json
index 94839827..142aa51e 100644
--- a/p2p-media-loader-demo/package.json
+++ b/p2p-media-loader-demo/package.json
@@ -12,6 +12,7 @@
     "type-check": "npx tsc --noEmit"
   },
   "dependencies": {
+    "@clappr/player": "^0.5.0",
     "dplayer": "^1.27.1",
     "hls.js": "^1.4.5",
     "mux.js": "^6.3.0",
diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index f6b1434c..4299c58a 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -3,23 +3,27 @@ import { Engine as HlsJsEngine } from "p2p-media-loader-hlsjs";
 import { Engine as ShakaEngine } from "p2p-media-loader-shaka";
 import Hls from "hls.js";
 import DPlayer from "dplayer";
+import Clappr from "@clappr/player";
 import shakaLib from "shaka-player";
 import muxjs from "mux.js";
 import debug from "debug";
 
 window.muxjs = muxjs;
+(window as any).Clappr = Clappr;
+(window as any).Hls = Hls;
 
 const players = [
   "hlsjs",
   "hls-dplayer",
   "shaka-dplayer",
   "shaka-player",
+  "hls-clappr",
 ] as const;
 type Player = (typeof players)[number];
 type ShakaPlayer = shaka.Player;
 type ExtendedWindow = Window & { videoPlayer?: { destroy?: () => void } };
 
-const streamUrl = {
+const streamUrls = {
   bigBunnyBuck: "https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8",
   byteRangeVideo:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/bipbop_16x9/bipbop_16x9_variant.m3u8",
@@ -52,7 +56,7 @@ function App() {
   const [playerType, setPlayerType] = useState<Player | undefined>(
     localStorage.player
   );
-  const [url, setUrl] = useState<string>(localStorage.streamUrl);
+  const [streamUrl, setStreamUrl] = useState<string>(localStorage.streamUrl);
   const shakaInstance = useRef<shaka.Player>();
   const hlsInstance = useRef<Hls>();
   const containerRef = useRef<HTMLDivElement>(null);
@@ -106,10 +110,9 @@ function App() {
       setPlayerType("hls-dplayer");
     }
     if (!localStorage.streamUrl) {
-      localStorage.streamUrl = streamUrl.live2;
-      setUrl(streamUrl.live2);
+      localStorage.streamUrl = streamUrls.live2;
+      setStreamUrl(streamUrls.live2);
     }
-
     createNewPlayer();
   }, [playerType]);
 
@@ -207,6 +210,25 @@ function App() {
     setPlayerToWindow(player);
   };
 
+  const initHlsClapprPlayer = (url: string) => {
+    const engine = hlsEngine.current!;
+    const clapprPlayer = new Clappr.Player({
+      parentId: "#player-container",
+      source: url,
+      playback: {
+        hlsjsConfig: {
+          ...engine.getConfig(),
+          // enableWorker: true,
+        },
+      },
+    });
+    clapprPlayer.play();
+    console.log(engine);
+    console.log(clapprPlayer);
+    initClapprPlayer(clapprPlayer);
+    setPlayerToWindow(clapprPlayer);
+  };
+
   const destroyAndWindowPlayer = () => {
     const extendedWindow = window as ExtendedWindow;
     extendedWindow.videoPlayer?.destroy?.();
@@ -219,9 +241,9 @@ function App() {
     destroyAndWindowPlayer();
   };
 
-  const onVideoUrlChange = (url: string) => {
-    localStorage.streamUrl = url;
-    setUrl(url);
+  const onVideoUrlChange = (streamUrl: string) => {
+    localStorage.streamUrl = streamUrl;
+    setStreamUrl(streamUrl);
   };
 
   const createNewPlayer = () => {
@@ -229,16 +251,19 @@ function App() {
     setP2PLoadedGlob(0);
     switch (playerType) {
       case "hls-dplayer":
-        initHlsDPlayer(url);
+        initHlsDPlayer(streamUrl);
         break;
       case "hlsjs":
-        initHlsJsPlayer(url);
+        initHlsJsPlayer(streamUrl);
         break;
       case "shaka-dplayer":
-        initShakaDPlayer(url);
+        initShakaDPlayer(streamUrl);
         break;
       case "shaka-player":
-        initShakaPlayer(url);
+        initShakaPlayer(streamUrl);
+        break;
+      case "hls-clappr":
+        initHlsClapprPlayer(streamUrl);
         break;
     }
   };
@@ -247,11 +272,11 @@ function App() {
     switch (playerType) {
       case "hls-dplayer":
       case "hlsjs":
-        hlsInstance.current?.loadSource(url);
+        hlsInstance.current?.loadSource(streamUrl);
         break;
       case "shaka-player":
       case "shaka-dplayer":
-        shakaInstance.current?.load(url).catch(() => undefined);
+        shakaInstance.current?.load(streamUrl).catch(() => undefined);
         break;
     }
   };
@@ -277,10 +302,10 @@ function App() {
               })}
             </select>
             <select
-              value={url}
+              value={streamUrl}
               onChange={(event) => onVideoUrlChange(event.target.value)}
             >
-              {Object.entries(streamUrl).map(([name, url]) => {
+              {Object.entries(streamUrls).map(([name, url]) => {
                 return (
                   <option key={name} value={url}>
                     {name}
@@ -299,7 +324,7 @@ function App() {
             ref={containerRef}
             id="player-container"
             style={{ width: 1000 }}
-          ></div>
+          />
         </div>
         {!!playerType && ["hlsjs", "shaka-player"].includes(playerType) && (
           <video ref={videoRef} controls muted style={{ width: 800 }} />
@@ -453,3 +478,23 @@ const loggers = [
   "core:requests-container-secondary",
   "core:segment-memory-storage",
 ] as const;
+
+export function initHlsJsPlayer(hlsInstance: Hls): void {
+  if (
+    hlsInstance.config?.loader &&
+    typeof (hlsInstance.config.fLoader as any).getEngine === "function"
+  ) {
+    const engine: HlsJsEngine = (hlsInstance.config.fLoader as any).getEngine();
+    engine.initHlsJsEvents(hlsInstance);
+  }
+}
+
+export function initClapprPlayer(clapprPlayer: any): void {
+  clapprPlayer.on("play", () => {
+    const playback = clapprPlayer.core.getCurrentPlayback();
+    if (playback._hls && !playback._hls._p2pm_linitialized) {
+      playback._hls._p2pm_linitialized = true;
+      initHlsJsPlayer(clapprPlayer.core.getCurrentPlayback()._hls);
+    }
+  });
+}
diff --git a/p2p-media-loader-demo/src/declarations.d.ts b/p2p-media-loader-demo/src/declarations.d.ts
index 126e5871..67692208 100644
--- a/p2p-media-loader-demo/src/declarations.d.ts
+++ b/p2p-media-loader-demo/src/declarations.d.ts
@@ -1,2 +1,3 @@
 declare module "mux.js";
 declare module "shaka-player";
+declare module "@clappr/player";
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index c918ae21..68b97ca9 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -81,14 +81,14 @@ export class Engine {
   private createFragmentLoaderClass() {
     const core = this.core;
     // eslint-disable-next-line @typescript-eslint/no-this-alias
-    const engine = this;
+    const engine: Engine = this;
 
     return class FragmentLoader extends FragmentLoaderBase {
       constructor(config: HlsConfig) {
         super(config, core);
       }
 
-      static getEngine() {
+      static getEngine(): Engine {
         return engine;
       }
     };
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 48fd3510..142e29e9 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,9 +1,5 @@
 lockfileVersion: '6.0'
 
-settings:
-  autoInstallPeers: true
-  excludeLinksFromLockfile: false
-
 patchedDependencies:
   bittorrent-tracker@10.0.12:
     hash: 3bacck7ok4ioq2ztv47aeh7t7e
@@ -47,6 +43,9 @@ importers:
 
   p2p-media-loader-demo:
     dependencies:
+      '@clappr/player':
+        specifier: ^0.5.0
+        version: 0.5.0
       dplayer:
         specifier: ^1.27.1
         version: 1.27.1(debug@4.3.4)
@@ -367,6 +366,10 @@ packages:
       to-fast-properties: 2.0.0
     dev: true
 
+  /@clappr/player@0.5.0:
+    resolution: {integrity: sha512-/CKtOOy4iImTy7fjt5VbJM68q/Dlhic0oavjCeWNrd73olzWXrfF/kzC4Z9pc/Q69soBLh7H/KdV2HNnS26cJw==}
+    dev: false
+
   /@esbuild/android-arm64@0.17.19:
     resolution: {integrity: sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==}
     engines: {node: '>=12'}
@@ -3631,3 +3634,7 @@ packages:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
     dev: true
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false

From 16cb32286579f810b5145e1198e7e8286e588751 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Thu, 30 Nov 2023 17:54:30 +0200
Subject: [PATCH 02/17] Add hls.js clappr player.

---
 p2p-media-loader-demo/index.html              | 18 ++---
 p2p-media-loader-demo/package.json            |  1 -
 p2p-media-loader-demo/src/App.tsx             | 39 ++---------
 p2p-media-loader-demo/src/global.d.ts         |  8 +++
 packages/p2p-media-loader-hlsjs/src/engine.ts | 70 +++++++++++++++----
 .../src/fragment-loader.ts                    | 32 +++++----
 .../src/playlist-loader.ts                    | 37 ++++++++++
 .../src/segment-mananger.ts                   | 19 ++---
 pnpm-lock.yaml                                | 15 ++--
 9 files changed, 152 insertions(+), 87 deletions(-)
 create mode 100644 p2p-media-loader-demo/src/global.d.ts
 create mode 100644 packages/p2p-media-loader-hlsjs/src/playlist-loader.ts

diff --git a/p2p-media-loader-demo/index.html b/p2p-media-loader-demo/index.html
index 7e6449b6..b68cfe22 100644
--- a/p2p-media-loader-demo/index.html
+++ b/p2p-media-loader-demo/index.html
@@ -1,12 +1,14 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<head>
+    <meta charset="UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <title>Vite + React + TS</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
+    <script defer type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
+    <script defer type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"></script>
+</head>
+<body>
+<div id="root"></div>
+<script type="module" src="/src/main.tsx"></script>
+</body>
 </html>
diff --git a/p2p-media-loader-demo/package.json b/p2p-media-loader-demo/package.json
index 142aa51e..94839827 100644
--- a/p2p-media-loader-demo/package.json
+++ b/p2p-media-loader-demo/package.json
@@ -12,7 +12,6 @@
     "type-check": "npx tsc --noEmit"
   },
   "dependencies": {
-    "@clappr/player": "^0.5.0",
     "dplayer": "^1.27.1",
     "hls.js": "^1.4.5",
     "mux.js": "^6.3.0",
diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 4299c58a..0197f553 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -3,15 +3,11 @@ import { Engine as HlsJsEngine } from "p2p-media-loader-hlsjs";
 import { Engine as ShakaEngine } from "p2p-media-loader-shaka";
 import Hls from "hls.js";
 import DPlayer from "dplayer";
-import Clappr from "@clappr/player";
 import shakaLib from "shaka-player";
 import muxjs from "mux.js";
 import debug from "debug";
 
 window.muxjs = muxjs;
-(window as any).Clappr = Clappr;
-(window as any).Hls = Hls;
-
 const players = [
   "hlsjs",
   "hls-dplayer",
@@ -48,8 +44,8 @@ const streamUrls = {
   audioOnly:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/img_bipbop_adv_example_ts/a1/prog_index.m3u8",
   dash1:
-    "http://dash.akamaized.net/dash264/TestCases/1a/qualcomm/1/MultiRate.mpd",
-  dash2: "http://dash.akamaized.net/dash264/TestCases/5b/nomor/6.mpd",
+    "https://dash.akamaized.net/dash264/TestCases/1a/qualcomm/1/MultiRate.mpd",
+  dash2: "https://dash.akamaized.net/dash264/TestCases/5b/nomor/6.mpd",
 };
 
 function App() {
@@ -212,20 +208,19 @@ function App() {
 
   const initHlsClapprPlayer = (url: string) => {
     const engine = hlsEngine.current!;
-    const clapprPlayer = new Clappr.Player({
+    const clapprPlayer = new window.Clappr.Player({
       parentId: "#player-container",
       source: url,
       playback: {
         hlsjsConfig: {
           ...engine.getConfig(),
-          // enableWorker: true,
+          _getHlsInstance: () => {
+            return clapprPlayer.core.getCurrentPlayback()?._hls;
+          },
         },
       },
+      plugins: [window.LevelSelector],
     });
-    clapprPlayer.play();
-    console.log(engine);
-    console.log(clapprPlayer);
-    initClapprPlayer(clapprPlayer);
     setPlayerToWindow(clapprPlayer);
   };
 
@@ -478,23 +473,3 @@ const loggers = [
   "core:requests-container-secondary",
   "core:segment-memory-storage",
 ] as const;
-
-export function initHlsJsPlayer(hlsInstance: Hls): void {
-  if (
-    hlsInstance.config?.loader &&
-    typeof (hlsInstance.config.fLoader as any).getEngine === "function"
-  ) {
-    const engine: HlsJsEngine = (hlsInstance.config.fLoader as any).getEngine();
-    engine.initHlsJsEvents(hlsInstance);
-  }
-}
-
-export function initClapprPlayer(clapprPlayer: any): void {
-  clapprPlayer.on("play", () => {
-    const playback = clapprPlayer.core.getCurrentPlayback();
-    if (playback._hls && !playback._hls._p2pm_linitialized) {
-      playback._hls._p2pm_linitialized = true;
-      initHlsJsPlayer(clapprPlayer.core.getCurrentPlayback()._hls);
-    }
-  });
-}
diff --git a/p2p-media-loader-demo/src/global.d.ts b/p2p-media-loader-demo/src/global.d.ts
new file mode 100644
index 00000000..0c730744
--- /dev/null
+++ b/p2p-media-loader-demo/src/global.d.ts
@@ -0,0 +1,8 @@
+declare global {
+  interface Window {
+    Clappr: any;
+    LevelSelector: any;
+  }
+}
+
+export {};
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 68b97ca9..d55946d9 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -1,27 +1,47 @@
 import type Hls from "hls.js";
 import type { HlsConfig, Events } from "hls.js";
 import { FragmentLoaderBase } from "./fragment-loader";
+import { PlaylistLoaderBase } from "./playlist-loader";
 import { SegmentManager } from "./segment-mananger";
 import { Core, CoreEventHandlers } from "p2p-media-loader-core";
 import Debug from "debug";
 
+type EngineState = {
+  isHlsJSEventsInit: boolean;
+  isPlaybackEventHandlersSet: boolean;
+};
+
+type HookedConfig = HlsConfig & {
+  _getHlsInstance?: () => Hls;
+};
+
 export class Engine {
   private readonly core: Core;
   private readonly segmentManager: SegmentManager;
   private debugDestroying = Debug("hls:destroying");
+  private state: EngineState = {
+    isHlsJSEventsInit: false,
+    isPlaybackEventHandlersSet: false,
+  };
 
   constructor(eventHandlers?: CoreEventHandlers) {
     this.core = new Core(eventHandlers);
     this.segmentManager = new SegmentManager(this.core);
   }
 
-  public getConfig(): Pick<HlsConfig, "fLoader"> {
+  public getConfig(): Pick<
+    HlsConfig,
+    "fLoader" | "pLoader" | "liveSyncDurationCount"
+  > {
     return {
+      liveSyncDurationCount: 7,
       fLoader: this.createFragmentLoaderClass(),
+      pLoader: this.createPlaylistLoaderClass(),
     };
   }
 
   initHlsJsEvents(hls: Hls) {
+    this.state.isHlsJSEventsInit = true;
     hls.on("hlsManifestLoaded" as Events.MANIFEST_LOADED, (event, data) => {
       const { networkDetails } = data;
       if (networkDetails instanceof XMLHttpRequest) {
@@ -59,19 +79,26 @@ export class Engine {
     });
 
     hls.on("hlsMediaAttached" as Events.MEDIA_ATTACHED, (event, data) => {
-      const { media } = data;
-      media.addEventListener("timeupdate", () => {
-        this.core.updatePlayback(media.currentTime, media.playbackRate);
-      });
-
-      media.addEventListener("seeking", () => {
-        this.core.updatePlayback(media.currentTime, media.playbackRate);
-      });
-
-      media.addEventListener("ratechange", () => {
-        this.core.updatePlayback(media.currentTime, media.playbackRate);
-      });
+      this.setPlaybackEventHandlers(data.media);
+    });
+
+    if (hls.media) this.setPlaybackEventHandlers(hls.media);
+  }
+
+  private setPlaybackEventHandlers(media: HTMLMediaElement) {
+    if (this.state.isPlaybackEventHandlersSet) return;
+    media.addEventListener("timeupdate", () => {
+      this.core.updatePlayback(media.currentTime, media.playbackRate);
+    });
+
+    media.addEventListener("seeking", () => {
+      this.core.updatePlayback(media.currentTime, media.playbackRate);
     });
+
+    media.addEventListener("ratechange", () => {
+      this.core.updatePlayback(media.currentTime, media.playbackRate);
+    });
+    this.state.isPlaybackEventHandlersSet = true;
   }
 
   destroy() {
@@ -93,4 +120,21 @@ export class Engine {
       }
     };
   }
+
+  private createPlaylistLoaderClass() {
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const engine: Engine = this;
+    return class PlaylistLoader extends PlaylistLoaderBase {
+      constructor(config: HookedConfig) {
+        super(config);
+        if (
+          !engine.state.isHlsJSEventsInit &&
+          typeof config._getHlsInstance === "function"
+        ) {
+          const hlsInstance = config._getHlsInstance();
+          if (hlsInstance) engine.initHlsJsEvents(hlsInstance);
+        }
+      }
+    };
+  }
 }
diff --git a/packages/p2p-media-loader-hlsjs/src/fragment-loader.ts b/packages/p2p-media-loader-hlsjs/src/fragment-loader.ts
index 8ed41e65..6f656c36 100644
--- a/packages/p2p-media-loader-hlsjs/src/fragment-loader.ts
+++ b/packages/p2p-media-loader-hlsjs/src/fragment-loader.ts
@@ -73,18 +73,26 @@ export class FragmentLoaderBase implements Loader<FragmentLoaderContext> {
     const onSuccess = (response: SegmentResponse) => {
       this.response = response;
       const loadedBytes = this.response.data.byteLength;
-      stats.loading = getLoadingStat({
-        targetBitrate: this.response.bandwidth,
-        loadingEndTime: performance.now(),
+      stats.loading = getLoadingStat(
+        this.response.bandwidth,
         loadedBytes,
-      });
+        performance.now()
+      );
       stats.total = stats.loaded = loadedBytes;
 
+      if (callbacks.onProgress) {
+        callbacks.onProgress(
+          this.stats,
+          context,
+          this.response.data,
+          undefined
+        );
+      }
       callbacks.onSuccess(
         { data: this.response.data, url: context.url },
         this.stats,
         context,
-        this.response
+        undefined
       );
     };
 
@@ -136,15 +144,11 @@ export class FragmentLoaderBase implements Loader<FragmentLoaderContext> {
   }
 }
 
-function getLoadingStat({
-  loadedBytes,
-  targetBitrate,
-  loadingEndTime,
-}: {
-  targetBitrate: number;
-  loadedBytes: number;
-  loadingEndTime: number;
-}) {
+function getLoadingStat(
+  targetBitrate: number,
+  loadedBytes: number,
+  loadingEndTime: number
+) {
   const bits = loadedBytes * 8;
   const timeForLoading = (bits / targetBitrate) * 1000;
   const first = loadingEndTime - timeForLoading;
diff --git a/packages/p2p-media-loader-hlsjs/src/playlist-loader.ts b/packages/p2p-media-loader-hlsjs/src/playlist-loader.ts
new file mode 100644
index 00000000..b6f56d18
--- /dev/null
+++ b/packages/p2p-media-loader-hlsjs/src/playlist-loader.ts
@@ -0,0 +1,37 @@
+import {
+  HlsConfig,
+  Loader,
+  LoaderCallbacks,
+  LoaderConfiguration,
+  LoaderContext,
+  LoaderStats,
+  PlaylistLoaderContext,
+} from "hls.js";
+
+export class PlaylistLoaderBase implements Loader<PlaylistLoaderContext> {
+  defaultLoader: Loader<LoaderContext>;
+  context: PlaylistLoaderContext;
+  stats: LoaderStats;
+
+  constructor(config: HlsConfig) {
+    this.defaultLoader = new config.loader(config);
+    this.stats = this.defaultLoader.stats;
+    this.context = this.defaultLoader.context as PlaylistLoaderContext;
+  }
+
+  async load(
+    context: LoaderContext,
+    config: LoaderConfiguration,
+    callbacks: LoaderCallbacks<LoaderContext>
+  ) {
+    this.defaultLoader.load(context, config, callbacks);
+  }
+
+  abort() {
+    this.defaultLoader.abort();
+  }
+
+  destroy() {
+    this.defaultLoader.destroy();
+  }
+}
diff --git a/packages/p2p-media-loader-hlsjs/src/segment-mananger.ts b/packages/p2p-media-loader-hlsjs/src/segment-mananger.ts
index f2732a17..97870b6a 100644
--- a/packages/p2p-media-loader-hlsjs/src/segment-mananger.ts
+++ b/packages/p2p-media-loader-hlsjs/src/segment-mananger.ts
@@ -16,21 +16,24 @@ export class SegmentManager {
   processMasterManifest(data: ManifestLoadedData) {
     const { levels, audioTracks } = data;
     // in the case of audio only stream it is stored in levels
-    levels.forEach((level, index) =>
+
+    for (const [index, level] of levels.entries()) {
+      const { url } = level;
       this.core.addStreamIfNoneExists({
-        localId: level.url,
+        localId: Array.isArray(url) ? url[0] : url,
         type: "main",
         index,
-      })
-    );
+      });
+    }
 
-    audioTracks.forEach((track, index) =>
+    for (const [index, track] of audioTracks.entries()) {
+      const { url } = track;
       this.core.addStreamIfNoneExists({
-        localId: track.url,
+        localId: Array.isArray(url) ? url[0] : url,
         type: "secondary",
         index,
-      })
-    );
+      });
+    }
   }
 
   updatePlaylist(data: LevelUpdatedData | AudioTrackLoadedData) {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 142e29e9..48fd3510 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,5 +1,9 @@
 lockfileVersion: '6.0'
 
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
 patchedDependencies:
   bittorrent-tracker@10.0.12:
     hash: 3bacck7ok4ioq2ztv47aeh7t7e
@@ -43,9 +47,6 @@ importers:
 
   p2p-media-loader-demo:
     dependencies:
-      '@clappr/player':
-        specifier: ^0.5.0
-        version: 0.5.0
       dplayer:
         specifier: ^1.27.1
         version: 1.27.1(debug@4.3.4)
@@ -366,10 +367,6 @@ packages:
       to-fast-properties: 2.0.0
     dev: true
 
-  /@clappr/player@0.5.0:
-    resolution: {integrity: sha512-/CKtOOy4iImTy7fjt5VbJM68q/Dlhic0oavjCeWNrd73olzWXrfF/kzC4Z9pc/Q69soBLh7H/KdV2HNnS26cJw==}
-    dev: false
-
   /@esbuild/android-arm64@0.17.19:
     resolution: {integrity: sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==}
     engines: {node: '>=12'}
@@ -3634,7 +3631,3 @@ packages:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
     dev: true
-
-settings:
-  autoInstallPeers: true
-  excludeLinksFromLockfile: false

From 9eac6c7a7b3ad8e2edc07a673bade56df0b9b3cf Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Thu, 30 Nov 2023 17:58:58 +0200
Subject: [PATCH 03/17] Fix eslint warnings.

---
 p2p-media-loader-demo/src/App.tsx     | 1 +
 p2p-media-loader-demo/src/global.d.ts | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 0197f553..23c22b86 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -207,6 +207,7 @@ function App() {
   };
 
   const initHlsClapprPlayer = (url: string) => {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const engine = hlsEngine.current!;
     const clapprPlayer = new window.Clappr.Player({
       parentId: "#player-container",
diff --git a/p2p-media-loader-demo/src/global.d.ts b/p2p-media-loader-demo/src/global.d.ts
index 0c730744..58823f1b 100644
--- a/p2p-media-loader-demo/src/global.d.ts
+++ b/p2p-media-loader-demo/src/global.d.ts
@@ -1,6 +1,8 @@
 declare global {
   interface Window {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     Clappr: any;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     LevelSelector: any;
   }
 }

From 8a8e9e5f4618b3655ade5e26de97e46cf4cfc0da Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Fri, 1 Dec 2023 12:56:24 +0200
Subject: [PATCH 04/17] Add shaka clappr player.

---
 p2p-media-loader-demo/index.html              |   2 +
 p2p-media-loader-demo/package.json            |   3 +-
 p2p-media-loader-demo/src/App.tsx             | 169 ++++++++++--------
 p2p-media-loader-demo/src/global.d.ts         |   4 +
 packages/p2p-media-loader-hlsjs/src/engine.ts |  22 +--
 pnpm-lock.yaml                                |   3 -
 6 files changed, 109 insertions(+), 94 deletions(-)

diff --git a/p2p-media-loader-demo/index.html b/p2p-media-loader-demo/index.html
index b68cfe22..1c5dc98e 100644
--- a/p2p-media-loader-demo/index.html
+++ b/p2p-media-loader-demo/index.html
@@ -6,6 +6,8 @@
     <title>Vite + React + TS</title>
     <script defer type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
     <script defer type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"></script>
+    <script defer src="https://cdn.jsdelivr.net/npm/shaka-player@latest/dist/shaka-player.compiled.min.js"></script>
+    <script defer type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
 </head>
 <body>
 <div id="root"></div>
diff --git a/p2p-media-loader-demo/package.json b/p2p-media-loader-demo/package.json
index 94839827..7c5730b0 100644
--- a/p2p-media-loader-demo/package.json
+++ b/p2p-media-loader-demo/package.json
@@ -18,8 +18,7 @@
     "p2p-media-loader-hlsjs": "workspace:*",
     "p2p-media-loader-shaka": "workspace:*",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "shaka-player": "^4.3.7"
+    "react-dom": "^18.2.0"
   },
   "devDependencies": {
     "@types/dplayer": "^1.25.2",
diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 23c22b86..052508be 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -3,7 +3,6 @@ import { Engine as HlsJsEngine } from "p2p-media-loader-hlsjs";
 import { Engine as ShakaEngine } from "p2p-media-loader-shaka";
 import Hls from "hls.js";
 import DPlayer from "dplayer";
-import shakaLib from "shaka-player";
 import muxjs from "mux.js";
 import debug from "debug";
 
@@ -11,41 +10,42 @@ window.muxjs = muxjs;
 const players = [
   "hlsjs",
   "hls-dplayer",
+  "hls-clappr",
   "shaka-dplayer",
   "shaka-player",
-  "hls-clappr",
+  "shaka-clappr",
 ] as const;
 type Player = (typeof players)[number];
 type ShakaPlayer = shaka.Player;
 type ExtendedWindow = Window & { videoPlayer?: { destroy?: () => void } };
 
 const streamUrls = {
-  bigBunnyBuck: "https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8",
-  byteRangeVideo:
+  hlsBigBunnyBuck: "https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8",
+  hlsByteRangeVideo:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/bipbop_16x9/bipbop_16x9_variant.m3u8",
-  live: "https://fcc3ddae59ed.us-west-2.playback.live-video.net/api/video/v1/us-west-2.893648527354.channel.DmumNckWFTqz.m3u8",
-  advancedVideo:
+  hlsAdvancedVideo:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/adv_dv_atmos/main.m3u8",
-  advancedVideo2:
+  hlsAdvancedVideo2:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/bipbop_adv_example_hevc/master.m3u8",
-  advancedVideo3:
+  hlsAdvancedVideo3:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/img_bipbop_adv_example_ts/master.m3u8",
-  advancedVideo4:
+  hlsAdvancedVideo4:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/img_bipbop_adv_example_fmp4/master.m3u8",
-  basicExample:
+  hlsBasicExample:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/bipbop_4x3/bipbop_4x3_variant.m3u8",
-  bigBunnyBuckDash: "https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd",
-  live2: "https://cph-p2p-msl.akamaized.net/hls/live/2000341/test/master.m3u8",
+  hlsLive1:
+    "https://fcc3ddae59ed.us-west-2.playback.live-video.net/api/video/v1/us-west-2.893648527354.channel.DmumNckWFTqz.m3u8",
+  hlsLive2:
+    "https://cph-p2p-msl.akamaized.net/hls/live/2000341/test/master.m3u8",
   live2OnlyLevel4:
     "https://cph-p2p-msl.akamaized.net/hls/live/2000341/test/level_4.m3u8",
-  dashLiveWithSeparateVideoAudio:
-    "https://livesim.dashif.org/livesim/testpic_2s/Manifest.mpd",
-  mss: "https://playready.directtaps.net/smoothstreaming/SSWSS720H264/SuperSpeedway_720.ism/Manifest",
   audioOnly:
     "https://devstreaming-cdn.apple.com/videos/streaming/examples/img_bipbop_adv_example_ts/a1/prog_index.m3u8",
-  dash1:
-    "https://dash.akamaized.net/dash264/TestCases/1a/qualcomm/1/MultiRate.mpd",
-  dash2: "https://dash.akamaized.net/dash264/TestCases/5b/nomor/6.mpd",
+  bigBunnyBuckDash: "https://dash.akamaized.net/akamai/bbb_30fps/bbb_30fps.mpd",
+  dashLiveBigBunnyBuck:
+    "https://livesim.dashif.org/livesim/testpic_2s/Manifest.mpd",
+  dashVODBigBunnyBuck:
+    "https://dash.akamaized.net/dash264/TestCases/5b/nomor/6.mpd",
 };
 
 function App() {
@@ -91,7 +91,7 @@ function App() {
   }
 
   if (!shakaEngine.current) {
-    shakaEngine.current = new ShakaEngine(shakaLib, { onSegmentLoaded });
+    shakaEngine.current = new ShakaEngine(window.shaka, { onSegmentLoaded });
   }
 
   useEffect(() => {
@@ -106,8 +106,8 @@ function App() {
       setPlayerType("hls-dplayer");
     }
     if (!localStorage.streamUrl) {
-      localStorage.streamUrl = streamUrls.live2;
-      setStreamUrl(streamUrls.live2);
+      localStorage.streamUrl = streamUrls.hlsLive2;
+      setStreamUrl(streamUrls.hlsLive2);
     }
     createNewPlayer();
   }, [playerType]);
@@ -116,6 +116,65 @@ function App() {
     (window as unknown as ExtendedWindow).videoPlayer = player;
   };
 
+  const initHlsJsPlayer = (url: string) => {
+    if (!videoRef.current) return;
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const engine = hlsEngine.current!;
+    const hls = new Hls({
+      ...engine.getConfig(),
+    });
+    engine.initHlsJsEvents(hls);
+    hls.attachMedia(videoRef.current);
+    hls.loadSource(url);
+    hlsInstance.current = hls;
+    setPlayerToWindow(hls);
+  };
+
+  const initHlsDPlayer = (url: string) => {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const engine = hlsEngine.current!;
+    const player = new DPlayer({
+      container: containerRef.current,
+      video: {
+        url,
+        type: "customHls",
+        customType: {
+          customHls: (video: HTMLVideoElement) => {
+            const hls = new Hls({
+              ...engine.getConfig(),
+              liveSyncDurationCount: 7,
+            });
+            engine.initHlsJsEvents(hls);
+            hls.loadSource(video.src);
+            hls.attachMedia(video);
+            hlsInstance.current = hls;
+          },
+        },
+      },
+    });
+    player.play();
+    setPlayerToWindow(player);
+  };
+
+  const initHlsClapprPlayer = (url: string) => {
+    const engine = hlsEngine.current;
+    if (!engine) return;
+
+    const clapprPlayer: any = new window.Clappr.Player({
+      parentId: "#player-container",
+      source: url,
+      playback: {
+        hlsjsConfig: {
+          ...engine.getConfig(
+            () => clapprPlayer.core.getCurrentPlayback()?._hls
+          ),
+        },
+      },
+      plugins: [window.LevelSelector],
+    });
+    setPlayerToWindow(clapprPlayer);
+  };
+
   const initShakaDPlayer = (url: string) => {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const engine = shakaEngine.current!;
@@ -128,7 +187,8 @@ function App() {
           customHlsOrDash: (video: HTMLVideoElement) => {
             video.autoplay = true;
             const src = video.src;
-            const shakaPlayer = new shakaLib.Player(video);
+            const shakaPlayer = new window.shaka.Player();
+            shakaPlayer.attach(video);
             const onError = (error: { code: number }) => {
               // eslint-disable-next-line no-console
               console.error("Error code", error.toString(), "object", error);
@@ -152,7 +212,7 @@ function App() {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     const engine = shakaEngine.current!;
 
-    const player = new shakaLib.Player(videoRef.current);
+    const player = new window.shaka.Player(videoRef.current);
     const onError = (error: { code: unknown }) => {
       // eslint-disable-next-line no-console
       console.error("Error code", error.code, "object", error);
@@ -166,61 +226,17 @@ function App() {
     setPlayerToWindow(player);
   };
 
-  const initHlsJsPlayer = (url: string) => {
-    if (!videoRef.current) return;
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const engine = hlsEngine.current!;
-    const hls = new Hls({
-      ...engine.getConfig(),
-    });
-    engine.initHlsJsEvents(hls);
-    hls.attachMedia(videoRef.current);
-    hls.loadSource(url);
-    hlsInstance.current = hls;
-    setPlayerToWindow(hls);
-  };
+  const initShakaClapprPlayer = (url: string) => {
+    const engine = shakaEngine.current;
+    if (!engine) return;
 
-  const initHlsDPlayer = (url: string) => {
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const engine = hlsEngine.current!;
-    const player = new DPlayer({
-      container: containerRef.current,
-      video: {
-        url,
-        type: "customHls",
-        customType: {
-          customHls: (video: HTMLVideoElement) => {
-            const hls = new Hls({
-              ...engine.getConfig(),
-              liveSyncDurationCount: 7,
-            });
-            engine.initHlsJsEvents(hls);
-            hls.loadSource(video.src);
-            hls.attachMedia(video);
-            hlsInstance.current = hls;
-          },
-        },
-      },
-    });
-    player.play();
-    setPlayerToWindow(player);
-  };
-
-  const initHlsClapprPlayer = (url: string) => {
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const engine = hlsEngine.current!;
     const clapprPlayer = new window.Clappr.Player({
       parentId: "#player-container",
       source: url,
-      playback: {
-        hlsjsConfig: {
-          ...engine.getConfig(),
-          _getHlsInstance: () => {
-            return clapprPlayer.core.getCurrentPlayback()?._hls;
-          },
-        },
+      plugins: [window.DashShakaPlayback, window.LevelSelector],
+      shakaOnBeforeLoad: (shakaPlayerInstance: any) => {
+        engine.initShakaPlayer(shakaPlayerInstance);
       },
-      plugins: [window.LevelSelector],
     });
     setPlayerToWindow(clapprPlayer);
   };
@@ -252,14 +268,17 @@ function App() {
       case "hlsjs":
         initHlsJsPlayer(streamUrl);
         break;
+      case "hls-clappr":
+        initHlsClapprPlayer(streamUrl);
+        break;
       case "shaka-dplayer":
         initShakaDPlayer(streamUrl);
         break;
       case "shaka-player":
         initShakaPlayer(streamUrl);
         break;
-      case "hls-clappr":
-        initHlsClapprPlayer(streamUrl);
+      case "shaka-clappr":
+        initShakaClapprPlayer(streamUrl);
         break;
     }
   };
diff --git a/p2p-media-loader-demo/src/global.d.ts b/p2p-media-loader-demo/src/global.d.ts
index 58823f1b..2f7cb7d0 100644
--- a/p2p-media-loader-demo/src/global.d.ts
+++ b/p2p-media-loader-demo/src/global.d.ts
@@ -4,6 +4,10 @@ declare global {
     Clappr: any;
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     LevelSelector: any;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    DashShakaPlayback: any;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    shaka: any;
   }
 }
 
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index d55946d9..2df6ad86 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -11,13 +11,10 @@ type EngineState = {
   isPlaybackEventHandlersSet: boolean;
 };
 
-type HookedConfig = HlsConfig & {
-  _getHlsInstance?: () => Hls;
-};
-
 export class Engine {
   private readonly core: Core;
   private readonly segmentManager: SegmentManager;
+  private getHlsJsInstance?: () => Hls;
   private debugDestroying = Debug("hls:destroying");
   private state: EngineState = {
     isHlsJSEventsInit: false,
@@ -29,10 +26,10 @@ export class Engine {
     this.segmentManager = new SegmentManager(this.core);
   }
 
-  public getConfig(): Pick<
-    HlsConfig,
-    "fLoader" | "pLoader" | "liveSyncDurationCount"
-  > {
+  public getConfig(
+    getHlsJsInstance?: () => Hls
+  ): Pick<HlsConfig, "fLoader" | "pLoader" | "liveSyncDurationCount"> {
+    this.getHlsJsInstance = getHlsJsInstance;
     return {
       liveSyncDurationCount: 7,
       fLoader: this.createFragmentLoaderClass(),
@@ -125,13 +122,10 @@ export class Engine {
     // eslint-disable-next-line @typescript-eslint/no-this-alias
     const engine: Engine = this;
     return class PlaylistLoader extends PlaylistLoaderBase {
-      constructor(config: HookedConfig) {
+      constructor(config: HlsConfig) {
         super(config);
-        if (
-          !engine.state.isHlsJSEventsInit &&
-          typeof config._getHlsInstance === "function"
-        ) {
-          const hlsInstance = config._getHlsInstance();
+        if (!engine.state.isHlsJSEventsInit && engine.getHlsJsInstance) {
+          const hlsInstance = engine.getHlsJsInstance();
           if (hlsInstance) engine.initHlsJsEvents(hlsInstance);
         }
       }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 48fd3510..5f2d92da 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -68,9 +68,6 @@ importers:
       react-dom:
         specifier: ^18.2.0
         version: 18.2.0(react@18.2.0)
-      shaka-player:
-        specifier: ^4.3.7
-        version: 4.3.7
     devDependencies:
       '@types/dplayer':
         specifier: ^1.25.2

From d110b92bae25f31c115d5dd1c789541548e58793 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Fri, 1 Dec 2023 13:00:37 +0200
Subject: [PATCH 05/17] Fix lint warnings.

---
 p2p-media-loader-demo/src/App.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 052508be..6c060306 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -160,6 +160,7 @@ function App() {
     const engine = hlsEngine.current;
     if (!engine) return;
 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const clapprPlayer: any = new window.Clappr.Player({
       parentId: "#player-container",
       source: url,
@@ -234,6 +235,7 @@ function App() {
       parentId: "#player-container",
       source: url,
       plugins: [window.DashShakaPlayback, window.LevelSelector],
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
       shakaOnBeforeLoad: (shakaPlayerInstance: any) => {
         engine.initShakaPlayer(shakaPlayerInstance);
       },

From 5560c44766392f6a0b0284ffac99c8003b8cb78e Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Fri, 1 Dec 2023 13:05:17 +0200
Subject: [PATCH 06/17] Disable no explicit any rule for demo.

---
 p2p-media-loader-demo/.eslintrc.cjs   | 31 ++++++++++++++-------------
 p2p-media-loader-demo/src/App.tsx     |  2 --
 p2p-media-loader-demo/src/global.d.ts |  4 ----
 3 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/p2p-media-loader-demo/.eslintrc.cjs b/p2p-media-loader-demo/.eslintrc.cjs
index ff95cbca..688f40c4 100644
--- a/p2p-media-loader-demo/.eslintrc.cjs
+++ b/p2p-media-loader-demo/.eslintrc.cjs
@@ -1,17 +1,18 @@
 module.exports = {
-  env: {es2020: true},
-  extends: ["../.eslintrc.common.cjs", "plugin:react-hooks/recommended"],
-  parser: "@typescript-eslint/parser",
-  parserOptions: {
-    ecmaVersion: "latest",
-    sourceType: "module",
-    project: "tsconfig.json",
-    tsconfigRootDir: __dirname,
-  },
-  plugins: ["react-refresh"],
-  rules: {
-    "react-refresh/only-export-components": "warn",
-    "@typescript-eslint/ban-ts-comment": 0,
-    "react-hooks/exhaustive-deps": 0
-  },
+    env: {es2020: true},
+    extends: ["../.eslintrc.common.cjs", "plugin:react-hooks/recommended"],
+    parser: "@typescript-eslint/parser",
+    parserOptions: {
+        ecmaVersion: "latest",
+        sourceType: "module",
+        project: "tsconfig.json",
+        tsconfigRootDir: __dirname,
+    },
+    plugins: ["react-refresh"],
+    rules: {
+        "react-refresh/only-export-components": "warn",
+        "@typescript-eslint/ban-ts-comment": 0,
+        "react-hooks/exhaustive-deps": 0,
+        "@typescript-eslint/no-explicit-any": 0
+    },
 };
diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 6c060306..052508be 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -160,7 +160,6 @@ function App() {
     const engine = hlsEngine.current;
     if (!engine) return;
 
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const clapprPlayer: any = new window.Clappr.Player({
       parentId: "#player-container",
       source: url,
@@ -235,7 +234,6 @@ function App() {
       parentId: "#player-container",
       source: url,
       plugins: [window.DashShakaPlayback, window.LevelSelector],
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
       shakaOnBeforeLoad: (shakaPlayerInstance: any) => {
         engine.initShakaPlayer(shakaPlayerInstance);
       },
diff --git a/p2p-media-loader-demo/src/global.d.ts b/p2p-media-loader-demo/src/global.d.ts
index 2f7cb7d0..4a81486a 100644
--- a/p2p-media-loader-demo/src/global.d.ts
+++ b/p2p-media-loader-demo/src/global.d.ts
@@ -1,12 +1,8 @@
 declare global {
   interface Window {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     Clappr: any;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     LevelSelector: any;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     DashShakaPlayback: any;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     shaka: any;
   }
 }

From f3a01f760c7430e53ae090f5f87b09d27f71f10e Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Fri, 1 Dec 2023 14:57:02 +0200
Subject: [PATCH 07/17] Refactor code.

---
 p2p-media-loader-demo/index.html                       |  8 ++++----
 p2p-media-loader-demo/src/App.tsx                      | 10 +++++-----
 .../src/manifest-parser-decorator.ts                   |  9 ++++-----
 3 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/p2p-media-loader-demo/index.html b/p2p-media-loader-demo/index.html
index 1c5dc98e..d0acc490 100644
--- a/p2p-media-loader-demo/index.html
+++ b/p2p-media-loader-demo/index.html
@@ -4,10 +4,10 @@
     <meta charset="UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <title>Vite + React + TS</title>
-    <script defer type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
-    <script defer type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"></script>
-    <script defer src="https://cdn.jsdelivr.net/npm/shaka-player@latest/dist/shaka-player.compiled.min.js"></script>
-    <script defer type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/shaka-player@4.3.7/dist/shaka-player.compiled.min.js"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
 </head>
 <body>
 <div id="root"></div>
diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 052508be..8fd8aef8 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -176,8 +176,9 @@ function App() {
   };
 
   const initShakaDPlayer = (url: string) => {
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const engine = shakaEngine.current!;
+    const engine = shakaEngine.current;
+    if (!engine) return;
+
     const player = new DPlayer({
       container: containerRef.current,
       video: {
@@ -208,9 +209,8 @@ function App() {
   };
 
   const initShakaPlayer = (url: string) => {
-    if (!videoRef.current) return;
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const engine = shakaEngine.current!;
+    const engine = shakaEngine.current;
+    if (!videoRef.current || !engine) return;
 
     const player = new window.shaka.Player(videoRef.current);
     const onError = (error: { code: unknown }) => {
diff --git a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
index 636b6ea8..b47e1a02 100644
--- a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
+++ b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
@@ -208,15 +208,14 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
       [key: string]: unknown;
     }[] = [];
     for (const manifestProp of manifestProperties) {
-      if (typeof manifestProp !== "object" || !(manifestProp instanceof Map)) {
-        continue;
-      }
+      if (!(manifestProp instanceof Map)) continue;
 
-      manifestVariantMapValues = Array.from(manifestProp.values());
-      const [value] = manifestVariantMapValues;
+      const value = manifestProp.values().next().value;
       if (typeof value !== "object" || !value.stream?.createSegmentIndex) {
         continue;
       }
+
+      manifestVariantMapValues = [...manifestProp.values()];
       if (!retrieveMediaSequenceMaps) break;
 
       // For version 4.2; Retrieving mediaSequence map for each of HLS playlists

From dd7d199ef881f87550c209ea16c9030561285809 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Fri, 1 Dec 2023 14:58:59 +0200
Subject: [PATCH 08/17] Change comment.

---
 .../p2p-media-loader-shaka/src/manifest-parser-decorator.ts     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
index b47e1a02..aafc464a 100644
--- a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
+++ b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
@@ -162,7 +162,7 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
   private retrieveStreamMediaSequenceTimeMaps(
     variants: shaka.extern.Variant[]
   ) {
-    // For version 4.3
+    // For version 4.3 and above
     const manifestProperties = Object.values(this.originalManifestParser);
     let videoMap: Map<number, number> | undefined = undefined;
     let audioMap: Map<number, number> | undefined = undefined;

From c3ed5ebcc797c4c1173aa24f48a331678a0cd944 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Fri, 1 Dec 2023 18:13:45 +0200
Subject: [PATCH 09/17] Use common approach for hls and dash in shaka.

---
 .../src/loading-handler.ts                    |  17 +--
 .../src/manifest-parser-decorator.ts          | 123 +++++++-----------
 .../src/segment-manager.ts                    |  13 +-
 .../src/stream-utils.ts                       |  14 --
 4 files changed, 52 insertions(+), 115 deletions(-)

diff --git a/packages/p2p-media-loader-shaka/src/loading-handler.ts b/packages/p2p-media-loader-shaka/src/loading-handler.ts
index 99773cfd..fd78c9bb 100644
--- a/packages/p2p-media-loader-shaka/src/loading-handler.ts
+++ b/packages/p2p-media-loader-shaka/src/loading-handler.ts
@@ -37,24 +37,13 @@ export class LoadingHandler implements LoadingHandlerInterface {
 
     const loading = this.defaultLoad();
     if (requestType === RequestType.MANIFEST) {
-      void this.handleManifestLoading(url, loading.promise);
+      void this.handleManifestLoading(loading.promise);
     }
     return loading;
   }
 
-  private async handleManifestLoading(
-    streamUrl: string,
-    loadingPromise: Promise<Response>
-  ) {
-    if (
-      this.streamInfo.protocol === "hls" &&
-      !!this.core.getStream(streamUrl)
-    ) {
-      // loading HLS playlist manifest
-      await loadingPromise;
-      // Waiting for the playlist to be parsed
-      setTimeout(() => this.segmentManager.updateStreamSegments(streamUrl), 0);
-    } else if (!this.streamInfo.manifestResponseUrl) {
+  private async handleManifestLoading(loadingPromise: Promise<Response>) {
+    if (!this.streamInfo.manifestResponseUrl) {
       // loading master manifest either HLS or DASH
       const response = await loadingPromise;
       this.setManifestResponseUrl(response.uri);
diff --git a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
index aafc464a..162055dc 100644
--- a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
+++ b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
@@ -7,12 +7,10 @@ import {
   P2PMLShakaData,
 } from "./types";
 import { StreamType } from "p2p-media-loader-core";
-import * as Utils from "./stream-utils";
 
 export class ManifestParserDecorator implements shaka.extern.ManifestParser {
   private readonly debug = Debug("p2pml-shaka:manifest-parser");
   private readonly isHLS: boolean;
-  private readonly isDash: boolean;
   private segmentManager?: SegmentManager;
 
   constructor(
@@ -20,7 +18,6 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
     private readonly originalManifestParser: shaka.extern.ManifestParser
   ) {
     this.isHLS = this.originalManifestParser instanceof shaka.hls.HlsParser;
-    this.isDash = this.originalManifestParser instanceof shaka.dash.DashParser;
   }
 
   configure(config: shaka.extern.ManifestConfiguration) {
@@ -47,13 +44,9 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
     if (!p2pml) return manifest;
 
     if (this.isHLS) {
-      const success = this.retrieveStreamMediaSequenceTimeMaps(
-        manifest.variants
-      );
-      this.retrieveStreamUrls(!success);
+      this.hookHLSStreamMediaSequenceTimeMaps(manifest.variants);
     }
     this.processStreams(manifest.variants);
-
     return manifest;
   }
 
@@ -82,7 +75,7 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
       type: StreamType,
       order: number
     ) => {
-      if (this.isDash) this.hookSegmentIndex(stream);
+      this.hookSegmentIndex(stream);
       segmentManager.setStream(stream as HookedStream, type, order);
       processedStreams.add(stream.id);
       return true;
@@ -142,12 +135,8 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
           lastItemReference !== prevLastItemReference
         ) {
           // Segment index have been updated
-          const streamLocalId = Utils.getStreamLocalIdFromShakaStream(
-            stream,
-            this.isHLS
-          );
-          segmentManager.updateStreamSegments(streamLocalId, references);
-          this.debug(`Stream ${streamLocalId} is updated`);
+          segmentManager.updateStreamSegments(stream, references);
+          this.debug(`Stream ${stream.id} is updated`);
           prevFirstItemReference = firstItemReference;
           prevLastItemReference = lastItemReference;
         }
@@ -159,44 +148,40 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
     };
   }
 
-  private retrieveStreamMediaSequenceTimeMaps(
-    variants: shaka.extern.Variant[]
-  ) {
+  private hookHLSStreamMediaSequenceTimeMaps(variants: shaka.extern.Variant[]) {
+    const maps = getMapPropertiesFromObject(this.originalManifestParser);
+
     // For version 4.3 and above
-    const manifestProperties = Object.values(this.originalManifestParser);
     let videoMap: Map<number, number> | undefined = undefined;
     let audioMap: Map<number, number> | undefined = undefined;
+    const keysToCheck = ["video", "audio", "text", "image"];
+    for (const map of maps) {
+      if (!keysToCheck.every((key) => map.has(key))) continue;
 
-    for (const manifestProp of manifestProperties) {
-      if (typeof manifestProp === "object" && manifestProp instanceof Map) {
-        const mapKeys = Array.from(manifestProp.keys());
-        if (
-          ["video", "audio", "text", "image"].every((i) => mapKeys.includes(i))
-        ) {
-          videoMap = manifestProp.get("video");
-          audioMap = manifestProp.get("audio");
-          break;
-        }
-      }
+      videoMap = map.get("video");
+      audioMap = map.get("audio");
     }
 
-    if (!videoMap && !audioMap) return false;
-
-    for (const variant of variants) {
-      const { video: videoStream, audio: audioStream } = variant;
-      if (videoStream && videoMap) {
-        (videoStream as HookedStream).mediaSequenceTimeMap = videoMap;
-      }
-      if (audioStream && audioMap) {
-        (audioStream as HookedStream).mediaSequenceTimeMap = videoMap;
+    if (videoMap && audioMap) {
+      for (const variant of variants) {
+        const { video: videoStream, audio: audioStream } = variant;
+        if (videoStream && videoMap) {
+          (videoStream as HookedStream).mediaSequenceTimeMap = videoMap;
+        }
+        if (audioStream && audioMap) {
+          (audioStream as HookedStream).mediaSequenceTimeMap = videoMap;
+        }
       }
+      return;
     }
 
-    return true;
-  }
+    // For version 4.2; Retrieving mediaSequence map for each of HLS playlists
+    const manifestVariantsMap = maps.find((map) => {
+      const item = map.values().next().value;
+      return typeof item === "object" && item.streams?.createSegmentIndex;
+    });
 
-  private retrieveStreamUrls(retrieveMediaSequenceMaps: boolean) {
-    const manifestProperties = Object.values(this.originalManifestParser);
+    if (!manifestVariantsMap) throw new Error();
 
     let manifestVariantMapValues: {
       stream: {
@@ -206,44 +191,22 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
         mediaSequenceTimeMap?: Map<number, number>;
       };
       [key: string]: unknown;
-    }[] = [];
-    for (const manifestProp of manifestProperties) {
-      if (!(manifestProp instanceof Map)) continue;
+    }[] = [...manifestVariantsMap.values()];
 
-      const value = manifestProp.values().next().value;
-      if (typeof value !== "object" || !value.stream?.createSegmentIndex) {
-        continue;
-      }
-
-      manifestVariantMapValues = [...manifestProp.values()];
-      if (!retrieveMediaSequenceMaps) break;
-
-      // For version 4.2; Retrieving mediaSequence map for each of HLS playlists
-      for (const variant of manifestVariantMapValues) {
-        const variantProps = Object.values(variant);
-        const mediaSequenceTimeMap = variantProps.find((p) => p instanceof Map);
-        if (!mediaSequenceTimeMap || variant.stream.mediaSequenceTimeMap) {
-          continue;
-        }
-        variant.stream.mediaSequenceTimeMap = mediaSequenceTimeMap as Map<
-          number,
-          number
-        >;
-      }
-      break;
-    }
-
-    // Retrieve HLS playlists urls
     for (const variant of manifestVariantMapValues) {
-      const variantProps = Object.values(variant) as unknown[];
-      let streamUrl = "";
-      for (const property of variantProps) {
-        if (typeof property === "string" && property.startsWith("http")) {
-          streamUrl = property;
-        }
-      }
+      if (variant.stream.mediaSequenceTimeMap) continue;
 
-      variant.stream.streamUrl = streamUrl;
+      const mediaSequenceTimeMap = getMapPropertiesFromObject(variant).find(
+        (map) => {
+          const [key, value] = map.entries().next().value ?? [];
+          return typeof key === "number" && typeof value === "number";
+        }
+      );
+      if (!mediaSequenceTimeMap) continue;
+      variant.stream.mediaSequenceTimeMap = mediaSequenceTimeMap as Map<
+        number,
+        number
+      >;
     }
   }
 }
@@ -259,3 +222,7 @@ export class DashManifestParser extends ManifestParserDecorator {
     super(shaka, new shaka.dash.DashParser());
   }
 }
+
+function getMapPropertiesFromObject(object: object): Map<any, any>[] {
+  return Object.values(object).filter((property) => property instanceof Map);
+}
diff --git a/packages/p2p-media-loader-shaka/src/segment-manager.ts b/packages/p2p-media-loader-shaka/src/segment-manager.ts
index 856610eb..a63a3359 100644
--- a/packages/p2p-media-loader-shaka/src/segment-manager.ts
+++ b/packages/p2p-media-loader-shaka/src/segment-manager.ts
@@ -17,26 +17,21 @@ export class SegmentManager {
   }
 
   setStream(shakaStream: HookedStream, type: StreamType, index = -1) {
-    const localId = Utils.getStreamLocalIdFromShakaStream(
-      shakaStream,
-      this.streamInfo.protocol === "hls"
-    );
-
     this.core.addStreamIfNoneExists({
-      localId,
+      localId: shakaStream.id.toString(),
       type,
       index,
       shakaStream,
     });
 
-    if (shakaStream.segmentIndex) this.updateStreamSegments(localId);
+    if (shakaStream.segmentIndex) this.updateStreamSegments(shakaStream);
   }
 
   updateStreamSegments(
-    streamLocalId: string,
+    shakaStream: HookedStream,
     segmentReferences?: shaka.media.SegmentReference[]
   ) {
-    const stream = this.core.getStream(streamLocalId);
+    const stream = this.core.getStream(shakaStream.id.toString());
     if (!stream) return;
 
     const { segmentIndex } = stream.shakaStream;
diff --git a/packages/p2p-media-loader-shaka/src/stream-utils.ts b/packages/p2p-media-loader-shaka/src/stream-utils.ts
index efd69db3..914a7fa4 100644
--- a/packages/p2p-media-loader-shaka/src/stream-utils.ts
+++ b/packages/p2p-media-loader-shaka/src/stream-utils.ts
@@ -87,17 +87,3 @@ export function getStreamLastMediaSequence(
     return firstMediaSequence + map.size - 1;
   }
 }
-
-export function getStreamLocalIdFromShakaStream(
-  stream: shaka.extern.Stream | HookedStream,
-  isHls: boolean
-): string {
-  if (isHls) {
-    const streamUrl = (stream as HookedStream).streamUrl;
-    if (!streamUrl) {
-      throw Error("Stream url must be set for HLS stream");
-    }
-    return streamUrl;
-  }
-  return stream.id.toString();
-}

From 70cff1a62d1fd81a02c75a4ea7bce7dcb3ebe5de Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Mon, 11 Dec 2023 12:38:08 +0200
Subject: [PATCH 10/17] Refactor, simplify and optimize getting segment
 references in shaka-player.

---
 p2p-media-loader-demo/index.html              |  2 +-
 .../src/manifest-parser-decorator.ts          | 60 ++++++++++---------
 .../src/stream-utils.ts                       |  2 +-
 3 files changed, 34 insertions(+), 30 deletions(-)

diff --git a/p2p-media-loader-demo/index.html b/p2p-media-loader-demo/index.html
index d0acc490..faced250 100644
--- a/p2p-media-loader-demo/index.html
+++ b/p2p-media-loader-demo/index.html
@@ -6,7 +6,7 @@
     <title>Vite + React + TS</title>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"></script>
-    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/shaka-player@4.3.7/dist/shaka-player.compiled.min.js"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/shaka-player@4.6.5/dist/shaka-player.compiled.min.js"></script>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
 </head>
 <body>
diff --git a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
index 162055dc..07494dd4 100644
--- a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
+++ b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
@@ -104,10 +104,13 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
       const result = await createSegmentIndexOriginal.call(stream);
       const { segmentIndex } = stream;
       let prevReference: shaka.media.SegmentReference | null = null;
-      let prevFirstItemReference: shaka.media.SegmentReference | null = null;
-      let prevLastItemReference: shaka.media.SegmentReference | null = null;
+      let prevFirstItemReference: shaka.media.SegmentReference;
+      let prevLastItemReference: shaka.media.SegmentReference;
 
       if (!segmentIndex) return result;
+      const segmentReferencesPropName =
+        getReferencesListPropertyOfSegmentIndex(segmentIndex);
+      if (!segmentReferencesPropName) return result;
 
       const getOriginal = segmentIndex.get;
       segmentIndex.get = (position) => {
@@ -115,33 +118,25 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
         if (reference === prevReference) return reference;
         prevReference = reference;
 
-        let firstItemReference: shaka.media.SegmentReference | null = null;
-        let lastItemReference: shaka.media.SegmentReference | null = null;
-        const currentGet = segmentIndex.get;
-        segmentIndex.get = getOriginal;
-
-        let references: shaka.media.SegmentReference[];
-        try {
-          references = [...segmentIndex];
-          firstItemReference = references[0];
-          lastItemReference = references[references.length - 1];
-        } catch (err) {
-          // For situations when segmentIndex is not iterable (inner array length is 0)
-          segmentIndex.get = getOriginal;
-          return reference;
-        }
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const referencesList = (segmentIndex as any)[
+          segmentReferencesPropName
+        ] as shaka.media.SegmentReference[];
+        const firstItemReference = referencesList[0];
+        const lastItemReference = referencesList[referencesList.length - 1];
+
         if (
-          firstItemReference !== prevFirstItemReference ||
-          lastItemReference !== prevLastItemReference
+          firstItemReference === prevFirstItemReference &&
+          lastItemReference === prevLastItemReference
         ) {
-          // Segment index have been updated
-          segmentManager.updateStreamSegments(stream, references);
-          this.debug(`Stream ${stream.id} is updated`);
-          prevFirstItemReference = firstItemReference;
-          prevLastItemReference = lastItemReference;
+          return reference;
         }
 
-        segmentIndex.get = currentGet;
+        // Segment index have been updated
+        segmentManager.updateStreamSegments(stream, referencesList);
+        this.debug(`Stream ${stream.id} is updated`);
+        prevFirstItemReference = firstItemReference;
+        prevLastItemReference = lastItemReference;
         return reference;
       };
       return result;
@@ -175,15 +170,15 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
       return;
     }
 
-    // For version 4.2; Retrieving mediaSequence map for each of HLS playlists
+    // For version 4.2; Retrieving mediaSequence map for each HLS playlist
     const manifestVariantsMap = maps.find((map) => {
       const item = map.values().next().value;
       return typeof item === "object" && item.streams?.createSegmentIndex;
     });
 
-    if (!manifestVariantsMap) throw new Error();
+    if (!manifestVariantsMap) return;
 
-    let manifestVariantMapValues: {
+    const manifestVariantMapValues: {
       stream: {
         createSegmentIndex: () => void;
         type: string;
@@ -223,6 +218,15 @@ export class DashManifestParser extends ManifestParserDecorator {
   }
 }
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 function getMapPropertiesFromObject(object: object): Map<any, any>[] {
   return Object.values(object).filter((property) => property instanceof Map);
 }
+
+function getReferencesListPropertyOfSegmentIndex(
+  segmentIndex: shaka.media.SegmentIndex
+): string | undefined {
+  return Object.entries(segmentIndex).find(
+    ([, value]) => value instanceof Array
+  )?.[0];
+}
diff --git a/packages/p2p-media-loader-shaka/src/stream-utils.ts b/packages/p2p-media-loader-shaka/src/stream-utils.ts
index 914a7fa4..a5237101 100644
--- a/packages/p2p-media-loader-shaka/src/stream-utils.ts
+++ b/packages/p2p-media-loader-shaka/src/stream-utils.ts
@@ -1,4 +1,4 @@
-import { HookedStream, Stream } from "./types";
+import { Stream } from "./types";
 import {
   SegmentBase,
   StreamWithReadonlySegments,

From 40c7ae8f4f1f50f37d5d278fe01670bdf0361f21 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Mon, 11 Dec 2023 17:03:56 +0200
Subject: [PATCH 11/17] Safe hls subscription/unsubscription to/from events.

---
 p2p-media-loader-demo/src/App.tsx             |  11 +-
 packages/p2p-media-loader-hlsjs/src/engine.ts | 171 +++++++++++-------
 2 files changed, 107 insertions(+), 75 deletions(-)

diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 8fd8aef8..82669eec 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -123,7 +123,7 @@ function App() {
     const hls = new Hls({
       ...engine.getConfig(),
     });
-    engine.initHlsJsEvents(hls);
+    engine.initHLSEvents(hls);
     hls.attachMedia(videoRef.current);
     hls.loadSource(url);
     hlsInstance.current = hls;
@@ -144,7 +144,7 @@ function App() {
               ...engine.getConfig(),
               liveSyncDurationCount: 7,
             });
-            engine.initHlsJsEvents(hls);
+            engine.initHLSEvents(hls);
             hls.loadSource(video.src);
             hls.attachMedia(video);
             hlsInstance.current = hls;
@@ -165,13 +165,12 @@ function App() {
       source: url,
       playback: {
         hlsjsConfig: {
-          ...engine.getConfig(
-            () => clapprPlayer.core.getCurrentPlayback()?._hls
-          ),
+          ...engine.getConfig(),
         },
       },
       plugins: [window.LevelSelector],
     });
+    engine.initClapprPlayer(clapprPlayer);
     setPlayerToWindow(clapprPlayer);
   };
 
@@ -287,10 +286,12 @@ function App() {
     switch (playerType) {
       case "hls-dplayer":
       case "hlsjs":
+      case "hls-clappr":
         hlsInstance.current?.loadSource(streamUrl);
         break;
       case "shaka-player":
       case "shaka-dplayer":
+      case "shaka-clappr":
         shakaInstance.current?.load(streamUrl).catch(() => undefined);
         break;
     }
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 2df6ad86..7af09756 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -1,35 +1,30 @@
 import type Hls from "hls.js";
+import type {
+  AudioTrackLoadedData,
+  LevelUpdatedData,
+  ManifestLoadedData,
+} from "hls.js";
 import type { HlsConfig, Events } from "hls.js";
 import { FragmentLoaderBase } from "./fragment-loader";
 import { PlaylistLoaderBase } from "./playlist-loader";
 import { SegmentManager } from "./segment-mananger";
 import { Core, CoreEventHandlers } from "p2p-media-loader-core";
-import Debug from "debug";
-
-type EngineState = {
-  isHlsJSEventsInit: boolean;
-  isPlaybackEventHandlersSet: boolean;
-};
 
 export class Engine {
   private readonly core: Core;
   private readonly segmentManager: SegmentManager;
-  private getHlsJsInstance?: () => Hls;
-  private debugDestroying = Debug("hls:destroying");
-  private state: EngineState = {
-    isHlsJSEventsInit: false,
-    isPlaybackEventHandlersSet: false,
-  };
+  private hlsInstanceGetter?: () => Hls;
+  private _hlsInstance?: Hls;
 
   constructor(eventHandlers?: CoreEventHandlers) {
     this.core = new Core(eventHandlers);
     this.segmentManager = new SegmentManager(this.core);
   }
 
-  public getConfig(
-    getHlsJsInstance?: () => Hls
-  ): Pick<HlsConfig, "fLoader" | "pLoader" | "liveSyncDurationCount"> {
-    this.getHlsJsInstance = getHlsJsInstance;
+  public getConfig(): Pick<
+    HlsConfig,
+    "fLoader" | "pLoader" | "liveSyncDurationCount"
+  > {
     return {
       liveSyncDurationCount: 7,
       fLoader: this.createFragmentLoaderClass(),
@@ -37,70 +32,108 @@ export class Engine {
     };
   }
 
-  initHlsJsEvents(hls: Hls) {
-    this.state.isHlsJSEventsInit = true;
-    hls.on("hlsManifestLoaded" as Events.MANIFEST_LOADED, (event, data) => {
-      const { networkDetails } = data;
-      if (networkDetails instanceof XMLHttpRequest) {
-        this.core.setManifestResponseUrl(networkDetails.responseURL);
-      } else if (networkDetails instanceof Response) {
-        this.core.setManifestResponseUrl(networkDetails.url);
-      }
-      this.segmentManager.processMasterManifest(data);
-    });
+  initHLSEvents(hls: Hls) {
+    if (this._hlsInstance === hls) return;
 
-    hls.on("hlsLevelUpdated" as Events.LEVEL_UPDATED, (event, data) => {
-      this.segmentManager.updatePlaylist(data);
-    });
+    if (this._hlsInstance) {
+      this.updateHlsEventsHandlers("unsubscribe");
+      this.updateMediaElementEventHandlers("unsubscribe");
+    }
+    this._hlsInstance = hls;
+    this.updateHlsEventsHandlers("subscribe");
+    this.updateMediaElementEventHandlers("subscribe");
+  }
+
+  private updateHlsEventsHandlers(type: "subscribe" | "unsubscribe") {
+    const hls = this._hlsInstance;
+    if (!hls) return;
+    const method = type === "subscribe" ? "on" : "off";
 
-    hls.on(
+    hls[method](
+      "hlsManifestLoaded" as Events.MANIFEST_LOADED,
+      this.handleManifestLoaded
+    );
+    hls[method](
+      "hlsLevelUpdated" as Events.LEVEL_UPDATED,
+      this.handleLevelUpdated
+    );
+    hls[method](
       "hlsAudioTrackLoaded" as Events.AUDIO_TRACK_LOADED,
-      (event, data) => {
-        this.segmentManager.updatePlaylist(data);
-      }
+      this.handleLevelUpdated
+    );
+    hls[method]("hlsDestroying" as Events.DESTROYING, this.destroy);
+    hls[method](
+      "hlsMediaAttaching" as Events.MEDIA_ATTACHING,
+      this.destroyCore
+    );
+    hls[method](
+      "hlsManifestLoading" as Events.MANIFEST_LOADING,
+      this.destroyCore
+    );
+    hls[method](
+      "hlsMediaDetached" as Events.MEDIA_DETACHED,
+      this.handleMediaDetached
     );
+    hls[method](
+      "hlsMediaAttached" as Events.MEDIA_ATTACHED,
+      this.handleMediaAttached
+    );
+  }
 
-    hls.on("hlsDestroying" as Events.DESTROYING, () => {
-      this.debugDestroying("Hls destroying");
-      this.destroy();
-    });
+  private updateMediaElementEventHandlers = (
+    type: "subscribe" | "unsubscribe"
+  ) => {
+    const media = this._hlsInstance?.media;
+    if (!media) return;
+    const method =
+      type === "subscribe" ? "addEventListener" : "removeEventListener";
+    media[method]("timeupdate", this.handlePlaybackUpdate);
+    media[method]("seeking", this.handlePlaybackUpdate);
+    media[method]("ratechange", this.handlePlaybackUpdate);
+  };
 
-    hls.on("hlsManifestLoading" as Events.MANIFEST_LOADING, () => {
-      this.debugDestroying("Manifest loading");
-      this.destroy();
-    });
+  private handleManifestLoaded = (event: string, data: ManifestLoadedData) => {
+    const { networkDetails } = data;
+    if (networkDetails instanceof XMLHttpRequest) {
+      this.core.setManifestResponseUrl(networkDetails.responseURL);
+    } else if (networkDetails instanceof Response) {
+      this.core.setManifestResponseUrl(networkDetails.url);
+    }
+    this.segmentManager.processMasterManifest(data);
+  };
 
-    hls.on("hlsMediaAttaching" as Events.MEDIA_ATTACHING, () => {
-      this.debugDestroying("Media attaching");
-      this.destroy();
-    });
+  private handleLevelUpdated = (
+    event: string,
+    data: LevelUpdatedData | AudioTrackLoadedData
+  ) => {
+    this.segmentManager.updatePlaylist(data);
+  };
 
-    hls.on("hlsMediaAttached" as Events.MEDIA_ATTACHED, (event, data) => {
-      this.setPlaybackEventHandlers(data.media);
-    });
+  private handleMediaAttached = () => {
+    this.updateMediaElementEventHandlers("subscribe");
+  };
 
-    if (hls.media) this.setPlaybackEventHandlers(hls.media);
-  }
+  private handleMediaDetached = () => {
+    this.updateMediaElementEventHandlers("unsubscribe");
+  };
 
-  private setPlaybackEventHandlers(media: HTMLMediaElement) {
-    if (this.state.isPlaybackEventHandlersSet) return;
-    media.addEventListener("timeupdate", () => {
-      this.core.updatePlayback(media.currentTime, media.playbackRate);
-    });
+  private handlePlaybackUpdate = (event: Event) => {
+    const media = event.target as HTMLMediaElement;
+    this.core.updatePlayback(media.currentTime, media.playbackRate);
+  };
 
-    media.addEventListener("seeking", () => {
-      this.core.updatePlayback(media.currentTime, media.playbackRate);
-    });
+  private destroyCore = () => this.core.destroy();
 
-    media.addEventListener("ratechange", () => {
-      this.core.updatePlayback(media.currentTime, media.playbackRate);
-    });
-    this.state.isPlaybackEventHandlersSet = true;
+  initClapprPlayer(clapprPlayer: any) {
+    this.hlsInstanceGetter = () => clapprPlayer.core.getCurrentPlayback()?._hls;
   }
 
-  destroy() {
-    this.core.destroy();
-  }
+  destroy = () => {
+    this.destroyCore();
+    this.updateHlsEventsHandlers("unsubscribe");
+    this.updateMediaElementEventHandlers("unsubscribe");
+    this._hlsInstance = undefined;
+  };
 
   private createFragmentLoaderClass() {
     const core = this.core;
@@ -124,10 +157,8 @@ export class Engine {
     return class PlaylistLoader extends PlaylistLoaderBase {
       constructor(config: HlsConfig) {
         super(config);
-        if (!engine.state.isHlsJSEventsInit && engine.getHlsJsInstance) {
-          const hlsInstance = engine.getHlsJsInstance();
-          if (hlsInstance) engine.initHlsJsEvents(hlsInstance);
-        }
+        const hlsInstance = engine.hlsInstanceGetter?.();
+        if (hlsInstance) engine.initHLSEvents(hlsInstance);
       }
     };
   }

From fd9c6380777af051c71c0084283553f8f0f20698 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Tue, 12 Dec 2023 12:07:08 +0200
Subject: [PATCH 12/17] Clearing and disposing for shaka engine.

---
 p2p-media-loader-demo/index.html              |   2 +-
 .../src/bandwidth-approximator.ts             |   4 +
 packages/p2p-media-loader-core/src/core.ts    |   5 +
 .../src/hybrid-loader.ts                      |   1 -
 packages/p2p-media-loader-hlsjs/src/engine.ts |  24 +--
 packages/p2p-media-loader-shaka/src/engine.ts | 170 +++++++++++-------
 packages/p2p-media-loader-shaka/src/utils.ts  |  22 ++-
 7 files changed, 149 insertions(+), 79 deletions(-)

diff --git a/p2p-media-loader-demo/index.html b/p2p-media-loader-demo/index.html
index faced250..fccca772 100644
--- a/p2p-media-loader-demo/index.html
+++ b/p2p-media-loader-demo/index.html
@@ -6,7 +6,7 @@
     <title>Vite + React + TS</title>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr-level-selector-plugin@latest/dist/level-selector.min.js"></script>
-    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/shaka-player@4.6.5/dist/shaka-player.compiled.min.js"></script>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/shaka-player@~4.4.0/dist/shaka-player.compiled.min.js"></script>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/dash-shaka-playback@latest/dist/dash-shaka-playback.external.js"></script>
 </head>
 <body>
diff --git a/packages/p2p-media-loader-core/src/bandwidth-approximator.ts b/packages/p2p-media-loader-core/src/bandwidth-approximator.ts
index 79216e53..f7cf25d6 100644
--- a/packages/p2p-media-loader-core/src/bandwidth-approximator.ts
+++ b/packages/p2p-media-loader-core/src/bandwidth-approximator.ts
@@ -21,6 +21,10 @@ export class BandwidthApproximator {
       this.loadings.shift();
     }
   }
+
+  destroy() {
+    this.loadings.length = 0;
+  }
 }
 
 function getBandwidthByProgressList(loadings: LoadProgress[]) {
diff --git a/packages/p2p-media-loader-core/src/core.ts b/packages/p2p-media-loader-core/src/core.ts
index 69700d8b..0e65a16d 100644
--- a/packages/p2p-media-loader-core/src/core.ts
+++ b/packages/p2p-media-loader-core/src/core.ts
@@ -108,6 +108,11 @@ export class Core<TStream extends Stream = Stream> {
     this.streams.clear();
     this.mainStreamLoader?.destroy();
     this.secondaryStreamLoader?.destroy();
+    this.segmentStorage?.destroy();
+    this.mainStreamLoader = undefined;
+    this.secondaryStreamLoader = undefined;
+    this.segmentStorage = undefined;
+    this.bandwidthApproximator.destroy();
     this.manifestResponseUrl = undefined;
   }
 
diff --git a/packages/p2p-media-loader-core/src/hybrid-loader.ts b/packages/p2p-media-loader-core/src/hybrid-loader.ts
index 41b0c00c..55461921 100644
--- a/packages/p2p-media-loader-core/src/hybrid-loader.ts
+++ b/packages/p2p-media-loader-core/src/hybrid-loader.ts
@@ -357,7 +357,6 @@ export class HybridLoader {
     clearInterval(this.storageCleanUpIntervalId);
     clearInterval(this.randomHttpDownloadInterval);
     this.storageCleanUpIntervalId = undefined;
-    void this.segmentStorage.destroy();
     this.requests.destroy();
     this.p2pLoaders.destroy();
     this.logger.loader.destroy();
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 7af09756..222f88f4 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -36,18 +36,18 @@ export class Engine {
     if (this._hlsInstance === hls) return;
 
     if (this._hlsInstance) {
-      this.updateHlsEventsHandlers("unsubscribe");
-      this.updateMediaElementEventHandlers("unsubscribe");
+      this.updateHlsEventsHandlers("unregister");
+      this.updateMediaElementEventHandlers("unregister");
     }
     this._hlsInstance = hls;
-    this.updateHlsEventsHandlers("subscribe");
-    this.updateMediaElementEventHandlers("subscribe");
+    this.updateHlsEventsHandlers("register");
+    this.updateMediaElementEventHandlers("unregister");
   }
 
-  private updateHlsEventsHandlers(type: "subscribe" | "unsubscribe") {
+  private updateHlsEventsHandlers(type: "register" | "unregister") {
     const hls = this._hlsInstance;
     if (!hls) return;
-    const method = type === "subscribe" ? "on" : "off";
+    const method = type === "register" ? "on" : "off";
 
     hls[method](
       "hlsManifestLoaded" as Events.MANIFEST_LOADED,
@@ -81,12 +81,12 @@ export class Engine {
   }
 
   private updateMediaElementEventHandlers = (
-    type: "subscribe" | "unsubscribe"
+    type: "register" | "unregister"
   ) => {
     const media = this._hlsInstance?.media;
     if (!media) return;
     const method =
-      type === "subscribe" ? "addEventListener" : "removeEventListener";
+      type === "register" ? "addEventListener" : "removeEventListener";
     media[method]("timeupdate", this.handlePlaybackUpdate);
     media[method]("seeking", this.handlePlaybackUpdate);
     media[method]("ratechange", this.handlePlaybackUpdate);
@@ -110,11 +110,11 @@ export class Engine {
   };
 
   private handleMediaAttached = () => {
-    this.updateMediaElementEventHandlers("subscribe");
+    this.updateMediaElementEventHandlers("register");
   };
 
   private handleMediaDetached = () => {
-    this.updateMediaElementEventHandlers("unsubscribe");
+    this.updateMediaElementEventHandlers("unregister");
   };
 
   private handlePlaybackUpdate = (event: Event) => {
@@ -130,8 +130,8 @@ export class Engine {
 
   destroy = () => {
     this.destroyCore();
-    this.updateHlsEventsHandlers("unsubscribe");
-    this.updateMediaElementEventHandlers("unsubscribe");
+    this.updateHlsEventsHandlers("unregister");
+    this.updateMediaElementEventHandlers("unregister");
     this._hlsInstance = undefined;
   };
 
diff --git a/packages/p2p-media-loader-shaka/src/engine.ts b/packages/p2p-media-loader-shaka/src/engine.ts
index 8ccb40d4..c6ad0ae9 100644
--- a/packages/p2p-media-loader-shaka/src/engine.ts
+++ b/packages/p2p-media-loader-shaka/src/engine.ts
@@ -4,7 +4,6 @@ import {
   DashManifestParser,
 } from "./manifest-parser-decorator";
 import { SegmentManager } from "./segment-manager";
-import Debug from "debug";
 import {
   StreamInfo,
   Shaka,
@@ -14,15 +13,16 @@ import {
   P2PMLShakaData,
 } from "./types";
 import { LoadingHandler } from "./loading-handler";
-import { decorateMethod } from "./utils";
+import { decorateMethod, undecorateMethod } from "./utils";
 import { Core, CoreEventHandlers } from "p2p-media-loader-core";
 
 export class Engine {
+  private player?: shaka.Player;
   private readonly shaka: Shaka;
   private readonly streamInfo: StreamInfo = {};
   private readonly core: Core<Stream>;
   private readonly segmentManager: SegmentManager;
-  private debugDestroying = Debug("shaka:destroying");
+  private requestFilter?: shaka.extern.RequestFilter;
 
   constructor(shaka?: unknown, eventHandlers?: CoreEventHandlers) {
     this.shaka = (shaka as Shaka | undefined) ?? window.shaka;
@@ -31,8 +31,73 @@ export class Engine {
   }
 
   initShakaPlayer(player: shaka.Player) {
+    if (this.player === player) return;
+    if (this.player) this.destroy();
+    this.player = player;
+
+    this.registerDataToPlayer();
+    this.registerNetworkingEngineSchemes();
+    this.registerManifestParsers();
+    this.updatePlayerEventHandlers("register");
+    decorateMethod(player, "destroy", this.destroy);
+  }
+
+  private updatePlayerEventHandlers = (type: "register" | "unregister") => {
+    const { player } = this;
+    if (!player) return;
+    const method =
+      type === "register" ? "addEventListener" : "removeEventListener";
+    player[method]("loaded", this.handlePlayerLoaded);
+    player[method]("loading", this.destroyCurrentStreamContext);
+    player[method]("unloading", this.handlePlayerUnloading);
+  };
+
+  private handlePlayerLoaded = () => {
+    this.updateMediaElementEventHandlers("register");
+  };
+
+  private handlePlayerUnloading = () => {
+    this.destroyCurrentStreamContext();
+    this.updateMediaElementEventHandlers("unregister");
+  };
+  private destroyCurrentStreamContext = () => {
+    this.streamInfo.protocol = undefined;
+    this.streamInfo.manifestResponseUrl = undefined;
+    this.core.destroy();
+  };
+
+  private updateMediaElementEventHandlers = (
+    type: "register" | "unregister"
+  ) => {
+    const media = this.player?.getMediaElement();
+    if (!media) return;
+    const method =
+      type === "register" ? "addEventListener" : "removeEventListener";
+    media[method]("timeupdate", this.handlePlaybackUpdate);
+    media[method]("ratechange", this.handlePlaybackUpdate);
+    media[method]("seeking", this.handlePlaybackUpdate);
+  };
+
+  private handlePlaybackUpdate = (event: Event) => {
+    const media = event.target as HTMLVideoElement;
+    this.core.updatePlayback(media.currentTime, media.playbackRate);
+  };
+
+  destroy() {
+    this.destroyCurrentStreamContext();
+    this.updatePlayerEventHandlers("unregister");
+    this.updateMediaElementEventHandlers("unregister");
+    this.unregisterDataFromPlayer();
+    this.unregisterManifestParsers();
+    this.unregisterNetworkingEngineSchemes();
+    if (this.player) undecorateMethod(this.player, "destroy");
+    this.player = undefined;
+  }
+
+  private registerDataToPlayer() {
+    if (!this.player) return;
     const networkingEngine =
-      player.getNetworkingEngine() as HookedNetworkingEngine | null;
+      this.player.getNetworkingEngine() as HookedNetworkingEngine | null;
     if (networkingEngine) {
       const p2pml: P2PMLShakaData = {
         shaka: this.shaka,
@@ -40,74 +105,52 @@ export class Engine {
         streamInfo: this.streamInfo,
         segmentManager: this.segmentManager,
       };
-      networkingEngine.p2pml = p2pml;
-      networkingEngine.registerRequestFilter((requestType, request) => {
+      this.requestFilter = (requestType, request) => {
         (request as HookedRequest).p2pml = p2pml;
-      });
+      };
+      networkingEngine.p2pml = p2pml;
+      networkingEngine.registerRequestFilter(this.requestFilter);
     }
-
-    this.initializeNetworkingEngine();
-    this.registerParsers();
-
-    player.addEventListener("loading", () => {
-      this.debugDestroying("Loading manifest");
-      this.destroy();
-    });
-    decorateMethod(player, "destroy", () => {
-      this.debugDestroying("Shaka player destroying");
-      this.destroy();
-    });
-
-    player.addEventListener("loaded", () => {
-      const media = player.getMediaElement();
-      if (!media) return;
-
-      media.addEventListener("timeupdate", () => {
-        this.core.updatePlayback(media.currentTime, media.playbackRate);
-      });
-
-      media.addEventListener("ratechange", () => {
-        this.core.updatePlayback(media.currentTime, media.playbackRate);
-      });
-
-      media.addEventListener("seeking", () => {
-        this.core.updatePlayback(media.currentTime, media.playbackRate);
-      });
-    });
   }
 
-  destroy() {
-    this.streamInfo.protocol = undefined;
-    this.streamInfo.manifestResponseUrl = undefined;
-    this.core.destroy();
+  unregisterDataFromPlayer() {
+    if (!this.player) return;
+    const networkingEngine =
+      this.player.getNetworkingEngine() as HookedNetworkingEngine | null;
+    if (!networkingEngine) return;
+    networkingEngine.p2pml = undefined;
+    if (this.requestFilter) {
+      networkingEngine.unregisterRequestFilter(this.requestFilter);
+    }
   }
 
-  private registerParsers() {
+  private registerManifestParsers() {
     const hlsParserFactory = () => new HlsManifestParser(this.shaka);
     const dashParserFactory = () => new DashManifestParser(this.shaka);
-    this.shaka.media.ManifestParser.registerParserByExtension(
-      "mpd",
-      dashParserFactory
-    );
-    this.shaka.media.ManifestParser.registerParserByMime(
-      "application/dash+xml",
-      dashParserFactory
-    );
-    this.shaka.media.ManifestParser.registerParserByExtension(
-      "m3u8",
-      hlsParserFactory
-    );
-    this.shaka.media.ManifestParser.registerParserByMime(
-      "application/x-mpegurl",
-      hlsParserFactory
-    );
-    this.shaka.media.ManifestParser.registerParserByMime(
+
+    const Parser = this.shaka.media.ManifestParser;
+    Parser.registerParserByExtension("mpd", dashParserFactory);
+    Parser.registerParserByMime("application/dash+xml", dashParserFactory);
+    Parser.registerParserByExtension("m3u8", hlsParserFactory);
+    Parser.registerParserByMime("application/x-mpegurl", hlsParserFactory);
+    Parser.registerParserByMime(
       "application/vnd.apple.mpegurl",
       hlsParserFactory
     );
   }
 
-  private initializeNetworkingEngine() {
+  private unregisterManifestParsers() {
+    const Parser = this.shaka.media.ManifestParser;
+    Parser.unregisterParserByMime("mpd");
+    Parser.unregisterParserByMime("application/dash+xml");
+    Parser.unregisterParserByMime("m3u8");
+    Parser.unregisterParserByMime("application/x-mpegurl");
+    Parser.unregisterParserByMime("application/vnd.apple.mpegurl");
+  }
+
+  private registerNetworkingEngineSchemes() {
+    const { NetworkingEngine } = this.shaka.net;
+
     const handleLoading: shaka.extern.SchemePlugin = (...args) => {
       const request = args[1] as HookedRequest;
       const { p2pml } = request;
@@ -121,8 +164,13 @@ export class Engine {
       );
       return loadingHandler.handleLoading(...args);
     };
+    NetworkingEngine.registerScheme("http", handleLoading);
+    NetworkingEngine.registerScheme("https", handleLoading);
+  }
 
-    this.shaka.net.NetworkingEngine.registerScheme("http", handleLoading);
-    this.shaka.net.NetworkingEngine.registerScheme("https", handleLoading);
+  private unregisterNetworkingEngineSchemes() {
+    const { NetworkingEngine } = this.shaka.net;
+    NetworkingEngine.unregisterScheme("http");
+    NetworkingEngine.unregisterScheme("https");
   }
 }
diff --git a/packages/p2p-media-loader-shaka/src/utils.ts b/packages/p2p-media-loader-shaka/src/utils.ts
index a898549d..6667e871 100644
--- a/packages/p2p-media-loader-shaka/src/utils.ts
+++ b/packages/p2p-media-loader-shaka/src/utils.ts
@@ -1,25 +1,39 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
 type MethodNames<T> = {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   [K in keyof T]: T[K] extends (...args: any[]) => any ? K : never;
 }[keyof T];
 
 export function decorateMethod<
   T extends object,
   MethodName extends MethodNames<T>,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   Method extends T[MethodName] extends (...args: any[]) => any
     ? T[MethodName]
     : never
 >(
   player: T,
   method: MethodName,
-  decorator: (...args: Parameters<Method>) => void
+  decorator: (...args: Parameters<Method>) => void,
+  position: "before" | "after" = "before"
 ) {
   const methodOriginal = player[method] as Method;
 
   player[method] = ((...args) => {
+    if (position === "before") decorator(...(args as Parameters<Method>));
     const result = methodOriginal.apply(player, args);
-    decorator(...(args as Parameters<Method>));
+    if (position === "after") decorator(...(args as Parameters<Method>));
     return result;
   }) as Method;
+  (player[method] as any)._p2pmlOriginalMethod = methodOriginal;
+}
+
+export function undecorateMethod<
+  T extends object,
+  MethodName extends MethodNames<T>,
+  Method extends T[MethodName] extends (...args: any[]) => any
+    ? T[MethodName]
+    : never
+>(player: T, method: MethodName) {
+  const originalMethod = (player[method] as any)._p2pmlOriginalMethod as Method;
+  (player[method] as any) = originalMethod.bind(player);
 }

From 810a228b0a4605af8c1205ce5af201e582bb3b7e Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Tue, 12 Dec 2023 12:38:49 +0200
Subject: [PATCH 13/17] Destroy hls instance.

---
 p2p-media-loader-demo/src/App.tsx             | 4 ++++
 packages/p2p-media-loader-hlsjs/src/engine.ts | 7 ++-----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 82669eec..be8562c7 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -260,6 +260,10 @@ function App() {
   const createNewPlayer = () => {
     setHttpLoadedGlob(0);
     setP2PLoadedGlob(0);
+
+    (window as unknown as ExtendedWindow).videoPlayer?.destroy?.();
+    hlsInstance.current?.destroy();
+    void shakaInstance.current?.destroy();
     switch (playerType) {
       case "hls-dplayer":
         initHlsDPlayer(streamUrl);
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 222f88f4..9ee9f30e 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -34,11 +34,7 @@ export class Engine {
 
   initHLSEvents(hls: Hls) {
     if (this._hlsInstance === hls) return;
-
-    if (this._hlsInstance) {
-      this.updateHlsEventsHandlers("unregister");
-      this.updateMediaElementEventHandlers("unregister");
-    }
+    if (this._hlsInstance) this.destroy();
     this._hlsInstance = hls;
     this.updateHlsEventsHandlers("register");
     this.updateMediaElementEventHandlers("unregister");
@@ -157,6 +153,7 @@ export class Engine {
     return class PlaylistLoader extends PlaylistLoaderBase {
       constructor(config: HlsConfig) {
         super(config);
+        if (engine._hlsInstance) return;
         const hlsInstance = engine.hlsInstanceGetter?.();
         if (hlsInstance) engine.initHLSEvents(hlsInstance);
       }

From fbfd36becfb90b44243ba63358e235916a85f452 Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Tue, 12 Dec 2023 12:45:27 +0200
Subject: [PATCH 14/17] Fix type errors.

---
 packages/p2p-media-loader-hlsjs/src/engine.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 9ee9f30e..419d180d 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -120,7 +120,9 @@ export class Engine {
 
   private destroyCore = () => this.core.destroy();
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   initClapprPlayer(clapprPlayer: any) {
+    this._hlsInstance = undefined;
     this.hlsInstanceGetter = () => clapprPlayer.core.getCurrentPlayback()?._hls;
   }
 

From b2ad3f93e851013f862b2081b178da4d19e65e4e Mon Sep 17 00:00:00 2001
From: igor <i.zoloto02@gmail.com>
Date: Tue, 12 Dec 2023 13:13:59 +0200
Subject: [PATCH 15/17] Fix bug.

---
 packages/p2p-media-loader-hlsjs/src/engine.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 419d180d..81a2f777 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -37,7 +37,7 @@ export class Engine {
     if (this._hlsInstance) this.destroy();
     this._hlsInstance = hls;
     this.updateHlsEventsHandlers("register");
-    this.updateMediaElementEventHandlers("unregister");
+    this.updateMediaElementEventHandlers("register");
   }
 
   private updateHlsEventsHandlers(type: "register" | "unregister") {

From b6ad7bd04087d4b37f0c8ad6544fcd65e580ed22 Mon Sep 17 00:00:00 2001
From: Igor Zolotarenko <zolotarenko.i.r@gmail.com>
Date: Wed, 13 Dec 2023 12:35:45 +0200
Subject: [PATCH 16/17] Compare hls instances on each manifest loading in hls
 js integration.

---
 p2p-media-loader-demo/src/App.tsx             |  4 +--
 packages/p2p-media-loader-hlsjs/src/engine.ts | 28 ++++++++++---------
 .../src/manifest-parser-decorator.ts          | 12 ++++----
 3 files changed, 23 insertions(+), 21 deletions(-)

diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index be8562c7..3dfcb498 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -123,7 +123,7 @@ function App() {
     const hls = new Hls({
       ...engine.getConfig(),
     });
-    engine.initHLSEvents(hls);
+    engine.setHls(hls);
     hls.attachMedia(videoRef.current);
     hls.loadSource(url);
     hlsInstance.current = hls;
@@ -144,7 +144,7 @@ function App() {
               ...engine.getConfig(),
               liveSyncDurationCount: 7,
             });
-            engine.initHLSEvents(hls);
+            engine.setHls(hls);
             hls.loadSource(video.src);
             hls.attachMedia(video);
             hlsInstance.current = hls;
diff --git a/packages/p2p-media-loader-hlsjs/src/engine.ts b/packages/p2p-media-loader-hlsjs/src/engine.ts
index 81a2f777..9c94c748 100644
--- a/packages/p2p-media-loader-hlsjs/src/engine.ts
+++ b/packages/p2p-media-loader-hlsjs/src/engine.ts
@@ -14,7 +14,7 @@ export class Engine {
   private readonly core: Core;
   private readonly segmentManager: SegmentManager;
   private hlsInstanceGetter?: () => Hls;
-  private _hlsInstance?: Hls;
+  private currentHlsInstance?: Hls;
 
   constructor(eventHandlers?: CoreEventHandlers) {
     this.core = new Core(eventHandlers);
@@ -32,16 +32,21 @@ export class Engine {
     };
   }
 
-  initHLSEvents(hls: Hls) {
-    if (this._hlsInstance === hls) return;
-    if (this._hlsInstance) this.destroy();
-    this._hlsInstance = hls;
+  setHls(hls: Hls | (() => Hls)) {
+    this.hlsInstanceGetter = typeof hls === "function" ? hls : () => hls;
+  }
+
+  private initHlsEvents() {
+    const hlsInstance = this.hlsInstanceGetter?.();
+    if (this.currentHlsInstance === hlsInstance) return;
+    if (this.currentHlsInstance) this.destroy();
+    this.currentHlsInstance = hlsInstance;
     this.updateHlsEventsHandlers("register");
     this.updateMediaElementEventHandlers("register");
   }
 
   private updateHlsEventsHandlers(type: "register" | "unregister") {
-    const hls = this._hlsInstance;
+    const hls = this.currentHlsInstance;
     if (!hls) return;
     const method = type === "register" ? "on" : "off";
 
@@ -79,7 +84,7 @@ export class Engine {
   private updateMediaElementEventHandlers = (
     type: "register" | "unregister"
   ) => {
-    const media = this._hlsInstance?.media;
+    const media = this.currentHlsInstance?.media;
     if (!media) return;
     const method =
       type === "register" ? "addEventListener" : "removeEventListener";
@@ -122,15 +127,14 @@ export class Engine {
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   initClapprPlayer(clapprPlayer: any) {
-    this._hlsInstance = undefined;
-    this.hlsInstanceGetter = () => clapprPlayer.core.getCurrentPlayback()?._hls;
+    this.setHls(() => clapprPlayer.core.getCurrentPlayback()?._hls);
   }
 
   destroy = () => {
     this.destroyCore();
     this.updateHlsEventsHandlers("unregister");
     this.updateMediaElementEventHandlers("unregister");
-    this._hlsInstance = undefined;
+    this.currentHlsInstance = undefined;
   };
 
   private createFragmentLoaderClass() {
@@ -155,9 +159,7 @@ export class Engine {
     return class PlaylistLoader extends PlaylistLoaderBase {
       constructor(config: HlsConfig) {
         super(config);
-        if (engine._hlsInstance) return;
-        const hlsInstance = engine.hlsInstanceGetter?.();
-        if (hlsInstance) engine.initHLSEvents(hlsInstance);
+        engine.initHlsEvents();
       }
     };
   }
diff --git a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
index 07494dd4..c1034520 100644
--- a/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
+++ b/packages/p2p-media-loader-shaka/src/manifest-parser-decorator.ts
@@ -10,14 +10,14 @@ import { StreamType } from "p2p-media-loader-core";
 
 export class ManifestParserDecorator implements shaka.extern.ManifestParser {
   private readonly debug = Debug("p2pml-shaka:manifest-parser");
-  private readonly isHLS: boolean;
+  private readonly isHls: boolean;
   private segmentManager?: SegmentManager;
 
   constructor(
     shaka: Readonly<Shaka>,
     private readonly originalManifestParser: shaka.extern.ManifestParser
   ) {
-    this.isHLS = this.originalManifestParser instanceof shaka.hls.HlsParser;
+    this.isHls = this.originalManifestParser instanceof shaka.hls.HlsParser;
   }
 
   configure(config: shaka.extern.ManifestConfiguration) {
@@ -27,7 +27,7 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
   private setP2PMediaLoaderData(p2pml?: P2PMLShakaData) {
     if (!p2pml) return;
     this.segmentManager = p2pml.segmentManager;
-    p2pml.streamInfo.protocol = this.isHLS ? "hls" : "dash";
+    p2pml.streamInfo.protocol = this.isHls ? "hls" : "dash";
   }
 
   async start(
@@ -43,8 +43,8 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
     );
     if (!p2pml) return manifest;
 
-    if (this.isHLS) {
-      this.hookHLSStreamMediaSequenceTimeMaps(manifest.variants);
+    if (this.isHls) {
+      this.hookHlsStreamMediaSequenceTimeMaps(manifest.variants);
     }
     this.processStreams(manifest.variants);
     return manifest;
@@ -143,7 +143,7 @@ export class ManifestParserDecorator implements shaka.extern.ManifestParser {
     };
   }
 
-  private hookHLSStreamMediaSequenceTimeMaps(variants: shaka.extern.Variant[]) {
+  private hookHlsStreamMediaSequenceTimeMaps(variants: shaka.extern.Variant[]) {
     const maps = getMapPropertiesFromObject(this.originalManifestParser);
 
     // For version 4.3 and above

From 42d815cc6eced0ff853212f637c5e0dd755ec7c9 Mon Sep 17 00:00:00 2001
From: Igor Zolotarenko <zolotarenko.i.r@gmail.com>
Date: Wed, 13 Dec 2023 13:10:03 +0200
Subject: [PATCH 17/17] Remove decoration utils.

---
 p2p-media-loader-demo/src/App.tsx             |  1 +
 packages/p2p-media-loader-shaka/src/engine.ts | 98 +++++++++----------
 packages/p2p-media-loader-shaka/src/utils.ts  | 39 --------
 3 files changed, 48 insertions(+), 90 deletions(-)
 delete mode 100644 packages/p2p-media-loader-shaka/src/utils.ts

diff --git a/p2p-media-loader-demo/src/App.tsx b/p2p-media-loader-demo/src/App.tsx
index 3dfcb498..a59f6435 100644
--- a/p2p-media-loader-demo/src/App.tsx
+++ b/p2p-media-loader-demo/src/App.tsx
@@ -91,6 +91,7 @@ function App() {
   }
 
   if (!shakaEngine.current) {
+    ShakaEngine.setGlobalSettings();
     shakaEngine.current = new ShakaEngine(window.shaka, { onSegmentLoaded });
   }
 
diff --git a/packages/p2p-media-loader-shaka/src/engine.ts b/packages/p2p-media-loader-shaka/src/engine.ts
index c6ad0ae9..73c634ab 100644
--- a/packages/p2p-media-loader-shaka/src/engine.ts
+++ b/packages/p2p-media-loader-shaka/src/engine.ts
@@ -13,7 +13,6 @@ import {
   P2PMLShakaData,
 } from "./types";
 import { LoadingHandler } from "./loading-handler";
-import { decorateMethod, undecorateMethod } from "./utils";
 import { Core, CoreEventHandlers } from "p2p-media-loader-core";
 
 export class Engine {
@@ -34,17 +33,36 @@ export class Engine {
     if (this.player === player) return;
     if (this.player) this.destroy();
     this.player = player;
-
-    this.registerDataToPlayer();
-    this.registerNetworkingEngineSchemes();
-    this.registerManifestParsers();
     this.updatePlayerEventHandlers("register");
-    decorateMethod(player, "destroy", this.destroy);
   }
 
   private updatePlayerEventHandlers = (type: "register" | "unregister") => {
     const { player } = this;
     if (!player) return;
+
+    if (!this.player) return;
+    const networkingEngine =
+      this.player.getNetworkingEngine() as HookedNetworkingEngine | null;
+    if (networkingEngine) {
+      if (type === "register") {
+        const p2pml: P2PMLShakaData = {
+          shaka: this.shaka,
+          core: this.core,
+          streamInfo: this.streamInfo,
+          segmentManager: this.segmentManager,
+        };
+        this.requestFilter = (requestType, request) => {
+          (request as HookedRequest).p2pml = p2pml;
+        };
+        networkingEngine.p2pml = p2pml;
+        networkingEngine.registerRequestFilter(this.requestFilter);
+      } else {
+        networkingEngine.p2pml = undefined;
+        if (this.requestFilter) {
+          networkingEngine.unregisterRequestFilter(this.requestFilter);
+        }
+      }
+    }
     const method =
       type === "register" ? "addEventListener" : "removeEventListener";
     player[method]("loaded", this.handlePlayerLoaded);
@@ -87,48 +105,14 @@ export class Engine {
     this.destroyCurrentStreamContext();
     this.updatePlayerEventHandlers("unregister");
     this.updateMediaElementEventHandlers("unregister");
-    this.unregisterDataFromPlayer();
-    this.unregisterManifestParsers();
-    this.unregisterNetworkingEngineSchemes();
-    if (this.player) undecorateMethod(this.player, "destroy");
     this.player = undefined;
   }
 
-  private registerDataToPlayer() {
-    if (!this.player) return;
-    const networkingEngine =
-      this.player.getNetworkingEngine() as HookedNetworkingEngine | null;
-    if (networkingEngine) {
-      const p2pml: P2PMLShakaData = {
-        shaka: this.shaka,
-        core: this.core,
-        streamInfo: this.streamInfo,
-        segmentManager: this.segmentManager,
-      };
-      this.requestFilter = (requestType, request) => {
-        (request as HookedRequest).p2pml = p2pml;
-      };
-      networkingEngine.p2pml = p2pml;
-      networkingEngine.registerRequestFilter(this.requestFilter);
-    }
-  }
-
-  unregisterDataFromPlayer() {
-    if (!this.player) return;
-    const networkingEngine =
-      this.player.getNetworkingEngine() as HookedNetworkingEngine | null;
-    if (!networkingEngine) return;
-    networkingEngine.p2pml = undefined;
-    if (this.requestFilter) {
-      networkingEngine.unregisterRequestFilter(this.requestFilter);
-    }
-  }
-
-  private registerManifestParsers() {
-    const hlsParserFactory = () => new HlsManifestParser(this.shaka);
-    const dashParserFactory = () => new DashManifestParser(this.shaka);
+  private static registerManifestParsers(shaka: Shaka) {
+    const hlsParserFactory = () => new HlsManifestParser(shaka);
+    const dashParserFactory = () => new DashManifestParser(shaka);
 
-    const Parser = this.shaka.media.ManifestParser;
+    const Parser = shaka.media.ManifestParser;
     Parser.registerParserByExtension("mpd", dashParserFactory);
     Parser.registerParserByMime("application/dash+xml", dashParserFactory);
     Parser.registerParserByExtension("m3u8", hlsParserFactory);
@@ -139,8 +123,8 @@ export class Engine {
     );
   }
 
-  private unregisterManifestParsers() {
-    const Parser = this.shaka.media.ManifestParser;
+  private static unregisterManifestParsers(shaka: Shaka) {
+    const Parser = shaka.media.ManifestParser;
     Parser.unregisterParserByMime("mpd");
     Parser.unregisterParserByMime("application/dash+xml");
     Parser.unregisterParserByMime("m3u8");
@@ -148,13 +132,13 @@ export class Engine {
     Parser.unregisterParserByMime("application/vnd.apple.mpegurl");
   }
 
-  private registerNetworkingEngineSchemes() {
-    const { NetworkingEngine } = this.shaka.net;
+  private static registerNetworkingEngineSchemes(shaka: Shaka) {
+    const { NetworkingEngine } = shaka.net;
 
     const handleLoading: shaka.extern.SchemePlugin = (...args) => {
       const request = args[1] as HookedRequest;
       const { p2pml } = request;
-      if (!p2pml) return this.shaka.net.HttpFetchPlugin.parse(...args);
+      if (!p2pml) return shaka.net.HttpFetchPlugin.parse(...args);
 
       const loadingHandler = new LoadingHandler(
         p2pml.shaka,
@@ -168,9 +152,21 @@ export class Engine {
     NetworkingEngine.registerScheme("https", handleLoading);
   }
 
-  private unregisterNetworkingEngineSchemes() {
-    const { NetworkingEngine } = this.shaka.net;
+  private static unregisterNetworkingEngineSchemes(shaka: Shaka) {
+    const { NetworkingEngine } = shaka.net;
     NetworkingEngine.unregisterScheme("http");
     NetworkingEngine.unregisterScheme("https");
   }
+
+  static setGlobalSettings(shaka?: unknown) {
+    const shakaGlobal = (shaka as Shaka | undefined) ?? window.shaka;
+    Engine.registerManifestParsers(shakaGlobal);
+    Engine.registerNetworkingEngineSchemes(shakaGlobal);
+  }
+
+  static unsetGlobalSettings(shaka?: unknown) {
+    const shakaGlobal = (shaka as Shaka | undefined) ?? window.shaka;
+    Engine.unregisterManifestParsers(shakaGlobal);
+    Engine.unregisterNetworkingEngineSchemes(shakaGlobal);
+  }
 }
diff --git a/packages/p2p-media-loader-shaka/src/utils.ts b/packages/p2p-media-loader-shaka/src/utils.ts
deleted file mode 100644
index 6667e871..00000000
--- a/packages/p2p-media-loader-shaka/src/utils.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
-type MethodNames<T> = {
-  [K in keyof T]: T[K] extends (...args: any[]) => any ? K : never;
-}[keyof T];
-
-export function decorateMethod<
-  T extends object,
-  MethodName extends MethodNames<T>,
-  Method extends T[MethodName] extends (...args: any[]) => any
-    ? T[MethodName]
-    : never
->(
-  player: T,
-  method: MethodName,
-  decorator: (...args: Parameters<Method>) => void,
-  position: "before" | "after" = "before"
-) {
-  const methodOriginal = player[method] as Method;
-
-  player[method] = ((...args) => {
-    if (position === "before") decorator(...(args as Parameters<Method>));
-    const result = methodOriginal.apply(player, args);
-    if (position === "after") decorator(...(args as Parameters<Method>));
-    return result;
-  }) as Method;
-  (player[method] as any)._p2pmlOriginalMethod = methodOriginal;
-}
-
-export function undecorateMethod<
-  T extends object,
-  MethodName extends MethodNames<T>,
-  Method extends T[MethodName] extends (...args: any[]) => any
-    ? T[MethodName]
-    : never
->(player: T, method: MethodName) {
-  const originalMethod = (player[method] as any)._p2pmlOriginalMethod as Method;
-  (player[method] as any) = originalMethod.bind(player);
-}