Thanks to @Ivan Reese for coming up with the idea and putting it in my head: I've added a new feature to code flow canvas.. you can now drag and drop arbitrary values which are on the canvas on edges (or use the clipboard). I've made a small video about and you can see it here: . Off course you can try it yourself on demo.codeflowcanvas.io

oh thats a very nice interaction! Its really invites playing with it.

Thanks! This is just the first iteration, I am definitely going to develop it further.

Using expressions as values is brilliant. That's a fantastic insight.

Thanks! 😊 That expression compiler in code flow canvas is really handy.. it's used in a lot of places already and just recently I also implemented a json-mapper node which can have expression in them to generate values for the output json. So it was a no-brainer to add it to these draggable values as well 😀

For Hest, I've been intending to add support for ambiguous values, or constrained values, to help with reversing non-injective functions (see link for examples). Now, those special values might also make it possible to place any function on a wire. If it's an expression that can be fully evaluated, it works just like what you've shown. But if it can't be fully evaluated, we use amb or constraints (or something) to represent the possible results of the function, and let those flow through the graph. At this point, the distinction between nodes and values gets pretty blurry. I've also been feeling out the blurry boundary between wires and values. And FP, OO, et al have done a good blurring the boundary between functions and data. So there might be some good realizations that could fall out of a mapping exercise like this:

Suggestion [forgive me, if I've missed noticing that this is already possible]: at 1:44 I would like to de-clutter the diagram by lassoing parts of it and making another diagram ("layer") with the lassoed part. I would like to see the diagram at 1:44 reduced to only 7+-2 boxes, with the details elided to other layers/diagrams, then be allowed to drill down into the sub-diagrams at will if I really want to see more detail.

@Ivan Reese the expression in the draggable values are actually evaluated before the value is put on the flow. So only values flow over the edges. Edges can have weights attached to them, but I dont really use that yet (only in a small neural network example)

Ah, I'm thinking of doing more than placing an X. I'm thinking: explore that design space in depth :)

Ah 😄 , but aren't we already doing that then in our projects? We could plan a session to talk more about it and share experiences/ideas or have an open discussion about it on one of our FoC meetups?

Yeah, though I think this sort of thing is a good async exercise. I'm going to spend a bit thinking about what could be done with the idea of "let the flowing values be functions"

consider scaling travel-on-wire speed with canvas zoom level. Now looking at zoomed-out overview is comfortable, but zoomed in (single wire) is way too fast

Thanks for the suggestion, I am going to experiment with it (there's already a run speed slider on the top left corner btw.. which can even be set at fullspeed and then no animations are shown)

Hest used command-up and command-down to adjust the run speed by powers of ten. That felt pretty good, but I think it'd be even better if the speed control were "closer" to my mouse hand, and more continuous. Maybe command-scroll? This feels kinda like a game design problem — tuning the inputs until they feel perfect and just disappear.

is animation = execution?

Yeah, that's a good observation. Though I feel like this is true of any system where you see "inside" the running state of the program as it executes — printf, breakpoints, state machine visualizations, etc. I wonder how it could be different.

the difference between printf/logs and this coupling is - you can inspect logs later

Ah, interesting. So execution could be recorded and then played back later.

yes. either playback as in "execute again", or just "sequence of logs mapped only rendering of the system", like subtitles over movie

Or like "instant replay"

(it seems) the only downside of playing back logs, and not live execution - you can't "oh, it does not look right, slow down, slow down!"

Or, instead of a

debugger

statement that grinds execution to a halt, you can put in a

slow down

node that (when triggered) pulls you over to that spot to watch closely what happens.

well, you_can_just™

(while true (try incomplete-program (catch Exception (recur))))

and have it play latest animation. so you drag-grop-edit nodes while wires are pulsing

Next to the things mentioned here, something that I want to improve in codeflowcanvas is the timeline slider. Currently it is a html input range control which is not sensitive at all. I want something that when you scrub over it slowly gives a different experience and handling then moving over it fast. Perhaps it even shouldn't have a thumb , although you want a visualisation of where you are on the timeline I think.