Hakushi.Canvas (Hakushi v0.6.0)

Copy Markdown View Source

The LiveComponent behind Hakushi.Components.canvas/1.

Render the canvas with canvas/1, not with this module: it is public for its events, which the browser sends and Hakushi.Test sends in tests.

The component keeps the canvas's graph (Hakushi.Graph), and sends the browser its nodes and edges as streams: a change sends the nodes and edges it touches, and no others, so a canvas of thousands of nodes sends a moved node, not the canvas.

The browser sends:

  • "hakushi:change", a change of a person: a move, a resize, an edge, a delete, an edge's label (see Hakushi.Change). The reply is %{"ok" => true}, or %{"error" => reason} for a change the server refused, which the browser takes back.
  • "hakushi:copy" with nodes: the nodes to paste later, and the edges between them, kept on the server.
  • "hakushi:paste" with x and y (or none): a copy of them, at that place of the canvas (or next to the nodes).
  • "hakushi:duplicate" with nodes: a copy of the nodes, next to them.
  • "hakushi:drop" with item, x and y: a new node, made by the canvas's new_node function, or by a kit for a kit's item ("schema:table").
  • "hakushi:draw" with tool ("ink:pen"), points, color, size and parent: a line drawn with a kit's tool, which the kit makes a node of (Hakushi.Kit.drawn/3).
  • "hakushi:edit" with node, action and the action's params: a change of a kit's node by its controls (Hakushi.Kit), whose data the kit gives.
  • "hakushi:undo" and "hakushi:redo": the person's own changes, undone and done again as new changes, which the server checks again.
  • "hakushi:peer", on a shared canvas: the person's cursor, the nodes they selected, the nodes they drag and the line they draw (ink), for the others.

On a shared canvas (issho), the component is a session of an Issho room (Hakushi.Issho): its changes go to the room's document, and the room's events come back to it through update/2.