Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-06 14:50:20 -05:00
Code Issues Activity

Remove direct lense mutation and eventes recursion on workspace.

Browse source
This commit is contained in:
Andrey Antukh 2015-12-17 18:34:15 +02:00
parent e458ffe355
commit 827b8a3aec
6 changed files with 83 additions and 104 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
frontend/uxbox/data/projects.cljs
View file

@ -125,8 +125,7 @@
rs/UpdateEvent
(-apply-update [_ state]
(let [s {:project projectid
:page pageid
:toolboxes {}}]
:page pageid}]
(update state :workspace merge s)))
IPrintWithWriter

20
frontend/uxbox/data/workspace.cljs
View file

@ -10,24 +10,14 @@
;; Events
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(defn toggle-pagesbar
[]
(defn toggle-tool
[toolname]
(reify
rs/UpdateEvent
(-apply-update [_ state]
(update-in state [:workspace :pagesbar-enabled] (fnil not false)))
(let [key (keyword (str (name toolname) "-enabled"))]
(update-in state [:workspace key] (fnil not false))))
IPrintWithWriter
(-pr-writer [mv writer _]
(-write writer "#<event:u.s.p/toggle-pagebar>"))))
(defn toggle-grid
[]
(reify
rs/UpdateEvent
(-apply-update [_ state]
(update-in state [:workspace :grid-enabled] (fnil not false)))
IPrintWithWriter
(-pr-writer [mv writer _]
(-write writer "#<event:u.s.p/toggle-grid>"))))
(-write writer "#<event:u.s.p/toggle-tool>"))))

10
frontend/uxbox/ui/workspace.cljs
View file

@ -6,6 +6,7 @@
[uxbox.state :as s]
[uxbox.data.projects :as dp]
[uxbox.ui.util :as util]
[uxbox.ui.mixins :as mx]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.workspace.toolbar :as wt]
[uxbox.ui.workspace.leftsidebar :as wl]
@ -19,7 +20,6 @@
(defn workspace-render
[own projectid]
(println "workspace-render")
(html
[:div
(wh/header)
@ -36,9 +36,9 @@
;; Canvas
(wa/workarea)
;; (working-area conn @open-toolboxes page project shapes (rum/react ws/zoom) (rum/react ws/grid?))
;; ;; Aside
;; (when-not (empty? @open-toolboxes)
;; (aside conn open-toolboxes page shapes))
;; ;; Aside
;; (when-not (empty? @open-toolboxes)
;; (aside conn open-toolboxes page shapes))
]]]))
(defn workspace-will-mount
@ -58,5 +58,5 @@
:will-mount workspace-will-mount
:transfer-state workspace-transfer-state
:name "workspace"
:mixins [rum/static]}))
:mixins [mx/static rum/reactive]}))

91
frontend/uxbox/ui/workspace/header.cljs
View file

