From 043c23899ae5b3bbca8c5f58d6c655953099bac3 Mon Sep 17 00:00:00 2001 From: Andrey Antukh Date: Thu, 24 Oct 2024 18:35:57 +0200 Subject: [PATCH 1/4] :tada: Add first impl of wasm-friendly for Shape data structure --- .../app/common/geom/shapes/transforms.cljc | 51 ++-- common/src/app/common/record.cljc | 44 ++-- common/src/app/common/types/shape.cljc | 23 +- common/src/app/common/types/shape/impl.cljc | 228 ++++++++++++++++++ .../src/app/main/ui/workspace/viewport.cljs | 12 +- frontend/src/app/render_wasm.cljs | 12 +- frontend/src/debug.cljs | 8 +- 7 files changed, 300 insertions(+), 78 deletions(-) create mode 100644 common/src/app/common/types/shape/impl.cljc diff --git a/common/src/app/common/geom/shapes/transforms.cljc b/common/src/app/common/geom/shapes/transforms.cljc index ebde6bf80..c08f06781 100644 --- a/common/src/app/common/geom/shapes/transforms.cljc +++ b/common/src/app/common/geom/shapes/transforms.cljc @@ -280,7 +280,7 @@ transform (calculate-transform points center selrect)] [selrect transform (when (some? transform) (gmt/inverse transform))])) -(defn- adjust-shape-flips! +(defn- adjust-shape-flips "After some tranformations the flip-x/flip-y flags can change we need to check this before adjusting the selrect" [shape points] @@ -299,16 +299,16 @@ (cond-> shape (neg? dot-x) - (cr/update! :flip-x not) + (update :flip-x not) (neg? dot-x) - (cr/update! :rotation -) + (update :rotation -) (neg? dot-y) - (cr/update! :flip-y not) + (update :flip-y not) (neg? dot-y) - (cr/update! :rotation -)))) + (update :rotation -)))) (defn- apply-transform-move "Given a new set of points transformed, set up the rectangle so it keeps @@ -318,9 +318,6 @@ points (gco/transform-points (dm/get-prop shape :points) transform-mtx) selrect (gco/transform-selrect (dm/get-prop shape :selrect) transform-mtx) - ;; NOTE: ensure we start with a fresh copy of shape for mutabilty - shape (cr/clone shape) - shape (if (= type :bool) (update shape :bool-content gpa/transform-content transform-mtx) shape) @@ -329,14 +326,14 @@ shape) shape (if (= type :path) (update shape :content gpa/transform-content transform-mtx) - (cr/assoc! shape - :x (dm/get-prop selrect :x) - :y (dm/get-prop selrect :y) - :width (dm/get-prop selrect :width) - :height (dm/get-prop selrect :height)))] + (assoc shape + :x (dm/get-prop selrect :x) + :y (dm/get-prop selrect :y) + :width (dm/get-prop selrect :width) + :height (dm/get-prop selrect :height)))] (-> shape - (cr/assoc! :selrect selrect) - (cr/assoc! :points points)))) + (assoc :selrect selrect) + (assoc :points points)))) (defn- apply-transform-generic @@ -346,9 +343,7 @@ (let [points (-> (dm/get-prop shape :points) (gco/transform-points transform-mtx)) - ;; NOTE: ensure we have a fresh shallow copy of shape - shape (cr/clone shape) - shape (adjust-shape-flips! shape points) + shape (adjust-shape-flips shape points) center (gco/points->center points) selrect (calculate-selrect points center) @@ -367,17 +362,17 @@ shape (if (= type :path) (update shape :content gpa/transform-content transform-mtx) - (cr/assoc! shape - :x (dm/get-prop selrect :x) - :y (dm/get-prop selrect :y) - :width (dm/get-prop selrect :width) - :height (dm/get-prop selrect :height)))] + (assoc shape + :x (dm/get-prop selrect :x) + :y (dm/get-prop selrect :y) + :width (dm/get-prop selrect :width) + :height (dm/get-prop selrect :height)))] (-> shape - (cr/assoc! :transform transform) - (cr/assoc! :transform-inverse inverse) - (cr/assoc! :selrect selrect) - (cr/assoc! :points points) - (cr/assoc! :rotation rotation)))))) + (assoc :transform transform) + (assoc :transform-inverse inverse) + (assoc :selrect selrect) + (assoc :points points) + (assoc :rotation rotation)))))) (defn- apply-transform "Given a new set of points transformed, set up the rectangle so it keeps diff --git a/common/src/app/common/record.cljc b/common/src/app/common/record.cljc index 385917a0a..cbb9fa006 100644 --- a/common/src/app/common/record.cljc +++ b/common/src/app/common/record.cljc @@ -403,30 +403,30 @@ nil))) ~rsym))) -(defmacro clone - [ssym] - (if (:ns &env) - `(cljs.core/clone ~ssym) - ssym)) +;; (defmacro clone +;; [ssym] +;; (if (:ns &env) +;; `(cljs.core/clone ~ssym) +;; ssym)) -(defmacro assoc! - "A record specific update operation" - [ssym & pairs] - (if (:ns &env) - (let [pairs (partition-all 2 pairs)] - `(-> ~ssym - ~@(map (fn [[ks vs]] - `(cljs.core/-assoc! ~ks ~vs)) - pairs))) - `(assoc ~ssym ~@pairs))) +;; (defmacro assoc! +;; "A record specific update operation" +;; [ssym & pairs] +;; (if (:ns &env) +;; (let [pairs (partition-all 2 pairs)] +;; `(-> ~ssym +;; ~@(map (fn [[ks vs]] +;; `(cljs.core/-assoc! ~ks ~vs)) +;; pairs))) +;; `(assoc ~ssym ~@pairs))) -(defmacro update! - "A record specific update operation" - [ssym ksym f & params] - (if (:ns &env) - (let [ssym (with-meta ssym {:tag 'js})] - `(cljs.core/assoc! ~ssym ~ksym (~f (. ~ssym ~(property-symbol ksym)) ~@params))) - `(update ~ssym ~ksym ~f ~@params))) +;; (defmacro update! +;; "A record specific update operation" +;; [ssym ksym f & params] +;; (if (:ns &env) +;; (let [ssym (with-meta ssym {:tag 'js})] +;; `(cljs.core/assoc! ~ssym ~ksym (~f (. ~ssym ~(property-symbol ksym)) ~@params))) +;; `(update ~ssym ~ksym ~f ~@params))) (defmacro define-properties! "Define properties in the prototype with `.defineProperty`" diff --git a/common/src/app/common/types/shape.cljc b/common/src/app/common/types/shape.cljc index a49002948..9b13bdad1 100644 --- a/common/src/app/common/types/shape.cljc +++ b/common/src/app/common/types/shape.cljc @@ -19,6 +19,7 @@ [app.common.schema.generators :as sg] [app.common.transit :as t] [app.common.types.color :as ctc] + [app.common.types.shape.impl :as impl] [app.common.types.grid :as ctg] [app.common.types.plugins :as ctpg] [app.common.types.shape.attrs :refer [default-color]] @@ -36,7 +37,7 @@ (defn shape? [o] - (instance? Shape o)) + (impl/shape? o)) (def stroke-caps-line #{:round :square}) (def stroke-caps-marker #{:line-arrow :triangle-arrow :square-marker :circle-marker :diamond-marker}) @@ -244,7 +245,7 @@ (defn- decode-shape [o] (if (map? o) - (map->Shape o) + (impl/map->Shape o) o)) (defn- shape-generator @@ -268,7 +269,7 @@ (= type :bool)) (merge attrs1 shape attrs3) (merge attrs1 shape attrs2 attrs3))))) - (sg/fmap map->Shape))) + (sg/fmap impl/map->Shape))) (def schema:shape [:and {:title "Shape" @@ -472,7 +473,7 @@ :rotation 0) :always - (map->Shape)))) + (impl/map->Shape)))) (defn setup-rect "Initializes the selrect and points for a shape." @@ -527,17 +528,3 @@ (assoc :transform-inverse (gmt/matrix))) (gpr/setup-proportions)))) -;; --- SHAPE SERIALIZATION - -(t/add-handlers! - {:id "shape" - :class Shape - :wfn #(into {} %) - :rfn map->Shape}) - -#?(:clj - (fres/add-handlers! - {:name "penpot/shape" - :class Shape - :wfn fres/write-map-like - :rfn (comp map->Shape fres/read-map-like)})) diff --git a/common/src/app/common/types/shape/impl.cljc b/common/src/app/common/types/shape/impl.cljc new file mode 100644 index 000000000..3dc75c498 --- /dev/null +++ b/common/src/app/common/types/shape/impl.cljc @@ -0,0 +1,228 @@ +;; This Source Code Form is subject to the terms of the Mozilla Public +;; License, v. 2.0. If a copy of the MPL was not distributed with this +;; file, You can obtain one at http://mozilla.org/MPL/2.0/. +;; +;; Copyright (c) KALEIDOS INC + +(ns app.common.types.shape.impl + (:require + #?(:clj [app.common.fressian :as fres]) + [app.common.colors :as clr] + [app.common.data :as d] + [app.common.data.macros :as dm] + [app.common.record :as cr] + [app.common.schema :as sm] + [app.common.schema.generators :as sg] + [app.common.transit :as t] + [app.common.uuid :as uuid] + [app.common.geom.rect :as grc] + [cuerdas.core :as str] + [clojure.core :as c] + [clojure.set :as set])) + +(def ArrayBuffer js/ArrayBuffer) +(def Float32Array js/Float32Array) + +(cr/defrecord Shape [id name type x y width height rotation selrect points + transform transform-inverse parent-id frame-id flip-x flip-y]) + +(declare ^:private clone-f32-array) +(declare ^:private impl-assoc) +(declare ^:private impl-conj) +(declare ^:private impl-dissoc) +(declare ^:private read-selrect) +(declare ^:private write-selrect) + +;; TODO: implement lazy MapEntry + +#?(:cljs + (deftype ShapeWithBuffer [buffer delegate] + Object + (toString [coll] + (str "{" (str/join ", " (for [[k v] coll] (str k " " v))) "}")) + + (equiv [this other] + (-equiv this other)) + + ;; ICloneable + ;; (-clone [_] + ;; (let [bf32 (clone-float32-array buffer)] + ;; (ShapeWithBuffer. bf32 delegate))) + + IWithMeta + (-with-meta [coll meta] + (ShapeWithBuffer. buffer (with-meta delegate meta))) + + IMeta + (-meta [coll] (meta delegate)) + + ICollection + (-conj [coll entry] + (impl-conj coll entry)) + + IEquiv + (-equiv [coll other] + (c/equiv-map coll other)) + + IHash + (-hash [coll] (hash (into {} coll))) + + ISequential + + ISeqable + (-seq [coll] + (cons (find coll :selrect) + (seq delegate))) + + ICounted + (-count [coll] + (+ 1 (count delegate))) + + ILookup + (-lookup [coll k] + (-lookup coll k nil)) + + (-lookup [coll k not-found] + (if (= k :selrect) + (read-selrect buffer) + (c/-lookup delegate k not-found))) + + IFind + (-find [coll k] + (if (= k :selrect) + (c/MapEntry. k (read-selrect buffer) nil) ; Replace with lazy MapEntry + (c/-find delegate k))) + + IAssociative + (-assoc [coll k v] + (impl-assoc coll k v)) + + (-contains-key? [coll k] + (or (= k :selrect) + (contains? delegate k))) + + IMap + (-dissoc [coll k] + (impl-dissoc coll k)) + + IFn + (-invoke [coll k] + (-lookup coll k)) + + (-invoke [coll k not-found] + (-lookup coll k not-found)) + + IPrintWithWriter + (-pr-writer [coll writer opts] + (-write writer (str "#penpot/shape " (:id delegate)))))) + +(defn shape? + [o] + (or (instance? Shape o) + (instance? ShapeWithBuffer o))) + +;; --- SHAPE IMPL + +#?(:cljs + (defn- clone-f32-array + [^Float32Array src] + (let [copy (new Float32Array (.-length src))] + (.set copy src) + copy))) + +#?(:cljs + (defn- write-selrect + "Write the selrect into the buffer" + [data selrect] + (assert (instance? Float32Array data) "expected instance of float32array") + + (aset data 0 (dm/get-prop selrect :x1)) + (aset data 1 (dm/get-prop selrect :y1)) + (aset data 2 (dm/get-prop selrect :x2)) + (aset data 3 (dm/get-prop selrect :y2)))) + +#?(:cljs + (defn- read-selrect + "Read selrect from internal buffer" + [^Float32Array buffer] + (let [x1 (aget buffer 0) + y1 (aget buffer 1) + x2 (aget buffer 2) + y2 (aget buffer 3)] + (grc/make-rect x1 y1 + (- x2 x1) + (- y2 y1))))) + +#?(:cljs + (defn- impl-assoc + [coll k v] + (if (= k :selrect) + (let [buffer (clone-f32-array (.-buffer coll))] + (write-selrect buffer v) + (ShapeWithBuffer. buffer (.-delegate coll))) + + (let [delegate (.-delegate coll) + delegate' (assoc delegate k v)] + (if (identical? delegate' delegate) + coll + (let [buffer (clone-f32-array (.-buffer coll))] + (ShapeWithBuffer. buffer delegate'))))))) + +#?(:cljs + (defn- impl-dissoc + [coll k] + (let [delegate (.-delegate coll) + delegate' (dissoc delegate k)] + (if (identical? delegate delegate') + coll + (let [buffer (clone-f32-array (.-buffer coll))] + (ShapeWithBuffer. buffer delegate')))))) + +#?(:cljs + (defn- impl-conj + [coll entry] + (if (vector? entry) + (-assoc coll (-nth entry 0) (-nth entry 1)) + (loop [ret coll es (seq entry)] + (if (nil? es) + ret + (let [e (first es)] + (if (vector? e) + (recur (-assoc ret (-nth e 0) (-nth e 1)) + (next es)) + (throw (js/Error. "conj on a map takes map entries or seqables of map entries"))))))))) + + +#?(:cljs + (defn create-shape + "Instanciate a shape from a map" + [data] + (let [selrect (:selrect data) + buffer (new Float32Array 4)] + (write-selrect buffer selrect) + (ShapeWithBuffer. buffer (dissoc data :selrect))))) + +;; --- SHAPE SERIALIZATION + +(t/add-handlers! + {:id "shape" + :class Shape + :wfn #(into {} %) + :rfn #?(:cljs create-shape + :clj map->Shape)}) + +(t/add-handlers! + {:id "shape" + :class ShapeWithBuffer + :wfn #(into {} %) + :rfn #?(:cljs create-shape + :clj map->Shape)}) + + + +#?(:clj + (fres/add-handlers! + {:name "penpot/shape" + :class Shape + :wfn fres/write-map-like + :rfn (comp map->Shape fres/read-map-like)})) diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index 4bf48ddd0..a83e45973 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -276,18 +276,20 @@ (when ^boolean render.wasm/enabled? (mf/with-effect [] - (when-let [canvas (mf/ref-val canvas-ref)] + (time (when-let [canvas (mf/ref-val canvas-ref)] (->> render.wasm/module (p/fmap (fn [ready?] (when ready? (mf/set-ref-val! canvas-init true) (render.wasm/assign-canvas canvas))))) (fn [] - (render.wasm/clear-canvas)))) + (render.wasm/clear-canvas))))) - (mf/with-effect [vbox' base-objects] - (when (mf/ref-val canvas-init) - (render.wasm/draw-objects base-objects zoom vbox')))) + (mf/with-effect [vbox objects-modified] + (let [sem (when (mf/ref-val canvas-init) + (render.wasm/draw-objects objects-modified zoom vbox))] + (partial render.wasm/cancel-draw sem))) + ) (hooks/setup-dom-events zoom disable-paste in-viewport? read-only? drawing-tool drawing-path?) (hooks/setup-viewport-size vport viewport-ref) diff --git a/frontend/src/app/render_wasm.cljs b/frontend/src/app/render_wasm.cljs index afb3038ba..197d0d9b2 100644 --- a/frontend/src/app/render_wasm.cljs +++ b/frontend/src/app/render_wasm.cljs @@ -17,7 +17,8 @@ (defonce ^:dynamic internal-module #js {}) (defonce ^:dynamic internal-gpu-state #js {}) -(defn draw-objects [objects zoom vbox] +(defn draw-objects + [objects zoom vbox] (let [draw-rect (unchecked-get internal-module "_draw_rect") translate (unchecked-get internal-module "_translate") reset-canvas (unchecked-get internal-module "_reset_canvas") @@ -35,17 +36,24 @@ (translate gpu-state (- x) (- y))) (run! (fn [shape] + ;; (js/console.log "render-shape" (.-buffer shape)) (let [selrect (dm/get-prop shape :selrect) x1 (dm/get-prop selrect :x1) y1 (dm/get-prop selrect :y1) x2 (dm/get-prop selrect :x2) y2 (dm/get-prop selrect :y2)] + ;; (prn (:id shape) selrect) (draw-rect gpu-state x1 y1 x2 y2))) (vals objects)) (flush gpu-state))))) -(def canvas-options +(defn cancel-draw + [sem] + (when (some? sem) + (js/cancelAnimationFrame sem))) + +(def ^:private canvas-options #js {:antialias true :depth true :stencil true diff --git a/frontend/src/debug.cljs b/frontend/src/debug.cljs index d758c09d4..c7c06dfc2 100644 --- a/frontend/src/debug.cljs +++ b/frontend/src/debug.cljs @@ -181,10 +181,12 @@ [state name] (let [page-id (get state :current-page-id) objects (get-in state [:workspace-data :pages-index page-id :objects]) - result (or (d/seek (fn [[_ shape]] (= name (:name shape))) objects) + result (or (d/seek (fn [shape] (= name (:name shape))) (vals objects)) (get objects (uuid/uuid name)))] - (logjs name result) - nil)) + #_(logjs name result) + result + + #_nil)) (defn ^:export dump-object [name] From 29e0964ebc0a22bc9f31dc504e3eed402d18b34e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bel=C3=A9n=20Albeza?= Date: Fri, 25 Oct 2024 12:10:59 +0200 Subject: [PATCH 2/4] :recycle: Refactor rust/wasm code organization --- render-wasm/src/main.rs | 99 ++++----------------------------------- render-wasm/src/render.rs | 86 ++++++++++++++++++++++++++++++++++ 2 files changed, 94 insertions(+), 91 deletions(-) create mode 100644 render-wasm/src/render.rs diff --git a/render-wasm/src/main.rs b/render-wasm/src/main.rs index bbef6bdf2..3690c6c2f 100644 --- a/render-wasm/src/main.rs +++ b/render-wasm/src/main.rs @@ -1,97 +1,14 @@ -use skia_safe::gpu::{self, gl::FramebufferInfo, DirectContext}; -use std::boxed::Box; +pub mod render; use skia_safe as skia; -extern "C" { - pub fn emscripten_GetProcAddress( - name: *const ::std::os::raw::c_char, - ) -> *const ::std::os::raw::c_void; -} - -struct GpuState { - context: DirectContext, - framebuffer_info: FramebufferInfo, -} - -/// This struct holds the state of the Rust application between JS calls. -/// -/// It is created by [init] and passed to the other exported functions. Note that rust-skia data -/// structures are not thread safe, so a state must not be shared between different Web Workers. -pub struct State { - gpu_state: GpuState, - surface: skia::Surface, -} - -impl State { - fn new(gpu_state: GpuState, surface: skia::Surface) -> Self { - State { gpu_state, surface } - } - - fn set_surface(&mut self, surface: skia::Surface) { - self.surface = surface; - } -} - -fn init_gl() { - unsafe { - gl::load_with(|addr| { - let addr = std::ffi::CString::new(addr).unwrap(); - emscripten_GetProcAddress(addr.into_raw() as *const _) as *const _ - }); - } -} - -/// This needs to be done once per WebGL context. -fn create_gpu_state() -> GpuState { - let interface = skia_safe::gpu::gl::Interface::new_native().unwrap(); - let context = skia_safe::gpu::direct_contexts::make_gl(interface, None).unwrap(); - let framebuffer_info = { - let mut fboid: gl::types::GLint = 0; - unsafe { gl::GetIntegerv(gl::FRAMEBUFFER_BINDING, &mut fboid) }; - - FramebufferInfo { - fboid: fboid.try_into().unwrap(), - format: skia_safe::gpu::gl::Format::RGBA8.into(), - protected: skia_safe::gpu::Protected::No, - } - }; - - GpuState { - context, - framebuffer_info, - } -} - -/// Create the Skia surface that will be used for rendering. -fn create_surface(gpu_state: &mut GpuState, width: i32, height: i32) -> skia::Surface { - let backend_render_target = - gpu::backend_render_targets::make_gl((width, height), 1, 8, gpu_state.framebuffer_info); - - gpu::surfaces::wrap_backend_render_target( - &mut gpu_state.context, - &backend_render_target, - skia_safe::gpu::SurfaceOrigin::BottomLeft, - skia_safe::ColorType::RGBA8888, - None, - None, - ) - .unwrap() -} - -fn render_rect(surface: &mut skia::Surface, rect: skia::Rect, color: skia::Color) { - let mut paint = skia::Paint::default(); - paint.set_style(skia::PaintStyle::Fill); - paint.set_color(color); - paint.set_anti_alias(true); - surface.canvas().draw_rect(rect, &paint); -} +use render::State; /// This is called from JS after the WebGL context has been created. #[no_mangle] -pub extern "C" fn init(width: i32, height: i32) -> Box { - let mut gpu_state = create_gpu_state(); - let surface = create_surface(&mut gpu_state, width, height); +pub extern "C" fn init(width: i32, height: i32) -> Box { + let mut gpu_state = render::create_gpu_state(); + let surface = render::create_surface(&mut gpu_state, width, height); let state = State::new(gpu_state, surface); @@ -103,7 +20,7 @@ pub extern "C" fn init(width: i32, height: i32) -> Box { #[no_mangle] pub unsafe extern "C" fn resize_surface(state: *mut State, width: i32, height: i32) { let state = unsafe { state.as_mut() }.expect("got an invalid state pointer"); - let surface = create_surface(&mut state.gpu_state, width, height); + let surface = render::create_surface(&mut state.gpu_state, width, height); state.set_surface(surface); } @@ -113,7 +30,7 @@ pub unsafe extern "C" fn resize_surface(state: *mut State, width: i32, height: i pub unsafe extern "C" fn draw_rect(state: *mut State, x1: f32, y1: f32, x2: f32, y2: f32) { let state = unsafe { state.as_mut() }.expect("got an invalid state pointer"); let r = skia::Rect::new(x1, y1, x2, y2); - render_rect(&mut state.surface, r, skia::Color::RED); + render::render_rect(&mut state.surface, r, skia::Color::RED); } #[no_mangle] @@ -144,5 +61,5 @@ pub unsafe extern "C" fn reset_canvas(state: *mut State) { } fn main() { - init_gl(); + render::init_gl(); } diff --git a/render-wasm/src/render.rs b/render-wasm/src/render.rs new file mode 100644 index 000000000..8046d0776 --- /dev/null +++ b/render-wasm/src/render.rs @@ -0,0 +1,86 @@ +use skia_safe as skia; +use skia_safe::gpu::{self, gl::FramebufferInfo, DirectContext}; + +extern "C" { + pub fn emscripten_GetProcAddress( + name: *const ::std::os::raw::c_char, + ) -> *const ::std::os::raw::c_void; +} + +pub struct GpuState { + pub context: DirectContext, + framebuffer_info: FramebufferInfo, +} + +/// This struct holds the state of the Rust application between JS calls. +/// +/// It is created by [init] and passed to the other exported functions. Note that rust-skia data +/// structures are not thread safe, so a state must not be shared between different Web Workers. +pub struct State { + pub gpu_state: GpuState, + pub surface: skia::Surface, +} + +impl State { + pub fn new(gpu_state: GpuState, surface: skia::Surface) -> Self { + State { gpu_state, surface } + } + + pub fn set_surface(&mut self, surface: skia::Surface) { + self.surface = surface; + } +} + +pub(crate) fn init_gl() { + unsafe { + gl::load_with(|addr| { + let addr = std::ffi::CString::new(addr).unwrap(); + emscripten_GetProcAddress(addr.into_raw() as *const _) as *const _ + }); + } +} + +/// This needs to be done once per WebGL context. +pub(crate) fn create_gpu_state() -> GpuState { + let interface = skia_safe::gpu::gl::Interface::new_native().unwrap(); + let context = skia_safe::gpu::direct_contexts::make_gl(interface, None).unwrap(); + let framebuffer_info = { + let mut fboid: gl::types::GLint = 0; + unsafe { gl::GetIntegerv(gl::FRAMEBUFFER_BINDING, &mut fboid) }; + + FramebufferInfo { + fboid: fboid.try_into().unwrap(), + format: skia_safe::gpu::gl::Format::RGBA8.into(), + protected: skia_safe::gpu::Protected::No, + } + }; + + GpuState { + context, + framebuffer_info, + } +} + +/// Create the Skia surface that will be used for rendering. +pub(crate) fn create_surface(gpu_state: &mut GpuState, width: i32, height: i32) -> skia::Surface { + let backend_render_target = + gpu::backend_render_targets::make_gl((width, height), 1, 8, gpu_state.framebuffer_info); + + gpu::surfaces::wrap_backend_render_target( + &mut gpu_state.context, + &backend_render_target, + skia_safe::gpu::SurfaceOrigin::BottomLeft, + skia_safe::ColorType::RGBA8888, + None, + None, + ) + .unwrap() +} + +pub(crate) fn render_rect(surface: &mut skia::Surface, rect: skia::Rect, color: skia::Color) { + let mut paint = skia::Paint::default(); + paint.set_style(skia::PaintStyle::Fill); + paint.set_color(color); + paint.set_anti_alias(true); + surface.canvas().draw_rect(rect, &paint); +} From 4623f36042f6a174402167ed6c8d047ee917d5fb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bel=C3=A9n=20Albeza?= Date: Fri, 25 Oct 2024 15:00:57 +0200 Subject: [PATCH 3/4] :sparkles: Write shapes directly to wasm memory --- common/src/app/common/geom/rect.cljc | 20 +-- common/src/app/common/record.cljc | 44 +++--- common/src/app/common/types/shape.cljc | 2 +- common/src/app/common/types/shape/impl.cljc | 126 +++++++++--------- .../app/main/data/workspace/selection.cljs | 2 +- .../src/app/main/ui/workspace/viewport.cljs | 29 ++-- frontend/src/app/render_wasm.cljs | 51 +++---- render-wasm/src/main.rs | 20 +++ render-wasm/src/shapes.rs | 31 +++++ 9 files changed, 186 insertions(+), 139 deletions(-) create mode 100644 render-wasm/src/shapes.rs diff --git a/common/src/app/common/geom/rect.cljc b/common/src/app/common/geom/rect.cljc index 3308b9256..b18befe6c 100644 --- a/common/src/app/common/geom/rect.cljc +++ b/common/src/app/common/geom/rect.cljc @@ -158,22 +158,22 @@ y (dm/get-prop rect :y) w (dm/get-prop rect :width) h (dm/get-prop rect :height)] - (rc/assoc! rect - :x1 x - :y1 y - :x2 (+ x w) - :y2 (+ y h))) + (assoc rect + :x1 x + :y1 y + :x2 (+ x w) + :y2 (+ y h))) :corners (let [x1 (dm/get-prop rect :x1) y1 (dm/get-prop rect :y1) x2 (dm/get-prop rect :x2) y2 (dm/get-prop rect :y2)] - (rc/assoc! rect - :x (mth/min x1 x2) - :y (mth/min y1 y2) - :width (mth/abs (- x2 x1)) - :height (mth/abs (- y2 y1)))))) + (assoc rect + :x (mth/min x1 x2) + :y (mth/min y1 y2) + :width (mth/abs (- x2 x1)) + :height (mth/abs (- y2 y1)))))) (defn close-rect? [rect1 rect2] diff --git a/common/src/app/common/record.cljc b/common/src/app/common/record.cljc index cbb9fa006..385917a0a 100644 --- a/common/src/app/common/record.cljc +++ b/common/src/app/common/record.cljc @@ -403,30 +403,30 @@ nil))) ~rsym))) -;; (defmacro clone -;; [ssym] -;; (if (:ns &env) -;; `(cljs.core/clone ~ssym) -;; ssym)) +(defmacro clone + [ssym] + (if (:ns &env) + `(cljs.core/clone ~ssym) + ssym)) -;; (defmacro assoc! -;; "A record specific update operation" -;; [ssym & pairs] -;; (if (:ns &env) -;; (let [pairs (partition-all 2 pairs)] -;; `(-> ~ssym -;; ~@(map (fn [[ks vs]] -;; `(cljs.core/-assoc! ~ks ~vs)) -;; pairs))) -;; `(assoc ~ssym ~@pairs))) +(defmacro assoc! + "A record specific update operation" + [ssym & pairs] + (if (:ns &env) + (let [pairs (partition-all 2 pairs)] + `(-> ~ssym + ~@(map (fn [[ks vs]] + `(cljs.core/-assoc! ~ks ~vs)) + pairs))) + `(assoc ~ssym ~@pairs))) -;; (defmacro update! -;; "A record specific update operation" -;; [ssym ksym f & params] -;; (if (:ns &env) -;; (let [ssym (with-meta ssym {:tag 'js})] -;; `(cljs.core/assoc! ~ssym ~ksym (~f (. ~ssym ~(property-symbol ksym)) ~@params))) -;; `(update ~ssym ~ksym ~f ~@params))) +(defmacro update! + "A record specific update operation" + [ssym ksym f & params] + (if (:ns &env) + (let [ssym (with-meta ssym {:tag 'js})] + `(cljs.core/assoc! ~ssym ~ksym (~f (. ~ssym ~(property-symbol ksym)) ~@params))) + `(update ~ssym ~ksym ~f ~@params))) (defmacro define-properties! "Define properties in the prototype with `.defineProperty`" diff --git a/common/src/app/common/types/shape.cljc b/common/src/app/common/types/shape.cljc index 9b13bdad1..707126c98 100644 --- a/common/src/app/common/types/shape.cljc +++ b/common/src/app/common/types/shape.cljc @@ -19,12 +19,12 @@ [app.common.schema.generators :as sg] [app.common.transit :as t] [app.common.types.color :as ctc] - [app.common.types.shape.impl :as impl] [app.common.types.grid :as ctg] [app.common.types.plugins :as ctpg] [app.common.types.shape.attrs :refer [default-color]] [app.common.types.shape.blur :as ctsb] [app.common.types.shape.export :as ctse] + [app.common.types.shape.impl :as impl] [app.common.types.shape.interactions :as ctsi] [app.common.types.shape.layout :as ctsl] [app.common.types.shape.path :as ctsp] diff --git a/common/src/app/common/types/shape/impl.cljc b/common/src/app/common/types/shape/impl.cljc index 3dc75c498..331b4e99d 100644 --- a/common/src/app/common/types/shape/impl.cljc +++ b/common/src/app/common/types/shape/impl.cljc @@ -10,18 +10,20 @@ [app.common.colors :as clr] [app.common.data :as d] [app.common.data.macros :as dm] + [app.common.geom.rect :as grc] [app.common.record :as cr] [app.common.schema :as sm] [app.common.schema.generators :as sg] [app.common.transit :as t] [app.common.uuid :as uuid] - [app.common.geom.rect :as grc] - [cuerdas.core :as str] [clojure.core :as c] - [clojure.set :as set])) + [clojure.set :as set] + [cuerdas.core :as str])) -(def ArrayBuffer js/ArrayBuffer) -(def Float32Array js/Float32Array) +#?(:cljs + (do + (def ArrayBuffer js/ArrayBuffer) + (def Float32Array js/Float32Array))) (cr/defrecord Shape [id name type x y width height rotation selrect points transform transform-inverse parent-id frame-id flip-x flip-y]) @@ -49,77 +51,77 @@ ;; (let [bf32 (clone-float32-array buffer)] ;; (ShapeWithBuffer. bf32 delegate))) - IWithMeta - (-with-meta [coll meta] - (ShapeWithBuffer. buffer (with-meta delegate meta))) + IWithMeta + (-with-meta [coll meta] + (ShapeWithBuffer. buffer (with-meta delegate meta))) - IMeta - (-meta [coll] (meta delegate)) + IMeta + (-meta [coll] (meta delegate)) - ICollection - (-conj [coll entry] - (impl-conj coll entry)) + ICollection + (-conj [coll entry] + (impl-conj coll entry)) - IEquiv - (-equiv [coll other] - (c/equiv-map coll other)) + IEquiv + (-equiv [coll other] + (c/equiv-map coll other)) - IHash - (-hash [coll] (hash (into {} coll))) + IHash + (-hash [coll] (hash (into {} coll))) - ISequential + ISequential - ISeqable - (-seq [coll] - (cons (find coll :selrect) - (seq delegate))) + ISeqable + (-seq [coll] + (cons (find coll :selrect) + (seq delegate))) - ICounted - (-count [coll] - (+ 1 (count delegate))) + ICounted + (-count [coll] + (+ 1 (count delegate))) - ILookup - (-lookup [coll k] - (-lookup coll k nil)) + ILookup + (-lookup [coll k] + (-lookup coll k nil)) - (-lookup [coll k not-found] - (if (= k :selrect) - (read-selrect buffer) - (c/-lookup delegate k not-found))) + (-lookup [coll k not-found] + (if (= k :selrect) + (read-selrect buffer) + (c/-lookup delegate k not-found))) - IFind - (-find [coll k] - (if (= k :selrect) - (c/MapEntry. k (read-selrect buffer) nil) ; Replace with lazy MapEntry - (c/-find delegate k))) + IFind + (-find [coll k] + (if (= k :selrect) + (c/MapEntry. k (read-selrect buffer) nil) ; Replace with lazy MapEntry + (c/-find delegate k))) - IAssociative - (-assoc [coll k v] - (impl-assoc coll k v)) + IAssociative + (-assoc [coll k v] + (impl-assoc coll k v)) - (-contains-key? [coll k] - (or (= k :selrect) - (contains? delegate k))) + (-contains-key? [coll k] + (or (= k :selrect) + (contains? delegate k))) - IMap - (-dissoc [coll k] - (impl-dissoc coll k)) + IMap + (-dissoc [coll k] + (impl-dissoc coll k)) - IFn - (-invoke [coll k] - (-lookup coll k)) + IFn + (-invoke [coll k] + (-lookup coll k)) - (-invoke [coll k not-found] - (-lookup coll k not-found)) + (-invoke [coll k not-found] + (-lookup coll k not-found)) - IPrintWithWriter - (-pr-writer [coll writer opts] - (-write writer (str "#penpot/shape " (:id delegate)))))) + IPrintWithWriter + (-pr-writer [coll writer opts] + (-write writer (str "#penpot/shape " (:id delegate)))))) (defn shape? [o] (or (instance? Shape o) - (instance? ShapeWithBuffer o))) + #?(:cljs (instance? ShapeWithBuffer o)))) ;; --- SHAPE IMPL @@ -211,12 +213,12 @@ :rfn #?(:cljs create-shape :clj map->Shape)}) -(t/add-handlers! - {:id "shape" - :class ShapeWithBuffer - :wfn #(into {} %) - :rfn #?(:cljs create-shape - :clj map->Shape)}) +#?(:cljs (t/add-handlers! + {:id "shape" + :class ShapeWithBuffer + :wfn #(into {} %) + :rfn #?(:cljs create-shape + :clj map->Shape)})) diff --git a/frontend/src/app/main/data/workspace/selection.cljs b/frontend/src/app/main/data/workspace/selection.cljs index 1f29cbcc3..f0210cf53 100644 --- a/frontend/src/app/main/data/workspace/selection.cljs +++ b/frontend/src/app/main/data/workspace/selection.cljs @@ -72,7 +72,7 @@ (cr/update! :x2 + (:x delta)) (cr/update! :y2 + (:y delta))) selrect (if ^boolean space? - (-> selrect + (-> (cr/clone selrect) (cr/update! :x1 + (:x delta)) (cr/update! :y1 + (:y delta))) selrect)] diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index a83e45973..1170068a2 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -134,13 +134,13 @@ hover-top-frame-id (mf/use-state nil) frame-hover (mf/use-state nil) active-frames (mf/use-state #{}) + canvas-init? (mf/use-state false) ;; REFS [viewport-ref on-viewport-ref] (create-viewport-ref) canvas-ref (mf/use-ref nil) - canvas-init (mf/use-ref false) ;; VARS disable-paste (mf/use-var false) @@ -277,19 +277,22 @@ (when ^boolean render.wasm/enabled? (mf/with-effect [] (time (when-let [canvas (mf/ref-val canvas-ref)] - (->> render.wasm/module - (p/fmap (fn [ready?] - (when ready? - (mf/set-ref-val! canvas-init true) - (render.wasm/assign-canvas canvas))))) - (fn [] - (render.wasm/clear-canvas))))) + (->> render.wasm/module + (p/fmap (fn [ready?] + (when ready? + (reset! canvas-init? true) + (render.wasm/assign-canvas canvas))))) + (fn [] + (render.wasm/clear-canvas))))) - (mf/with-effect [vbox objects-modified] - (let [sem (when (mf/ref-val canvas-init) - (render.wasm/draw-objects objects-modified zoom vbox))] - (partial render.wasm/cancel-draw sem))) - ) + (mf/with-effect [objects-modified canvas-init?] + (when @canvas-init? + (render.wasm/set-objects objects-modified) + (render.wasm/draw-objects zoom vbox))) + (mf/with-effect [vbox canvas-init?] + (let [frame-id (when @canvas-init? (do + (render.wasm/draw-objects zoom vbox)))] + (partial render.wasm/cancel-draw frame-id)))) (hooks/setup-dom-events zoom disable-paste in-viewport? read-only? drawing-tool drawing-path?) (hooks/setup-viewport-size vport viewport-ref) diff --git a/frontend/src/app/render_wasm.cljs b/frontend/src/app/render_wasm.cljs index 197d0d9b2..045d6973b 100644 --- a/frontend/src/app/render_wasm.cljs +++ b/frontend/src/app/render_wasm.cljs @@ -8,6 +8,7 @@ "A WASM based render API" (:require [app.common.data.macros :as dm] + [app.common.files.helpers :as cfh] [app.config :as cf] [promesa.core :as p])) @@ -17,41 +18,31 @@ (defonce ^:dynamic internal-module #js {}) (defonce ^:dynamic internal-gpu-state #js {}) -(defn draw-objects - [objects zoom vbox] - (let [draw-rect (unchecked-get internal-module "_draw_rect") - translate (unchecked-get internal-module "_translate") - reset-canvas (unchecked-get internal-module "_reset_canvas") - scale (unchecked-get internal-module "_scale") - flush (unchecked-get internal-module "_flush") - gpu-state internal-gpu-state] +(defn set-objects [objects] + (let [shapes-buffer (unchecked-get internal-module "_shapes_buffer") + heap (unchecked-get internal-module "HEAPF32") + ;; size *in bytes* for each shapes::Shape + rect-size 16 + ;; TODO: remove the `take` once we have the dynamic data structure in Rust + supported-shapes (take 2048 (filter #(not (cfh/root? %)) (vals objects))) + mem (js/Float32Array. (.-buffer heap) (shapes-buffer) (* rect-size (count supported-shapes)))] + (run! (fn [[shape index]] + (.set mem (.-buffer shape) (* index rect-size))) + (zipmap supported-shapes (range))))) +(defn draw-objects + [zoom vbox] + (let [draw-all-shapes (unchecked-get internal-module "_draw_all_shapes")] (js/requestAnimationFrame (fn [] - (reset-canvas gpu-state) - (scale gpu-state zoom zoom) - - (let [x (dm/get-prop vbox :x) - y (dm/get-prop vbox :y)] - (translate gpu-state (- x) (- y))) - - (run! (fn [shape] - ;; (js/console.log "render-shape" (.-buffer shape)) - (let [selrect (dm/get-prop shape :selrect) - x1 (dm/get-prop selrect :x1) - y1 (dm/get-prop selrect :y1) - x2 (dm/get-prop selrect :x2) - y2 (dm/get-prop selrect :y2)] - ;; (prn (:id shape) selrect) - (draw-rect gpu-state x1 y1 x2 y2))) - (vals objects)) - - (flush gpu-state))))) + (let [pan-x (- (dm/get-prop vbox :x)) + pan-y (- (dm/get-prop vbox :y))] + (draw-all-shapes internal-gpu-state zoom pan-x pan-y)))))) (defn cancel-draw - [sem] - (when (some? sem) - (js/cancelAnimationFrame sem))) + [frame-id] + (when (some? frame-id) + (js/cancelAnimationFrame frame-id))) (def ^:private canvas-options #js {:antialias true diff --git a/render-wasm/src/main.rs b/render-wasm/src/main.rs index 3690c6c2f..408d95fe9 100644 --- a/render-wasm/src/main.rs +++ b/render-wasm/src/main.rs @@ -1,4 +1,5 @@ pub mod render; +pub mod shapes; use skia_safe as skia; @@ -33,6 +34,19 @@ pub unsafe extern "C" fn draw_rect(state: *mut State, x1: f32, y1: f32, x2: f32, render::render_rect(&mut state.surface, r, skia::Color::RED); } +#[no_mangle] +pub unsafe extern "C" fn draw_all_shapes(state: *mut State, zoom: f32, pan_x: f32, pan_y: f32) { + let state = unsafe { state.as_mut() }.expect("got an invalid state pointer"); + + reset_canvas(state); + scale(state, zoom, zoom); + translate(state, pan_x, pan_y); + + shapes::draw_all(state); + + flush(state); +} + #[no_mangle] pub unsafe extern "C" fn flush(state: *mut State) { let state = unsafe { state.as_mut() }.expect("got an invalid state pointer"); @@ -60,6 +74,12 @@ pub unsafe extern "C" fn reset_canvas(state: *mut State) { flush(state); } +#[no_mangle] +pub unsafe extern "C" fn shapes_buffer() -> *mut shapes::Shape { + let ptr = shapes::SHAPES_BUFFER.as_mut_ptr(); + return ptr; +} + fn main() { render::init_gl(); } diff --git a/render-wasm/src/shapes.rs b/render-wasm/src/shapes.rs new file mode 100644 index 000000000..891267620 --- /dev/null +++ b/render-wasm/src/shapes.rs @@ -0,0 +1,31 @@ +use crate::render::{render_rect, State}; +use skia_safe as skia; + +#[derive(Debug, Clone, Copy)] +pub struct Selrect { + pub x1: f32, + pub y1: f32, + pub x2: f32, + pub y2: f32, +} + +pub type Shape = Selrect; // temp + +pub static mut SHAPES_BUFFER: [Shape; 2048] = [Selrect { + x1: 0.0, + y1: 0.0, + x2: 0.0, + y2: 0.0, +}; 2048]; + +pub(crate) fn draw_all(state: &mut State) { + let shapes; + unsafe { + shapes = SHAPES_BUFFER.iter(); + } + + for shape in shapes { + let r = skia::Rect::new(shape.x1, shape.y1, shape.x2, shape.y2); + render_rect(&mut state.surface, r, skia::Color::RED); + } +} From 96bb282674dbdf192940e41f624343af6b2f9f90 Mon Sep 17 00:00:00 2001 From: Alejandro Alonso Date: Tue, 29 Oct 2024 09:15:24 +0100 Subject: [PATCH 4/4] :sparkles: Fix many corner issues related to shape data structure change --- common/src/app/common/files/migrations.cljc | 2 +- common/src/app/common/geom/rect.cljc | 1 + .../app/common/geom/shapes/transforms.cljc | 1 - common/src/app/common/types/shape.cljc | 42 +++++------ common/src/app/common/types/shape/impl.cljc | 73 +++++++++---------- .../app/main/data/workspace/selection.cljs | 15 ++-- .../app/main/ui/workspace/shapes/common.cljs | 18 +---- .../src/app/main/ui/workspace/viewport.cljs | 22 +++--- frontend/src/app/render_wasm.cljs | 58 +++++++++++---- 9 files changed, 125 insertions(+), 107 deletions(-) diff --git a/common/src/app/common/files/migrations.cljc b/common/src/app/common/files/migrations.cljc index 2b6c4b450..2a0c0d184 100644 --- a/common/src/app/common/files/migrations.cljc +++ b/common/src/app/common/files/migrations.cljc @@ -499,7 +499,7 @@ object (-> object (update :selrect grc/make-rect) - (cts/map->Shape)))) + (cts/create-shape)))) (update-container [container] (d/update-when container :objects update-vals update-object))] (-> data diff --git a/common/src/app/common/geom/rect.cljc b/common/src/app/common/geom/rect.cljc index b18befe6c..b7d14d542 100644 --- a/common/src/app/common/geom/rect.cljc +++ b/common/src/app/common/geom/rect.cljc @@ -139,6 +139,7 @@ :width (mth/abs (- x2 x1)) :height (mth/abs (- y2 y1)))) + ;; FIXME: looks unused :position (let [x (dm/get-prop rect :x) y (dm/get-prop rect :y) diff --git a/common/src/app/common/geom/shapes/transforms.cljc b/common/src/app/common/geom/shapes/transforms.cljc index c08f06781..079fe1de9 100644 --- a/common/src/app/common/geom/shapes/transforms.cljc +++ b/common/src/app/common/geom/shapes/transforms.cljc @@ -16,7 +16,6 @@ [app.common.geom.shapes.common :as gco] [app.common.geom.shapes.path :as gpa] [app.common.math :as mth] - [app.common.record :as cr] [app.common.types.modifiers :as ctm])) #?(:clj (set! *warn-on-reflection* true)) diff --git a/common/src/app/common/types/shape.cljc b/common/src/app/common/types/shape.cljc index 707126c98..2d0e2ad94 100644 --- a/common/src/app/common/types/shape.cljc +++ b/common/src/app/common/types/shape.cljc @@ -6,7 +6,6 @@ (ns app.common.types.shape (:require - #?(:clj [app.common.fressian :as fres]) [app.common.colors :as clr] [app.common.data :as d] [app.common.geom.matrix :as gmt] @@ -14,10 +13,8 @@ [app.common.geom.proportions :as gpr] [app.common.geom.rect :as grc] [app.common.geom.shapes :as gsh] - [app.common.record :as cr] [app.common.schema :as sm] [app.common.schema.generators :as sg] - [app.common.transit :as t] [app.common.types.color :as ctc] [app.common.types.grid :as ctg] [app.common.types.plugins :as ctpg] @@ -33,8 +30,6 @@ [app.common.uuid :as uuid] [clojure.set :as set])) -(cr/defrecord Shape [id name type x y width height rotation selrect points transform transform-inverse parent-id frame-id flip-x flip-y]) - (defn shape? [o] (impl/shape? o)) @@ -453,27 +448,30 @@ ;; NOTE: used for create ephimeral shapes for multiple selection :multiple minimal-multiple-attrs)) +(defn create-shape + "A low level function that creates a Shape data structure + from a attrs map without performing other transformations" + [attrs] + (impl/create-shape attrs)) + (defn- make-minimal-shape [type] (let [type (if (= type :curve) :path type) - attrs (get-minimal-shape type)] + attrs (get-minimal-shape type) + attrs (cond-> attrs + (and (not= :path type) + (not= :bool type)) + (-> (assoc :x 0) + (assoc :y 0) + (assoc :width 0.01) + (assoc :height 0.01))) + attrs (-> attrs + (assoc :id (uuid/next)) + (assoc :frame-id uuid/zero) + (assoc :parent-id uuid/zero) + (assoc :rotation 0))] - (cond-> attrs - (and (not= :path type) - (not= :bool type)) - (-> (assoc :x 0) - (assoc :y 0) - (assoc :width 0.01) - (assoc :height 0.01)) - - :always - (assoc :id (uuid/next) - :frame-id uuid/zero - :parent-id uuid/zero - :rotation 0) - - :always - (impl/map->Shape)))) + (impl/create-shape attrs))) (defn setup-rect "Initializes the selrect and points for a shape." diff --git a/common/src/app/common/types/shape/impl.cljc b/common/src/app/common/types/shape/impl.cljc index 331b4e99d..11eade8a8 100644 --- a/common/src/app/common/types/shape/impl.cljc +++ b/common/src/app/common/types/shape/impl.cljc @@ -7,18 +7,14 @@ (ns app.common.types.shape.impl (:require #?(:clj [app.common.fressian :as fres]) - [app.common.colors :as clr] - [app.common.data :as d] - [app.common.data.macros :as dm] - [app.common.geom.rect :as grc] + #?(:cljs [app.common.data.macros :as dm]) + #?(:cljs [app.common.geom.rect :as grc]) + #?(:cljs [cuerdas.core :as str]) [app.common.record :as cr] - [app.common.schema :as sm] - [app.common.schema.generators :as sg] [app.common.transit :as t] - [app.common.uuid :as uuid] - [clojure.core :as c] - [clojure.set :as set] - [cuerdas.core :as str])) + [clojure.core :as c])) + +(def enabled-wasm-ready-shape false) #?(:cljs (do @@ -52,11 +48,11 @@ ;; (ShapeWithBuffer. bf32 delegate))) IWithMeta - (-with-meta [coll meta] + (-with-meta [_ meta] (ShapeWithBuffer. buffer (with-meta delegate meta))) IMeta - (-meta [coll] (meta delegate)) + (-meta [_] (meta delegate)) ICollection (-conj [coll entry] @@ -77,20 +73,20 @@ (seq delegate))) ICounted - (-count [coll] + (-count [_] (+ 1 (count delegate))) ILookup (-lookup [coll k] (-lookup coll k nil)) - (-lookup [coll k not-found] + (-lookup [_ k not-found] (if (= k :selrect) (read-selrect buffer) (c/-lookup delegate k not-found))) IFind - (-find [coll k] + (-find [_ k] (if (= k :selrect) (c/MapEntry. k (read-selrect buffer) nil) ; Replace with lazy MapEntry (c/-find delegate k))) @@ -99,7 +95,7 @@ (-assoc [coll k v] (impl-assoc coll k v)) - (-contains-key? [coll k] + (-contains-key? [_ k] (or (= k :selrect) (contains? delegate k))) @@ -115,13 +111,14 @@ (-lookup coll k not-found)) IPrintWithWriter - (-pr-writer [coll writer opts] + (-pr-writer [_ writer _] (-write writer (str "#penpot/shape " (:id delegate)))))) (defn shape? [o] - (or (instance? Shape o) - #?(:cljs (instance? ShapeWithBuffer o)))) + #?(:clj (instance? Shape o) + :cljs (or (instance? Shape o) + (instance? ShapeWithBuffer o)))) ;; --- SHAPE IMPL @@ -194,15 +191,18 @@ (next es)) (throw (js/Error. "conj on a map takes map entries or seqables of map entries"))))))))) +(defn create-shape + "Instanciate a shape from a map" + [attrs] + #?(:cljs + (if enabled-wasm-ready-shape + (let [selrect (:selrect attrs) + buffer (new Float32Array 4)] + (write-selrect buffer selrect) + (ShapeWithBuffer. buffer (dissoc attrs :selrect))) + (map->Shape attrs)) -#?(:cljs - (defn create-shape - "Instanciate a shape from a map" - [data] - (let [selrect (:selrect data) - buffer (new Float32Array 4)] - (write-selrect buffer selrect) - (ShapeWithBuffer. buffer (dissoc data :selrect))))) + :clj (map->Shape attrs))) ;; --- SHAPE SERIALIZATION @@ -210,21 +210,18 @@ {:id "shape" :class Shape :wfn #(into {} %) - :rfn #?(:cljs create-shape - :clj map->Shape)}) - -#?(:cljs (t/add-handlers! - {:id "shape" - :class ShapeWithBuffer - :wfn #(into {} %) - :rfn #?(:cljs create-shape - :clj map->Shape)})) - + :rfn create-shape}) +#?(:cljs + (t/add-handlers! + {:id "shape" + :class ShapeWithBuffer + :wfn #(into {} %) + :rfn create-shape})) #?(:clj (fres/add-handlers! {:name "penpot/shape" :class Shape :wfn fres/write-map-like - :rfn (comp map->Shape fres/read-map-like)})) + :rfn (comp create-shape fres/read-map-like)})) diff --git a/frontend/src/app/main/data/workspace/selection.cljs b/frontend/src/app/main/data/workspace/selection.cljs index f0210cf53..8150ea465 100644 --- a/frontend/src/app/main/data/workspace/selection.cljs +++ b/frontend/src/app/main/data/workspace/selection.cljs @@ -15,7 +15,6 @@ [app.common.geom.rect :as grc] [app.common.geom.shapes :as gsh] [app.common.logic.libraries :as cll] - [app.common.record :as cr] [app.common.types.component :as ctk] [app.common.uuid :as uuid] [app.main.data.changes :as dch] @@ -68,15 +67,15 @@ calculate-selrect (fn [selrect [delta space?]] - (let [selrect (-> (cr/clone selrect) - (cr/update! :x2 + (:x delta)) - (cr/update! :y2 + (:y delta))) + (let [selrect (-> selrect + (update :x2 + (:x delta)) + (update :y2 + (:y delta))) selrect (if ^boolean space? - (-> (cr/clone selrect) - (cr/update! :x1 + (:x delta)) - (cr/update! :y1 + (:y delta))) + (-> selrect + (update :x1 + (:x delta)) + (update :y1 + (:y delta))) selrect)] - (grc/update-rect! selrect :corners))) + (grc/update-rect selrect :corners))) selrect-stream (->> ms/mouse-position diff --git a/frontend/src/app/main/ui/workspace/shapes/common.cljs b/frontend/src/app/main/ui/workspace/shapes/common.cljs index 4af042e87..e09092ca7 100644 --- a/frontend/src/app/main/ui/workspace/shapes/common.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/common.cljs @@ -6,32 +6,20 @@ (ns app.main.ui.workspace.shapes.common (:require - [app.common.record :as cr] [app.main.ui.shapes.shape :refer [shape-container]] [app.main.ui.workspace.shapes.debug :as wsd] [rumext.v2 :as mf])) -(def ^:private excluded-attrs - #{:blocked - :hide-fill-on-export - :collapsed - :remote-synced - :exports}) - -(defn check-shape - [new-shape old-shape] - (cr/-equiv-with-exceptions old-shape new-shape excluded-attrs)) - (defn check-shape-props [np op] - (check-shape (unchecked-get np "shape") - (unchecked-get op "shape"))) + (= (unchecked-get np "shape") + (unchecked-get op "shape"))) (defn generic-wrapper-factory [component] (mf/fnc generic-wrapper {::mf/wrap [#(mf/memo' % check-shape-props)] - ::mf/wrap-props false} + ::mf/props :obj} [props] (let [shape (unchecked-get props "shape")] [:> shape-container {:shape shape} diff --git a/frontend/src/app/main/ui/workspace/viewport.cljs b/frontend/src/app/main/ui/workspace/viewport.cljs index 1170068a2..fb3eb79b3 100644 --- a/frontend/src/app/main/ui/workspace/viewport.cljs +++ b/frontend/src/app/main/ui/workspace/viewport.cljs @@ -261,7 +261,8 @@ (= (:layout selected-frame) :flex) (zero? (:rotation first-shape))) - selecting-first-level-frame? (and single-select? (cfh/root-frame? first-shape)) + selecting-first-level-frame? + (and single-select? (cfh/root-frame? first-shape)) offset-x (if selecting-first-level-frame? (:x first-shape) @@ -276,19 +277,20 @@ (when ^boolean render.wasm/enabled? (mf/with-effect [] - (time (when-let [canvas (mf/ref-val canvas-ref)] - (->> render.wasm/module - (p/fmap (fn [ready?] - (when ready? - (reset! canvas-init? true) - (render.wasm/assign-canvas canvas))))) - (fn [] - (render.wasm/clear-canvas))))) + (when-let [canvas (mf/ref-val canvas-ref)] + (->> render.wasm/module + (p/fmap (fn [ready?] + (when ready? + (reset! canvas-init? true) + (render.wasm/assign-canvas canvas))))) + (fn [] + (render.wasm/clear-canvas)))) (mf/with-effect [objects-modified canvas-init?] (when @canvas-init? (render.wasm/set-objects objects-modified) (render.wasm/draw-objects zoom vbox))) + (mf/with-effect [vbox canvas-init?] (let [frame-id (when @canvas-init? (do (render.wasm/draw-objects zoom vbox)))] @@ -300,6 +302,8 @@ (hooks/setup-keyboard alt? mod? space? z? shift?) (hooks/setup-hover-shapes page-id move-stream base-objects transform selected mod? hover measure-hover hover-ids hover-top-frame-id @hover-disabled? focus zoom show-measures?) + + ;; FIXME: this should be removed on canvas viewport (hooks/setup-viewport-modifiers modifiers base-objects) (hooks/setup-shortcuts node-editing? drawing-path? text-editing? grid-editing?) (hooks/setup-active-frames base-objects hover-ids selected active-frames zoom transform vbox) diff --git a/frontend/src/app/render_wasm.cljs b/frontend/src/app/render_wasm.cljs index 045d6973b..44086efd7 100644 --- a/frontend/src/app/render_wasm.cljs +++ b/frontend/src/app/render_wasm.cljs @@ -9,26 +9,58 @@ (:require [app.common.data.macros :as dm] [app.common.files.helpers :as cfh] + [app.common.types.shape.impl] [app.config :as cf] [promesa.core :as p])) (def enabled? (contains? cf/flags :render-wasm)) -(defonce ^:dynamic internal-module #js {}) -(defonce ^:dynamic internal-gpu-state #js {}) +(set! app.common.types.shape.impl/enabled-wasm-ready-shape enabled?) -(defn set-objects [objects] - (let [shapes-buffer (unchecked-get internal-module "_shapes_buffer") - heap (unchecked-get internal-module "HEAPF32") - ;; size *in bytes* for each shapes::Shape - rect-size 16 - ;; TODO: remove the `take` once we have the dynamic data structure in Rust - supported-shapes (take 2048 (filter #(not (cfh/root? %)) (vals objects))) - mem (js/Float32Array. (.-buffer heap) (shapes-buffer) (* rect-size (count supported-shapes)))] - (run! (fn [[shape index]] - (.set mem (.-buffer shape) (* index rect-size))) - (zipmap supported-shapes (range))))) +(defonce internal-module #js {}) +(defonce internal-gpu-state #js {}) + +;; TODO: remove the `take` once we have the dynamic data structure in Rust +(def xform + (comp + (remove cfh/root?) + (take 2048))) + +;; Size in number of f32 values that represents the shape selrect ( +(def rect-size 4) + +(defn set-objects + [objects] + ;; FIXME: maybe change the name of `_shapes_buffer` (?) + (let [get-shapes-buffer-ptr + (unchecked-get internal-module "_shapes_buffer") + + heap + (unchecked-get internal-module "HEAPF32") + + shapes + (into [] xform (vals objects)) + + total-shapes + (count shapes) + + heap-offset + (get-shapes-buffer-ptr) + + heap-size + (* rect-size total-shapes) + + mem + (js/Float32Array. (.-buffer heap) + heap-offset + heap-size)] + + (loop [index 0] + (when (< index total-shapes) + (let [shape (nth shapes index)] + (.set ^js mem (.-buffer shape) (* index rect-size)) + (recur (inc index))))))) (defn draw-objects [zoom vbox]