ECL-PiPES

[househippo]

C++ (Hard) => ECL(Easy) => ECL-PIPES (Easiest)



DRAG & DROP to make ECL code

Here are some rough GUI layouts:
https://846a6bcc15e6009871807cef600f8ea ... .09-AM.png

https://846a6bcc15e6009871807cef600f8ea ... .21-AM.png

[gsmith]

If you are looking for some JavaScript which will take the "flow" diagram and do an automatic layout you will find it here: https://github.com/hpcc-systems/Visualization

And an (under development) demo page is here: http://gordonsmith.github.io/Visualization/

[househippo]

Gordan,

Thanks for the recommend. I really like how you can zoom in and out the window with ease.
Was thinking about using jsPlumb. I'm liking the thick connectors ,but that just CSS.

Here is the progress so far, a little more thought out. If anyone has any suggestions or features ideas let me know.

[gsmith]

Disclaimer: I have a vested interest in getting people to use the new Viz framework!

The layout algorithm is independent to the visual rendering (and is from dagre), it does a really good job for these type of hierarchical flows.

Further - if you _did_ adopt the new Viz Widget Framework for each of your "nodes"/"edges" then they would be trivial to plug into a "Graph" view which can do the layout.

Further Again: The core viz libraries will be included in future versions of the platform.

PS - Looking good!!!

[househippo]

Gordan,

Can't get the require.js file to work right.
Could you create a single example page for the just Composition
and have onload="doTest()" execute on a jquery $(document).ready(function(){ doTest(); });

Thank you

[househippo]

Gordan,

Got it to work.
Is there a documentation for methods that I can use?

I see some like
.vertex_click()

are there others like:
.remove_edge()

[gsmith]

The docs don't exist yet, but I am in the process of adding some annotation to help in this matter.

Comments:
The vertex_click is an event that user can hook.

To add/remove items, you need to maintain your own list of "vertices" and "edges", then you simply call .data({vertices: myVertices, edges:myEdges, merge: true}); To merge your changes into the viz.

It would be simple to expose some simple add/remove methods as well.

(as you can see this is very early days, but any real world usage like this is excellent).