This is a slightly scary set of changes to be making. It overhauls
how the view is rendered.
Rather than use d3 for every single part of generating the view,
we new use native DOM functions as much as possible.
d3 is still used for the basic heavy lifting of working out what
nodes/links etc need to be added/removed from the view. But once
it comes to rendering them, d3 is side-lined as much as possible.
There's room for further improvement. This change focusses on Nodes
and Links. It has not touched groups, subflow-ports and link-nodes.
Closes#2567
This ensures when the node:added event fires, all possible
changes have already been applied such as remapping node ids.
This avoids the need to emit a separate node:changed event.
This introduces a much more consistent set of events within the editor
for whenever a element is added, removed or modified.
The events emited on the `RED.events` event system. The event names
take the form: `"<thing>:<action>"`.
`<thing>` can be one of:
- nodes
- flows
- subflows
- groups
- links
`<action>` can be one of:
- add
- remove
- change
The payload of the events is the object in question.
There is also:
- flows:reorder - when tabs are reordered. Payload is array of flow ids.
- workspace:clear - when the workspace is emptied - part of switching projects
The `nodes:change` event was already used by RED.nodes.dirty() to cause
the Deploy button to become active. This renames that event to:
- workspace:dirty - Payload is boolean flag for the dirty state
This commit also updates the Palette to use the subflows:change event to
only redraw subflows that have actually changed rather than refresh them
all whenever one of them *might* have changed. This removes a noticable
flicker of the icon which was needlessly being redrawn.