Merge #619: Fix #598: the Free Transform widget

# Conflicts:
#	ROADMAP.md
#	crates/ui-egui/src/i18n/cs.tsv
#	crates/ui-egui/src/i18n/es.tsv
#	crates/ui-egui/src/i18n/it.tsv
#	crates/ui-egui/src/i18n/ja.tsv
#	crates/ui-egui/src/i18n/pt-br.tsv
#	crates/ui-egui/src/i18n/ru.tsv
#	crates/ui-egui/src/i18n/zh-hans.tsv
#	crates/ui-egui/src/i18n/zh-hant.tsv

crates/ui-egui/src/canvas.rs

@@ -384,6 +384,9 @@ pub fn show(app: &mut VectorcraftApp, ui: &mut Ui) {
     if app.ui.task_bar && !app.session.tool_busy() && app.ui.screen_mode < 3 {
         task_bar(app, ui, &xf);
     }
+    if app.ui.screen_mode < 3 {
+        crate::free_transform::show(app, ui, xf.rect);
+    }
     // Cursor.
     if resp.hovered() {
         let m = ui.input(|i| i.modifiers);

crates/ui-egui/src/control.rs

@@ -84,6 +84,8 @@ pub fn inspect(app: &VectorcraftApp, ctx: &egui::Context) -> Value {
             "pinned": app.ui.task_bar_place.pinned,
             "rect": crate::canvas::task_bar_rect(ctx).map(|r| json!([r.left(), r.top(), r.width(), r.height()])),
         },
+        // The Free Transform tool's widget, where it shows.
+        "freeTransformWidget": crate::free_transform::rect(ctx).map(|r| json!([r.left(), r.top(), r.width(), r.height()])),
         "view": app.view().map(|v| serde_json::to_value(v).unwrap_or_default()),
         "canvasRect": app.canvas_rect.map(|c| json!([c.left(), c.top(), c.width(), c.height()])),
         "window": [r.width(), r.height()],

crates/ui-egui/src/free_transform.rs

@@ -0,0 +1,202 @@
+//! The Free Transform widget (#598): while the Free Transform tool is active, a small floating box
+//! at the canvas's top left with Constrain (as holding Shift: proportional scaling, moves and
+//! rotations by 45°) over the tool's three modes, Free Transform, Perspective Distort and Free
+//! Distort. It sets the tool's options through `tool.setOption` (`constrain`, `mode`), as agents
+//! do; the modifier keys keep working while dragging.
+
+use egui::{Color32, CornerRadius, Pos2, Rect, Sense, Stroke, StrokeKind, Ui, pos2, vec2};
+use serde_json::{Value, json};
+
+use crate::VectorcraftApp;
+use crate::theme::Tokens;
+
+/// The tool the widget belongs to.
+const TOOL: &str = "freeTransform";
+/// A button's side.
+const BUTTON: f32 = 28.0;
+
+/// What a button shows.
+#[derive(Clone, Copy)]
+enum Glyph {
+    /// An icon of the set.
+    Icon(&'static str),
+    /// A box narrower at the top than at the bottom, its corners marked.
+    Perspective,
+    /// A box with corners pulled every which way, its corners marked.
+    Distort,
+}
+
+/// The tool's modes as its `mode` option names them, with their buttons.
+fn modes() -> [(&'static str, Glyph, &'static str); 3] {
+    [
+        ("free", Glyph::Icon("dc-free-transform"), tl!("Free Transform")),
+        ("perspective", Glyph::Perspective, tl!("Perspective Distort")),
+        ("distort", Glyph::Distort, tl!("Free Distort")),
+    ]
+}
+
+/// Where the widget was last drawn (none while it isn't shown).
+pub(crate) fn rect(ctx: &egui::Context) -> Option<Rect> {
+    let id = egui::Id::new(TOOL);
+    ctx.memory(|m| m.areas().is_visible(&egui::LayerId::new(egui::Order::Middle, id)).then(|| m.area_rect(id)).flatten())
+}
+
+/// Show the widget in `canvas` (the canvas's area inside the rulers) while the Free Transform
+/// tool is active.
+pub(crate) fn show(app: &mut VectorcraftApp, ui: &Ui, canvas: Rect) {
+    if app.session.tool_id() != TOOL {
+        return;
+    }
+    let t = Tokens::get(ui.ctx());
+    let opts = app.session.tool_options();
+    let mode = opts["mode"].as_str().unwrap_or("free").to_string();
+    let constrain = opts["constrain"].as_bool().unwrap_or(false);
+    let mut set: Option<(&str, Value)> = None;
+    egui::Area::new(egui::Id::new(TOOL)).order(egui::Order::Middle).fixed_pos(canvas.min + vec2(10.0, 10.0)).show(ui.ctx(), |ui| {
+        egui::Frame::NONE
+            .fill(t.panel)
+            .stroke(Stroke::new(1.0, t.button_border))
+            .corner_radius(CornerRadius::same(4))
+            .inner_margin(egui::Margin::same(3))
+            .shadow(egui::epaint::Shadow { offset: [0, 2], blur: 8, spread: 0, color: Color32::from_black_alpha(60) })
+            .show(ui, |ui| {
+                ui.spacing_mut().item_spacing.y = 2.0;
+                // Constrain shapes only what the Free Transform mode does.
+                if button(ui, Glyph::Icon("link"), tl!("Constrain"), constrain, mode == "free") {
+                    set = Some(("constrain", json!(!constrain)));
+                }
+                let (line, _) = ui.allocate_exact_size(vec2(BUTTON, 3.0), Sense::hover());
+                ui.painter().hline(line.x_range().shrink(4.0), line.center().y, Stroke::new(1.0, t.button_border));
+                for (name, glyph, tip) in modes() {
+                    if button(ui, glyph, tip, mode == name, true) && mode != name {
+                        set = Some(("mode", json!(name)));
+                    }
+                }
+            });
+    });
+    if let Some((key, value)) = set
+        && let Err(e) = app.run("tool.setOption", json!({ "key": key, "value": value }))
+    {
+        app.status(e);
+    }
+}
+
+/// A square button showing `glyph`, highlighted when `on`, greyed and inert unless `enabled`.
+/// Returns whether it was clicked.
+fn button(ui: &mut Ui, glyph: Glyph, tip: &str, on: bool, enabled: bool) -> bool {
+    let t = Tokens::get(ui.ctx());
+    let (rect, resp) = ui.allocate_exact_size(vec2(BUTTON, BUTTON), if enabled { Sense::click() } else { Sense::hover() });
+    let bg = if on && enabled {
+        t.tool_active
+    } else if enabled && resp.hovered() {
+        t.hover
+    } else {
+        Color32::TRANSPARENT
+    };
+    ui.painter().rect_filled(rect, CornerRadius::same(3), bg);
+    let color = match (enabled, on) {
+        (false, _) => t.text_dim,
+        (true, true) => t.text,
+        (true, false) => t.icon,
+    };
+    paint(ui, glyph, rect.shrink(6.0), color);
+    resp.on_hover_text(tip).clicked() && enabled
+}
+
+/// Draw `glyph` in `r`.
+fn paint(ui: &Ui, glyph: Glyph, r: Rect, color: Color32) {
+    let at = |x: f32, y: f32| pos2(r.left() + x * r.width(), r.top() + y * r.height());
+    let quad: [Pos2; 4] = match glyph {
+        Glyph::Icon(name) => return crate::icons::paint(ui, name, r, color),
+        Glyph::Perspective => [at(0.3, 0.12), at(0.7, 0.12), at(0.95, 0.88), at(0.05, 0.88)],
+        Glyph::Distort => [at(0.08, 0.2), at(0.78, 0.06), at(0.94, 0.9), at(0.2, 0.76)],
+    };
+    let (p, fill) = (ui.painter(), Tokens::get(ui.ctx()).panel);
+    p.add(egui::Shape::closed_line(quad.to_vec(), Stroke::new(1.3, color)));
+    for c in quad {
+        let mark = Rect::from_center_size(c, vec2(3.5, 3.5));
+        p.rect_filled(mark, 0.0, fill);
+        p.rect_stroke(mark, 0.0, Stroke::new(1.0, color), StrokeKind::Middle);
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use serde_json::json;
+    use vectorcraft_engine::Session;
+    use vectorcraft_geom::Point;
+
+    use super::*;
+    use crate::canvas::Xf;
+
+    fn frame(app: &mut VectorcraftApp, ctx: &egui::Context, events: Vec<egui::Event>) {
+        let raw = egui::RawInput { screen_rect: Some(Rect::from_min_size(Pos2::ZERO, vec2(800.0, 600.0))), events, ..Default::default() };
+        ctx.run_ui(raw, |ui| crate::canvas::show(app, ui)).textures_delta.clear();
+    }
+
+    /// A press and release at `at`, then a frame to settle.
+    fn click(app: &mut VectorcraftApp, ctx: &egui::Context, at: Pos2) {
+        let button = |pressed| egui::Event::PointerButton { pos: at, button: egui::PointerButton::Primary, pressed, modifiers: Default::default() };
+        frame(app, ctx, vec![egui::Event::PointerMoved(at), button(true)]);
+        frame(app, ctx, vec![button(false)]);
+        frame(app, ctx, vec![]);
+    }
+
+    fn options(app: &VectorcraftApp) -> (String, bool) {
+        let o = app.session.tool_options();
+        (o["mode"].as_str().unwrap_or_default().to_string(), o["constrain"].as_bool().unwrap_or_default())
+    }
+
+    /// The widget shows with the Free Transform tool only; its buttons set the mode and Constrain
+    /// (inert in the distort modes); a corner dragged in Free Distort moves that corner alone.
+    #[test]
+    fn the_widget_sets_the_mode_and_a_corner_drag_then_distorts() {
+        let mut app = VectorcraftApp::new(Session::new(), Default::default());
+        app.session.execute("file.new", &json!({"width": 400, "height": 300})).unwrap();
+        let id = app.session.execute("shape.rectangle", &json!({"x": 100, "y": 100, "width": 100, "height": 60})).unwrap()["id"].clone();
+        app.session.execute("select.set", &json!({"ids": [id]})).unwrap();
+        let ctx = egui::Context::default();
+        app.select_tool("selection");
+        frame(&mut app, &ctx, vec![]);
+        assert!(rect(&ctx).is_none(), "not with the Selection tool");
+        app.select_tool(TOOL);
+        frame(&mut app, &ctx, vec![]);
+        frame(&mut app, &ctx, vec![]);
+        let w = rect(&ctx).expect("the widget shows");
+        let canvas = app.canvas_rect.unwrap();
+        assert!(canvas.contains(w.min) && w.left() - canvas.left() < 20.0 && w.top() - canvas.top() < 20.0, "{w:?} in {canvas:?}");
+        // Constrain, a rule, then Free Transform, Perspective Distort and Free Distort.
+        let at = |i: usize| {
+            let rule = if i > 0 { 3.0 + 2.0 } else { 0.0 };
+            pos2(w.center().x, w.top() + 4.0 + BUTTON / 2.0 + i as f32 * (BUTTON + 2.0) + rule)
+        };
+        assert_eq!(options(&app), ("free".into(), false));
+        click(&mut app, &ctx, at(0));
+        assert_eq!(options(&app), ("free".into(), true), "Constrain on");
+        click(&mut app, &ctx, at(3));
+        assert_eq!(options(&app), ("distort".into(), true));
+        click(&mut app, &ctx, at(0));
+        assert_eq!(options(&app), ("distort".into(), true), "Constrain is inert in Free Distort");
+        click(&mut app, &ctx, at(2));
+        assert_eq!(options(&app).0, "perspective");
+        click(&mut app, &ctx, at(3));
+        // Free Distort: the top-left corner dragged alone.
+        let xf = Xf::new(canvas, app.view().unwrap());
+        let (from, to) = (xf.to_screen(Point::new(100.0, 100.0)), xf.to_screen(Point::new(80.0, 90.0)));
+        let button = |pos, pressed| egui::Event::PointerButton { pos, button: egui::PointerButton::Primary, pressed, modifiers: Default::default() };
+        frame(&mut app, &ctx, vec![egui::Event::PointerMoved(from), button(from, true)]);
+        frame(&mut app, &ctx, vec![egui::Event::PointerMoved(from + (to - from) / 2.0)]);
+        frame(&mut app, &ctx, vec![egui::Event::PointerMoved(to)]);
+        frame(&mut app, &ctx, vec![button(to, false)]);
+        frame(&mut app, &ctx, vec![]);
+        let st = app.session.active().unwrap();
+        let node = st.doc.node(vectorcraft_doc::NodeId(id.as_u64().unwrap())).unwrap();
+        let pts: Vec<Point> = node.path_data().unwrap().anchors().map(|(.., a)| a.p).collect();
+        let near = |q: Point| pts.iter().any(|p| p.distance(q) < 0.5);
+        assert!(
+            near(Point::new(80.0, 90.0)) && near(Point::new(200.0, 100.0)) && near(Point::new(200.0, 160.0)) && near(Point::new(100.0, 160.0)),
+            "{pts:?}"
+        );
+        assert_eq!(app.session.tool_id(), TOOL);
+    }
+}

crates/ui-egui/src/i18n/cs.tsv

@@ -639,3 +639,6 @@
 	Expand Shaper Group	Rozšířit skupinu Shaper
 	Release Shaper Group	Uvolnit skupinu Shaper
 	Select Shaper Face	Vybrat oblast Shaper
+	Constrain	Omezit
+	Free Transform	Volná transformace
+	Perspective Distort	Perspektivní deformace

crates/ui-egui/src/i18n/es.tsv

@@ -3603,3 +3603,6 @@ axis	Both	Ambos
 	Expand Shaper Group	Expandir grupo Shaper
 	Release Shaper Group	Soltar grupo Shaper
 	Select Shaper Face	Seleccionar cara Shaper
+	Constrain	Restringir
+	Free Transform	Transformación libre
+	Perspective Distort	Distorsión de perspectiva

crates/ui-egui/src/i18n/it.tsv

@@ -3603,3 +3603,6 @@ axis	Both	Entrambi
 	Expand Shaper Group	Espandi gruppo Shaper
 	Release Shaper Group	Rilascia gruppo Shaper
 	Select Shaper Face	Seleziona faccia Shaper
+	Constrain	Vincola
+	Free Transform	Trasformazione libera
+	Perspective Distort	Distorsione prospettica

crates/ui-egui/src/i18n/ja.tsv

@@ -3065,3 +3065,6 @@ theme	Appearance	外観
 	Expand Shaper Group	Shaper グループを拡張
 	Release Shaper Group	Shaper グループを解除
 	Select Shaper Face	Shaper の面を選択
+	Constrain	制限
+	Free Transform	自由変形
+	Perspective Distort	遠近変形

crates/ui-egui/src/i18n/pt-br.tsv

@@ -2653,3 +2653,6 @@
 	Expand Shaper Group	Expandir Grupo Formador
 	Release Shaper Group	Liberar Grupo Formador
 	Select Shaper Face	Selecionar Face do Formador
+	Constrain	Restringir
+	Free Transform	Transformação Livre
+	Perspective Distort	Distorção de Perspectiva

crates/ui-egui/src/i18n/ru.tsv

@@ -3601,3 +3601,6 @@ axis	Both	Оба
 	Expand Shaper Group	Разобрать группу Shaper
 	Release Shaper Group	Освободить группу Shaper
 	Select Shaper Face	Выбрать область Shaper
+	Constrain	Ограничить
+	Free Transform	Свободное трансформирование
+	Perspective Distort	Искажение перспективы

crates/ui-egui/src/i18n/zh-hans.tsv

@@ -3319,3 +3319,5 @@ axis	Both	两者
 	Expand Shaper Group	扩展 Shaper 组
 	Release Shaper Group	释放 Shaper 组
 	Select Shaper Face	选择 Shaper 区域
+	Constrain	约束
+	Perspective Distort	透视扭曲

crates/ui-egui/src/i18n/zh-hant.tsv

@@ -3095,3 +3095,6 @@ axis	Both	兩者
 	Expand Shaper Group	展開 Shaper 群組
 	Release Shaper Group	釋放 Shaper 群組
 	Select Shaper Face	選取 Shaper 區域
+	Constrain	強制
+	Free Transform	任意變形
+	Perspective Distort	透視扭曲

crates/ui-egui/src/lib.rs

@@ -27,6 +27,7 @@ pub mod dock;
 pub mod find_font;
 pub mod floating;
 pub mod font_menu;
+mod free_transform;
 pub mod graphics;
 pub mod i18n;
 pub mod icon_data;

docs/control-protocol.md

@@ -18,7 +18,7 @@ so only enable it while you use it. Transport: `apps/vectorcraft/src/control_ser
 | `engine.execute` | `{command, params}` | run any engine or UI command (see `engine.commands`) |
 | `engine.commands` | | every command with label, shortcut, params doc, enablement |
 | `document.inspect` | `{depth?, childLimit?}` | layer tree, selection, history, paint defaults; the options slice the layer tree as `document.node {summary: true}` does |
-| `ui.inspect` | | tool, UI state, `screenMode` (0 normal, 1 full screen with menu bar, 2 full screen, 3 Presentation Mode), `taskBar` (`pinned`, and `rect` `[x, y, w, h]` while the Contextual Task Bar shows), view, canvas rect, window size, perf, background saves and exports still running, `nativeMenuBar` (true when the menus are in the macOS menu bar rather than the window; `ui.menu.list` lists the in-window menus either way) |
+| `ui.inspect` | | tool, UI state, `screenMode` (0 normal, 1 full screen with menu bar, 2 full screen, 3 Presentation Mode), `taskBar` (`pinned`, and `rect` `[x, y, w, h]` while the Contextual Task Bar shows), `freeTransformWidget` (`[x, y, w, h]` while the Free Transform widget shows), view, canvas rect, window size, perf, background saves and exports still running, `nativeMenuBar` (true when the menus are in the macOS menu bar rather than the window; `ui.menu.list` lists the in-window menus either way) |
 | `ui.menu.list` / `ui.menu.invoke` | `{command, params}` | the full menu tree / invoke an item |
 | `ui.contextMenu.list` | | the canvas context menu for the current selection, flattened like `ui.menu.list` (`path` holds its submenus). `ui.click {x, y, button: "right"}` on the canvas opens it, after selecting the object there unless it is already selected |
 | `ui.tool.select` / `ui.tool.list` | `{tool}` | |
@@ -214,6 +214,13 @@ Bar Position (`window.taskBar.reset`), which unpins it and puts it back under th
 Panel. As in Illustrator, neither the position nor the pin is saved: each launch starts with the bar under the
 selection.
 
+The Free Transform widget: while the Free Transform tool (E) is active, a small box at the canvas's top left holds
+Constrain over the tool's three modes, Free Transform, Perspective Distort and Free Distort. The buttons set the tool's
+options, as `tool.setOption {key: "mode", value: "free"|"perspective"|"distort"}` and `{key: "constrain", value}` do:
+Constrain acts as Shift held (proportional scaling, moves and rotations by 45°) and does nothing in the distort modes,
+where it is greyed. The modifier keys still work while dragging (Cmd on a corner distorts it freely, Cmd+Alt+Shift in
+perspective, Cmd on a side shears).
+
 Floating panels: dragging a dock tab, a panel icon or a popped-out panel's title out of the dock floats that panel
 inside the window, and the strip right of the dock's tabs floats the whole Properties | Layers | Libraries group. A
 floating group moves by its title bar (or the strip right of its tabs); a tab dragged out of it floats on its own;