Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-10 08:50:57 -05:00
Code Issues Activity

Add basic impl for change the stroke type.

Browse source
This commit is contained in:
Andrey Antukh 2016-01-28 23:28:37 +02:00
parent c2724bca5d
commit af8873470c
3 changed files with 43 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -227,13 +227,14 @@
(when opacity {:opacity opacity})))))
(defn update-shape-stroke
[sid {:keys [color opacity width] :as opts}]
[sid {:keys [color opacity width type] :as opts}]
(sc/validate! +shape-update-stroke-schema+ opts)
(reify
rs/UpdateEvent
(-apply-update [_ state]
(update-in state [:shapes-by-id sid]
merge
{:stroke-type type}
(when width {:stroke-width width})
(when color {:stroke color})
(when opacity {:stroke-opacity opacity})))))

37
src/uxbox/ui/shapes.cljs
View file

@ -18,7 +18,24 @@
(defn- extract-style-attrs
"Extract predefinet attrs from shapes."
[shape]
(select-keys shape [:fill :opacity :stroke :stroke-opacity :stroke-width]))
(select-keys shape [:fill :opacity :stroke :stroke-opacity :stroke-width
:stroke-type]))
(defn- transform-stroke-type
[attrs]
(if-let [type (:stroke-type attrs)]
(let [value (case type
:dotted "1,1"
:dashed "10,10")]
(-> attrs
(assoc :stroke-dasharray value)
(dissoc :stroke-type)))
attrs))
(defn- transform-attrs
[attrs]
(-> attrs
(transform-stroke-type)))
(defn- make-debug-attrs
[shape]
@ -35,19 +52,25 @@
[{:keys [data id] :as shape} _]
(let [key (str id)
rfm (svg/calculate-transform shape)
attrs (-> (extract-style-attrs shape)
(transform-attrs))
attrs (merge {:id key :key key :transform rfm}
;; (select-keys shape [:x :y :width :height])
(make-debug-attrs shape)
(extract-style-attrs shape))]
attrs)]
(html
[:g attrs data])))
(defmethod sh/-render :builtin/line
[{:keys [id x1 y1 x2 y2]}]
(html
[:line {:x1 x1 :y1 y1 :x2 x2 :y2 y2
:stroke "black"
:stroke-width "1"}]))
[{:keys [id x1 y1 x2 y2] :as shape}]
(let [key (str id)
props (select-keys shape [:x1 :x2 :y2 :y1])
attrs (-> (extract-style-attrs shape)
(transform-attrs)
(merge {:id key :key key})
(merge props))]
(html
[:line attrs])))
;; FIXME: the impl should be more clear.

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

@ -11,7 +11,7 @@
[uxbox.ui.colorpicker :refer (colorpicker)]
[uxbox.ui.workspace.recent-colors :refer (recent-colors)]
[uxbox.ui.workspace.base :as wb]
[uxbox.util.data :refer (parse-int parse-float)]))
[uxbox.util.data :refer (parse-int parse-float read-string)]))
(def +menus-map+
{:builtin/icon [:menu/icon-measures :menu/fill :menu/stroke]
@ -66,7 +66,11 @@
(change-stroke {:opacity value})))
(on-color-change [event]
(let [value (dom/event->value event)]
(change-stroke {:color value})))]
(change-stroke {:color value})))
(on-stroke-style-change [event]
(let [value (dom/event->value event)
value (read-string value)]
(change-stroke {:type value})))]
(html
[:div.element-set {:key (str (:id menu))}
[:div.element-set-title (:name menu)]
@ -79,11 +83,11 @@
:min "0"
:value (:stroke-width shape "")
:on-change on-width-change}]
[:select#style {:placeholder "Style"}
[:option {:value "none"} "None"]
[:option {:value "none"} "Solid"]
[:option {:value "none"} "Dotted"]
[:option {:value "none"} "Dashed"]]]
[:select#style {:placeholder "Style"
:on-change on-stroke-style-change}
[:option {:value "nil"} "Solid"]
[:option {:value ":dotted"} "Dotted"]
[:option {:value ":dashed"} "Dashed"]]]
;; SLIDEBAR FOR ROTATION AND OPACITY
[:span "Color"]