|
@@ -0,0 +1,81 @@
|
|
|
+(ns lineup.views
|
|
|
+ (:require
|
|
|
+ [lineup.events :as events]
|
|
|
+ [lineup.subs :as subs]
|
|
|
+ [re-com.core :as re-com]
|
|
|
+ [re-frame.core :as re-frame]))
|
|
|
+
|
|
|
+(defn- top-bar [mode]
|
|
|
+ [re-com/h-box
|
|
|
+ :style {:padding-right "10px"}
|
|
|
+ :justify :between
|
|
|
+ :align :center
|
|
|
+ :children
|
|
|
+ [[re-com/title
|
|
|
+ :label "Schedule"
|
|
|
+ :level :level2]
|
|
|
+ [re-com/hyperlink
|
|
|
+ :label (if (= mode :edit) "done" "edit")
|
|
|
+ :on-click #(re-frame/dispatch [::events/toggle-mode (if (= mode :edit) :normal :edit)])]]])
|
|
|
+
|
|
|
+(defn- slot [index task]
|
|
|
+ [re-com/box
|
|
|
+ :width "300px"
|
|
|
+ :height "300px"
|
|
|
+ :style {:padding "10px"
|
|
|
+ :border "3px solid black"
|
|
|
+ :border-radius "10px"
|
|
|
+ :background-color "white"}
|
|
|
+ :child
|
|
|
+ [:div
|
|
|
+ {:style {:width "100%"
|
|
|
+ :height "100%"
|
|
|
+ :cursor "pointer"}
|
|
|
+ :on-click #(re-frame/dispatch [::events/toggle-task-complete index])}
|
|
|
+ "BOX"
|
|
|
+ (when (:complete? task)
|
|
|
+ "COMPLETE!")]])
|
|
|
+
|
|
|
+(defn- schedule []
|
|
|
+ (let [task-list (re-frame/subscribe [::subs/schedule])
|
|
|
+ list-complete? (re-frame/subscribe [::subs/complete])]
|
|
|
+ [re-com/scroller
|
|
|
+ :v-scroll :off
|
|
|
+ :h-scroll :auto
|
|
|
+ :style {:padding "20px 10px"}
|
|
|
+ :width "100%"
|
|
|
+ :child
|
|
|
+ [re-com/h-box
|
|
|
+ :gap "10px"
|
|
|
+ :align :center
|
|
|
+ :children
|
|
|
+ (concat
|
|
|
+ [[re-com/box
|
|
|
+ :height "150px"
|
|
|
+ :width "150px"
|
|
|
+ :child
|
|
|
+ [:img
|
|
|
+ {:src "go.png"}]]]
|
|
|
+ (map-indexed
|
|
|
+ (fn [index task]
|
|
|
+ ^{:key (str "slot-" index)}
|
|
|
+ [slot index task])
|
|
|
+ @task-list)
|
|
|
+ [[re-com/box
|
|
|
+ :height "150px"
|
|
|
+ :width "150px"
|
|
|
+ :child
|
|
|
+ [:img
|
|
|
+ {:src (if @list-complete? "clapping.gif" "clapping.png")}]]])]]))
|
|
|
+
|
|
|
+(defn main-panel []
|
|
|
+ (let [mode (re-frame/subscribe [::subs/mode])]
|
|
|
+ [re-com/v-box
|
|
|
+ :gap "10px"
|
|
|
+ :height "100%"
|
|
|
+ :children
|
|
|
+ [[top-bar @mode]
|
|
|
+ (if (= @mode :edit)
|
|
|
+ [:div "EDITING!"]
|
|
|
+ [schedule])]]))
|
|
|
+
|