From 3038ceeb8240674b7a4d63ad9a8d5ae2bdbc1da3 Mon Sep 17 00:00:00 2001 From: Brian Sztamfater Date: Thu, 11 May 2023 16:25:57 -0300 Subject: [PATCH] fix: audio issue when sending app to background on Android and other fixes Signed-off-by: Brian Sztamfater --- .../record_audio/record_audio/view.cljs | 9 ++++- src/react_native/audio_toolkit.cljs | 5 +++ .../content/audio/component_spec.cljs | 3 +- .../chat/messages/content/audio/view.cljs | 35 ++++++++++++------- 4 files changed, 38 insertions(+), 14 deletions(-) diff --git a/src/quo2/components/record_audio/record_audio/view.cljs b/src/quo2/components/record_audio/record_audio/view.cljs index 3c0e2e6057..7de10ee550 100644 --- a/src/quo2/components/record_audio/record_audio/view.cljs +++ b/src/quo2/components/record_audio/record_audio/view.cljs @@ -173,6 +173,7 @@ reached-max-duration? (atom false) touch-timestamp (atom nil) disabled? (atom false) + app-state-listener (atom nil) rec-options (merge audio/default-recorder-options @@ -512,7 +513,13 @@ (on-init reset-recorder)) (when audio-file (let [filename (last (string/split audio-file "/"))] - (reload-player filename))))) + (reload-player filename))) + (reset! app-state-listener + (.addEventListener rn/app-state + "change" + #(when (= % "background") + (reset! playing-audio? false)))) + #(.remove @app-state-listener))) [rn/view {:style style/bar-container :pointer-events :box-none} diff --git a/src/react_native/audio_toolkit.cljs b/src/react_native/audio_toolkit.cljs index cc4357d542..068e2a9427 100644 --- a/src/react_native/audio_toolkit.cljs +++ b/src/react_native/audio_toolkit.cljs @@ -130,6 +130,11 @@ (when (and player (.-canPlay ^js player)) (.-currentTime ^js player))) +(defn set-player-wake-lock + [player wake-lock?] + (when player + (set! (.-wakeLock player) wake-lock?))) + (defn toggle-playpause-player [player on-play on-pause on-error] (when (and player (.-canPlay ^js player)) diff --git a/src/status_im2/contexts/chat/messages/content/audio/component_spec.cljs b/src/status_im2/contexts/chat/messages/content/audio/component_spec.cljs index 7822c50ec2..5c74850ca4 100644 --- a/src/status_im2/contexts/chat/messages/content/audio/component_spec.cljs +++ b/src/status_im2/contexts/chat/messages/content/audio/component_spec.cljs @@ -20,7 +20,8 @@ (h/describe "audio message" (h/before-each - #(setup-subs {:mediaserver/port 1000})) + #(setup-subs {:mediaserver/port 1000 + :app-state "active"})) (h/test "renders correctly" (h/render [audio-message/audio-message message context]) diff --git a/src/status_im2/contexts/chat/messages/content/audio/view.cljs b/src/status_im2/contexts/chat/messages/content/audio/view.cljs index 5196400e33..5c9f9c381f 100644 --- a/src/status_im2/contexts/chat/messages/content/audio/view.cljs +++ b/src/status_im2/contexts/chat/messages/content/audio/view.cljs @@ -59,7 +59,7 @@ audio-url (fn [base64-data] (let [player (audio/new-player - (str "data:audio/acc;base64," base64-data) + (str "data:audio/aac;base64," base64-data) {:autoDestroy false :continuesToPlayInBackground false} (fn [] @@ -68,6 +68,7 @@ (when (and @progress-timer (= @current-player-key player-key)) (js/clearInterval @progress-timer) (reset! progress-timer nil))))] + (audio/set-player-wake-lock player true) (swap! active-players assoc player-key player) (audio/prepare-player player @@ -90,7 +91,8 @@ (when-not playing? (reset! current-player-key player-key)) (if (and player - (= (@audio-uris player-key) audio-uri)) + (= (@audio-uris player-key) audio-uri) + (not= (audio/get-state player) audio/IDLE)) (audio/toggle-playpause-player player (fn [] @@ -121,7 +123,7 @@ (reset! seeking-audio? false) (if (> @progress 0) (let [seek-time (* audio-duration-ms @progress) - checked-seek-time (min audio-duration-ms seek-time)] + checked-seek-time (if (<= @progress 1) seek-time @progress)] (seek-player player-key player-state @@ -141,13 +143,20 @@ (if (or @seeking-audio? (#{:playing :seeking} @player-state)) (if (<= @progress 1) (* duration @progress) @progress) duration) - 1000)] + 1000) + paused? (= (audio/get-state player) audio/PAUSED) + app-state (rf/sub [:app-state])] (rn/use-effect (fn [] #(destroy-player player-key))) (rn/use-effect (fn [] - (when (and (some? @current-player-key) - (not= @current-player-key player-key) - (= @player-state :playing)) + (when (or + (and (some? @current-player-key) + (not= @current-player-key player-key) + (= @player-state :playing)) + (and platform/ios? + (= @current-player-key player-key) + (not= app-state "active") + (= @player-state :playing))) (play-pause-player {:player-key player-key :player-state player-state :progress progress @@ -155,7 +164,7 @@ :audio-duration-ms duration :seeking-audio? seeking-audio? :user-interaction? false}))) - [@current-player-key]) + [@current-player-key app-state]) (if (= @player-state :error) [quo/text {:style style/error-label @@ -177,10 +186,12 @@ :user-interaction? true}) :style (style/play-pause-container)} [quo/icon - (case @player-state - :preparing :i/loading - :playing :i/pause-audio - :i/play-audio) + (cond + (= @player-state :preparing) + :i/loading + (and (= @player-state :playing) (not paused?)) + :i/pause-audio + :else :i/play-audio) {:size 20 :color colors/white}]] [:f> quo/soundtrack