near/airsonic-ui
1
0
Fork 0
mirror of https://github.com/heyarne/airsonic-ui.git synced 2026-05-07 02:33:39 +02:00
Code Issues Projects Releases Wiki Activity

Add burger menu

Browse source
This commit is contained in:
Arne Schlüter 2018-08-29 17:28:26 +02:00
commit 3b58648b82
1 changed files with 36 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/cljs/airsonic_ui/views.cljs
View file

@ -2,6 +2,7 @@
"This module contains the outmost layer of our app views. It makes sure that
the proper subscriptions are run and arranges the complete layout."
(:require [re-frame.core :refer [dispatch subscribe]]
[reagent.core :as r]
[airsonic-ui.routes :as routes :refer [url-for]]
[airsonic-ui.events :as events]
[airsonic-ui.subs :as subs]
@ -20,32 +21,41 @@
(defn navbar-top
"Contains search, some navigational links and the logo"
[{:keys [user]}]
[_]
(let [active? (r/atom false)
toggle-active #(swap! active? not)
navbar-item (fn navbar-item [{:keys [href]} label]
[:a.navbar-item {:href href :on-click toggle-active} label])]
(fn [{:keys [user]}]
[:nav.navbar.is-fixed-top.is-dark {:role "navigation", :aria-label "search and navigation"}
;; user is `nil` when we're not logged in, we can hide the extended navigation
[:div.navbar-brand
[:div.navbar-item>img {:src logo-url}]]
;; user is `nil` when we're not logged in, we can hide the extended navbar
[:div.navbar-item>img {:src logo-url}]
[:div.navbar-burger.burger {:on-click toggle-active} (repeat 3 [:span])]]
(when user
[:div.navbar-menu
[(if @active? :div.navbar-menu.is-active :div.navbar-menu)
[:div.navbar-start
[:div.navbar-item [search/form]]]
[:div.navbar-end
[:div.navbar-item.has-dropdown.is-hoverable
[:div.navbar-link "Library"]
[:div.navbar-dropdown
[:a.navbar-item {:href (url-for ::routes/library {:criteria "recent"})} "Recently played"]
[:a.navbar-item {:href (url-for ::routes/library {:criteria "newest"})} "Newest additions"]
[:a.navbar-item {:href (url-for ::routes/library {:criteria "starred"})} "Starred"]]]
[:a.navbar-item {} "Podcasts"]
[:a.navbar-item {} "Playlists"]
[:a.navbar-item {} "Shares"]
[navbar-item {:href (url-for ::routes/library {:criteria "recent"})} "Recently played"]
[navbar-item {:href (url-for ::routes/library {:criteria "newest"})} "Newest additions"]
[navbar-item {:href (url-for ::routes/library {:criteria "starred"})} "Starred"]]]
[navbar-item {} "Podcasts"]
[navbar-item {} "Playlists"]
[navbar-item {} "Shares"]
[:div.navbar-item.has-dropdown.is-hoverable
[:div.navbar-link "More"]
[:div.navbar-dropdown.is-right
[:a.navbar-item {:disabled true} "Settings"]
[navbar-item "Settings"]
[:a.navbar-item
{:on-click #(dispatch [::events/logout]) :href "#"}
(str "Logout (" (:name user) ")")]]]]])])
{:on-click (fn [_]
(toggle-active)
(dispatch [::events/logout]))
:href "#"}
(str "Logout (" (:name user) ")")]]]]])])))
(defn media-content
"Provides the complete UI to browse the media library, interact with search