From 042d56bd2479b86d14afa3aa186ade03e1ddf079 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Arne=20Schl=C3=BCter?= <arne@schlueter.is>
Date: Sun, 3 Jun 2018 15:40:00 +0200
Subject: [PATCH] Simplify album listing view function, add text-overflow to
 thumbs

---
 src/cljs/airsonic_ui/views/album.cljs      |  8 ++++----
 src/cljs/airsonic_ui/views/bottom_bar.cljs |  6 +++---
 src/sass/app.sass                          | 10 ++++++++--
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/cljs/airsonic_ui/views/album.cljs b/src/cljs/airsonic_ui/views/album.cljs
index eca8f73..945db62 100644
--- a/src/cljs/airsonic_ui/views/album.cljs
+++ b/src/cljs/airsonic_ui/views/album.cljs
@@ -17,7 +17,7 @@
 (defn listing [albums]
   ;; always show 5 in a row
   [:div
-   (for [albums (partition-all 6 albums)]
-     [:div.columns
-      (for [[idx album] (map-indexed vector albums)]
-        [:div.column.is-2 {:key idx} [preview album]])])])
+   [:div.columns.is-multiline.is-mobile
+    (for [[idx album] (map-indexed vector albums)]
+      ^{:key idx} [:div.column.is-one-fifth-desktop.is-one-quarter-tablet.is-one-half-mobile
+                   [preview album]])]])
diff --git a/src/cljs/airsonic_ui/views/bottom_bar.cljs b/src/cljs/airsonic_ui/views/bottom_bar.cljs
index 0cb8d32..4cfbbc7 100644
--- a/src/cljs/airsonic_ui/views/bottom_bar.cljs
+++ b/src/cljs/airsonic_ui/views/bottom_bar.cljs
@@ -20,8 +20,9 @@
                   [(if is-playing? :media-pause :media-play) ::events/toggle-play-pause]
                   [:media-step-forward ::events/next-song]]]
      (map (fn [[icon-glyph event]]
-            [:p.control>button.button.is-light {:on-click #(dispatch [event])}
-             [icon icon-glyph]])
+            ^{:key icon-glyph} [:p.control>button.button.is-light
+                                {:on-click #(dispatch [event])}
+                                [icon icon-glyph]])
           buttons))])
 
   (def logo-url "https://airsonic.github.io/airsonic-ui/assets/images/logo/airsonic-light-350x100.png")
@@ -29,7 +30,6 @@
 (defn bottom-bar []
   (let [currently-playing @(subscribe [::subs/currently-playing])
         is-playing? @(subscribe [::subs/is-playing?])]
-    (println "is-playing?" is-playing?)
     [:nav.navbar.is-fixed-bottom.playback-area
      [:div.navbar-brand
       [:div.navbar-item
diff --git a/src/sass/app.sass b/src/sass/app.sass
index 7bc7eca..1056156 100644
--- a/src/sass/app.sass
+++ b/src/sass/app.sass
@@ -49,8 +49,14 @@
   .missing-cover
     display: block
 
-  // make sure the grid doesn't overflow
-  .album-preview &
+.album-preview
+  .title,
+  .subtitle
+    overflow: hidden
+    white-space: nowrap
+    text-overflow: ellipsis
+
+  .image.is-256x256
     width: auto
     height: auto
     max-width: 256px