StreamGraph Wiki

StreamGraph is a node graph-based virtual stream deck.

Check out the node index for a list of nodes or read on for an overview of the general concepts.

⚠️WARNING⚠️

StreamGraph is still in an alpha state. This means that the authors do not consider it stable or complete enough for real usage. While we try to make sure it works as intended, we make no guarantees for stability. If you encounter an issue, please report it on the issue tracker with as much detail about how to reproduce it as possible.

Additionally, this wiki too is still in progress. It may be incomplete or out of date, or just plain wrong. If you have questions, it's best to ask on the issue tracker.

Overview

Decks

StreamGraph provides a node graph with nodes that interact with each other in various ways, as well as with OBS (via OBS-WebSocket) and Twitch.

A file opened with StreamGraph is called a "deck". A deck is a graph containing nodes that each do something, like a button that can be pressed, or send a message to a Twitch channel.

When opening the app, you will be presented with an empty screen like this:

To create a deck, press Ctrl+N or use the menu bar at the top left, File -> New. Alternatively, you can press the + button. A new tab will open with an empty graph.

To move around the graph, hold the middle mouse button and pan the mouse, or hold Space and hold the left mouse button and pan.

To add a node to the graph, right click anywhere on the graph. A menu will be presented with a list of nodes. To navigate the menu, you can either use the arrow keys, or scroll with the mouse. To add the node, either click on its name or press Enter with the node highlighted.

You can also mark a node as favorite by clicking the star next to its name. To search for favorite nodes, you can search for #f anywhere within the search term. Nodes are also separated into categories. You can filter for nodes in a specific category by searching for #c category name.

For more information on the general concepts behind nodes, check out the Nodes page. You can also check out the node index to find out what each node does. Nodes have a brief description in the app, as well.

Groups

Any Deck can have any number of groups. Groups are just like any other deck except for a few differences:

• Group decks can have two special nodes, Group Input and Group Output. Their purpose and use is explained below.
• Groups are represented by a special Group node in the group's parent deck.

To make a group, select some nodes and press Ctrl+G. The nodes will be moved to the new group deck and in their place a new node will be created. This group node is the interface between the parent deck and the group.

To enter the group, select the node it's represented by and press Tab. A new deck tab will open with the group's contents.

You will notice two extra nodes in the new deck: Group Input and Group Output. The ports on those nodes and shrink in number depending on how many of them you connect to other nodes.

Data is fed to the input and output nodes via the group node. The group node can also be duplicated, creating a new instance of the group.

Group instances are copies of the group deck, but they allow for different "entry" and "exit" points out of it, letting you use groups like functions with different "parameters" in a programming language.

Inspector

The inspector, located in the sidebar (default shortcut: T), allows editing deck and node properties, such as library group name and description and node port values. It also shows the list of nodes in the currently open deck.

Library groups

Library groups are a special kind of group: they are designed to be shareable and reusable, and can be added to a deck in the same way as nodes; they function the same way as group nodes in a deck.

Creating library groups

Library groups are still decks at the core, so they can be created from existing decks or make one from scratch. To be considered a library group, a deck must satisfy the following conditions:

• It must have at least a library name defined. This can be done in the inspector, under Deck -> Library Group,
• It must have one of either Group Input or Group Output nodes,
• The deck file must be saved in a searchable path (see Library group search paths).

Customizing library group ports

The input and output ports of a library group can be customized, such as changing the label (i.e. port name), data type and usage type. For advanced uses, the descriptor of a port can be changed as well, but it should be used with caution. These will be reflected on the group node and input/output nodes.

Important

While custom descriptors will be reflected on the group input and output nodes, the data flow will not consider values typed into these ports inside the library group. That means it is not possible to have placeholders or default values. If you need that behavior, you must implement it using nodes instead.

Library group search paths

