Changes to text editor

This commit is contained in:
alonso.torres 2022-02-17 14:53:46 +01:00
parent d83459f674
commit 618d22d214
9 changed files with 115 additions and 149 deletions

View file

@ -80,34 +80,38 @@
"z")}))
attrs))
(defn add-fill [attrs shape render-id index]
(let [
fill-attrs (cond
(contains? shape :fill-image)
(let [fill-image-id (str "fill-image-" render-id)]
{:fill (str/format "url(#%s)" fill-image-id)})
(defn add-fill
([attrs shape render-id]
(add-fill attrs shape render-id 0))
(contains? shape :fill-color-gradient)
(let [fill-color-gradient-id (str "fill-color-gradient_" render-id "_" index)]
{:fill (str/format "url(#%s)" fill-color-gradient-id)})
([attrs shape render-id index]
(let [fill-attrs
(cond
(contains? shape :fill-image)
(let [fill-image-id (str "fill-image-" render-id)]
{:fill (str/format "url(#%s)" fill-image-id)})
(contains? shape :fill-color)
{:fill (:fill-color shape)}
(contains? shape :fill-color-gradient)
(let [fill-color-gradient-id (str "fill-color-gradient_" render-id "_" index)]
{:fill (str/format "url(#%s)" fill-color-gradient-id)})
;; If contains svg-attrs the origin is svg. If it's not svg origin
;; we setup the default fill as transparent (instead of black)
(and (not (contains? shape :svg-attrs))
(not (#{:svg-raw :group} (:type shape))))
{:fill "none"}
(contains? shape :fill-color)
{:fill (:fill-color shape)}
:else
{})
;; If contains svg-attrs the origin is svg. If it's not svg origin
;; we setup the default fill as transparent (instead of black)
(and (not (contains? shape :svg-attrs))
(not (#{:svg-raw :group} (:type shape))))
{:fill "none"}
fill-attrs (cond-> fill-attrs
(contains? shape :fill-opacity)
(assoc :fillOpacity (:fill-opacity shape)))]
:else
{})
(obj/merge! attrs (clj->js fill-attrs))))
fill-attrs (cond-> fill-attrs
(contains? shape :fill-opacity)
(assoc :fillOpacity (:fill-opacity shape)))]
(obj/merge! attrs (clj->js fill-attrs)))))
(defn add-stroke [attrs shape render-id]
(let [stroke-style (:stroke-style shape :none)

View file

@ -38,19 +38,8 @@
stroke-width (case (:stroke-alignment shape :center)
:center (/ (:stroke-width shape 0) 2)
:outer (:stroke-width shape 0)
0)
margin (gsh/shape-stroke-margin shape stroke-width)
bounding-box (-> (gsh/points->selrect (:points shape))
(update :x - (+ stroke-width margin))
(update :y - (+ stroke-width margin))
(update :width + (* 2 (+ stroke-width margin)))
(update :height + (* 2 (+ stroke-width margin))))]
[:mask {:id stroke-mask-id
:x (:x bounding-box)
:y (:y bounding-box)
:width (:width bounding-box)
:height (:height bounding-box)
:maskUnits "userSpaceOnUse"}
0)]
[:mask {:id stroke-mask-id}
[:use {:xlinkHref (str "#" shape-id)
:style #js {:fill "none" :stroke "white" :strokeWidth (* stroke-width 2)}}]

View file

@ -19,11 +19,12 @@
(let [valign (:vertical-align node "top")
base #js {:height "100%"
:width "100%"
:fontFamily "sourcesanspro"}]
:fontFamily "sourcesanspro"
:display "flex"}]
(cond-> base
(= valign "top") (obj/set! "justifyContent" "flex-start")
(= valign "center") (obj/set! "justifyContent" "center")
(= valign "bottom") (obj/set! "justifyContent" "flex-end"))))
(= valign "top") (obj/set! "alignItems" "flex-start")
(= valign "center") (obj/set! "alignItems" "center")
(= valign "bottom") (obj/set! "alignItems" "flex-end"))))
(defn generate-paragraph-set-styles
[{:keys [grow-type] :as shape}]
@ -39,7 +40,6 @@
#js {:display "inline-flex"
:flexDirection "column"
:justifyContent "inherit"
:minHeight (when-not (or auto-width? auto-height?) "100%")
:minWidth (when-not auto-width? "100%")
:marginRight "1px"
:verticalAlign "top"}))

View file

@ -24,9 +24,8 @@
(let [render-id (mf/use-ctx muc/render-ctx)
{:keys [id x y width height position-data] :as shape} (obj/get props "shape")
clip-id (str "clip-text" id "_" render-id)
group-props (-> #js {:transform (gsh/transform-matrix shape)
:clipPath (str "url(#" clip-id ")")}
transform (str (gsh/transform-matrix shape))
group-props (-> #js {:transform transform}
(attrs/add-style-attrs shape render-id))
get-gradient-id
(fn [index]
@ -43,9 +42,6 @@
[:& shape-custom-stroke {:shape shape}
[:> :g group-props
[:defs
[:clipPath {:id clip-id}
[:rect.text-clip {:x x :y y :width width :height height}]]]
(for [[index data] (d/enumerate position-data)]
(let [props (-> #js {:x (:x data)
:y (:y data)