Remove code duplication for thumbnails loading (#562)

NUXT/components/Player/index.vue

@@ -54,7 +54,7 @@
               }rem 0rem 0rem !important`
             : '0',
       }"
-      :poster="$youtube.getThumbnail($route.query.v, 'max', [])"
+      :poster="getThumbnail($route.query.v)"
       @loadedmetadata="checkDimensions()"
       @click="controlsHandler()"
     />
@@ -352,6 +352,7 @@ import progressbar from "~/components/Player/progressbar.vue";
 import sponsorblock from "~/components/Player/sponsorblock.vue";
 
 import backType from "~/plugins/classes/backType";
+import Thumbnail from "~/plugins/thumbnail";
 
 export default {
   components: {
@@ -623,6 +624,11 @@ export default {
       this.$refs.player.playbackRate = speed;
       this.$refs.audio.playbackRate = speed;
     },
+    getThumbnail(query) {
+      const thumbnail = new Thumbnail();
+
+      return thumbnail.getThumbnail(query, "max", []);
+    },
     checkDimensions() {
       if (this.$refs.player.videoHeight > this.$refs.player.videoWidth) {
         this.isVerticalVideo = true;

NUXT/plugins/innertube.js

@@ -262,20 +262,6 @@ class Innertube {
     });
   }
 
-  // Static methods
-
-  static getThumbnail(id, resolution) {
-    if (resolution == "max") {
-      const url = `https://img.youtube.com/vi/${id}/maxresdefault.jpg`;
-      let img = new Image();
-      img.src = url;
-      img.onload = function () {
-        if (img.height !== 120) return url;
-      };
-    }
-    return `https://img.youtube.com/vi/${id}/mqdefault.jpg`;
-  }
-
   // Simple Wrappers
   async getRecommendationsAsync() {
     const rec = await this.browseAsync("recommendations");

NUXT/plugins/thumbnail.js

@@ -0,0 +1,17 @@
+class Thumbnail {
+  getThumbnail(id, resolution, backupThumbnail) {
+    if (resolution == "max") {
+      const url = `https://img.youtube.com/vi/${id}/maxresdefault.jpg`;
+      let img = new Image();
+      img.src = url;
+      img.onload = function () {
+        if (img.height !== 120) return url;
+      };
+    }
+    if (backupThumbnail[backupThumbnail.length - 1])
+      return backupThumbnail[backupThumbnail.length - 1].url;
+    else return `https://img.youtube.com/vi/${id}/mqdefault.jpg`;
+  }
+}
+
+export default Thumbnail;

NUXT/plugins/youtube.js

@@ -91,30 +91,14 @@ const innertubeModule = {
   async getVid(id) {
     try {
       return await InnertubeAPI.VidInfoAsync(id);
-    } catch (error) {
+    } catch (error) {}
-    }
-  },
-
-  getThumbnail(id, resolution, backupThumbnail) {
-    if (resolution == "max") {
-      const url = `https://img.youtube.com/vi/${id}/maxresdefault.jpg`;
-      let img = new Image();
-      img.src = url;
-      img.onload = function () {
-        if (img.height !== 120) return url;
-      };
-    }
-    if (backupThumbnail[backupThumbnail.length - 1])
-      return backupThumbnail[backupThumbnail.length - 1].url;
-    else return `https://img.youtube.com/vi/${id}/mqdefault.jpg`;
   },
 
   async getChannel(url) {
     try {
       const response = await InnertubeAPI.getChannelAsync(url);
       return response.data;
-    } catch (error) {
+    } catch (error) {}
-    }
   },
 
   // It just works™
@@ -177,8 +161,7 @@ const innertubeModule = {
     try {
       const response = await InnertubeAPI.getSearchAsync(query);
       return response.contents.sectionListRenderer;
-    } catch (err) {
+    } catch (err) {}
-    }
   },
 
   async saveApiStats(query, url) {