improve timer while recording audio

src/main/frontend/mobile/footer.cljs

@@ -25,7 +25,7 @@
         seconds (mod seconds 60)]
     (util/format "%02d:%02d" minutes seconds)))
 
-(def *record-start (atom -1))
+(def *record-start (atom nil))
 (rum/defcs audio-record-cp < rum/reactive
   {:did-mount (fn [state]
                 (let [comp (:rum/react-component state)
@@ -36,20 +36,16 @@
                  (js/clearInterval (::interval state))
                  (dissoc state ::interval))}
   [state]
-  (when (= (state/sub :editor/record-status) "RECORDING")
-    (swap! *record-start inc))
   (if (= (state/sub :editor/record-status) "NONE")
-    (do
-      (reset! *record-start -1)
-      (mobile-bar-command record/start-recording "microphone"))
+    (mobile-bar-command #(do (record/start-recording)
+                             (reset! *record-start (js/Date.now))) "microphone")
     [:div.flex.flex-row.items-center
-     (mobile-bar-command #(do
-                            (record/stop-recording)
-                            (reset! *record-start -1))
+     (mobile-bar-command #(do (record/stop-recording)
+                            (reset! *record-start nil))
                          "player-stop")
      [:div.timer.pl-2
       {:on-click record/stop-recording}
-      (seconds->minutes:seconds @*record-start)]]))
+      (seconds->minutes:seconds (/ (- (js/Date.now) @*record-start) 1000))]]))
 
 (rum/defc footer < rum/reactive
   []

src/main/frontend/mobile/mobile_bar.cljs

@@ -7,6 +7,7 @@
             [frontend.handler.history :as history]
             [frontend.handler.page :as page-handler]
             [frontend.mobile.camera :as mobile-camera]
+            [frontend.mobile.footer :as footer]
             [frontend.mobile.record :as record]
             [frontend.state :as state]
             [frontend.ui :as ui]
@@ -103,7 +104,9 @@
              (command editor-handler/cycle-priority! "a-b" true)
              (command editor-handler/toggle-list! "list" true)
              (command #(mobile-camera/embed-photo parent-id) "camera" true)
-             (command record/start-recording "microphone" true)
+             (command #(do (record/start-recording)
+                           (reset! footer/*record-start (js/Date.now)))
+                      "microphone" true)
              (command commands/insert-youtube-timestamp "brand-youtube" true)
              (command editor-handler/html-link-format! "link" true)
              (command history/undo! "rotate" true true)