wip: draw rect

frontend/render_v2/cpp/Dockerfile

@@ -25,7 +25,7 @@ RUN cd /tmp \
 RUN cd /tmp \
   && git clone 'https://skia.googlesource.com/skia' \
   && cd skia \
-  && git checkout 'chrome/m127'
+  && git checkout 'chrome/m129'
 
 ENV PATH=${PATH}:/tmp/depot_tools
 ENV PATH=${PATH}:/tmp/gn

frontend/render_v2/cpp/Makefile

@@ -31,7 +31,6 @@ all:
 		-DSK_FORCE_AAA \
 		-DSK_FORCE_8_BYTE_ALIGNMENT \
 		-DSK_SHAPER_HARFBUZZ_AVAILABLE \
-		-DCK_INCLUDE_PARAGRAPH \
 		-DCK_SERIALIZE_SKP \
 		-DSK_GANESH \
 		-DSK_DISABLE_LEGACY_SHADERCONTEXT \

frontend/render_v2/cpp/js/preamble.js

@@ -1,9 +1,13 @@
 // Adds compile-time JS functions to augment Renderer interface.
 (function (Renderer) {
   console.log("preamble", Renderer);
+
+  //
+  let gr;
+  let surface;
+
   Renderer.setCanvas = function setCanvas(canvas, attrs) {
     console.log("GL", GL);
-    debugger
     const context = GL.createContext(canvas, attrs);
     if (!context) {
       throw new Error('Could not create a new WebGL context')
@@ -15,6 +19,77 @@
     GL.currentContext.GLctx.getExtension('WEBGL_debug_renderer_info');
 
     console.log("setCanvas", canvas, attrs);
-    const gr  = this._MakeGrContext();
+    gr = this._MakeGrContext();
     console.log("gr", gr);
+
+    surface = this._MakeOnScreenGLSurface(gr, canvas.width, canvas.height);
+    console.log("surface", surface);
+    if (!surface) {
+      throw new Error('Cannot initialize surface')
+    }
+  };
+
+  function wasMalloced(obj) {
+    return obj && obj['_ck'];
+  }
+
+  function copy1dArray(arr, dest, ptr) {
+    if (!arr || !arr.length) return null;
+    if (wasMalloced(arr)) {
+      return arr.byteOffset;
+    }
+    const bytesPerElement = Renderer[dest].BYTES_PER_ELEMENT;
+    if (!ptr) {
+      ptr = Renderer._malloc(arr.length * bytesPerElement);
+    }
+    Renderer[dest].set(arr, ptr / bytesPerElement);
+    return ptr;
+  }
+
+	function copyRectToWasm(fourFloats, ptr) {
+	  return copy1dArray(fourFloats, 'HEAPF32', ptr || null);
+	}
+
+  function copyColorToWasm(color4f, ptr) {
+    return copy1dArray(color4f, 'HEAPF32', ptr || null);
+  }
+
+  Renderer.drawCanvas = function drawCanvas(vbox, zoom, objects) {
+    console.log("vbox", vbox);
+    console.log("zoom", zoom);
+    if (!surface) {
+      throw new Error('Surface uninitialized');
+    }
+
+    console.log("renderer", Renderer);
+    console.log("surface", surface);
+
+    // Esto es una ÑAPA terrible, no me gusta.
+    if (!Renderer.Paint.prototype.setColor) {
+      Renderer.Paint.prototype.setColor = function(color4f, colorSpace = null) {
+        const cPtr = copyColorToWasm(color4f);
+        this._setColor(cPtr, colorSpace);
+      }
+    }
+
+    const paint = new Renderer.Paint();
+    paint.setColor(Float32Array.of(1.0, 0, 0, 1.0));
+    paint.setStyle(Renderer.PaintStyle.Fill);
+    paint.setAntiAlias(true);
+    console.log("paint", paint);
+
+    const canvas = surface._getCanvas();
+    console.log("canvas", canvas);
+
+    const cPtr = copyColorToWasm(Float32Array.of(0.0, 0.0, 0.0, 1.0))
+    canvas._clear(cPtr);
+    console.log("canvas cleared");
+
+    for (const { val: object } of objects) {
+      console.log("object", object);
+      const rr = Float32Array.of(object.selrect.x, object.selrect.y, object.selrect.width, object.selrect.height);
+
+      const rPtr = copyRectToWasm(rr);
+      canvas._drawRect(rPtr, paint);
+    }
   };

frontend/render_v2/cpp/scripts/copy-artifacts

@@ -1,11 +1,11 @@
 #!/bin/bash
-mkdir -p ../../resources/public/js/render-v2/cpp
+mkdir -p ../../resources/public/js/render_v2/cpp
-mkdir -p ../../src/app/render-v2/
+mkdir -p ../../src/app/render_v2/
 
 # FIXME: This is a VERY HACKY way to set the correct `scriptDirectory` but
 # I didn't find a better way yet.
 PREAMBLE_LINES=`wc -l js/preamble.js | egrep -o [0-9]+`
 POSTAMBLE_LINES=`wc -l js/postamble.js | egrep -o [0-9]+`
 LINE_NUMBER=`echo "200 + ${PREAMBLE_LINES} + ${POSTAMBLE_LINES}" | bc | egrep -o [0-9]+`
-sed "${LINE_NUMBER} i \ \ scriptDirectory += 'render-v2/cpp/';" out/render-v2.js > ../../src/app/render-v2/cpp.js
+sed "${LINE_NUMBER} i \ \ scriptDirectory += 'js/render_v2/cpp/';" out/renderer.js > ../../src/app/render_v2/cpp.js
-cp out/render-v2.wasm ../../resources/public/js/render-v2/cpp
+cp out/renderer.wasm ../../resources/public/js/render_v2/cpp

frontend/src/app/main/ui/workspace/viewport.cljs

@@ -114,8 +114,6 @@
 
         selected-shapes   (keep (d/getf objects-modified) selected)
 
-        canvas-ref        (mf/use-ref nil)
-
         ;; STATE
         alt?              (mf/use-state false)
         shift?            (mf/use-state false)
@@ -130,12 +128,13 @@
         hover-top-frame-id (mf/use-state nil)
         frame-hover       (mf/use-state nil)
         active-frames     (mf/use-state #{})
-        canvas-init?      (mf/use-ref 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)
@@ -276,14 +275,15 @@
         [canvas-ref]
         (let [canvas (mf/ref-val canvas-ref)]
           (when (some? canvas)
-            (p/then (render-v2/init)
+            (-> (p/then (render-v2/init)
-                    (fn []
+                        (fn []
-                      (render-v2/set-canvas canvas vbox' zoom base-objects)
+                          (mf/set-ref-val! canvas-init? true)
-                      (mf/set-ref-val! canvas-init? true))))))
+                          (render-v2/set-canvas canvas vbox' zoom base-objects)))
+                (p/catch (fn [error] (js/console.error error)))))))
 
       ;; redraw when vbox or shapes change
       (mf/with-effect
-        [vbox canvas-init? zoom]
+        [vbox canvas-init? base-objects zoom]
         (when (mf/ref-val canvas-init?)
           (render-v2/draw-canvas vbox zoom base-objects)))
 

frontend/src/app/render_v2.cljs

@@ -31,14 +31,20 @@
   (cond
     ;; CPP
     (contains? cf/flags :render-v2-cpp)
-    (render-v2-cpp/set-canvas canvas)
+    (render-v2-cpp/set-canvas canvas vbox zoom base-objects)
 
     ;; Rust
     (contains? cf/flags :render-v2-rs)
     (render-v2-rs/set-canvas canvas vbox zoom base-objects)))
 
-(defn draw-canvas [vbox zoom base-objects]
+(defn draw-canvas
+  [vbox zoom base-objects]
+  (js/console.log "draw-canvas")
   (cond
+    ;; CPP
+    (contains? cf/flags :render-v2-cpp)
+    (render-v2-cpp/draw-canvas vbox zoom base-objects)
+
     ;; Rust
     (contains? cf/flags :render-v2-rs)
     (render-v2-rs/draw-canvas vbox zoom base-objects)))

frontend/src/app/render_v2/cpp.cljs

@@ -14,9 +14,16 @@
 (defonce ^:dynamic internal-module nil)
 
 (defn set-canvas
-  [canvas]
+  [canvas vbox zoom base-objects]
   (js/console.log "setting canvas" canvas)
-  (.setCanvas internal-module canvas #js {:antialias false}))
+  (.setCanvas ^js internal-module canvas #js {:antialias false})
+  (js/console.log "canvas set")
+  (.drawCanvas ^js internal-module vbox zoom base-objects))
+
+(defn draw-canvas
+  [vbox zoom base-objects]
+  (js/console.log "draw canvas" vbox zoom base-objects)
+  (.drawCanvas ^js internal-module vbox zoom base-objects))
 
 (defn on-init
   [module']