Merge branch 'main' of https://github.com/Frontesque/VueTube

.github/workflows/ci.yml

@@ -50,10 +50,10 @@ jobs:
           node-version: ${{ env.NODE_VERSION }}
       - name: Install dependencies
         run: npm i
-      - name: Set up JDK 1.8
+      - name: Set up JDK 11
         uses: actions/setup-java@v1
         with:
-          java-version: 1.8
+          java-version: 11
       - name: Copy web assets to native platform
         run: npx cap copy android
       - name: Update native platform

NUXT/components/topNavigation.vue

@@ -39,16 +39,18 @@
       class="ml-3 mr-1 my-auto fill-height"
       style="border-radius: 0.25rem !important"
       @click="refreshRecommendations"
-      ><v-icon>mdi-refresh</v-icon></v-btn
     >
+      <v-icon>mdi-refresh</v-icon>
+    </v-btn>
     <v-btn
       icon
       tile
       class="ml-3 my-auto fill-height"
       style="border-radius: 0.25rem !important"
       @click="$emit('search-btn', text)"
-      ><v-icon>mdi-magnify</v-icon></v-btn
     >
+      <v-icon>mdi-magnify</v-icon>
+    </v-btn>
     <v-btn
       v-show="!search"
       icon
@@ -56,8 +58,9 @@
       class="ml-4 mr-2 my-auto fill-height"
       style="border-radius: 0.25rem !important"
       to="/settings"
-      ><v-icon>mdi-cog-outline</v-icon></v-btn
     >
+      <v-icon>mdi-cog-outline</v-icon>
+    </v-btn>
   </v-card>
 </template>
 
