Implement artist view

shadow-cljs.edn

@@ -11,7 +11,7 @@
   [day8.re-frame/re-frame-10x "0.3.2-react16"]
   [day8.re-frame/tracing "0.5.1"]
   ;; for CIDER
-  [cider/cider-nrepl "0.16.0"]
+  [cider/cider-nrepl "0.16.0-snapshot"]
   [refactor-nrepl "2.3.1"]]
 
  :builds

src/airsonic_ui/routes.cljs

@@ -7,15 +7,15 @@
 (def router
   (r/router [["/" ::login]
              ["/hello" ::main]
-             ["/album/:id" ::album-view]
+             ["/artist/:id" ::artist-view]
-             ["/artist/:id" ::artist-view]]))
+             ["/album/:id" ::album-view]]))
 
 ; use this in views to construct a url
 (defn url-for [k params]
   (str "#" (r/resolve router k params)))
 
 ; which routes need valid login credentials?
-(def protected-routes #{::main ::album-view})
+(def protected-routes #{::main ::artist-view ::album-view})
 
 ; which data should be requested for which route? can either be a vector or a function returning a vector
 
@@ -29,9 +29,13 @@
   [route-id params query]
   [:api-request "getAlbumList2" :albumList2 {:type "recent"}])
 
+(defmethod route-data ::artist-view
+  [route-id params query]
+  [:api-request "getArtist" :artist (select-keys params [:id])])
+
 (defmethod route-data ::album-view
   [route-id params query]
-  [:api-request "getAlbum" :album {:id (:id params)}])
+  [:api-request "getAlbum" :album (select-keys params [:id])])
 
 ;; shouldn't need to change anything below
 

src/airsonic_ui/views.cljs

@@ -38,7 +38,29 @@
        [:div
         [:button {:on-click #(dispatch [::events/authenticate @user @pass @server])} "Submit"]]])))
 
-;; album list (start page)
+;; single album
+
+(defn song-item [songs song]
+  (let [artist-id (:artistId song)]
+    [:div
+     [:a
+      (when artist-id {:href (routes/url-for ::routes/artist-view {:id artist-id})})
+      (:artist song)]
+     " - "
+     [:a
+      {:href "#" :on-click (fn [e]
+                             (.preventDefault e)
+                             (dispatch [::events/play-songs songs song]))}
+      (:title song)]]))
+
+(defn album-detail [content]
+  [:div
+   [:h2 (str (:artist content) " - " (:name content))]
+   (let [songs (:song content)]
+     [:ul (for [[idx song] (map-indexed vector songs)]
+            [:li {:key idx} [song-item songs song]])])])
+
+;; single artist
 
 (defn album-item [album]
   (let [{:keys [artist artistId name coverArt year id]} album]
@@ -49,29 +71,20 @@
      ;; link to album
      [:a {:href (routes/url-for ::routes/album-view {:id id})} name] (when year (str " (" year ")"))]))
 
-;; TODO: album-list shouldn't know about the structure of content and should just get a list
+(defn artist-detail [content]
-(defn album-list [content]
   [:div
-   [:h2 (str "Recently played")]
+   [:h2 (:name content)]
+   [:p (:albumCount content) " items"]
    [:ul (for [[idx album] (map-indexed vector (:album content))]
           [:li {:key idx} [album-item album]])]])
 
-;; single album
+;; TODO: album-list shouldn't know about the structure of content and should just get a list
 
-(defn song-item [songs song]
+(defn most-recent [content]
-  [:div (str (:artist song) " - ")
-   [:a
-    {:on-click #(dispatch [::events/play-songs songs song])}
-    (:title song)]])
-
-(defn song-list [songs]
-  [:ul (for [[idx song] (map-indexed vector songs)]
-         [:li {:key idx} [song-item songs song]])])
-
-(defn album-detail [content]
   [:div
-   [:h2 (str (:artist content) " - " (:name content))]
+   [:h2 "Recently played"]
-   [song-list (:song content)]])
+   [:ul (for [[idx album] (map-indexed vector (:album content))]
+          [:li {:key idx} [album-item album]])]])
 
 ;; currently playing / coming next / audio controls...
 
@@ -104,7 +117,8 @@
     [:div
      [:span (str "Currently logged in as " (:u login))]
      (case route
-       ::routes/main [album-list content]
+       ::routes/main [most-recent content]
+       ::routes/artist-view [artist-detail content]
        ::routes/album-view [album-detail content])
      [:a {:on-click #(dispatch [::events/initialize-db]) :href "#"} "Logout"]
      [bottom-bar]]))