🎉 Add function to retrieve caret position

frontend/src/app/render_wasm/api/fonts.cljs

@@ -98,6 +98,13 @@
             (:style font-data)
             emoji?
             fallback?)
+
+    (h/call wasm/internal-module "_update_shape_text_layout_for"
+            (aget shape-id-buffer 0)
+            (aget shape-id-buffer 1)
+            (aget shape-id-buffer 2)
+            (aget shape-id-buffer 3))
+
     true))
 
 (defn- fetch-font
@@ -217,7 +224,6 @@
   [shape-id fonts]
   (keep (fn [font] (store-font shape-id font)) fonts))
 
-
 (defn add-emoji-font
   [fonts]
   (conj fonts {:font-id "gfont-noto-color-emoji"
@@ -275,7 +281,6 @@
    :symbols-2   {:font-id "gfont-noto-sans-symbols-2" :font-variant-id "regular" :style 0 :weight 400 :is-fallback true}
    :music       {:font-id "gfont-noto-music" :font-variant-id "regular" :style 0 :weight 400 :is-fallback true}})
 
-
 (defn add-noto-fonts [fonts languages]
   (reduce (fn [acc lang]
             (if-let [font (get noto-fonts lang)]

frontend/text-editor/src/index.html

@@ -528,6 +528,13 @@
           Module._init_shapes_pool(1);
           setupInteraction(canvas);
 
+          canvas.addEventListener('click', (e) => {
+            console.log('click', e.type, e);
+            useShape(uuid);
+            const caretPosition = Module._get_caret_position_at(e.offsetX, e.offsetY);
+            console.log('caretPosition', caretPosition);
+          })
+
           storeFonts(fonts)
 
           console.log("text shape", uuid);

frontend/text-editor/vite.config.js

@@ -1,12 +1,61 @@
-import { resolve } from "node:path";
+import path from "node:path";
+import fs from 'node:fs/promises';
 import { defineConfig } from "vite";
-import { coverageConfigDefaults } from "vitest/config"
+import { coverageConfigDefaults } from "vitest/config";
+
+async function waitFor(timeInMillis) {
+  return new Promise(resolve =>
+    setTimeout(_ => resolve(), timeInMillis)
+  );
+}
+
+const wasmWatcherPlugin = (options = {}) => {
+  return {
+    name: "vite-wasm-watcher-plugin",
+    configureServer(server) {
+      server.watcher.add("../resources/public/js/render_wasm.wasm")
+      server.watcher.add("../resources/public/js/render_wasm.js")
+      server.watcher.on("change", async (file) => {
+        if (file.includes("../resources/")) {
+          // If we copy the files immediately, we end
+          // up with an empty .js file (I don't know why).
+          await waitFor(100)
+          // copy files.
+          await fs.copyFile(
+            path.resolve(file),
+            path.resolve('./src/wasm/', path.basename(file))
+          )
+          console.log(`${file} changed`);
+        }
+      });
+
+      server.watcher.on("add", async (file) => {
+        if (file.includes("../resources/")) {
+          await fs.copyFile(
+            path.resolve(file),
+            path.resolve("./src/wasm/", path.basename(file)),
+          );
+          console.log(`${file} added`);
+        }
+      });
+
+      server.watcher.on("unlink", (file) => {
+        if (file.includes("../resources/")) {
+          console.log(`${file} removed`);
+        }
+      });
+    },
+  };
+};
 
 export default defineConfig({
+  plugins: [
+    wasmWatcherPlugin()
+  ],
   root: "./src",
   resolve: {
     alias: {
-      "~": resolve("./src"),
+      "~": path.resolve("./src"),
     },
   },
   build: {

render-wasm/src/render.rs

@@ -619,7 +619,7 @@ impl RenderState {
                 let inner_shadows = shape.inner_shadow_paints();
                 let blur_filter = shape.image_filter(1.);
                 let count_inner_strokes = shape.count_visible_inner_strokes();
-                let mut paragraphs = text_content.paragraph_builder_group_from_text(None);
+                let mut paragraph_builders = text_content.paragraph_builder_group_from_text(None);
                 let mut paragraphs_with_shadows =
                     text_content.paragraph_builder_group_from_text(Some(true));
                 let mut stroke_paragraphs_list = shape
@@ -693,7 +693,7 @@ impl RenderState {
                         Some(self),
                         None,
                         &shape,
-                        &mut paragraphs,
+                        &mut paragraph_builders,
                         Some(fills_surface_id),
                         None,
                         blur_filter.as_ref(),

render-wasm/src/render/text.rs

@@ -195,7 +195,11 @@ pub fn render(
     render_canvas.restore();
 }
 
-fn draw_text(canvas: &Canvas, shape: &Shape, paragraph_builders: &mut [Vec<ParagraphBuilder>]) {
+fn draw_text(
+    canvas: &Canvas,
+    shape: &Shape,
+    paragraph_builder_groups: &mut [Vec<ParagraphBuilder>],
+) {
     // Width
     let paragraph_width = if let crate::shapes::Type::Text(text_content) = &shape.shape_type {
         text_content.width()
@@ -205,7 +209,8 @@ fn draw_text(canvas: &Canvas, shape: &Shape, paragraph_builders: &mut [Vec<Parag
 
     // Height
     let container_height = shape.selrect().height();
-    let total_content_height = calculate_all_paragraphs_height(paragraph_builders, paragraph_width);
+    let total_content_height =
+        calculate_all_paragraphs_height(paragraph_builder_groups, paragraph_width);
     let mut global_offset_y = match shape.vertical_align() {
         VerticalAlign::Center => (container_height - total_content_height) / 2.0,
         VerticalAlign::Bottom => container_height - total_content_height,
@@ -214,19 +219,19 @@ fn draw_text(canvas: &Canvas, shape: &Shape, paragraph_builders: &mut [Vec<Parag
 
     let layer_rec = SaveLayerRec::default();
     canvas.save_layer(&layer_rec);
-    for group in paragraph_builders {
+    for paragraph_builder_group in paragraph_builder_groups {
         let mut group_offset_y = global_offset_y;
-        let group_len = group.len();
+        let group_len = paragraph_builder_group.len();
 
-        for builder in group.iter_mut() {
+        for paragraph_builder in paragraph_builder_group.iter_mut() {
-            let mut skia_paragraph = builder.build();
+            let mut paragraph = paragraph_builder.build();
-            skia_paragraph.layout(paragraph_width);
+            paragraph.layout(paragraph_width);
-            let paragraph_height = skia_paragraph.height();
+            let paragraph_height = paragraph.height();
             let xy = (shape.selrect().x(), shape.selrect().y() + group_offset_y);
-            skia_paragraph.paint(canvas, xy);
+            paragraph.paint(canvas, xy);
 
-            for line_metrics in skia_paragraph.get_line_metrics().iter() {
+            for line_metrics in paragraph.get_line_metrics().iter() {
-                render_text_decoration(canvas, &skia_paragraph, builder, line_metrics, xy);
+                render_text_decoration(canvas, &paragraph, paragraph_builder, line_metrics, xy);
             }
 
             if group_len == 1 {
@@ -235,7 +240,7 @@ fn draw_text(canvas: &Canvas, shape: &Shape, paragraph_builders: &mut [Vec<Parag
         }
 
         if group_len > 1 {
-            let mut first_paragraph = group[0].build();
+            let mut first_paragraph = paragraph_builder_group[0].build();
             first_paragraph.layout(paragraph_width);
             global_offset_y += first_paragraph.height();
         } else {

render-wasm/src/shapes.rs

@@ -45,8 +45,7 @@ pub use svgraw::*;
 pub use text::*;
 pub use transform::*;
 
-use crate::math;
+use crate::math::{self, Bounds, Matrix, Point};
-use crate::math::{Bounds, Matrix, Point};
 use indexmap::IndexSet;
 
 use crate::state::ShapesPool;
@@ -655,12 +654,17 @@ impl Shape {
             Point::new(self.selrect.x(), self.selrect.y() + self.selrect.height()),
         );
 
-        let center = self.center();
+        // Apply this transformation only when self.transform
+        // is not the identity matrix because if it is,
+        // the result of applying this transformations would be
+        // the same identity matrix.
+        if !self.transform.is_identity() {
             let mut matrix = self.transform;
+            let center = self.center();
             matrix.post_translate(center);
             matrix.pre_translate(-center);
-
             bounds.transform_mut(&matrix);
+        }
 
         bounds
     }
@@ -829,6 +833,10 @@ impl Shape {
         rect
     }
 
+    pub fn left_top(&self) -> Point {
+        Point::new(self.selrect.left, self.selrect.top)
+    }
+
     pub fn center(&self) -> Point {
         self.selrect.center()
     }
@@ -918,13 +926,42 @@ impl Shape {
                 ancestors.insert(parent_id);
                 current_id = parent_id;
             } else {
-                break;
+                // FIXME: This should panic! I've removed it temporarily until
+                // we fix the problems with shapes without parents.
+                // panic!("Parent can't be found");
             }
         }
 
         ancestors
     }
 
+    pub fn get_matrix(&self) -> Matrix {
+        let mut matrix = Matrix::new_identity();
+        matrix.post_translate(self.left_top());
+        matrix.post_rotate(self.rotation, self.center());
+        matrix
+    }
+
+    pub fn get_concatenated_matrix(&self, shapes: &ShapesPool) -> Matrix {
+        let mut matrix = Matrix::new_identity();
+        let mut current_id = self.id;
+        while let Some(parent_id) = shapes.get(&current_id).and_then(|s| s.parent_id) {
+            if parent_id == Uuid::nil() {
+                break;
+            }
+
+            if let Some(parent) = shapes.get(&parent_id) {
+                matrix.pre_concat(&parent.get_matrix());
+                current_id = parent_id;
+            } else {
+                // FIXME: This should panic! I've removed it temporarily until
+                // we fix the problems with shapes without parents.
+                // panic!("Parent can't be found");
+            }
+        }
+        matrix
+    }
+
     pub fn image_filter(&self, scale: f32) -> Option<skia::ImageFilter> {
         self.blur
             .filter(|blur| !blur.hidden)

render-wasm/src/shapes/text.rs

@@ -10,10 +10,12 @@ use skia_safe::{
     paint::{self, Paint},
     textlayout::ParagraphBuilder,
     textlayout::ParagraphStyle,
+    textlayout::PositionWithAffinity,
 };
 use std::collections::HashSet;
 
 use super::FontFamily;
+use crate::math::Point;
 use crate::shapes::{self, merge_fills};
 use crate::utils::{get_fallback_fonts, get_font_collection};
 use crate::Uuid;
@@ -221,6 +223,22 @@ impl TextContent {
         self.bounds = Rect::from_ltrb(p1.x, p1.y, p2.x, p2.y);
     }
 
+    pub fn get_caret_position_at(&self, point: &Point) -> Option<PositionWithAffinity> {
+        let mut offset_y = 0.0;
+        let paragraphs = self.layout.paragraphs.iter().flatten();
+
+        for paragraph in paragraphs {
+            let start_y = offset_y;
+            let end_y = offset_y + paragraph.height();
+            if point.y > start_y && point.y < end_y {
+                let position_with_affinity = paragraph.get_glyph_position_at_coordinate(*point);
+                return Some(position_with_affinity);
+            }
+            offset_y += paragraph.height();
+        }
+        None
+    }
+
     /// Builds the ParagraphBuilders necessary to render
     /// this text.
     pub fn paragraph_builder_group_from_text(
@@ -273,8 +291,6 @@ impl TextContent {
 
     /// Performs an Auto Width text layout.
     fn text_layout_auto_width(&self) -> TextContentLayoutResult {
-        // TODO: Deberíamos comprobar primero que los párrafos
-        // no están generados.
         let mut paragraph_builders = self.paragraph_builder_group_from_text(None);
         let paragraphs =
             self.build_paragraphs_from_paragraph_builders(&mut paragraph_builders, f32::MAX);
@@ -297,8 +313,6 @@ impl TextContent {
     /// Performs an Auto Height text layout.
     fn text_layout_auto_height(&self) -> TextContentLayoutResult {
         let width = self.width();
-        // TODO: Deberíamos primero comprobar si existen los
-        // paragraph builders para poder obtener el layout.
         let mut paragraph_builders = self.paragraph_builder_group_from_text(None);
         let paragraphs =
             self.build_paragraphs_from_paragraph_builders(&mut paragraph_builders, f32::INFINITY);
@@ -335,7 +349,6 @@ impl TextContent {
 
     pub fn update_layout(&mut self, selrect: Rect) -> TextContentSize {
         self.size.set_size(selrect.width(), selrect.height());
-        // 3. Width and Height Calculation
         match self.grow_type() {
             GrowType::AutoHeight => {
                 let result = self.text_layout_auto_height();

render-wasm/src/view.rs

@@ -1,5 +1,7 @@
 use skia_safe::Rect;
 
+use crate::math::{Matrix, Point};
+
 #[derive(Debug, Copy, Clone)]
 pub(crate) struct Viewbox {
     pub pan_x: f32,
@@ -53,7 +55,18 @@ impl Viewbox {
             .set_wh(self.width / self.zoom, self.height / self.zoom);
     }
 
+    pub fn pan(&self) -> Point {
+        Point::new(self.pan_x, self.pan_y)
+    }
+
     pub fn zoom(&self) -> f32 {
         self.zoom
     }
+
+    pub fn get_matrix(&self) -> Matrix {
+        let mut matrix = Matrix::new_identity();
+        matrix.post_translate(self.pan());
+        matrix.post_scale((self.zoom, self.zoom), None);
+        matrix
+    }
 }

render-wasm/src/wasm/text.rs

@@ -1,12 +1,13 @@
 use macros::ToJs;
 
 use super::fonts::RawFontStyle;
+use crate::math::{Matrix, Point};
 use crate::mem;
 use crate::shapes::{
     self, GrowType, TextAlign, TextDecoration, TextDirection, TextTransform, Type,
 };
-use crate::utils::uuid_from_u32;
+use crate::utils::{uuid_from_u32, uuid_from_u32_quartet};
-use crate::{with_current_shape_mut, STATE};
+use crate::{with_current_shape, with_current_shape_mut, with_state_mut, STATE};
 
 const RAW_LEAF_DATA_SIZE: usize = std::mem::size_of::<RawTextLeafAttrs>();
 pub const RAW_LEAF_FILLS_SIZE: usize = 160;
@@ -370,3 +371,41 @@ pub extern "C" fn update_shape_text_layout() {
         }
     });
 }
+
+#[no_mangle]
+pub extern "C" fn update_shape_text_layout_for(a: u32, b: u32, c: u32, d: u32) {
+    with_state_mut!(state, {
+        let shape_id = uuid_from_u32_quartet(a, b, c, d);
+        if let Some(shape) = state.shapes.get_mut(&shape_id) {
+            if let Type::Text(text_content) = &mut shape.shape_type {
+                text_content.update_layout(shape.selrect);
+            }
+        }
+    });
+}
+
+#[no_mangle]
+pub extern "C" fn get_caret_position_at(x: f32, y: f32) -> i32 {
+    with_current_shape!(state, |shape: &Shape| {
+        if let Type::Text(text_content) = &shape.shape_type {
+            let mut matrix = Matrix::new_identity();
+            let shape_matrix = shape.get_concatenated_matrix(&state.shapes);
+            let view_matrix = state.render_state.viewbox.get_matrix();
+            if let Some(inv_view_matrix) = view_matrix.invert() {
+                matrix.post_concat(&inv_view_matrix);
+                matrix.post_concat(&shape_matrix);
+
+                let mapped_point = matrix.map_point(Point::new(x, y));
+
+                if let Some(position_with_affinity) =
+                    text_content.get_caret_position_at(&mapped_point)
+                {
+                    return position_with_affinity.position;
+                }
+            }
+        } else {
+            panic!("Trying to update grow type in a shape that it's not a text shape");
+        }
+    });
+    -1
+}