Node graph-based viewport overlays system #99
Description
Tools need a way of supplying overlays to be drawn on top of the canvas. These can be globally or selectively disabled with the Overlays button:
(Overlays are globally disabled by clicking the checkbox area, selectively disabled by clicking the popover dropdown arrow and clicking on various types of specific overlays to disable)
Various types of overlays will come from:
- The bounding box around the selected objects when using the Select Tool:
- Similar to above, subtle bounding boxes indicating which which layers are being hovered over (which clicking at that moment would then select) when using the Select Tool
- The points used to connect and control the flow of gradients in the Gradient Tool (example in Illustrator:)
- All the vector shape points and handles when using the Path Tool and Pen Tool
- Spline points when using the Spline Tool
There is similar concept related to overlays which always appear and don't get affected by the Overlays toggle. These are fundamental visualizations provided by the tools for their own interactivity, such as:
- A box selection with the Select Tool
- The window, rule-of-thirds, handles, and peripheral darkening of the Crop Tool
- Floating interactive mouse-centric UI widgets like color sample preview from the Eyedropper Tool
- In the Brush Tool, some sort of brush preview showing the angles of the bristles or the size and shape of the textured brush pattern
- In the Clone Tool, it would show the corresponding area of the canvas being actively sampled from while drawing
These would be drawn on a layer above the overlays you can enable/disable with the setting described earlier. However they will probably use the same overlay system code.
Overlays will be rendered as an SVG string over the top of the document viewport.
Complexity: 5
Involves: Frontend (JS), Editor (Rust), Document (Rust)