mirror of
https://github.com/penpot/penpot.git
synced 2025-06-09 16:11:38 +02:00
✨ Send fill + stops data in one call for linear fills
This commit is contained in:
parent
16012a3881
commit
fccd1a5bd7
4 changed files with 143 additions and 62 deletions
|
@ -10,7 +10,6 @@
|
|||
["react-dom/server" :as rds]
|
||||
[app.common.data :as d]
|
||||
[app.common.data.macros :as dm]
|
||||
[app.common.math :as mth]
|
||||
[app.common.types.shape.layout :as ctl]
|
||||
[app.common.types.shape.path :as path]
|
||||
[app.common.uuid :as uuid]
|
||||
|
@ -50,6 +49,7 @@
|
|||
(def GRID-LAYOUT-COLUMN-ENTRY-SIZE 5)
|
||||
(def GRID-LAYOUT-CELL-ENTRY-SIZE 37)
|
||||
(def GRADIENT-STOP-SIZE 5)
|
||||
(def LINEAR-FILL-BASE-SIZE 21)
|
||||
|
||||
(defn gradient-stop-get-entries-size
|
||||
[stops]
|
||||
|
@ -104,24 +104,7 @@
|
|||
(h/call wasm/internal-module "_render")
|
||||
(set! wasm/internal-frame-id nil))
|
||||
|
||||
(defn- rgba-from-hex
|
||||
"Takes a hex color in #rrggbb format, and an opacity value from 0 to 1 and returns its 32-bit rgba representation"
|
||||
[hex opacity]
|
||||
(let [rgb (js/parseInt (subs hex 1) 16)
|
||||
a (mth/floor (* (or opacity 1) 0xff))]
|
||||
;; rgba >>> 0 so we have an unsigned representation
|
||||
(unsigned-bit-shift-right (bit-or (bit-shift-left a 24) rgb) 0)))
|
||||
|
||||
(defn- rgba-bytes-from-hex
|
||||
"Takes a hex color in #rrggbb format, and an opacity value from 0 to 1 and returns an array with its r g b a values"
|
||||
[hex opacity]
|
||||
(let [rgb (js/parseInt (subs hex 1) 16)
|
||||
a (mth/floor (* (or opacity 1) 0xff))
|
||||
;; rgba >>> 0 so we have an unsigned representation
|
||||
r (bit-shift-right rgb 16)
|
||||
g (bit-and (bit-shift-right rgb 8) 255)
|
||||
b (bit-and rgb 255)]
|
||||
[r g b a]))
|
||||
|
||||
(defn cancel-render
|
||||
[_]
|
||||
|
@ -241,35 +224,37 @@
|
|||
image (:fill-image fill)]
|
||||
(cond
|
||||
(some? color)
|
||||
(let [rgba (rgba-from-hex color opacity)]
|
||||
(let [rgba (sr/hex->u32argb color opacity)]
|
||||
(h/call wasm/internal-module "_add_shape_solid_fill" rgba))
|
||||
|
||||
(some? gradient)
|
||||
(let [stops (:stops gradient)
|
||||
size (gradient-stop-get-entries-size stops)
|
||||
offset (mem/alloc-bytes size)
|
||||
heap (mem/get-heap-u8)
|
||||
mem (js/Uint8Array. (.-buffer heap) offset size)]
|
||||
(if (= (:type gradient) :linear)
|
||||
(h/call wasm/internal-module "_add_shape_linear_fill"
|
||||
(:start-x gradient)
|
||||
(:start-y gradient)
|
||||
(:end-x gradient)
|
||||
(:end-y gradient)
|
||||
opacity)
|
||||
(case (:type gradient)
|
||||
:linear
|
||||
(let [stops (:stops gradient)
|
||||
size (+ LINEAR-FILL-BASE-SIZE (* (count stops) GRADIENT-STOP-SIZE))
|
||||
offset (mem/alloc-bytes size)
|
||||
heap (mem/get-heap-u8)]
|
||||
(sr/serialize-linear-fill gradient opacity heap offset)
|
||||
(h/call wasm/internal-module "_add_shape_linear_fill"))
|
||||
:radial
|
||||
(let [stops (:stops gradient)
|
||||
size (gradient-stop-get-entries-size stops)
|
||||
offset (mem/alloc-bytes size)
|
||||
heap (mem/get-heap-u8)
|
||||
mem (js/Uint8Array. (.-buffer heap) offset size)]
|
||||
(h/call wasm/internal-module "_add_shape_radial_fill"
|
||||
(:start-x gradient)
|
||||
(:start-y gradient)
|
||||
(:end-x gradient)
|
||||
(:end-y gradient)
|
||||
opacity
|
||||
(:width gradient)))
|
||||
(.set mem (js/Uint8Array. (clj->js (flatten (map (fn [stop]
|
||||
(let [[r g b a] (rgba-bytes-from-hex (:color stop) (:opacity stop))
|
||||
offset (:offset stop)]
|
||||
[r g b a (* 100 offset)]))
|
||||
stops)))))
|
||||
(h/call wasm/internal-module "_add_shape_fill_stops"))
|
||||
(:width gradient))
|
||||
(.set mem (js/Uint8Array. (clj->js (flatten (map (fn [stop]
|
||||
(let [[r g b a] (sr/rgba-bytes-from-hex (:color stop) (:opacity stop))
|
||||
offset (:offset stop)]
|
||||
[r g b a (* 100 offset)]))
|
||||
stops)))))
|
||||
(h/call wasm/internal-module "_add_shape_fill_stops")))
|
||||
|
||||
(some? image)
|
||||
(let [id (dm/get-prop image :id)
|
||||
|
@ -327,7 +312,7 @@
|
|||
opacity
|
||||
(:width gradient)))
|
||||
(.set mem (js/Uint8Array. (clj->js (flatten (map (fn [stop]
|
||||
(let [[r g b a] (rgba-bytes-from-hex (:color stop) (:opacity stop))
|
||||
(let [[r g b a] (sr/rgba-bytes-from-hex (:color stop) (:opacity stop))
|
||||
offset (:offset stop)]
|
||||
[r g b a (* 100 offset)]))
|
||||
stops)))))
|
||||
|
@ -349,7 +334,7 @@
|
|||
(store-image id)))
|
||||
|
||||
(some? color)
|
||||
(let [rgba (rgba-from-hex color opacity)]
|
||||
(let [rgba (sr/hex->u32argb color opacity)]
|
||||
(h/call wasm/internal-module "_add_shape_stroke_solid_fill" rgba)))))
|
||||
strokes))
|
||||
|
||||
|
@ -641,7 +626,7 @@
|
|||
(let [shadow (nth shadows index)
|
||||
color (dm/get-prop shadow :color)
|
||||
blur (dm/get-prop shadow :blur)
|
||||
rgba (rgba-from-hex (dm/get-prop color :color) (dm/get-prop color :opacity))
|
||||
rgba (sr/hex->u32argb (dm/get-prop color :color) (dm/get-prop color :opacity))
|
||||
hidden (dm/get-prop shadow :hidden)
|
||||
x (dm/get-prop shadow :offset-x)
|
||||
y (dm/get-prop shadow :offset-y)
|
||||
|
@ -864,7 +849,7 @@
|
|||
|
||||
(defn set-canvas-background
|
||||
[background]
|
||||
(let [rgba (rgba-from-hex background 1)]
|
||||
(let [rgba (sr/hex->u32argb background 1)]
|
||||
(h/call wasm/internal-module "_set_canvas_background" rgba)
|
||||
(request-render "set-canvas-background")))
|
||||
|
||||
|
@ -893,7 +878,7 @@
|
|||
|
||||
(defn initialize
|
||||
[base-objects zoom vbox background]
|
||||
(let [rgba (rgba-from-hex background 1)]
|
||||
(let [rgba (sr/hex->u32argb background 1)]
|
||||
(h/call wasm/internal-module "_set_canvas_background" rgba)
|
||||
(h/call wasm/internal-module "_set_view" zoom (- (:x vbox)) (- (:y vbox)))
|
||||
(set-objects base-objects)))
|
||||
|
@ -952,5 +937,4 @@
|
|||
(p/merr (fn [cause]
|
||||
(js/console.error cause)
|
||||
(p/resolved false)))))
|
||||
(p/resolved false))))
|
||||
|
||||
(p/resolved false))))
|
Loading…
Add table
Add a link
Reference in a new issue