Library groups are loaded from the paths defined in the Settings dialog (Edit -> Settings -> General or Ctrl+Comma by default). There is one path that is always active, which is a folder called library_groups in the app directory. Custom paths can also be added and ordered. The order matters when loading: if two or more library group files share the same file name, the one that was found in the folder which is highest in the list will "claim" that file name, and others will not be loaded.

Library group files can be placed in any subfolder in the folders defined in the search paths, and the folder the file is in will determine the category it appears in the add node menu. For example, if a library group file is in the top-level library_groups folder, the category will appear as "Library Groups", if it's in library_groups/twitch, the category will be "Twitch", and if it's in library_groups/twitch/obs, the category will be "OBS".

Shortcuts

All shortcuts in the app are editable in the Settings dialog (Settings -> Shortcuts).

The most common default shortcuts are:

• Ctrl+N - New Deck
• Ctrl+S - Save Deck
• Shift+A or right click - Add Node
• Ctrl+Comma - Open Settings

Bottom dock

The bottom dock contains two tabs: "Console" and "Variables". It can be resized by left-dragging the grabber between the scroll bar and the tabs.

Console

The Console contains text output from nodes, decks, and other sources. It may be regular text, such as the output from a Print node, warnings or errors. A lot of things will print to the console, so it is a good idea to check on it.

Variables

The Variables tab contains a variable inspector that lets you view, edit and add variables on the currently opened Deck. It is split into three columns: Name, Value, and Type.

To add a new variable, make sure you have a Deck open and press the "New" button at the bottom of the dock. A new variable will be added to the Deck and the inspector.

To change the name of the variable, double-click it in the Name column, type in a new name and press Enter. Similarly, to change the value, double-click it in the value column.

Variables, like ports, have types. By default, when creating a new variable in the inspector, it will be a String. You can change the type of the variable by double-clicking it in the Type tab, which will open a dropdown list allowing you to select a different type. If the old type can be converted into the new one, it will be converted automatically, e.g. a String variable "0.5" converted into a Numeric type will become the number 0.5.

Unlike many programming languages, there are no restrictions on variable names in StreamGraph: they can be any string, include spaces, and can start with a number.

To delete a variable from the Deck, click the trash can icon to the right in its row.

When the currently active variable is of type Array or Dictionary, the "New" button will add a new element to the container instead of a new variable. Arrays and Dictionaries in StreamGraph can have any type of data inside (and while theoretically Dictionary keys may be of any type, this isn't used anywhere and String keys are used instead). When a container type has elements inside it, it can be folded and unfolded by either double-clicking it in the Value column or clicking the arrow to the left in its row.

The variables in the inspector can be used immediately with nodes like the Get Deck Var node. Similarly, any variables created by nodes in a Deck will be shown and updated in the inspector.

Connections

OBS

To connect to OBS, make sure you have a modern version of OBS installed along with OBS-websocket version >5.0.0. OBS 30 and later come with OBS-websocket bundled in.

Currently, connecting to one local OBS-websocket instance is supported.

To connect, go to the Connections menu in the top menu bar, and select "OBS...". Enter the obs-websocket password (which can be created or obtained in OBS by going to Tools - obs-websocket Settings) and port (4455 by default in both obs-websocket and StreamGraph). If you wish, you can click on the "Subscriptions" button to expand a menu and select the events you would like to subscribe to. By default, it will subscribe to all non-high volume events, which is fine for most use cases. Click the Connect button to connect.

If everything went fine, the button should change to say "Disconnect". Click OK to close the dialog. You now have the ability to use OBS nodes.

Twitch

Currently, only connections to a single Twitch chat are supported.

To connect to Twitch, go to the Connections menu in the top menu bar, and select "Twitch...". Click the Authenticate button (you can leave the Custom Client ID field blank to use StreamGraph's). This will open a browser with Twitch prompting you to grant access to StreamGraph. Click Accept and wait for a blank page to be displayed in the browser. When it is, go back to StreamGraph and enter a channel name in the "Default Chat Channel" field. This will usually be your own chat. Click OK. After a few seconds, you will have the ability to use the Twitch nodes.