Merge branch 'main' into main

NUXT/layouts/default.vue

@@ -14,6 +14,7 @@
         class="searchBar"
         color="white"
         v-if="search"
+        v-on:keyup.enter="searchBtn"
       />
 
       <v-spacer />
@@ -178,6 +179,10 @@ export default {
     searchBtn() {
       const query = this.text;
 
+      if(query === "") {
+        return;
+      }
+
       if (this.search === true) {
         this.$router.push(`/search?q=${query}`);
         this.search = false;

NUXT/pages/watch.vue

@@ -1,7 +1,12 @@
 <template>
   <div>
     <video controls autoplay :src="vidSrc" width="100%" height="300vh" />
-    {{ vidSrc }}
+    <v-card class="ml-2 mr-2 flat light">
+      <h2>{{ title }}</h2>
+      <span>{{ views }} views • Published {{uploaded}}</span><br />
+      <span>{{ likes }} Likes / {{ dislikes }} Dislikes</span><br />
+      <p>{{ description }}</p>
+    </v-card>
   </div>
 </template>
 
@@ -9,12 +14,37 @@
 export default {
   data() {
     return {
-      vidSrc: ""
+      likes: this.likes,
+      uploaded: this.uploaded,
+      dislikes: this.dislikes,
+      vidSrc: this.vidSrc,
+      description: this.description,
+      views: this.views
     }
   },
   mounted() {
-    const { v } = this.$route.query
-    console.log(v, this.$youtube.getVid(v))
+      <br />
+    this.$youtube.getVid(this.$route.query.v).then(result => {
+      console.log('Video info data')
+      console.log(result);
+      result = result.data;
+      console.log(result.streamingData.formats)
+      this.vidSrc = result.streamingData.formats[result.streamingData.formats.length-1].url
+      this.title = result.videoDetails.title
+      this.description = result.videoDetails.shortDescription;
+      this.views = result.videoDetails.viewCount;
+    });
+
+    
+    this.$youtube.getRemainingVideoInfo(this.$route.query.v, (data) => {
+      this.likes = data.likes,
+      this.uploaded = data.uploadDate;
+    });
+    
+    this.$youtube.getReturnYoutubeDislike(this.$route.query.v, (data) => {
+      this.dislikes = data.dislikes;
+    });
+
   }
 }
 </script>

NUXT/plugins/youtube.js

@@ -120,8 +120,49 @@ const searchModule = {
 
     },
 
-    getVideo(id) {
-        return id;
+    getRemainingVideoInfo(id, callback) {
+        String.prototype.decodeEscapeSequence = function() {
+            return this.replace(/\\x([0-9A-Fa-f]{2})/g, function() {
+                return String.fromCharCode(parseInt(arguments[1], 16));
+            });
+        };
+        Http.request({
+            method: 'GET', 
+            url: `${constants.URLS.YT_URL}/watch`,
+            params: { v: id }
+        })
+        .then((res) => {
+            let dataUpdated = res.data.decodeEscapeSequence()
+            let likes = dataUpdated.split(`"defaultIcon":{"iconType":"LIKE"},"defaultText":{"runs":[{"text":"`)[1].split(`"}],"accessibility":`)[0]
+            let uploadDate = dataUpdated.split(`"uploadDate":"`)[1].split(`}},"trackingParams":"`)[0].slice(0, -2);
+            let data = {
+                "likes": likes,
+                "uploadDate": uploadDate
+            }
+            logger("vidData", data)
+            callback(data)
+        })
+        .catch((err) => {
+            logger("codeRun", err, true);
+            callback(err);
+        });
+
+    },
+
+    getReturnYoutubeDislike(id, callback) {
+        Http.request({
+            method: 'GET', 
+            url: `https://returnyoutubedislikeapi.com/votes`,
+            params: { videoId: id }
+        })
+        .then((res) => {
+            logger("rydData", res.data)
+            callback(res.data)
+        })
+        .catch((err) => {
+            logger("codeRun", err, true);
+            callback(err);
+        });
     }
 
 }
@@ -207,4 +248,4 @@ export default ({ app }, inject) => {
     inject('youtube', {...searchModule, ...recommendationModule, })
     inject("logger", logger)
 }
-logger(constants.LOGGER_NAMES.init, "Program Started");
+logger(constants.LOGGER_NAMES.init, "Program Started");