🔧 Improve debugging UI (#7500)

render-wasm/src/render.rs

@@ -422,15 +422,6 @@ impl RenderState {
             rect,
             self.background_color,
         );
-
-        if self.options.is_debug_visible() {
-            debug::render_workspace_current_tile(
-                self,
-                "".to_string(),
-                self.current_tile.unwrap(),
-                rect,
-            );
-        }
     }
 
     pub fn apply_drawing_to_render_canvas(&mut self, shape: Option<&Shape>) {
@@ -814,6 +805,12 @@ impl RenderState {
                 // bools::debug_render_bool_paths(self, shape, shapes, modifiers, structure);
             }
         };
+
+        if self.options.is_debug_visible() {
+            let shape_selrect_bounds = self.get_shape_selrect_bounds(&shape);
+            let shape_extrect_bounds = self.get_shape_extrect_bounds(&shape, shapes, modifiers);
+            debug::render_debug_shape(self, shape_selrect_bounds, shape_extrect_bounds);
+        }
         if apply_to_current_surface {
             self.apply_drawing_to_render_canvas(Some(&shape));
         }
@@ -871,6 +868,10 @@ impl RenderState {
             canvas.draw_image(snapshot, (0, 0), Some(&skia::Paint::default()));
             canvas.restore();
 
+            if self.options.is_debug_visible() {
+                debug::render(self);
+            }
+
             ui::render(self, shapes, modifiers, structure);
             debug::render_wasm_label(self);
 
@@ -913,7 +914,8 @@ impl RenderState {
             );
         }
 
-        debug::render_debug_tiles_for_viewbox(self);
+        // FIXME - review debug
+        // debug::render_debug_tiles_for_viewbox(self);
 
         performance::begin_measure!("tile_cache");
         self.pending_tiles.update(&self.tile_viewbox);
@@ -1103,6 +1105,33 @@ impl RenderState {
         )
     }
 
