feat: simple test to see if backend API works

NUXT/pages/home.vue

@@ -3,5 +3,16 @@
     <img style="margin-top: 5em; max-width: 80%; max-height: 15em;" src="/dev.svg" />
     <h1 class="grey--text">Page Under Construction</h1>
     <p class="grey--text">Please read the VueTube FAQ for more information.</p>
+    <button @click="debug">Test Button</button>
   </center>
 </template>
+
+<script>
+export default {
+  methods: {
+    debug () {
+      console.log(this.$youtube.recommend("test", false))
+    }
+  } 
+}
+</script>

NUXT/plugins/innertube.js

@@ -0,0 +1,67 @@
+// Code specific to working with the innertube API
+// https://www.youtube.com/youtubei/v1
+
+import { Http } from '@capacitor-community/http';
+import { getBetweenStrings } from './utils';
+
+class Innertube {
+    constructor(ErrorCallback) {
+        this.ErrorCallback = ErrorCallback;
+        this.init();
+        this.retry_count = 0
+    }
+
+    async init() {
+        const html = await Http.request({ method: 'GET', url: 'https://www.youtube.com', params: { hl: "en" } }).catch((error) => error);
+        if (html instanceof Error) this.ErrorCallback(html.message, true);
+        try {
+            const data = JSON.parse(getBetweenStrings(html.data, 'ytcfg.set({', '});'));
+            if (data.INNERTUBE_CONTEXT) {
+                this.key = data.INNERTUBE_API_KEY;
+                this.context = data.INNERTUBE_CONTEXT;
+            }
+
+        } catch (err) {
+            this.ErrorCallback(err, true)
+            this.retry_count >= 10 ? this.init() : this.ErrorCallback("Failed to retrieve Innertube session", true);
+        }
+    };
+
+    async browse(action_type) {
+        let data = { context: this.context }
+
+        switch (action_type) {
+            case 'recommendations':
+                data.browseId = 'FEwhat_to_watch'
+
+                break;
+            case 'playlist':
+                data.browseId = args.browse_id
+                break;
+            default:
+        }
+
+        const response = await Http.request({
+            method: 'POST',
+            url: `https://www.youtube.com/youtubei/v1/browse?key=${this.key}`,
+            data: JSON.stringify(data)
+        }).catch((error) => error);
+
+        if (response instanceof Error) return { success: false, status_code: response.response.status, message: response.message };
+
+        return {
+            success: true,
+            status_code: response.status,
+            data: response.data
+        };
+    }
+
+    async getRecommendations() {
+        const response = await this.browse("recommendations")
+        return response.data;
+    }
+
+
+}
+
+export default Innertube;

NUXT/plugins/utils.js

@@ -0,0 +1,9 @@
+// Collection of functions that are useful but non-specific to any particular files 
+
+function getBetweenStrings(data, start_string, end_string) {
+    const regex = new RegExp(`${start_string}(.*?)${end_string}`, "s");
+    const match = data.match(regex);
+    return match ? match[1] : undefined;
+}
+
+module.exports = { getBetweenStrings };

NUXT/plugins/youtube.js

@@ -1,9 +1,10 @@
 //---   Modules/Imports   ---//
 import { Http } from '@capacitor-community/http';
+import Innertube from './innertube'
 
 //---   Logger Function   ---//
-function logger(func, data, isError=false) {
-  module.logs.unshift({
+function logger(func, data, isError = false) {
+    searchModule.logs.unshift({
         name: func,
         time: Date.now(),
         data: data,
@@ -22,10 +23,10 @@ function youtubeParse(html, callback) {
 
     //---   Get Results   ---// ( Thanks To appit-online On Github ) -> https://github.com/appit-online/youtube-search/blob/master/src/lib/search.ts
     let results;
-  if (html && html.contents && html.contents.sectionListRenderer && html.contents.sectionListRenderer.contents
-    && html.contents.sectionListRenderer.contents.length > 0
-    && html.contents.sectionListRenderer.contents[0].itemSectionRenderer
-    && html.contents.sectionListRenderer.contents[0].itemSectionRenderer.contents.length > 0) {
+    if (html && html.contents && html.contents.sectionListRenderer && html.contents.sectionListRenderer.contents &&
+        html.contents.sectionListRenderer.contents.length > 0 &&
+        html.contents.sectionListRenderer.contents[0].itemSectionRenderer &&
+        html.contents.sectionListRenderer.contents[0].itemSectionRenderer.contents.length > 0) {
         results = html.contents.sectionListRenderer.contents[0].itemSectionRenderer.contents;
         logger("search", results);
         callback(results);
@@ -39,7 +40,7 @@ function youtubeParse(html, callback) {
             results = JSON.parse(html.split('{"itemSectionRenderer":')[html.split('{"itemSectionRenderer":').length - 1].split('},{"continuationItemRenderer":{')[0]).contents;
             logger("search", results);
             callback(results);
-    } catch(e) {}
+        } catch (e) {}
     }
 }
 
@@ -69,7 +70,7 @@ function youtubeSearch(text, callback) {
         });
 }
 
-const module = {
+const searchModule = {
     logs: new Array(),
 
     //---   Get YouTube's Search Auto Complete   ---//
@@ -118,14 +119,26 @@ const module = {
 
     },
 
+    async recommend() {
+        const recommendAPI = new Innertube((message, isError) => {
+            logger("recommendation", message, isError)
+        });
+        return await recommendAPI.getRecommendations();
+    },
+
     getVideo(id) {
         return id;
     }
 
 }
 
+//---   Recommendations   --//
+const recommendationModule = {
+
+}
+
 //---   Start   ---//
 export default ({ app }, inject) => {
-  inject('youtube', module)
+    inject('youtube', searchModule, recommendationModule)
 }
-logger("Initialize","Program Started");
+logger("Initialize", "Program Started");