Pause current track when starting next, implement play / pause

src/airsonic_ui/audio.cljs

@@ -20,16 +20,19 @@
   (doseq [event ["loadstart" "progress" "play" "timeupdate" "pause"]]
     (.addEventListener el event #(re-frame/dispatch [:audio-update (->status el)]))))
 
-
 (re-frame/reg-fx
  :play-song
  (fn [song-url]
+   (some-> @current-audio .pause)
    (let [audio (js/Audio. song-url)]
      (reset! current-audio audio)
      (attach-listeners! audio)
      (.play audio))))
 
 (re-frame/reg-fx
- :pause-song
+ :toggle-play-pause
  (fn [_]
-   (some-> @current-audio .pause)))
+   (when-let [a @current-audio]
+     (if (.-paused a)
+       (.play a)
+       (.pause a)))))

src/airsonic_ui/events.cljs

@@ -73,10 +73,10 @@
       :db (assoc-in db [:currently-playing :item] song)})))
 
 (re-frame/reg-event-fx
- ::pause-song
+ ::toggle-play-pause
  (fn [_ _]
    ; pauses the current song
-   {:pause-song nil}))
+   {:toggle-play-pause nil}))
 
 (re-frame/reg-event-db
  :audio-update
@@ -91,7 +91,6 @@
  (fn [{:keys [db]} [_ route params query]]
    ;; all the naviagation logic is in routes.cljs; all we need to do here
    ;; is say what actually happens once we've navigated succesfully
-   (println "routes/route-data" (routes/route-data route params query))
    {:db (assoc db :current-route [route params query])
     :dispatch (routes/route-data route params query)}))
 

src/airsonic_ui/views.cljs

@@ -69,7 +69,7 @@
 (defn playback-controls []
   [:div
    [:button "previous"]
-   [:button "play / pause"]
+   [:button {:on-click #(re-frame/dispatch [::events/toggle-play-pause])} "play / pause"]
    [:button "next"]
    [:label [:input {:type "checkbox"}] "shuffle"]
    [:label [:input {:type "checkbox"}] "repeat"]])