Handle events via UI instead of just the REPL

src/airsonic_ui/events.cljs

@@ -18,27 +18,40 @@
                    (string/join "&"))]
     (str config/server "/rest/" endpoint "?" query)))
 
+(defn api-error?
+  "We need to look at the message body because the subsonic api always responds
+  with status 200"
+  [response]
+  (= "failed" (-> response :subsonic-response :status)))
+
+(defn error-message
+  [response]
+  (let [{:keys [code message]} (-> response :subsonic-response :error)]
+    (str "Code " code ": " message)))
+
 (re-frame/reg-event-fx
  ::authenticate
- (fn [{:keys [db]} [_ {:keys [user pass]}]]
+ (fn [{:keys [db]} [_ user pass]]
    {:db (update db :active-requests inc)
     :http-xhrio {:method :get
                  :uri (api-url "ping" {:u user :p pass})
-                 :response-format (ajax/text-response-format)
+                 :response-format (ajax/json-response-format {:keywords? true})
                  :on-success [::auth-successful user pass]
-                 :on-failure [::auth-gone-bad]}}))
+                 :on-failure [::api-failure]}}))
 
 (re-frame/reg-event-db
  ::auth-successful
- (fn [db [_ user pass]]
+ (fn [db [_ user pass response]]
+   ;; TODO: Handle failures differently
    (-> (update db :active-requests dec)
        (assoc :login {:u user
                       :p pass}))))
 
 (re-frame/reg-event-db
- ::auth-gone-bad
+ ::api-failure
  (fn [db event]
-   (println "auth gone bad" event)))
+   (println "api call gone bad; CORS headers missing? check for :status 0" event)
+   db))
 
 (re-frame/reg-event-db
  ::initialize-db

src/airsonic_ui/views.cljs

@@ -1,24 +1,29 @@
 (ns airsonic-ui.views
   (:require [re-frame.core :as re-frame]
-            [airsonic-ui.config :as config]
+            [reagent.core :as r]
+            [airsonic-ui.events :as events]
             [airsonic-ui.subs :as subs]))
 
 (defn login-form []
-  [:form {:method "get"
+  (let [user (r/atom "")
-          :action config/server
+        pass (r/atom "")]
-          :on-click #(js/alert "bang bang! TODO: implement login via form")}
+    (fn []
+      [:div
        [:div
         [:span "User"]
-    [:input {:type "text" :name "user"}]]
+        [:input {:type "text"
+                 :name "user"
+                 :on-change #(reset! user (-> % .-target .-value))}]]
        [:div
         [:span "Password"]
-    [:input {:type "password" :name "pass"}]]
+        [:input {:type "password" :name "pass" :on-change #(reset! pass (-> % .-target .-value))}]]
        [:div
-    [:input {:type "submit" :value "submit"}]]])
+        [:button {:on-click #(re-frame/dispatch [::events/authenticate @user @pass])} "Submit"]]])))
 
 (defn app [user]
   [:div
-   [:h2 (str "Currently logged in as " user)]])
+   [:h2 (str "Currently logged in as " user)]
+   [:a {:on-click #(re-frame/dispatch [::events/initialize-db]) :href "#"} "Logout"]])
 
 (defn main-panel []
   [:div