From 64956ea4ec00c2d139c663a8a63d6dd097011d95 Mon Sep 17 00:00:00 2001
From: Ethan <ethan@etekweb.net>
Date: Tue, 22 Mar 2022 00:47:28 -0500
Subject: [PATCH] add video share sheet to watch page

---
 NUXT/pages/watch.vue                          | 31 ++++++++++++++-----
 android/app/capacitor.build.gradle            |  1 +
 .../src/main/assets/capacitor.plugins.json    |  4 +++
 android/capacitor.settings.gradle             |  3 ++
 android/gradlew                               |  0
 ios/App/Podfile                               |  1 +
 package.json                                  |  1 +
 7 files changed, 33 insertions(+), 8 deletions(-)
 mode change 100644 => 100755 android/gradlew

diff --git a/NUXT/pages/watch.vue b/NUXT/pages/watch.vue
index 8fd7eed..2f73fb4 100644
--- a/NUXT/pages/watch.vue
+++ b/NUXT/pages/watch.vue
@@ -22,7 +22,7 @@
               style="padding: 0; margin: 0"
               elevation="0"
               :disabled="item.disabled"
-              @click="item.action"
+              @click="callMethodByName(item.actionName)"
             >
               <v-icon v-text="item.icon" />
               <div class="mt-2" style="font-size: .66rem;" v-text="item.value || item.name" />
@@ -79,6 +79,8 @@
 </style>
 
 <script>
+import { Share } from "@capacitor/share";
+
 export default {
   data() {
     return {
@@ -86,26 +88,28 @@ export default {
         {
           name: "Likes",
           icon: "mdi-thumb-up-outline",
-          action: null,
+          // action: null,
           value: this.likes,
           disabled: true,
         },
         {
           name: "Dislikes",
           icon: "mdi-thumb-down-outline",
-          action: this.dislike(),
+          // action: this.dislike(),
+          actionName: "dislike",
           value: this.dislikes,
           disabled: true,
         },
         {
           name: "Share",
           icon: "mdi-share-outline",
-          action: this.share(),
-          disabled: true,
+          // action: this.share(),
+          actionName: "share",
+          disabled: false,
         },
       ],
       showMore: false,
-      share: false,
+      // share: false,
       title: null,
       uploaded: null,
       vidSrc: null,
@@ -144,9 +148,20 @@ export default {
     });
   },
   methods: {
+    callMethodByName(name) {
+      // Helper function needed because of issues when directly calling method
+      // using item.action in the v-for loop
+      this[name]();
+    },
     dislike() {},
-    share() {
-      this.share = !this.share;
+    async share() {
+      // this.share = !this.share;
+      await Share.share({
+        title: this.title,
+        text: this.title,
+        url: 'https://youtu.be/' + this.$route.query.v,
+        dialogTitle: 'Share video',
+      });
     },
   },
 };
diff --git a/android/app/capacitor.build.gradle b/android/app/capacitor.build.gradle
index e2659d4..e0a3c24 100644
--- a/android/app/capacitor.build.gradle
+++ b/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-share')
     implementation project(':capacitor-splash-screen')
     implementation project(':capacitor-status-bar')
 
diff --git a/android/app/src/main/assets/capacitor.plugins.json b/android/app/src/main/assets/capacitor.plugins.json
index 5621296..74ab1b1 100644
--- a/android/app/src/main/assets/capacitor.plugins.json
+++ b/android/app/src/main/assets/capacitor.plugins.json
@@ -15,6 +15,10 @@
 		"pkg": "@capacitor/device",
 		"classpath": "com.capacitorjs.plugins.device.DevicePlugin"
 	},
+	{
+		"pkg": "@capacitor/share",
+		"classpath": "com.capacitorjs.plugins.share.SharePlugin"
+	},
 	{
 		"pkg": "@capacitor/splash-screen",
 		"classpath": "com.capacitorjs.plugins.splashscreen.SplashScreenPlugin"
diff --git a/android/capacitor.settings.gradle b/android/capacitor.settings.gradle
index 850ecf3..6e813ce 100644
--- a/android/capacitor.settings.gradle
+++ b/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-share'
+project(':capacitor-share').projectDir = new File('../node_modules/@capacitor/share/android')
+
 include ':capacitor-splash-screen'
 project(':capacitor-splash-screen').projectDir = new File('../node_modules/@capacitor/splash-screen/android')
 
diff --git a/android/gradlew b/android/gradlew
old mode 100644
new mode 100755
diff --git a/ios/App/Podfile b/ios/App/Podfile
index f53af6e..a568824 100644
--- a/ios/App/Podfile
+++ b/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 'CapacitorShare', :path => '../../node_modules/@capacitor/share'
   pod 'CapacitorSplashScreen', :path => '../../node_modules/@capacitor/splash-screen'
   pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar'
 end
diff --git a/package.json b/package.json
index 907e23e..754c44a 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "@capacitor/cli": "^3.4.0",
     "@capacitor/core": "^3.4.0",
     "@capacitor/device": "^1.1.2",
+    "@capacitor/share": "^1.1.2",
     "@capacitor/splash-screen": "^1.2.2",
     "@capacitor/status-bar": "^1.0.8"
   }