Add tab interaction to history sidebar.

This commit is contained in:
Andrey Antukh 2016-02-21 18:14:46 +02:00
parent 85d7adb8c5
commit 15bd7b0939
2 changed files with 84 additions and 65 deletions

View file

@ -81,7 +81,7 @@
i/options] i/options]
[:li.tooltip.tooltip-bottom [:li.tooltip.tooltip-bottom
{:alt "History (Ctrl + Shift + H)" {:alt "History (Ctrl + Shift + H)"
:class (when (contains? flags :document-history)) :class (when (contains? flags :document-history) "selected")
:on-click (partial toggle :document-history)} :on-click (partial toggle :document-history)}
i/undo-history]] i/undo-history]]
[:ul.options-btn [:ul.options-btn

View file

@ -20,9 +20,15 @@
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn document-history-toolbox-render (defn document-history-toolbox-render
[open-toolboxes] [own]
(let [workspace (rum/react wb/workspace-l) (let [workspace (rum/react wb/workspace-l)
close #(rs/emit! (dw/toggle-flag :document-history))] local (:rum/local own)
section (:section @local :main)
close #(rs/emit! (dw/toggle-flag :document-history))
main? (= section :main)
pinned? (= section :pinned)
show-main #(swap! local assoc :section :main)
show-pinned #(swap! local assoc :section :pinned)]
(html (html
[:div.document-history.tool-window [:div.document-history.tool-window
[:div.tool-window-bar [:div.tool-window-bar
@ -31,70 +37,83 @@
[:div.tool-window-close {:on-click close} i/close]] [:div.tool-window-close {:on-click close} i/close]]
[:div.tool-window-content [:div.tool-window-content
[:ul.history-tabs [:ul.history-tabs
[:li.selected "History"] [:li {:on-click show-main
[:li "Pinned"]] :class (when main? "selected")}
[:ul.history-content "History"]
[:li.current [:li {:on-click show-pinned
[:div.pin-icon i/pin] :class (when pinned? "selected")}
[:span "Current version"]] "Pinned"]]
[:li (if (= section :pinned)
[:div.pin-icon i/pin] [:ul.history-content
[:span "Version 02/02/2016 12:33h"]] [:li.current
[:li [:div.pin-icon i/pin]
[:div.pin-icon i/pin] [:span "Current version"]]
[:span "Version 02/02/2016 12:33h"]] [:li
[:li [:div.pin-icon i/pin]
[:div.pin-icon i/pin] [:span "Version 02/02/2016 12:33h"]]])
[:span "Version 02/02/2016 12:33h"]] (if (= section :main)
[:li [:ul.history-content
[:div.pin-icon i/pin] [:li.current
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Current version"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]] [:div.pin-icon i/pin]
[:li [:span "Version 02/02/2016 12:33h"]]
[:div.pin-icon i/pin] [:li
[:span "Version 02/02/2016 12:33h"]]] [:div.pin-icon i/pin]
]]))) [:span "Version 02/02/2016 12:33h"]]
[:li
[:div.pin-icon i/pin]
[:span "Version 02/02/2016 12:33h"]]
[:li
[:div.pin-icon i/pin]
[:span "Version 02/02/2016 12:33h"]]
[:li
[:div.pin-icon i/pin]
[:span "Version 02/02/2016 12:33h"]]
[:li
[:div.pin-icon i/pin]
[:span "Version 02/02/2016 12:33h"]]])]])))
(def ^:static document-history-toolbox (def ^:static document-history-toolbox
(mx/component (mx/component
{:render document-history-toolbox-render {:render document-history-toolbox-render
:name "document-history-toolbox" :name "document-history-toolbox"
:mixins [mx/static rum/reactive]})) :mixins [mx/static rum/reactive (mx/local)]}))