conflicts resolved

NUXT/components/videoPlayer.vue

@@ -0,0 +1,38 @@
+<template>
+  <div>
+
+
+    <video
+        controls
+        autoplay
+        :src="vidSrc"
+        width="100%"
+        @webkitfullscreenchange="handleFullscreenChange"
+        ref="player"
+        style="max-height: 50vh"
+    />
+
+
+  </div>
+</template>
+
+<script>
+  export default {
+    props: [
+        "vidSrc"
+    ],
+
+    methods: {
+      handleFullscreenChange() {
+        if (document.fullscreenElement === this.$refs.player) {
+          this.$vuetube.statusBar.hide();
+          this.$vuetube.navigationBar.hide();
+        } else {
+          this.$vuetube.statusBar.show();
+          this.$vuetube.navigationBar.show();
+        }
+      },
+    }
+  }
+
+</script>

NUXT/layouts/default.vue

@@ -25,7 +25,7 @@
       >
         <!-- element above removes artifacting from things like v-ripple by -->
         <!-- scrollbox below must be a standalone div -->
-        <div class="scroll-y" ref="pgscroll" style="height: 100%">
+        <div ref="pgscroll" class="scroll-y" style="height: 100%">
           <nuxt />
         </div>
       </div>
@@ -165,6 +165,10 @@ export default {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
     Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
 }
+*:focus::before {
+  opacity: 0 !important;
+}
+
 .scroll-y {
   overflow-y: scroll !important; /* has to be scroll, not auto */
   -webkit-overflow-scrolling: touch !important;

NUXT/pages/mods/about.vue

@@ -28,7 +28,7 @@
     <div>OS: {{ deviceInfo.operatingSystem }} ({{ deviceInfo.osVersion }})</div>
     <div>Model: {{ deviceInfo.model }}</div>
     <div>Manufacturer: {{ deviceInfo.manufacturer }}</div>
-    <div>Virtual Device: {{ deviceInfo.isVirtual ? 'yes' : 'no'  }}</div>
+    <div>Virtual Device: {{ deviceInfo.isVirtual ? "yes" : "no" }}</div>
   </center>
 </template>
 

NUXT/pages/search.vue

@@ -34,17 +34,6 @@ export default {
       renderer: [],
     };
   },
-  mounted() {
-    this.getSearch();
-  },
-  methods: {
-    getSearch() {
-      const searchQuestion = this.$route.query.q;
-      this.$youtube.search(searchQuestion).then((response) => {
-        this.renderer = response;
-      });
-    },
-  },
   watch: {
     // Watches for new searches while the current search page is active.
     $route: {
@@ -56,5 +45,16 @@ export default {
       },
     },
   },
+  mounted() {
+    this.getSearch();
+  },
+  methods: {
+    getSearch() {
+      const searchQuestion = this.$route.query.q;
+      this.$youtube.search(searchQuestion).then((response) => {
+        this.renderer = response;
+      });
+    },
+  },
 };
 </script>

NUXT/pages/watch.vue

@@ -1,14 +1,6 @@
 <template>
   <div class="accent">
-    <video
-      controls
-      autoplay
-      :src="vidSrc"
-      width="100%"
-      @webkitfullscreenchange="handleFullscreenChange"
-      ref="player"
-      style="max-height: 30vh; position: sticky; top: 0; z-index: 9999"
-    />
+    <videoPlayer :vid-src="vidSrc" />
     <v-card v-if="loaded" class="ml-2 mr-2 accent" flat>
       <v-card-title
         class="mt-2"
@@ -142,6 +134,21 @@ export default {
       loaded: false,
     };
   },
+  watch: {
+    // Watch for change in the route query string (in this case, ?v=xxxxxxxx to ?v=yyyyyyyy)
+    $route: {
+      deep: true,
+      handler(newRt, oldRt) {
+        if (newRt.query.v != oldRt.query.v) {
+          // Exit fullscreen if currently in fullscreen
+          this.$refs.player.webkitExitFullscreen();
+          // Reset player and run getVideo function again
+          this.vidSrc = "";
+          this.getVideo();
+        }
+      },
+    },
+  },
   mounted() {
     this.getVideo();
   },
