From bcf1dc9b526b1d88e84b482574aae01564383b03 Mon Sep 17 00:00:00 2001
From: wryk <wryk@wryk.moe>
Date: Fri, 15 Mar 2019 20:43:34 +0100
Subject: [PATCH] fix(capture): enable/disable capture button

---
 src/store.js                  | 2 ++
 src/views/screens/capture.vue | 9 +++++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/store.js b/src/store.js
index ef97b1b..4282fce 100644
--- a/src/store.js
+++ b/src/store.js
@@ -40,6 +40,8 @@ export default new Vuex.Store({
       if (state.mediaStream) {
         state.mediaStream.getTracks().forEach(track => track.stop())
       }
+
+      state.mediaStream = null
     },
     inverseFacingMode (store) {
       store.capturing.shouldFaceUser = !store.capturing.shouldFaceUser
diff --git a/src/views/screens/capture.vue b/src/views/screens/capture.vue
index b4dd008..4ac70b8 100644
--- a/src/views/screens/capture.vue
+++ b/src/views/screens/capture.vue
@@ -6,10 +6,10 @@
     <capture-options v-else></capture-options>
 
     <div class="preview">
-      <video ref="preview" class="preview-visual" preload="yes" :srcObject.prop="mediaStream" autoplay muted playsinline webkit-playsinline></video>
+      <video ref="preview" class="preview-visual" preload="yes" autoplay muted playsinline webkit-playsinline></video>
     </div>
 
-    <button class="capture-btn" :class="{ 'capture-btn--capturing': capturing.status }" @click.prevent="startCapture">Capture</button>
+    <button class="capture-btn" :class="{ 'capture-btn--capturing': capturing.status }" @click.prevent="startCapture" :disabled="!mediaStream">Capture</button>
 
     <encoding-overlay v-if="encoding.status"></encoding-overlay>
   </div>
@@ -44,6 +44,11 @@ export default {
       this.$store.dispatch('capture')
     }
   },
+  watch: {
+    mediaStream: function (mediaStream) {
+      this.$refs.preview.srcObject = mediaStream
+    }
+  },
   mounted: function () {
     window.objectFitPolyfill(this.$refs.preview)
     document.body.classList.add('capture-body')