the-graph icon indicating copy to clipboard operation
the-graph copied to clipboard

abstract out a model for the whole visual state

Open forresto opened this issue 11 years ago • 2 comments

Model? Store?

We are hooking into noflo.Graph directly, listening for change events to rerender. I'm thinking that an abstracted model will clean up some of the spaghetti.

Inputs:

  • noflo.Graph
  • library from runtime
  • updates from runtime (icon change, error state)
  • selected nodes / edges

Output:

  • object representing entire visual state of graph to feed into React components
    • node position, size, selected / error state
    • port positions
    • edge start/stop points, selected / error state
    • group position, size

If we use an immutable data structure (mori, immutable-js, React.addons.update), and everything is sent to components as props, then all of the shouldComponentUpdate() calls will be simplified to a single, fast ===.

So, the model will be responsible for:

  • initial component library inferred from graph edges (current)
  • node height from # of ports
  • update icons, errors from runtime
  • update ports
    • subgraph changed ports
    • coded component changed ports
    • addressable port connected, show new empty, etc.

forresto avatar Sep 17 '14 07:09 forresto

Is immutable data a bad idea with animation?


Google says: probably. But then again... https://thestrangeloop.com/sessions/clojure-in-unity-3d-functional-video-game-development

forresto avatar Sep 17 '14 11:09 forresto

Once everything rendered is in specifiable via props, intermediate/internal state is in state and all events call callbacks specified in props, then the app can keep the state datastructure however it likes.

jonnor avatar Jun 26 '17 16:06 jonnor