Hakushi.Canvas (Hakushi v0.1.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.
  • "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 and the nodes they drag, for the others.

On a shared canvas (live), 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.