From aa52f5df31341ebe583985829cbf5da8d50db0a9 Mon Sep 17 00:00:00 2001
From: mark <1446916+markcellus@users.noreply.github.com>
Date: Wed, 28 Jun 2023 10:43:56 -0400
Subject: [PATCH] Remove deprecated ResourceManager

Fixes #608
---
 src/youtube-video.ts         | 31 ++++++++++++++++++++++---------
 tests/youtube-video-tests.ts |  2 +-
 2 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/youtube-video.ts b/src/youtube-video.ts
index 606f388..a83d77b 100644
--- a/src/youtube-video.ts
+++ b/src/youtube-video.ts
@@ -1,5 +1,3 @@
-import ResourceManager from 'resource-manager-js';
-
 declare global {
     // eslint-disable-next-line no-unused-vars
     interface Window {
@@ -25,9 +23,13 @@ export class YoutubeVideoElement extends HTMLElement {
     private scriptPath: string = 'https://www.youtube.com/iframe_api';
     private mediaError: Error = undefined;
 
+    id: string;
+
     constructor() {
         super();
-        videos.set(this, this.id);
+        const id = this.getAttribute('id') || `ytPlayer-${videos.size}`;
+        videos.set(this, id);
+        this.id = id;
     }
 
     connectedCallback() {
@@ -73,10 +75,6 @@ export class YoutubeVideoElement extends HTMLElement {
         return this.hasAttribute('playsinline');
     }
 
-    get id(): string {
-        return this.getAttribute('id') || `ytPlayer-${videos.size}`;
-    }
-
     get controls(): boolean {
         return this.hasAttribute('controls') || true;
     }
@@ -200,6 +198,10 @@ export class YoutubeVideoElement extends HTMLElement {
         }
     }
 
+    private get loadScriptId() {
+        return `youtube-video-${this.id}`;
+    }
+
     private loadYTScript(): Promise<void> {
         // Load the IFrame Player API code asynchronously.
         if (!YoutubeVideoElement.scriptLoadPromise) {
@@ -217,15 +219,26 @@ export class YoutubeVideoElement extends HTMLElement {
                     if (originalOnYouTubeIframeAPIReady) {
                         originalOnYouTubeIframeAPIReady(...args);
                     }
+                    resolve();
                 };
-                return ResourceManager.loadScript(this.scriptPath);
+
+                // load youtube's script tag
+                const script = document.createElement('script');
+                script.id = this.loadScriptId;
+                script.src = this.scriptPath;
+                const firstScriptTag =
+                    document.getElementsByTagName('script')[0];
+                firstScriptTag.parentNode.insertBefore(script, firstScriptTag);
             });
         }
         return YoutubeVideoElement.scriptLoadPromise;
     }
 
     private unloadYTScript() {
-        ResourceManager.unloadScript(this.scriptPath);
+        const script = document.querySelector(`#${this.loadScriptId}`);
+        if (script) {
+            script.remove();
+        }
         YoutubeVideoElement.scriptLoadPromise = null;
     }
 
diff --git a/tests/youtube-video-tests.ts b/tests/youtube-video-tests.ts
index 5ccc62d..c22263d 100644
--- a/tests/youtube-video-tests.ts
+++ b/tests/youtube-video-tests.ts
@@ -92,7 +92,7 @@ describe('Youtube Video Tests', function () {
         testContainer.removeChild(videoEl);
     });
 
-    it('should load proper iFrame player api script when load() is called and remove it from the dom when removed', async function () {
+    it('loads proper iFrame player api script when load() is called and remove it from the dom when removed', async function () {
         var videoEl = document.createElement(
             'youtube-video'
         ) as YoutubeVideoElement;