+    pub fn get_rect_bounds(&mut self, rect: skia::Rect) -> Rect {
+        let scale = self.get_scale();
+        let offset_x = self.viewbox.area.left * scale;
+        let offset_y = self.viewbox.area.top * scale;
+        Rect::from_xywh(
+            (rect.left * scale) - offset_x,
+            (rect.top * scale) - offset_y,
+            rect.width() * scale,
+            rect.height() * scale,
+        )
+    }
+
+    pub fn get_shape_selrect_bounds(&mut self, shape: &Shape) -> Rect {
+        let rect = shape.selrect();
+        self.get_rect_bounds(rect)
+    }
+
+    pub fn get_shape_extrect_bounds(
+        &mut self,
+        shape: &Shape,
+        tree: &ShapesPool,
+        modifiers: &HashMap<Uuid, Matrix>,
+    ) -> Rect {
+        let rect = shape.extrect(tree, modifiers);
+        self.get_rect_bounds(rect)
+    }
+
     pub fn get_aligned_tile_bounds(&mut self, tile: tiles::Tile) -> Rect {
         let scale = self.get_scale();
         let start_tile_x =
@@ -1265,16 +1294,6 @@ impl RenderState {
                         modifiers,
                     );
 
-                if self.options.is_debug_visible() {
-                    debug::render_debug_shape(
-                        self,
-                        &transformed_element,
-                        is_visible,
-                        tree,
-                        modifiers,
-                    );
-                }
-
                 if !is_visible {
                     continue;
                 }
@@ -1545,6 +1564,15 @@ impl RenderState {
                     let tile_rect = self.get_current_tile_bounds();
                     if !is_empty {
                         self.apply_render_to_final_canvas(tile_rect);
+
+                        if self.options.is_debug_visible() {
+                            debug::render_workspace_current_tile(
+                                self,
+                                "".to_string(),
+                                current_tile,
+                                tile_rect,
+                            );
+                        }
                     } else {
                         self.surfaces.apply_mut(SurfaceId::Target as u32, |s| {
                             let mut paint = skia::Paint::default();

render-wasm/src/render/debug.rs

@@ -1,13 +1,5 @@
-use crate::shapes::Shape;
-use crate::state::ShapesPool;
-use crate::uuid::Uuid;
-
-use crate::math::Matrix;
-use skia_safe::{self as skia, Rect};
-
-use std::collections::HashMap;
-
 use super::{tiles, RenderState, SurfaceId};
+use skia_safe::{self as skia, Rect};
 
 #[cfg(target_arch = "wasm32")]
 use crate::run_script;
@@ -23,10 +15,11 @@ fn get_debug_rect(rect: Rect) -> Rect {
     )
 }
 
+#[allow(dead_code)]
 fn render_debug_view(render_state: &mut RenderState) {
     let mut paint = skia::Paint::default();
     paint.set_style(skia::PaintStyle::Stroke);
-    paint.set_color(skia::Color::from_rgb(255, 0, 255));
+    paint.set_color(skia::Color::GREEN);
     paint.set_stroke_width(1.);
 
     let rect = get_debug_rect(render_state.viewbox.area);
@@ -36,6 +29,7 @@ fn render_debug_view(render_state: &mut RenderState) {
         .draw_rect(rect, &paint);
 }
 
+#[allow(dead_code)]
 pub fn render_debug_cache_surface(render_state: &mut RenderState) {
     let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
     canvas.save();
@@ -50,7 +44,7 @@ pub fn render_wasm_label(render_state: &mut RenderState) {
     let canvas = render_state.surfaces.canvas(SurfaceId::Target);
     let skia::ISize { width, height } = canvas.base_layer_size();
     let mut paint = skia::Paint::default();
-    paint.set_color(skia::Color::from_argb(100, 0, 0, 0));
+    paint.set_color(skia::Color::GRAY);
 
     let str = if render_state.options.is_debug_visible() {
         "WASM RENDERER (DEBUG)"
@@ -64,36 +58,12 @@ pub fn render_wasm_label(render_state: &mut RenderState) {
     canvas.draw_str(str, p, debug_font, &paint);
 }
 
-pub fn render_debug_shape(
-    render_state: &mut RenderState,
-    element: &Shape,
-    intersected: bool,
-    shapes_pool: &ShapesPool,
-    modifiers: &HashMap<Uuid, Matrix>,
-) {
-    let mut paint = skia::Paint::default();
-    paint.set_style(skia::PaintStyle::Stroke);
-    paint.set_color(if intersected {
-        skia::Color::from_rgb(255, 255, 0)
-    } else {
-        skia::Color::from_rgb(0, 255, 255)
-    });
-    paint.set_stroke_width(1.);
-
-    let rect = get_debug_rect(element.extrect(shapes_pool, modifiers));
-    render_state
-        .surfaces
-        .canvas(SurfaceId::Debug)
-        .draw_rect(rect, &paint);
-}
-
+#[allow(dead_code)]
 pub fn render_debug_tiles_for_viewbox(render_state: &mut RenderState) {
     let tiles::TileRect(sx, sy, ex, ey) = render_state.tile_viewbox.interest_rect;
     let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
     let mut paint = skia::Paint::default();
-    paint.set_style(skia::PaintStyle::Stroke);
-    paint.set_color(skia::Color::from_rgb(255, 0, 127));
-    paint.set_stroke_width(1.);
+    paint.set_color(skia::Color::RED);
     let str_rect = format!("{} {} {} {}", sx, sy, ex, ey);
 
     let debug_font = render_state.fonts.debug_font();
@@ -101,12 +71,13 @@ pub fn render_debug_tiles_for_viewbox(render_state: &mut RenderState) {
 }
 
 // Renders the tiles in the viewbox
+#[allow(dead_code)]
 pub fn render_debug_viewbox_tiles(render_state: &mut RenderState) {
     let scale = render_state.get_scale();
     let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
     let mut paint = skia::Paint::default();
     paint.set_style(skia::PaintStyle::Stroke);
-    paint.set_color(skia::Color::from_rgb(255, 0, 127));
+    paint.set_color(skia::Color::MAGENTA);
     paint.set_stroke_width(1.);
 
     let tile_size = tiles::get_tile_size(scale);
@@ -130,42 +101,7 @@ pub fn render_debug_viewbox_tiles(render_state: &mut RenderState) {
             let p = skia::Point::new(debug_rect.x(), debug_rect.y() - 1.);
             let str = format!("{}:{}", x, y);
             let debug_font = render_state.fonts.debug_font();
-            canvas.draw_str(str, p, debug_font, &paint);
-            canvas.draw_rect(debug_rect, &paint);
-        }
-    }
-}
-
-pub fn render_debug_tiles(render_state: &mut RenderState) {
-    let scale = render_state.get_scale();
-    let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
-    let mut paint = skia::Paint::default();
-    paint.set_style(skia::PaintStyle::Stroke);
-    paint.set_color(skia::Color::from_rgb(127, 0, 255));
-    paint.set_stroke_width(1.);
-
-    let tile_size = tiles::get_tile_size(scale);
-    let tiles::TileRect(sx, sy, ex, ey) =
-        tiles::get_tiles_for_rect(render_state.viewbox.area, tile_size);
-    for y in sy..=ey {
-        for x in sx..=ex {
-            let tile = tiles::Tile(x, y);
-            let shape_count = render_state.tiles.get_shapes_at(tile).iter().len();
-            if shape_count == 0 {
-                continue;
-            }
-
-            let rect = Rect::from_xywh(
-                x as f32 * tile_size,
-                y as f32 * tile_size,
-                tile_size,
-                tile_size,
-            );
-            let debug_rect = get_debug_rect(rect);
-            let p = skia::Point::new(debug_rect.x(), debug_rect.y() - 1.);
-            let str = format!("{}:{} {}", x, y, shape_count);
-
-            let debug_font = render_state.fonts.debug_font();
+            paint.set_style(skia::PaintStyle::Fill);
             canvas.draw_str(str, p, debug_font, &paint);
             canvas.draw_rect(debug_rect, &paint);
         }
@@ -173,10 +109,15 @@ pub fn render_debug_tiles(render_state: &mut RenderState) {
 }
 
 pub fn render(render_state: &mut RenderState) {
-    render_debug_view(render_state);
-    render_debug_viewbox_tiles(render_state);
-    render_debug_tiles(render_state);
-    render_debug_cache_surface(render_state);
+    // DEBUG VIEWBOX - green rect - buggy?
+    // render_debug_view(render_state);
+
+    // DEBUG VIEWBOX TILES - magenta - buggy?
+    // render_debug_viewbox_tiles(render_state);
+
+    // DEBUG CACHE SURFACE - noisy - ?
+    // render_debug_cache_surface(render_state);
+
     render_state.surfaces.draw_into(
         SurfaceId::Debug,
         SurfaceId::Target,
@@ -184,6 +125,46 @@ pub fn render(render_state: &mut RenderState) {
     );
 }
 
+pub fn render_workspace_current_tile(
+    render_state: &mut RenderState,
+    prefix: String,
+    tile: tiles::Tile,
+    rect: skia::Rect,
+) {
+    let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
+    let mut p = skia::Paint::default();
+    p.set_stroke_width(2.);
+    p.set_style(skia::PaintStyle::Stroke);
+    canvas.draw_rect(rect, &p);
+
+    let tile_position_origin = skia::Point::new(rect.x() + 10., rect.y() + 20.);
+    p.set_style(skia::PaintStyle::Fill);
+    let str = format!("{prefix} {}:{}", tile.0, tile.1);
+    let mut debug_font = render_state.fonts.debug_font().clone();
+    debug_font.set_size(16.);
+    canvas.draw_str(str, tile_position_origin, &debug_font, &p);
+}
+
+pub fn render_debug_shape(
+    render_state: &mut RenderState,
+    shape_selrect: skia::Rect,
+    shape_extrect: skia::Rect,
+) {
+    let canvas = render_state.surfaces.canvas(SurfaceId::Debug);
+
+    let mut paint = skia::Paint::default();
+    paint.set_style(skia::PaintStyle::Stroke);
+    paint.set_color(skia::Color::RED);
+    paint.set_stroke_width(1.);
+
+    canvas.draw_rect(shape_selrect, &paint);
+
+    if shape_extrect != shape_selrect {
+        paint.set_color(skia::Color::BLUE);
+        canvas.draw_rect(shape_extrect, &paint);
+    }
+}
+
 #[cfg(target_arch = "wasm32")]
 #[allow(dead_code)]
 pub fn console_debug_surface(render_state: &mut RenderState, id: SurfaceId) {
@@ -208,22 +189,3 @@ pub fn console_debug_surface_rect(render_state: &mut RenderState, id: SurfaceId,
         run_script!(format!("console.log('%c ', 'font-size: 1px; background: url(data:image/png;base64,{base64_image}) no-repeat; padding: 100px; background-size: contain;')"))
     }
 }
-
-pub fn render_workspace_current_tile(
-    render_state: &mut RenderState,
-    prefix: String,
-    tile: tiles::Tile,
-    rect: skia::Rect,
-) {
-    let canvas = render_state.surfaces.canvas(SurfaceId::Target);
-    let mut p = skia::Paint::default();
-    p.set_stroke_width(1.);
-    p.set_style(skia::PaintStyle::Stroke);
-    canvas.draw_rect(rect, &p);
-
-    let point = skia::Point::new(rect.x() + 10., rect.y() + 20.);
-    p.set_stroke_width(1.);
-    let str = format!("{prefix} {}:{}", tile.0, tile.1);
-    let debug_font = render_state.fonts.debug_font();
-    canvas.draw_str(str, point, debug_font, &p);
-}