@ -23,53 +23,50 @@
(defn header-render
[own]
(letfn [(toggle-pagesbar [e]
(rs/emit! (dw/toggle-pagesbar)))
(toggle-grid [e]
(rs/emit! (dw/toggle-grid)))]
(let [page (rum/react wb/page-state)
workspace (rum/react wb/workspace-state)]
(html
[:header#workspace-bar.workspace-bar
[:div.main-icon
(nav/link (r/route-for :dashboard/projects) i/logo-icon)]
[:div.project-tree-btn
{:on-click toggle-pagesbar}
i/project-tree
[:span (:name page)]]
[:div.workspace-options
[:ul.options-btn
[:li.tooltip.tooltip-bottom {:alt "Undo (Ctrl + Z)"}
i/undo]
[:li.tooltip.tooltip-bottom {:alt "Redo (Ctrl + Shift + Z)"}
i/redo]]
[:ul.options-btn
;; TODO: refactor
[:li.tooltip.tooltip-bottom
{:alt "Export (Ctrl + E)"}
;; page-title
[:a {:download (str (:name page) ".svg")
:href "#" :on-click on-download-clicked}
i/export]]
[:li.tooltip.tooltip-bottom
{:alt "Image (Ctrl + I)"}
i/image]]
[:ul.options-btn
[:li.tooltip.tooltip-bottom
{:alt "Ruler (Ctrl + R)"}
i/ruler]
[:li.tooltip.tooltip-bottom
{:alt "Grid (Ctrl + G)"
:class (when (:grid-enabled workspace) "selected")
:on-click toggle-grid}
i/grid]
[:li.tooltip.tooltip-bottom
{:alt "Align (Ctrl + A)"}
i/alignment]
[:li.tooltip.tooltip-bottom
{:alt "Organize (Ctrl + O)"}
i/organize]]]
(ui.u/user)]))))
(let [page (rum/react wb/page-state)
workspace (rum/react wb/workspace-state)
toggle #(rs/emit! (dw/toggle-tool %))]
(html
[:header#workspace-bar.workspace-bar
[:div.main-icon
(nav/link (r/route-for :dashboard/projects) i/logo-icon)]
[:div.project-tree-btn
{:on-click (partial toggle :pagesbar)}
i/project-tree
[:span (:name page)]]
[:div.workspace-options
[:ul.options-btn
[:li.tooltip.tooltip-bottom {:alt "Undo (Ctrl + Z)"}
i/undo]
[:li.tooltip.tooltip-bottom {:alt "Redo (Ctrl + Shift + Z)"}
i/redo]]
[:ul.options-btn
;; TODO: refactor
[:li.tooltip.tooltip-bottom
{:alt "Export (Ctrl + E)"}
;; page-title
[:a {:download (str (:name page) ".svg")
:href "#" :on-click on-download-clicked}
i/export]]
[:li.tooltip.tooltip-bottom
{:alt "Image (Ctrl + I)"}
i/image]]
[:ul.options-btn
[:li.tooltip.tooltip-bottom
{:alt "Ruler (Ctrl + R)"}
i/ruler]
[:li.tooltip.tooltip-bottom
{:alt "Grid (Ctrl + G)"
:class (when (:grid-enabled workspace) "selected")
:on-click (partial toggle :grid)}
i/grid]
[:li.tooltip.tooltip-bottom
{:alt "Align (Ctrl + A)"}
i/alignment]
[:li.tooltip.tooltip-bottom
{:alt "Organize (Ctrl + O)"}
i/organize]]]
(ui.u/user)])))
(def header
(util/component

41
frontend/uxbox/ui/workspace/rules.cljs
View file

@ -5,21 +5,15 @@
[beicon.core :as rx]
[uxbox.state :as s]
[uxbox.ui.dom :as dom]
[uxbox.ui.workspace.base :as wd]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.mixins :as mx]
[uxbox.ui.util :as util]))
(def viewport-height 3000)
(def viewport-width 3000)
(def document-start-x 50)
(def document-start-y 50)
(defn h-rule-render
[zoom]
(let [left (rum/react wd/left-scroll)
width viewport-width
start-width document-start-x
[own]
(let [left (or (rum/react wb/left-scroll) 0)
width wb/viewport-width
start-width wb/document-start-x
padding 20
zoom 1
big-ticks-mod (/ 100 zoom)
@ -30,10 +24,12 @@
lines (fn [position value padding]
(cond
(< (mod value big-ticks-mod) step-size)
(html
[:g
[:line {:x1 position :x2 position :y1 5 :y2 padding :stroke "#7f7f7f"}]
[:text {:x (+ position 2) :y 13 :fill "#7f7f7f" :style {:font-size "12px"}} value]])
(do
(println "foobar")
(html
[:g
[:line {:x1 position :x2 position :y1 5 :y2 padding :stroke "#7f7f7f"}]
[:text {:x (+ position 2) :y 13 :fill "#7f7f7f" :style {:font-size "12px"}} value]]))
(< (mod value mid-ticks-mod) step-size)
(html
[:line {:key position :x1 position :x2 position :y1 10 :y2 padding :stroke "#7f7f7f"}])
@ -57,14 +53,13 @@
(util/component
{:render h-rule-render
:name "h-rule"
:mixins [rum/reactive]}))
:mixins [mx/static rum/reactive]}))
(defn v-rule-render
[zoom]
(let [height viewport-height
start-height document-start-y
top (rum/react wd/top-scroll)
[own]
(let [height wb/viewport-height
start-height wb/document-start-y
top (or (rum/react wb/top-scroll) 0)
zoom 1
padding 20
big-ticks-mod (/ 100 zoom)
@ -102,4 +97,4 @@
(util/component
{:render v-rule-render
:name "v-rule"
:mixins [rum/reactive]}))
:mixins [mx/static rum/reactive]}))

22
frontend/uxbox/ui/workspace/toolbar.cljs
View file

@ -4,6 +4,8 @@
[cats.labs.lens :as l]
[uxbox.rstore :as rs]
[uxbox.state :as s]
[uxbox.data.workspace :as dw]
[uxbox.ui.workspace.base :as wb]
[uxbox.ui.icons :as i]
[uxbox.ui.util :as util]))
@ -11,36 +13,32 @@
;; Toolbar
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(def ^:static toolbar-state
(as-> (l/in [:workspace :toolbars]) $
(l/focus-atom $ s/state)))
(defn- toggle-toolbox
[state item]
(update state item (fnil not false)))
(defn toolbar-render
[own]
(let [state (rum/react toolbar-state)]
(let [workspace (rum/react wb/workspace-state)
toggle #(rs/emit! (dw/toggle-tool %))]
(html
[:div#tool-bar.tool-bar
[:div.tool-bar-inside
[:ul.main-tools
[:li.tooltip
{:alt "Shapes (Ctrl + Shift + F)"
:class (when (:tools state) "current")
:on-click #(swap! toolbar-state toggle-toolbox :tools)}
:class (when (:tools-enabled workspace false) "current")
:on-click (partial toggle :tools)}
i/shapes]
[:li.tooltip
{:alt "Icons (Ctrl + Shift + I)"
:class (when (:icons state) "current")
:on-click #(swap! toolbar-state toggle-toolbox :icons)}
:class (when (:icons-enabled workspace false) "current")
:on-click (partial toggle :icons)}
i/icon-set]
[:li.tooltip
{:alt "Elements (Ctrl + Shift + L)"
:class (when (:layers state)
"current")
:on-click #(swap! toolbar-state toggle-toolbox :layers)}
:class (when (:layers-enabled workspace false) "current")
:on-click (partial toggle :layers)}
i/layers]
[:li.tooltip
{:alt "Feedback (Ctrl + Shift + M)"}