So far we've created some basic nodes. We've created text, number, and boolean nodes, and a root node for the final output. While this is fine and well, let's take a minute and think about some nodes we could create that could make our editor more powerful. Here's a few ideas:
- A user node, that outputs attributes of the current user
- A time node that outputs the current time
- A text join node, that combines two strings of text
- Nodes representing mathmatical operations (+, -, *, ÷)
- A find and replace node, for replacing strings of text
- Boolean operation nodes (and, or)
- A window node to expose attributes of the window
- Logical comparison nodes (greater than, less than, equals)
The kinds of nodes your present to your users are entirely up to you. When making this determination, ask yourself questions like,
- What kind of data inputs will my users need access to?
- What kind of logic will be intuitive for my users to use?
- What capabilities make sense to expose to the end user?
Let's get back to our example app.
Adding logic nodes
Let's pick a few ideas from the list above. We'll first create a node that represents the current user, a node that concatenates strings, and a node that reverses a boolean. We already have all the ports we need, so let's add a new user node in
Nothing new to see here, we've just added a node type called
user, with 4 outputs and no inputs. In a later section we'll walk through how to actually hook up the data for this node, but for now let's save and return to our node editor. You should now have a new node available like this:
Let's head back to
config.js and add our "Join Text" node.
As you can see, this node will take in two strings as inputs, and outputs a single combined string. You should now have a new node available in your editor like this:
Now let's add our last node that reverses a boolean.
This node just takes in a boolean, and outputs its inverse. Heading back to the node editor this new node should be available:
So far we've created a useful node editor, but we don't have a way to get our logic graph in and out of the editor. In the next section we'll look at how to save the nodes in our editor so we can use them later.