add logger

NUXT/layouts/default.vue

@@ -88,7 +88,8 @@
       ],
       dropdownMenu: [
         { title: "Settings", link: "/settings" },
-        { title: "About", link: "/about" }
+        { title: "About", link: "/about" },
+        { title: "Logs", link: "/logs" }
       ]
     }),
     mounted() {

NUXT/pages/logs.vue

@@ -0,0 +1,33 @@
+<template>
+  <div>
+
+    <v-list-item v-for="(item, index) in logs" :key="index">
+      <v-card class="card">
+        <v-card-title v-text="`${item.name} - ${new Date(item.time).toLocaleString()}`" />
+        <v-card-text v-text="item.data" />
+      </v-card>
+    </v-list-item>
+
+  </div>
+</template>
+
+<style scoped>
+.card {
+  width: 100%;
+  margin-top: 1em;
+}
+</style>
+
+<script>
+export default {
+  data() {
+    return {
+      logs: new Array()
+    }
+  },
+  mounted() {
+    const logs = this.$youtube.logs
+    this.logs = logs;
+  }
+}
+</script>

NUXT/plugins/youtube.js

@@ -1,18 +1,32 @@
+//---   Modules/Imports   ---//
 import { Http } from '@capacitor-community/http';
 
-const module = {
-  async autoComplete(text, callback) {
+//---   Logger Function   ---//
+function logger(func, data) {
+  module.logs.push({
+    name: func,
+    time: Date.now(),
+    data: data
+  })
+}
 
-    const response = await Http.request({
+const module = {
+  logs: new Array(),
+
+  //---   Get YouTube's Search Auto Complete   ---//
+  async autoComplete(text, callback) {
+    const res = await Http.request({
       method: 'GET',
       url: 'https://suggestqueries-clients6.youtube.com/complete/search',
       params: { client: 'youtube', q: text }
     });
-    callback(response)
-
+    logger("autoComplete", res);
+    callback(res);
   }
 }
 
+//---   Start   ---//
 export default ({ app }, inject) => {
   inject('youtube', module)
 }
+logger("Initialize","Program Started");