TEMP: minimap debug overlay

Author: tilladam

node-editor-building-blocks.slint

@@ -328,7 +328,7 @@ export component Minimap inherits Rectangle {
     // === Styling ===
     in property <length> minimap-width: 200px;
     in property <length> minimap-height: 150px;
-    in property <color> minimap-background-color: #1a1a1aee;
+    in property <color> minimap-background-color: #1a1a1aff;
     in property <color> minimap-node-color: #4a4a4a;
     in property <color> minimap-viewport-border-color: #ffffff;
     in property <length> minimap-viewport-border-width: 2px;
@@ -374,10 +374,10 @@ export component Minimap inherits Rectangle {
         root.available-height / root.content-height);
 
     // === Viewport Indicator in Minimap Coordinates ===
-    property <length> viewport-indicator-x: root.minimap-padding + (root.visible-min-x - root.content-min-x) * root.scale;
-    property <length> viewport-indicator-y: root.minimap-padding + (root.visible-min-y - root.content-min-y) * root.scale;
-    property <length> viewport-indicator-width: (root.visible-max-x - root.visible-min-x) * root.scale;
-    property <length> viewport-indicator-height: (root.visible-max-y - root.visible-min-y) * root.scale;
+    out property <length> viewport-indicator-x: root.minimap-padding + (root.visible-min-x - root.content-min-x) * root.scale;
+    out property <length> viewport-indicator-y: root.minimap-padding + (root.visible-min-y - root.content-min-y) * root.scale;
+    out property <length> viewport-indicator-width: (root.visible-max-x - root.visible-min-x) * root.scale;
+    out property <length> viewport-indicator-height: (root.visible-max-y - root.visible-min-y) * root.scale;
 
     width: root.minimap-width;
     height: root.minimap-height;
@@ -423,11 +423,72 @@ export component Minimap inherits Rectangle {
         y: root.viewport-indicator-y;
         width: root.viewport-indicator-width;
         height: root.viewport-indicator-height;
-        background: transparent;
-        border-color: root.minimap-viewport-border-color;
+        background: #ff000055;
+        border-color: red;
         border-width: root.minimap-viewport-border-width;
     }
 
+    // DEBUG: corner markers to verify minimap bounds
+    Rectangle {
+        x: 0px;
+        y: 0px;
+        width: 8px;
+        height: 8px;
+        background: lime;
+    }
+    Rectangle {
+        x: root.minimap-width - 8px;
+        y: 0px;
+        width: 8px;
+        height: 8px;
+        background: yellow;
+    }
+    Rectangle {
+        x: 0px;
+        y: root.minimap-height - 8px;
+        width: 8px;
+        height: 8px;
+        background: cyan;
+    }
+    Rectangle {
+        x: root.minimap-width - 8px;
+        y: root.minimap-height - 8px;
+        width: 8px;
+        height: 8px;
+        background: magenta;
+    }
+
+    // DEBUG: small blue rectangle at a completely different fixed position
+    Rectangle {
+        x: 150px;
+        y: 100px;
+        width: 50px;
+        height: 50px;
+        background: #00a0ff;
+    }
+
+    // TEMP DEBUG: overlay with actual numeric values — positioned ABOVE the minimap
+    Rectangle {
+        x: -260px;
+        y: 0px;
+        width: 260px;
+        height: 100px;
+        background: white;
+        Text {
+            x: 2px;
+            y: 2px;
+            text: "vpw=" + round(root.viewport-width / 1px) + " vpz=" + round(root.viewport-zoom * 1000) / 1000
+                + "\nscale=" + round(root.scale * 10000) / 10000
+                + "\ncontent-w=" + round(root.content-width / 1px)
+                + "\ncontent-min=" + round(root.content-min-x / 1px) + "," + round(root.content-min-y / 1px)
+                + "\nvis-min=" + round(root.visible-min-x / 1px) + "," + round(root.visible-min-y / 1px)
+                + "\nind x=" + round(root.viewport-indicator-x / 1px) + " w=" + round(root.viewport-indicator-width / 1px)
+                + "\nind y=" + round(root.viewport-indicator-y / 1px) + " h=" + round(root.viewport-indicator-height / 1px);
+            color: black;
+            font-size: 11px;
+        }
+    }
+
     TouchArea {
         width: 100%;
         height: 100%;