From 4d356df02afb1956b30ff226b478d7a7ef8e792d Mon Sep 17 00:00:00 2001
From: Justin Georgi <justin.georgi@gmail.com>
Date: Thu, 7 Mar 2024 14:41:58 -0700
Subject: [PATCH] Add stop camera button

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>
---
 src/pages/detect.vue | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/pages/detect.vue b/src/pages/detect.vue
index 1573741..6fd4bab 100644
--- a/src/pages/detect.vue
+++ b/src/pages/detect.vue
@@ -10,7 +10,7 @@
         <SvgIcon v-if="!imageView && !videoAvailable" :icon="f7route.params.region" fill-color="var(--avn-theme-color)" @click="selectImage" />
         <div class="vid-container" v-if="videoAvailable" style="width: 100%; height: 100%">
           <video id="vid-view" ref="vid_viewer" :srcObject="cameraStream" :autoPlay="true" style="width: 100%; height: 100%"></video>
-          <f7-button @click="captureVidFrame()" style="position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%);" fill>Capture</f7-button>
+          <f7-button @click="captureVidFrame()" style="position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%);" fill large>Capture</f7-button>
         </div>
       </div>
       <div class="chip-results" style="grid-area: result-view; flex: 0 0 auto; align-self: center;">
@@ -41,9 +41,12 @@
         <f7-button popover-open="#region-popover">
           <RegionIcon :region="activeRegion" />
         </f7-button>
-        <f7-button :class="(!modelLoading) ? '' : 'disabled'" popover-open="#capture-popover">
+        <f7-button v-if="!videoAvailable" :class="(!modelLoading) ? '' : 'disabled'" popover-open="#capture-popover">
           <SvgIcon icon="camera_add"/>
         </f7-button>
+        <f7-button v-if="videoAvailable" @click="closeCamera()">
+          <SvgIcon icon="no_photography"/>
+        </f7-button>
         <f7-button @click="() => showDetectSettings = !showDetectSettings" :class="(imageLoaded) ? '' : 'disabled'">
           <SvgIcon icon="visibility"/>
         </f7-button>
@@ -271,12 +274,12 @@
       async selectImage (mode) {
         this.imageLoadMode = mode
         if (this.isCordova && mode == "camera") {
-            navigator.camera.getPicture(this.getImage, this.onFail, { quality: 50, destinationType: Camera.DestinationType.DATA_URL, correctOrientation: true });
-            return
+          navigator.camera.getPicture(this.getImage, this.onFail, { quality: 50, destinationType: Camera.DestinationType.DATA_URL, correctOrientation: true });
+          return
         }
         if (mode == "camera") {
-            this.videoAvailable = await this.openCamera()
-            if (this.videoAvailable) { return }
+          this.videoAvailable = await this.openCamera()
+          if (this.videoAvailable) { return }
         }
         this.$refs.image_chooser.click()
       },