After the WebFlow Editor applet finished loading, you should see three
frames: base editor frame (with a rectangular grid), pallete frame (with
various module buttons) and control frame (with create,
run and destroy checkboxes). To run a minimal demo
('Flip the Frog'), follow the steps below:
Click on InputModule in the palette, move the mouse cursor
into the editor frame, click again there to place the module.
You should get the input popup applet frame with a frog image.
Place the OutputModule in the editor in the same way. You should get
the (empty) output popup applet frame.
Place the FlipFilter module in the editor in the same way. You should
not get any additional visual feedback.
To connect two module ports, click on a color pin of one port, drag
the mouse towards the other port pin (this way you draw a connection
line), and then release the mouse button (when the line connects both
ports) to instantiate the connection. Using this method, a) connect the
InputModule port to the input (left) filter port, and b) connect the
output (right) filter port to the OutputModule port. You should get both
connections represented as blue reclinear curves.
Press run button on the Control Panel to run the module.
You should see the frog flipped in the OutputModule applet.
Press destroy button on the Control Panel. All popup frames
should disappear and the editor frame should be cleared. You can now
edit another graph and run it or just go
to some other page in your browser.