@@ -80,6 +83,7 @@ export default {
   methods: {
     refreshRecommendations() {
       this.$emit("scroll-to-top");
+
       const continuations =
         this.$store.state.recommendedVideos[
           this.$store.state.recommendedVideos.length - 1
@@ -108,6 +112,7 @@ export default {
   position: fixed;
   width: 100%;
 }
+
 .topNavSearch {
   margin-bottom: -10em;
   margin-left: 2em;

NUXT/layouts/default.vue

@@ -42,7 +42,7 @@
                 @click="youtubeSearch(item)"
               >
                 <v-icon class="mr-5">mdi-magnify</v-icon>
-                {{ item[0] }}
+                {{ item[0] || item.text }}
               </v-btn>
             </v-list-item>
           </div>
@@ -59,7 +59,9 @@
 <script>
 import { App as CapacitorApp } from "@capacitor/app";
 import { mapState } from "vuex";
-import constants from "../plugins/constants";
+import constants from "~/plugins/constants";
+import { linkParser } from "~/plugins/utils"
+
 export default {
   data: () => ({
     search: false,
@@ -123,6 +125,19 @@ export default {
   methods: {
     textChanged(text) {
       if (text.length <= 0) this.response = []; // No text found, no point in calling API
+
+      //---   User Pastes Link, Direct Them To Video   ---//
+      const isLink = linkParser(text);
+      if (isLink) {
+        this.response = [{
+          text: `Watch video from ID: ${isLink}`,
+          id: isLink
+        }];
+        return;
+      }
+      //---   End User Pastes Link, Direct Them To Video   ---//
+
+      //---   Auto Suggest   ---//
       this.$youtube.autoComplete(text, (res) => {
         const data = res.replace(/^.*?\(/, "").replace(/\)$/, ""); //Format Response
         this.response = JSON.parse(data)[1];
@@ -130,7 +145,10 @@ export default {
     },
 
     youtubeSearch(item) {
-      this.$router.push(`/search?q=${item[0]}`);
+      const link = item.id
+        ? `/watch?v=${item.id}`
+        : `/search?q=${item[0]}`
+      this.$router.push(link);
       this.search = false;
     },
 

NUXT/nuxt.config.js

@@ -16,6 +16,7 @@ export default {
     { src: "~/plugins/youtube", mode: "client" },
     { src: "~/plugins/vuetube", mode: "client" },
     { src: "~/plugins/ryd", mode: "client" },
+    { src: "~/plugins/thirdPartyPluginLoader", mode: "client" },
   ],
   generate: {
     dir: "../dist",

NUXT/pages/mods/updates.vue

@@ -19,12 +19,7 @@
             v-if="index == 0"
             class="tags"
             color="orange"
-            style="
-              border-radius: 0.5rem;
-              border: 2px var(--v-oragnge-base);
-              margin-top: -1.5rem;
-              margin-right: -0.5rem;
-            "
+            style="border-radius: 0.5rem; border: 2px var(--v-orange-base)"
           >
             Latest
           </v-chip>
@@ -32,15 +27,10 @@
             v-if="item.sha == installedVersion"
             class="tags"
             color="green"
-            style="
-              border-radius: 0.5rem;
-              border: 2px var(--v-green-base);
-              margin-top: -1.5rem;
-              margin-right: -0.5rem;
-            "
-          >
-            >Installed</v-chip
+            style="border-radius: 0.5rem; border: 2px var(--v-green-base)"
           >
+            Installed
+          </v-chip>
         </v-card-title>
 
         <div style="margin-left: 1em">
@@ -70,17 +60,21 @@
 .card {
   width: 100%;
 }
+
 .subtitle {
   margin: 0.4em;
   font-size: 0.75em;
   transform: translateY(5%);
 }
+
 .date {
   transform: translateY(-40%);
 }
+
 .btn-icon {
   margin-right: 0.25em;
 }
+
 .tags {
   margin-left: 0.5em;
 }
@@ -95,18 +89,33 @@ export default {
       return this.$store.state.tweaks.roundTweak;
     },
   },
-
   data() {
     return {
       commits: new Array(),
       installedVersion: process.env.appVersion,
     };
   },
+  async mounted() {
+    const commits = await this.$vuetube.commits;
+    if (commits[0].sha) {
+      //If Commit Valid
+      this.commits = commits;
+    } else {
+      console.log(commits);
+    }
+  },
+  methods: {
+    async openExternal(item) {
+      await Browser.open({
+        url: item.html_url,
+      });
+    },
 
-  install(item) {
-    this.$vuetube.getRuns(item, (data) => {
-      console.log(data);
-    });
+    install(item) {
+      this.$vuetube.getRuns(item, (data) => {
+        console.log(data);
+      });
+    },
   },
 };
 </script>

NUXT/pages/settings.vue

@@ -50,6 +50,7 @@ export default {
           to: "/mods/tweaks",
         },
         { name: "Startup Options", icon: "mdi-restart", to: "/mods/startup" },
+<<<<<<< HEAD
         {
           name: "Plugins",
           icon: "mdi-puzzle",
@@ -57,6 +58,9 @@ export default {
           to: "/mods/plugins",
           disabled: true,
         },
+=======
+        { name: "Plugins", icon: "mdi-puzzle", to: "", to: "/mods/plugins" },
+>>>>>>> 94e0108 (Merge branch 'main' of https://github.com/Frontesque/VueTube)
         {
           name: "Updates",
           icon: "mdi-cloud-download-outline",

NUXT/plugins/tempPlugins/demoPlugin.js

@@ -0,0 +1,30 @@
+module.exports = {
+  manifest: {
+    name: "Test plugin", // Required
+    vuetube: "*",
+    version: "1.0", // Required
+    author: "Frontesque", // Required
+    description: "A plugin to test how vuetube handles plugins // Add 'Hello, World!' to the home page.", // Required
+    homepage: "https://github.com/Frontesque/VueTube-Example-Plugin",
+    license: "GPL-3.0" // Required
+  },
+
+  /************************* 
+   * Execute code on ALL VueTube pages
+   ************************/
+  global: function() {
+
+  },
+
+  /************************* 
+   * Execute code on SPECIFIC VueTube pages
+   * 
+   * You can view what page you intend to inject code into by looking at `~/NUXT/pages/` in the main VueTube repo
+   ************************/
+  pages: {
+    home: function() { // Execute code on JUST the home page
+
+    }
+  }
+
+}

NUXT/plugins/thirdPartyPluginLoader.js

@@ -14,14 +14,16 @@ const ensureStructure = new Promise(async (resolve, reject) => {
 
   //---   Ensure Plugins Folder   ---//
   try {
-    await Filesystem.mkdir({ directory: APP_DIRECTORY, recursive: true,
+    await Filesystem.mkdir({
+      directory: APP_DIRECTORY, recursive: true,
       path: fs.plugins,
     });
   } catch (e) { /* Exists */ }
 
   //---   Ensure Temp Folder   ---//
   try {
-    await Filesystem.mkdir({ directory: APP_DIRECTORY, recursive: true,
+    await Filesystem.mkdir({
+      directory: APP_DIRECTORY, recursive: true,
       path: fs.temp,
     });
   } catch (e) { /* Exists */ }

NUXT/plugins/utils.js

@@ -17,10 +17,10 @@ function hexToRgb(hex) {
   var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
   return result
     ? {
-        r: parseInt(result[1], 16),
-        g: parseInt(result[2], 16),
-        b: parseInt(result[3], 16),
-      }
+      r: parseInt(result[1], 16),
+      g: parseInt(result[2], 16),
+      b: parseInt(result[3], 16),
+    }
     : null;
 }
 
@@ -41,6 +41,12 @@ function getMutationByKey(key, mutations) {
   if (!key || !mutations) return undefined;
   return mutations.find((mutation) => mutation.entityKey === key).payload;
 }
+function linkParser(url) {
+
+  var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#&?]*).*/;
+  var match = url.match(regExp);
+  return (match && match[7].length == 11) ? match[7] : false;
+}
 
 function linkParser(url) {
   var regExp =

android/app/capacitor.build.gradle

@@ -13,6 +13,7 @@ dependencies {
     implementation project(':capacitor-app')
     implementation project(':capacitor-browser')
     implementation project(':capacitor-device')
+    implementation project(':capacitor-filesystem')
     implementation project(':capacitor-haptics')
     implementation project(':capacitor-share')
     implementation project(':capacitor-splash-screen')

android/app/release/output-metadata.json

@@ -1,5 +1,5 @@
 {
-  "version": 2,
+  "version": 3,
   "artifactType": {
     "type": "APK",
     "kind": "Directory"
@@ -10,9 +10,11 @@
     {
       "type": "SINGLE",
       "filters": [],
+      "attributes": [],
       "versionCode": 1,
       "versionName": "1.0",
       "outputFile": "app-release.apk"
     }
-  ]
+  ],
+  "elementType": "File"
 }

android/app/src/main/AndroidManifest.xml

@@ -53,6 +53,8 @@
     </application>
 
     <!-- Permissions -->
-
     <uses-permission android:name="android.permission.INTERNET" />
+    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
+    
 </manifest>

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

@@ -15,6 +15,10 @@
 		"pkg": "@capacitor/device",
 		"classpath": "com.capacitorjs.plugins.device.DevicePlugin"
 	},
+	{
+		"pkg": "@capacitor/filesystem",
+		"classpath": "com.capacitorjs.plugins.filesystem.FilesystemPlugin"
+	},
 	{
 		"pkg": "@capacitor/haptics",
 		"classpath": "com.capacitorjs.plugins.haptics.HapticsPlugin"

android/build.gradle

@@ -7,8 +7,8 @@ buildscript {
         jcenter()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:4.2.1'
-        classpath 'com.google.gms:google-services:4.3.5'
+        classpath 'com.android.tools.build:gradle:7.1.2'
+        classpath 'com.google.gms:google-services:4.3.10'
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

android/capacitor.settings.gradle

@@ -14,6 +14,9 @@ project(':capacitor-browser').projectDir = new File('../node_modules/@capacitor/
 include ':capacitor-device'
 project(':capacitor-device').projectDir = new File('../node_modules/@capacitor/device/android')
 
+include ':capacitor-filesystem'
+project(':capacitor-filesystem').projectDir = new File('../node_modules/@capacitor/filesystem/android')
+
 include ':capacitor-haptics'
 project(':capacitor-haptics').projectDir = new File('../node_modules/@capacitor/haptics/android')
 

android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,5 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.0-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.2-all.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

ios/App/Podfile

@@ -13,6 +13,7 @@ def capacitor_pods
   pod 'CapacitorApp', :path => '..\..\node_modules\@capacitor\app'
   pod 'CapacitorBrowser', :path => '..\..\node_modules\@capacitor\browser'
   pod 'CapacitorDevice', :path => '..\..\node_modules\@capacitor\device'
+  pod 'CapacitorFilesystem', :path => '..\..\node_modules\@capacitor\filesystem'
   pod 'CapacitorHaptics', :path => '..\..\node_modules\@capacitor\haptics'
   pod 'CapacitorShare', :path => '..\..\node_modules\@capacitor\share'
   pod 'CapacitorSplashScreen', :path => '..\..\node_modules\@capacitor\splash-screen'

package.json

@@ -7,6 +7,7 @@
     "@capacitor/cli": "^3.4.0",
     "@capacitor/core": "^3.4.0",
     "@capacitor/device": "^1.1.2",
+    "@capacitor/filesystem": "^1.1.0",
     "@capacitor/haptics": "^1.1.4",
     "@capacitor/share": "^1.1.2",
     "@capacitor/splash-screen": "^1.2.2",