From bcd05803e2b77634bf87387d766f1f14e310aab1 Mon Sep 17 00:00:00 2001
From: Vidocq <949867756@qq.com>
Date: Thu, 4 Mar 2021 01:16:15 +0800
Subject: [PATCH] fix output switching outside electron

---
 src/locale/index.js      |  1 +
 src/locale/lang/en.js    |  2 ++
 src/locale/lang/zh-CN.js |  2 ++
 src/views/settings.vue   | 39 +++++++++++++++++++++++++++------------
 4 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/src/locale/index.js b/src/locale/index.js
index 2d41179..6882a6e 100644
--- a/src/locale/index.js
+++ b/src/locale/index.js
@@ -13,6 +13,7 @@ const i18n = new VueI18n({
     en,
     "zh-CN": zhCN,
   },
+  silentTranslationWarn: true,
 });
 
 export default i18n;
diff --git a/src/locale/lang/en.js b/src/locale/lang/en.js
index c2657a2..29983e4 100644
--- a/src/locale/lang/en.js
+++ b/src/locale/lang/en.js
@@ -119,6 +119,8 @@ export default {
       lossless: "Lossless",
     },
     deviceSelector: "Audio Output Device",
+    permissionDenied: "Microphone Permission Denied",
+    permissionRequired: "Microphone Permission Required",
     appearance: {
       text: "Appearance",
       auto: "Auto",
diff --git a/src/locale/lang/zh-CN.js b/src/locale/lang/zh-CN.js
index cb030d7..10c7eec 100644
--- a/src/locale/lang/zh-CN.js
+++ b/src/locale/lang/zh-CN.js
@@ -120,6 +120,8 @@ export default {
       lossless: "无损",
     },
     deviceSelector: "音频输出设备",
+    permissionDenied: "无麦克风权限",
+    permissionRequired: "需要麦克风权限",
     appearance: {
       text: "外观",
       auto: "自动",
diff --git a/src/views/settings.vue b/src/views/settings.vue
index 38f090e..f70a413 100644
--- a/src/views/settings.vue
+++ b/src/views/settings.vue
@@ -79,14 +79,14 @@
           <div class="title"> {{ $t("settings.deviceSelector") }} </div>
         </div>
         <div class="right">
-          <select v-model="outputDevice">
+          <select v-model="outputDevice" :disabled="withoutAudioPriviledge">
             <option
               v-for="device in allOutputDevices"
               :key="device.deviceId"
               :value="device.deviceId"
               :selected="device.deviceId == outputDevice"
             >
-              {{ device.label }}
+              {{ $t(device.label) }}
             </option>
           </select>
         </div>
@@ -244,7 +244,11 @@ export default {
         size: "0KB",
         length: 0,
       },
-      allOutputDevices: [],
+      allOutputDevices: [{
+        deviceId: "default",
+        label: "settings.permissionRequired"
+      }],
+      withoutAudioPriviledge: true,
     };
   },
   computed: {
@@ -290,7 +294,7 @@ export default {
     },
     outputDevice: {
       get() {
-        if (this.allOutputDevices.length == 0) this.getAllOutputDevices(); // Ensure devices loaded before get
+        if (this.withoutAudioPriviledge === true) this.getAllOutputDevices();
         const isValidDevice = this.allOutputDevices.find(
           (device) => device.deviceId === this.settings.outputDevice
         );
@@ -395,14 +399,25 @@ export default {
   },
   methods: {
     getAllOutputDevices() {
-      return navigator.mediaDevices
-        .enumerateDevices()
-        .then(
-          (devices) =>
-            (this.allOutputDevices = devices.filter(
-              (device) => device.kind == "audiooutput"
-            ))
-        );
+      navigator.mediaDevices.
+        getUserMedia({ audio: true })
+          .then(() => {
+            this.withoutAudioPriviledge = false;
+            navigator.mediaDevices
+              .enumerateDevices()
+              .then(
+                (devices) =>
+                  (this.allOutputDevices = devices.filter(
+                    (device) => device.kind == "audiooutput"
+                  ))
+              );
+          })
+          .catch(() => {
+            this.allOutputDevices = [{
+              deviceId: "default",
+              label: "settings.permissionDenied",
+            }];
+          })
     },
     logout() {
       doLogout();