@@ -190,30 +197,6 @@ export default {
         dialogTitle: "Share video",
       });
     },
-    handleFullscreenChange() {
-      if (document.fullscreenElement === this.$refs.player) {
-        this.$vuetube.statusBar.hide();
-        this.$vuetube.navigationBar.hide();
-      } else {
-        this.$vuetube.statusBar.show();
-        this.$vuetube.navigationBar.show();
-      }
-    },
-  },
-  watch: {
-    // Watch for change in the route query string (in this case, ?v=xxxxxxxx to ?v=yyyyyyyy)
-    $route: {
-      deep: true,
-      handler(newRt, oldRt) {
-        if (newRt.query.v != oldRt.query.v) {
-          // Exit fullscreen if currently in fullscreen
-          this.$refs.player.webkitExitFullscreen();
-          // Reset player and run getVideo function again
-          this.vidSrc = "";
-          this.getVideo();
-        }
-      },
-    },
   },
 };
 </script>

NUXT/static/icon.svg

@@ -1,7 +1 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
-    <g transform="matrix(1.84351,0,0,1.84351,-236.17,-215.938)">
-        <path d="M318.761,269.869C329.456,263.716 329.456,248.285 318.761,242.132L280.096,219.886L319.969,201.293L336.714,210.927L390.951,242.132C401.646,248.285 401.646,263.716 390.951,269.869L336.732,301.062L336.714,301.073L318.643,311.47L278.77,292.877L318.761,269.869ZM197,294.468L197,312.264C197.005,324.563 210.308,332.258 220.971,326.13L220.979,326.126L240.637,314.816L280.509,333.409L238.932,357.33L238.904,357.346L184.979,388.371C174.312,394.508 161,386.808 161,374.502L161,277.681L197,294.468ZM281.835,179.354L241.962,197.947L220.979,185.874L220.966,185.867C210.302,179.744 197,187.442 197,199.743L197,218.913L161,235.7L161,137.498C161,125.192 174.312,117.492 184.979,123.629L238.925,154.666L238.932,154.67L281.835,179.354Z" style="fill:white;"/>
-    </g>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%" version="1.1" viewBox="0 0 512 512" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"><g><path d="M318.761,269.869C329.456,263.716 329.456,248.285 318.761,242.132L280.096,219.886L319.969,201.293L336.714,210.927L390.951,242.132C401.646,248.285 401.646,263.716 390.951,269.869L336.732,301.062L336.714,301.073L318.643,311.47L278.77,292.877L318.761,269.869ZM197,294.468L197,312.264C197.005,324.563 210.308,332.258 220.971,326.13L220.979,326.126L240.637,314.816L280.509,333.409L238.932,357.33L238.904,357.346L184.979,388.371C174.312,394.508 161,386.808 161,374.502L161,277.681L197,294.468ZM281.835,179.354L241.962,197.947L220.979,185.874L220.966,185.867C210.302,179.744 197,187.442 197,199.743L197,218.913L161,235.7L161,137.498C161,125.192 174.312,117.492 184.979,123.629L238.925,154.666L238.932,154.67L281.835,179.354Z" transform="matrix(1.84351,0,0,1.84351,-236.17,-215.938)" style="fill:#fff"/></g></svg>

android/app/src/main/assets/capacitor.config.json

@@ -2,7 +2,7 @@
 	"appId": "com.Frontesque.vuetube",
 	"appName": "VueTube",
 	"webDir": "dist",
-	"bundledWebRuntime": false,
+	"bundledWebRuntime": true,
 	"server": {
 		"hostname": "youtube.com",
 		"androidScheme": "https"

ios/App/App/capacitor.config.json

@@ -2,7 +2,7 @@
 	"appId": "com.Frontesque.vuetube",
 	"appName": "VueTube",
 	"webDir": "dist",
-	"bundledWebRuntime": false,
+	"bundledWebRuntime": true,
 	"server": {
 		"hostname": "youtube.com",
 		"androidScheme": "https"