♻️ Move sidebar logic to data functions

This commit is contained in:
Andrés Moya 2020-06-22 14:58:30 +02:00 committed by Andrey Antukh
parent 8330a001ae
commit 06c301c7d6
9 changed files with 56 additions and 42 deletions

View file

@ -83,7 +83,9 @@
:drawing-tool nil
:tooltip nil
:options-mode :design
:draw-interaction-to nil})
:draw-interaction-to nil
:left-sidebar? true
:right-sidebar? true})
(def initialize-layout
(ptk/reify ::initialize-layout
@ -328,19 +330,34 @@
;; --- Toggle layout flag
(defn toggle-layout-flag
(defn- toggle-layout-flag
[state flag]
(update state :workspace-layout
(fn [flags]
(if (contains? flags flag)
(disj flags flag)
(conj flags flag)))))
(defn- check-sidebars
[state]
(let [layout (:workspace-layout state)
left-sidebar? (not (empty? (keep layout [:layers
:sitemap
:document-history
:libraries])))
right-sidebar? (not (empty? (keep layout [:icons
:element-options])))]
(update-in state [:workspace-local]
assoc :left-sidebar? left-sidebar?
:right-sidebar? right-sidebar?)))
(defn toggle-layout-flags
[& flags]
(ptk/reify ::toggle-layout-flag
(ptk/reify ::toggle-layout-flags
ptk/UpdateEvent
(update [_ state]
(let [reduce-fn
(fn [state flag]
(update state :workspace-layout
(fn [flags]
(if (contains? flags flag)
(disj flags flag)
(conj flags flag)))))]
(reduce reduce-fn state flags)))))
(-> (reduce toggle-layout-flag state flags)
(check-sidebars)))))
;; --- Set element options mode
@ -1462,14 +1479,14 @@
;; Shortcuts impl https://github.com/ccampbell/mousetrap
(def shortcuts
{"ctrl+m" #(st/emit! (toggle-layout-flag :sitemap))
"ctrl+i" #(st/emit! (toggle-layout-flag :libraries))
"ctrl+l" #(st/emit! (toggle-layout-flag :layers))
"ctrl+shift+r" #(st/emit! (toggle-layout-flag :rules))
"ctrl+a" #(st/emit! (toggle-layout-flag :dynamic-alignment))
"ctrl+p" #(st/emit! (toggle-layout-flag :colorpalette))
"ctrl+'" #(st/emit! (toggle-layout-flag :display-grid))
"ctrl+shift+'" #(st/emit! (toggle-layout-flag :snap-grid))
{"ctrl+m" #(st/emit! (toggle-layout-flags :sitemap))
"ctrl+i" #(st/emit! (toggle-layout-flags :libraries))
"ctrl+l" #(st/emit! (toggle-layout-flags :layers))
"ctrl+shift+r" #(st/emit! (toggle-layout-flags :rules))
"ctrl+a" #(st/emit! (toggle-layout-flags :dynamic-alignment))
"ctrl+p" #(st/emit! (toggle-layout-flags :colorpalette))
"ctrl+'" #(st/emit! (toggle-layout-flags :display-grid))
"ctrl+shift+'" #(st/emit! (toggle-layout-flags :snap-grid))
"+" #(st/emit! (increase-zoom nil))
"-" #(st/emit! (decrease-zoom nil))
"g" #(st/emit! group-selected)

View file

@ -38,15 +38,12 @@
(mf/defc workspace-content
[{:keys [page file layout project] :as params}]
(let [left-sidebar? (not (empty? (keep layout [:layers :sitemap
:document-history :libraries])))
right-sidebar? (not (empty? (keep layout [:icons :element-options])))
(let [local (mf/deref refs/workspace-local)
left-sidebar? (:left-sidebar? local)
right-sidebar? (:right-sidebar? local)
classes (classnames
:no-tool-bar-right (not right-sidebar?)
:no-tool-bar-left (not left-sidebar?))
local (mf/deref refs/workspace-local)]
:no-tool-bar-left (not left-sidebar?))]
[:*
(when (:colorpalette layout)
[:& colorpalette {:left-sidebar? left-sidebar?

View file

@ -72,7 +72,7 @@
max-offset (- (count items)
visible)
close-fn #(st/emit! (udw/toggle-layout-flag :colorpalette))
close-fn #(st/emit! (udw/toggle-layout-flags :colorpalette))
container (mf/use-ref nil)
on-left-arrow-click

View file

@ -69,49 +69,49 @@
[:& dropdown {:show @show-menu?
:on-close #(reset! show-menu? false)}
[:ul.menu
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :rules))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :rules))}
[:span
(if (contains? layout :rules)
(t locale "workspace.header.menu.hide-rules")
(t locale "workspace.header.menu.show-rules"))]
[:span.shortcut "Ctrl+r"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :display-grid))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :display-grid))}
[:span
(if (contains? layout :display-grid)
(t locale "workspace.header.menu.hide-grid")
(t locale "workspace.header.menu.show-grid"))]
[:span.shortcut "Ctrl+'"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :snap-grid))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :snap-grid))}
[:span
(if (contains? layout :snap-grid)
(t locale "workspace.header.menu.disable-snap-grid")
(t locale "workspace.header.menu.enable-snap-grid"))]
[:span.shortcut "Ctrl+Shift+'"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :sitemap :layers))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :sitemap :layers))}
[:span
(if (or (contains? layout :sitemap) (contains? layout :layers))
(t locale "workspace.header.menu.hide-layers")
(t locale "workspace.header.menu.show-layers"))]
[:span.shortcut "Ctrl+l"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :colorpalette))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :colorpalette))}
[:span
(if (contains? layout :colorpalette)
(t locale "workspace.header.menu.hide-palette")
(t locale "workspace.header.menu.show-palette"))]
[:span.shortcut "Ctrl+p"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :libraries))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :libraries))}
[:span
(if (contains? layout :libraries)
(t locale "workspace.header.menu.hide-libraries")
(t locale "workspace.header.menu.show-libraries"))]
[:span.shortcut "Ctrl+i"]]
[:li {:on-click #(st/emit! (dw/toggle-layout-flag :dynamic-alignment))}
[:li {:on-click #(st/emit! (dw/toggle-layout-flags :dynamic-alignment))}
[:span
(if (contains? layout :dynamic-alignment)
(t locale "workspace.header.menu.disable-dynamic-alignment")

View file

@ -94,12 +94,12 @@
[:li.tooltip.tooltip-right
{:alt "Layers"
:class (when (contains? layout :layers) "selected")
:on-click #(st/emit! (dw/toggle-layout-flag :sitemap :layers))}
:on-click #(st/emit! (dw/toggle-layout-flags :sitemap :layers))}
i/layers]
[:li.tooltip.tooltip-right
{:alt (t locale "workspace.toolbar.libraries")
:class (when (contains? layout :libraries) "selected")
:on-click #(st/emit! (dw/toggle-layout-flag :libraries))}
:on-click #(st/emit! (dw/toggle-layout-flags :libraries))}
i/icon-set]
[:li.tooltip.tooltip-right
{:alt "History"}
@ -107,5 +107,5 @@
[:li.tooltip.tooltip-right
{:alt (t locale "workspace.toolbar.color-palette")
:class (when (contains? layout :colorpalette) "selected")
:on-click #(st/emit! (dw/toggle-layout-flag :colorpalette))}
:on-click #(st/emit! (dw/toggle-layout-flags :colorpalette))}
i/palette]]]]))

View file

@ -73,7 +73,7 @@
on-close
(fn [event]
(st/emit! (dw/toggle-layout-flag :icons)))
(st/emit! (dw/toggle-layout-flags :icons)))
on-change
(fn [val]

View file

@ -308,7 +308,7 @@
[{:keys [page] :as props}]
(let [locale (mf/deref i18n/locale)
data (mf/deref refs/workspace-data)
on-click #(st/emit! (dw/toggle-layout-flag :layers))]
on-click #(st/emit! (dw/toggle-layout-flags :layers))]
[:div#layers.tool-window
[:div.tool-window-bar
[:div.tool-window-icon i/layers]

View file

@ -50,7 +50,7 @@
(mf/defc options-toolbox
{:wrap [mf/memo]}
[{:keys [page selected] :as props}]
(let [close #(st/emit! (udw/toggle-layout-flag :element-options))
(let [close #(st/emit! (udw/toggle-layout-flags :element-options))
on-change-tab #(st/emit! (udw/set-options-mode %))
options-mode (mf/deref refs/options-mode)

View file

@ -143,13 +143,13 @@
(mf/defc sitemap-toolbox
[{:keys [file page layout] :as props}]
(let [on-create-click #(st/emit! dw/create-empty-page)
toggle-layout #(st/emit! (dw/toggle-layout-flag %))
toggle-layout #(st/emit! (dw/toggle-layout-flags %))
locale (i18n/use-locale)]
[:div.sitemap.tool-window
[:div.tool-window-bar
[:span (t locale "workspace.sidebar.sitemap")]
[:div.add-page {:on-click on-create-click} i/close]
[:div.collapse-pages {:on-click #(st/emit! (dw/toggle-layout-flag :sitemap-pages))}
[:div.collapse-pages {:on-click #(st/emit! (dw/toggle-layout-flags :sitemap-pages))}
i/arrow-slide]]
(when (contains? layout :sitemap-pages)