3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-08-07 14:38:33 +02:00
Code Issues Projects Releases Packages Wiki Activity

Improved naming.

Browse source
This commit is contained in:
Andrey Antukh 2016-01-30 11:34:27 +02:00
parent 3cf5a4a4cf
commit 43b6056c1e
3 changed files with 89 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

101
src/uxbox/data/workspace.cljs
View file

@ -27,7 +27,7 @@
:lock [v/boolean]}) :lock [v/boolean]})
(def ^:static +shape-update-fill-schema+ (def ^:static +shape-update-fill-schema+
{:fill [sc/color] {:color [sc/color]
:opacity [v/number]}) :opacity [v/number]})
(def ^:static +shape-update-stroke-schema+ (def ^:static +shape-update-stroke-schema+
@ -194,7 +194,18 @@
(let [shape (get-in state [:shapes-by-id sid])] (let [shape (get-in state [:shapes-by-id sid])]
(update-in state [:shapes-by-id sid] sh/-move delta))))) (update-in state [:shapes-by-id sid] sh/-move delta)))))
(defn update-shape-rotation (defn update-line
[sid props]
(reify
rs/UpdateEvent
(-apply-update [_ state]
(let [shape (get-in state [:shapes-by-id sid])
props (select-keys props [:x1 :y1 :x2 :y2])
props' (select-keys shape [:x1 :y1 :x2 :y2])]
(update-in state [:shapes-by-id sid] sh/-initialize
(merge props' props))))))
(defn update-rotation
[sid rotation] [sid rotation]
{:pre [(number? rotation) {:pre [(number? rotation)
(>= rotation 0) (>= rotation 0)
@ -205,7 +216,7 @@
(update-in state [:shapes-by-id sid] (update-in state [:shapes-by-id sid]
sh/-rotate rotation)))) sh/-rotate rotation))))
(defn update-shape-size (defn update-size
"A helper event just for update the position "A helper event just for update the position
of the shape using the width and heigt attrs of the shape using the width and heigt attrs
instread final point of coordinates. instread final point of coordinates.
@ -220,7 +231,7 @@
(let [size [width height]] (let [size [width height]]
(update-in state [:shapes-by-id sid] sh/-resize' size))))) (update-in state [:shapes-by-id sid] sh/-resize' size)))))
(defn update-shape-position (defn update-position
"Update the start position coordenate of the shape." "Update the start position coordenate of the shape."
[sid {:keys [x y] :as opts}] [sid {:keys [x y] :as opts}]
(sc/validate! +shape-update-position-schema+ opts) (sc/validate! +shape-update-position-schema+ opts)
@ -229,31 +240,20 @@
(-apply-update [_ state] (-apply-update [_ state]
(update-in state [:shapes-by-id sid] sh/-move' [x y])))) (update-in state [:shapes-by-id sid] sh/-move' [x y]))))
(defn update-line
[sid props]
(reify
rs/UpdateEvent
(-apply-update [_ state]
(let [shape (get-in state [:shapes-by-id sid])
props (select-keys props [:x1 :y1 :x2 :y2])
props' (select-keys shape [:x1 :y1 :x2 :y2])]
(update-in state [:shapes-by-id sid] sh/-initialize
(merge props' props))))))
;; TODO: rename fill to "color" for consistency. ;; TODO: rename fill to "color" for consistency.
(defn update-shape-fill (defn update-fill-attrs
[sid {:keys [fill opacity] :as opts}] [sid {:keys [color opacity] :as opts}]
(sc/validate! +shape-update-fill-schema+ opts) (sc/validate! +shape-update-fill-schema+ opts)
(reify (reify
rs/UpdateEvent rs/UpdateEvent
(-apply-update [_ state] (-apply-update [_ state]
(update-in state [:shapes-by-id sid] (update-in state [:shapes-by-id sid]
merge merge
(when fill {:fill fill}) (when color {:fill color})
(when opacity {:opacity opacity}))))) (when opacity {:opacity opacity})))))
(defn update-shape-stroke (defn update-stroke-attrs
[sid {:keys [color opacity width type] :as opts}] [sid {:keys [color opacity width type] :as opts}]
(sc/validate! +shape-update-stroke-schema+ opts) (sc/validate! +shape-update-stroke-schema+ opts)
(reify (reify
@ -266,17 +266,35 @@
(when color {:stroke color}) (when color {:stroke color})
(when opacity {:stroke-opacity opacity}))))) (when opacity {:stroke-opacity opacity})))))
(defn toggle-shape-visibility (defn hide-shape
[sid] [sid]
(reify (reify
rs/UpdateEvent rs/UpdateEvent
(-apply-update [_ state] (-apply-update [_ state]
(let [shape (get-in state [:shapes-by-id sid]) (assoc-in state [:shapes-by-id sid :hidden] true))
hidden? (:hidden shape false)]
(if hidden?
(assoc-in state [:shapes-by-id sid] (assoc shape :hidden false))
(assoc-in state [:shapes-by-id sid] (assoc shape :hidden true)))))))
rs/WatchEvent
(-apply-watch [_ state]
(let [shape (get-in state [:shapes-by-id sid])]
(if-not (= (:type shape) :builtin/group)
(rx/empty)
(rx/from-coll
(map hide-shape (:items shape))))))))
(defn show-shape
[sid]
(reify
rs/UpdateEvent
(-apply-update [_ state]
(assoc-in state [:shapes-by-id sid :hidden] false))
rs/WatchEvent
(-apply-watch [_ state]
(let [shape (get-in state [:shapes-by-id sid])]
(if-not (= (:type shape) :builtin/group)
(rx/empty)
(rx/from-coll
(map show-shape (:items shape))))))))
(defn block-shape (defn block-shape
[sid] [sid]
@ -308,16 +326,35 @@
(rx/from-coll (rx/from-coll
(map unblock-shape (:items shape)))))))) (map unblock-shape (:items shape))))))))
(defn toggle-shape-locking (defn lock-shape
[sid] [sid]
(reify (reify
rs/UpdateEvent rs/UpdateEvent
(-apply-update [_ state] (-apply-update [_ state]
(let [shape (get-in state [:shapes-by-id sid]) (assoc-in state [:shapes-by-id sid :locked] true))
locked? (:locked shape false)]
(if locked? rs/WatchEvent
(assoc-in state [:shapes-by-id sid] (assoc shape :locked false)) (-apply-watch [_ state]
(assoc-in state [:shapes-by-id sid] (assoc shape :locked true))))))) (let [shape (get-in state [:shapes-by-id sid])]
(if-not (= (:type shape) :builtin/group)
(rx/empty)
(rx/from-coll
(map lock-shape (:items shape))))))))
(defn unlock-shape
[sid]
(reify
rs/UpdateEvent
(-apply-update [_ state]
(assoc-in state [:shapes-by-id sid :locked] false))
rs/WatchEvent
(-apply-watch [_ state]
(let [shape (get-in state [:shapes-by-id sid])]
(if-not (= (:type shape) :builtin/group)
(rx/empty)
(rx/from-coll
(map unlock-shape (:items shape))))))))
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;; ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Events (for selected) ;; Events (for selected)
@ -424,5 +461,5 @@
(-apply-watch [_ state] (-apply-watch [_ state]
(rx/from-coll (rx/from-coll
(->> (get-in state [:workspace :selected]) (->> (get-in state [:workspace :selected])
(map #(update-shape-fill % opts))))))) (map #(update-fill-attrs % opts)))))))

21
src/uxbox/ui/workspace/options.cljs
View file

@ -74,7 +74,7 @@
[menu own shape] [menu own shape]
(letfn [(change-stroke [value] (letfn [(change-stroke [value]
(let [sid (:id shape)] (let [sid (:id shape)]
(rs/emit! (dw/update-shape-stroke sid value)))) (rs/emit! (dw/update-stroke-attrs sid value))))
(on-width-change [event] (on-width-change [event]
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-float value 1)] value (parse-float value 1)]
@ -136,8 +136,7 @@
[menu own shape] [menu own shape]
(letfn [(change-fill [value] (letfn [(change-fill [value]
(let [sid (:id shape)] (let [sid (:id shape)]
(-> (dw/update-shape-fill sid value) (rs/emit! (dw/update-fill-attrs sid value))))
(rs/emit!))))
(on-color-change [event] (on-color-change [event]
(let [value (dom/event->value event)] (let [value (dom/event->value event)]
(change-fill {:fill value}))) (change-fill {:fill value})))
@ -146,7 +145,7 @@
value (parse-float value 1)] value (parse-float value 1)]
(change-fill {:opacity value}))) (change-fill {:opacity value})))
(on-color-picker-event [{:keys [hex]}] (on-color-picker-event [{:keys [hex]}]
(change-fill {:fill hex}))] (change-fill {:color hex}))]
(html (html
[:div.element-set {:key (str (:id menu))} [:div.element-set {:key (str (:id menu))}
[:div.element-set-title (:name menu)] [:div.element-set-title (:name menu)]
@ -181,18 +180,18 @@
value (parse-int value 0) value (parse-int value 0)
sid (:id shape) sid (:id shape)
props {attr value}] props {attr value}]
(rs/emit! (dw/update-shape-size sid props)))) (rs/emit! (dw/update-size sid props))))
(on-rotation-change [event] (on-rotation-change [event]
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-int value 0) value (parse-int value 0)
sid (:id shape)] sid (:id shape)]
(rs/emit! (dw/update-shape-rotation sid value)))) (rs/emit! (dw/update-rotation sid value))))
(on-pos-change [attr event] (on-pos-change [attr event]
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-int value nil) value (parse-int value nil)
sid (:id shape) sid (:id shape)
props {attr value}] props {attr value}]
(rs/emit! (dw/update-shape-position sid props)))) (rs/emit! (dw/update-position sid props))))
(on-border-change [attr event])] (on-border-change [attr event])]
(html (html
[:div.element-set {:key (str (:id menu))} [:div.element-set {:key (str (:id menu))}
@ -271,18 +270,18 @@
value (parse-int value 0) value (parse-int value 0)
sid (:id shape) sid (:id shape)
props {attr value}] props {attr value}]
#_(rs/emit! (dw/update-shape-size sid props)))) #_(rs/emit! (dw/update-size sid props))))
(on-rotation-change [event] (on-rotation-change [event]
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-int value 0) value (parse-int value 0)
sid (:id shape)] sid (:id shape)]
#_(rs/emit! (dw/update-shape-rotation sid value)))) #_(rs/emit! (dw/update-rotation sid value))))
(on-pos-change [attr event] (on-pos-change [attr event]
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-int value nil) value (parse-int value nil)
sid (:id shape) sid (:id shape)
props {attr value}] props {attr value}]
#_(rs/emit! (dw/update-shape-position sid props))))] #_(rs/emit! (dw/update-position sid props))))]
(html (html
[:div.element-set {:key (str (:id menu))} [:div.element-set {:key (str (:id menu))}
[:div.element-set-title (:name menu)] [:div.element-set-title (:name menu)]
@ -346,7 +345,7 @@
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-int value 0) value (parse-int value 0)
sid (:id shape)] sid (:id shape)]
(rs/emit! (dw/update-shape-rotation sid value)))) (rs/emit! (dw/update-rotation sid value))))
(on-pos-change [attr event] (on-pos-change [attr event]
(let [value (dom/event->value event) (let [value (dom/event->value event)
value (parse-int value nil) value (parse-int value nil)

14
src/uxbox/ui/workspace/toolboxes/layers.cljs
View file

@ -53,8 +53,11 @@
(defn- toggle-visibility (defn- toggle-visibility
[selected item event] [selected item event]
(dom/stop-propagation event) (dom/stop-propagation event)
(let [id (:id item)] (let [id (:id item)
(rs/emit! (dw/toggle-shape-visibility id)) hidden? (:hidden item)]
(if hidden?
(rs/emit! (dw/show-shape id))
(rs/emit! (dw/hide-shape id)))
(when (contains? selected id) (when (contains? selected id)
(rs/emit! (dw/select-shape id))))) (rs/emit! (dw/select-shape id)))))
@ -70,8 +73,11 @@
(defn- toggle-locking (defn- toggle-locking
[item event] [item event]
(dom/stop-propagation event) (dom/stop-propagation event)
(let [id (:id item)] (let [id (:id item)
(rs/emit! (dw/toggle-shape-locking id)))) locked? (:locked item)]
(if locked?
(rs/emit! (dw/unlock-shape id))
(rs/emit! (dw/lock-shape id)))))
(defn- element-icon (defn- element-icon
[item] [item]