◷ Reading Time: 3 minutes
When we talk about Flow, it covers the topic of Workflow as well. Generally, Workflow is a type of flow that can handle long-running business transactions. The Flow editor supports normal Flow as well as Workflow authoring.

Toolbox
The editor supports an out-of-the-box toolbox control that allows users to drag items from it and drop these onto the canvas. It makes it very easy for you as a developer to just show the toolbox and let your users take care of the modeling. The toolbox is divided into different groups of controls. By clicking on each group in the toolbox these expand and collapse.
API
Loading
// Creates the flow or workflow editor from an HTML element // return: reference to flow or the workflow editor toFlow() // Load the flow or workflow content // content: string content of flow or workflow in XML format loadFlow(content)
New
// Creates a new flow editor newFlow() // Creates a new workflow editor newWorkflow()
Generate Model
// Generates the XML representation of Flow or Workflow getFlow() // Generates the XML representation of Flow or Workflow layout and displays information getFlowInfo()
Retrieving Nodes and Transitions
// Reads the actual model nodes so these can be updated by manipulating the returned JSON objects getNodes() // Finds a node using its unique name in the actual model recursively // name: a strong name of the node findNode(name) // Finds a node's transition by its unique name in the actual model recursively // name: a strong name of the node's transition findTransition(name)
Updating Node
To update a node, simply use ‘findNode’ to find a node and then update the JSON object.
Attributes in the JSON object start with '_'
The code below would update the expression attribute of a node:
flow.loadFlow(flowXml, flowHelper); var node = flow.findNode("Assign1"); node._expression = "person.Age=25";
Parameters
signature on a web editor gives you the declaration section of logic. This allows you to manage the value and types parameters of your logic in JavaScript.
var flow = flow.loadFlow(flowXml, flowHelper); var signature = flow.signature; // and now you have access to signature of the logic // ...use properties and methods descried in API section...
API
Properties
// Returns input parameters inputs // Returns output parameters outputs // Returns input-output parameters inputOutputs
Methods
// Adds input parameters addInputs(names) // Adds output parameters addOutputs(names) // Adds input-output parameters addInputOutputs(names)