Tokavuh Stream Control

This is the instruction manual for the current release. Things may change in the future and all comments are welcome to make things as easy and comfortable to use as possible. If you have any questions please use the Steam Community so we can have a record of issues to help others also. You can also join our Discord for a chat.

The application doesn't connect to any external systems, it only connects to OBS Studio and allows the mobile application to connect to it. The mobile application only connects to the IP address given to it, nowhere else.

Installation

OBS Studio

Make sure you install obs-websocket in the same folder you installed OBS Studio. After starting OBS Studio you should have the settings visible in the Tools menu:

After these steps you can install Stream Control and connect it to OBS Studio. Remember to check for updates to obs-websocket if you update OBS Studio.

Streamlabs OBS

Now you can install Stream Control and connect it to Streamlabs OBS.

Mobile Applications

For Android you can install the application from Google Play.
For iOS you can join the TestFlight and get the app for your devices.

Usage

Start the PC application. The Connect button will connect to OBS Studio and enables the application to control it. Make sure you have the WebSocket plugin installed with default settings and no password, otherwise connect won't work.

Start your mobile application. It will search for the PC apps available on your local network. Select the one and click Connect.

Alternate Connections

On your mobile device you can also open the page http://<your.pcs.ip.address>:7496/Mobile.html and it will connect to the PC application. Replace the beginning with the actual IP address of the PC you're running Stream Control on.

You can also test things out using your PC browser as the mobile device by going to http://localhost:7496/Mobile.html

Mobile Application

The top left icon (blue) indicates the state of connection to the PC app. If it says C it's connected, D is disconnected. You can tap it to connect/disconnect.

The middle icons (green) show the status of streaming and recording. Tapping this area takes you to the stream information page which shows uptime, frame drops, framerate etc.

The bottom icon (yellow) allows changing to volume mode where you can mute and change volume for each source in your setup.

Settings

Clicking on the cog in the top right part of the application brings you to the settings:

You can backup and restore the decks in the application.

You can edit counters you use in the application, for example death or follower counters.

You can link your Twitch account so that the application can change the stream title, game being played, and use chat commands.

You can link your Streamlabs account so you can empty your jar, spin a wheel etc.

You can enable or disable OBS Studio support and select which computer to connect to as well as the password defined in OBS Websocket's settings. By default use localhost to connect to the same computer.

You can enable or disable Streamlabs OBS support and select which computer to connect to. Default value is a dot (.) which means the local computer.

You can enable connections to Elgato Stream Deck. This functionality has not been tested since we don't own the hardware.

Editing Buttons

To add buttons click Edit to enable edit mode.

In this mode you can drag and drop buttons from the list on the left to the button bar.

Selecting a button will allow editing the options for it. Edits happens realtime and you can click Undo to revert if you do something wrong. Note that settings won't save to disk automatically yet, so clicking Save next to Exit Edit is still required. This will change later.

In edit mode double click a button to go inside folders/multifunctions or to test out settings on a button.

When edit mode is off the buttons work like the mobile application so you can test them without the mobile device, or even use it to control OBS Studio by itself.

You can move and swap buttons by dragging them around in the grid. To duplicate a button hold the Ctrl key while dragging it.

To delete a button select it and click Delete in the editing area, or right click and select delete.

In the end remember to press Save to save the changes to disk. At the moment nothing is autosaved so you may lose the edits you made! If you make mistakes editing you can restart the application and the last saved settings will be restored.

Context Menu

While in edit mode you can right click buttons to perform several functions:

Change Grid Size allows setting a different grid size than the default 5x3. The size is basically unlimited.

Embed in Folder creates a new folder and puts the selected button inside it.

Embed in Multifunction creates a new Multifunction and puts the selected button inside it. Useful for example when you have a function on the deck and want to combine it with some other actions. No need to create a Multifunction, drag the button in it etc.

Export saves the button's functionality into a file. You can send this to a friend, or use as a backup. Works also with folders and Multifunctions saving everything inside them. Images are stored as paths so they're not saved.

Import loads an Export file definition of a button and puts it into the deck.

Delete removes a button from the deck.

General Button Options

All buttons have the same general options:

Title
Text to show on the button
Text Color
Color of text on the button
Image
Image shown on the button
Background
Background color of the button
Hotkey
The hotkey to bind to the button
Require Confirmation
Require user confirmation before performing the action

Togglable buttons also utilize:

Image Active
Image to show when the button is active
Background Active
Background color of the button when active

Togglable buttons change between Image/Image Active and Background/Background Active depending if the target is on or off. Currently togglable buttons are Mute Toggle and Hide Toggle.

All Duration values are in milliseconds, so 1000 is one second.

Button Types

Folder

Folders can be used to group functions into separate views and provides unlimited amount of buttons. Drag a folder to the deck, go into it (double click on edit mode) and you can drag more items into it. Every folder by default has a back button also to get back to previous level.

Multifunction

Multifunction looks like a folder and is edited in the same way but it behaves very differently. On the mobile device and out of edit mode it is a button, not a folder. When it's pressed everything inside it will be run, sequentially or concurrently. This allows for performing multiple functions at once, for example a Be Right Back screen:

All this can be done on one button. And of course going back to game screen can do similar things changing scene, enabling game audio and microphone etc.

If you select Concurrent mode all the actions are run at the same time. This works nice for example for animations, which shouldn't happen after each other. You can also put Multifunctions inside Multifunctions to make more complicated features and mix concurrent and sequential running.

Change Scene

Changes the scene to whatever is selected. Scene collection can be left empty, which means the current collection is used. Scene name must be set.

Mute/Unmute Source

Mutes or unmutes a source that's in the mixer, for example, Mic/Aux or Desktop Audio. Usable in Multifunctions to set the state explicitly. If you set the Duration the volume is faded during that time and not just turned off/on immediately.

Mute Toggle

Toggles mute state. Will show different color and image based on the state. Usable in interactive buttons for example to mute/unmute microphone and showing the state. If you set the Duration the volume is faded during that time and not just turned off/on immediately.

Hide/Unhide Source

Hides or shows an item on the screen. Usable in Multifunctions to set the state explicitly. Scene can be left empty, in that case the Source selected will be hidden or shown in the currently active scene.

Hide Toggle

Toggles visibility state. Will show different color and image based on the state. Usable in interactive buttons. Scene can be left empty, in that case the Source selected will be hidden or shown in the currently active scene.

Source Volume

Changes the volume of a source. Allows either absolute value (0-100) or prefix with < or > for changing current value. For example, a setting of >20 will add 20 to the current volume every time the button is pressed.

Use the Duration setting if you want to fade the volume rather than just set it immediately.

Move Item

Changes the position/scale/crop of an item on the screen. For example, texts or images can be moved around. Maybe you need different webcam positions based on games? Just set them up and with a press of a button it will be moved there.

Coordinates and scales allow either absolute values or prefix with </> to change current value. For example, setting X to >50 will move the item 50 pixels to the right every time the button is pressed.

Use the Duration setting if you want to animate rather than just set the position/scale. Using zero here will disable animating and just move the item.

Start/Stop Streaming/Recording

Will start or stop streaming or recording with the settings and profile currently selected in OBS Studio. You'll probably want to use Require Confirmation on these to make sure accidents don't happen.

Select Transition, Transition Time

Selects the transition to use and the Duration of the transition.

Keypress

Presses keys on the PC. Requires more explanation on how to set Ctrl/Alt/etc combinations. Normal text/keys can be just written in, for example "Hey you", without quotes will write that out to whatever application has focus.

If you need special keys, you can use these:

If you need Alt, Ctrl, Shift use these:

+A
Press Shift-A
^D
Press Ctrl-D
%A
Press Alt-A

If you need to press multiple buttons while Shift, Ctrl or Alt is down, use parentheses. Otherwise the modifier only applies to the next button. For example, +(ASD) presses A, S, and D while Shift is down whereas +ASD presses A with shift, followed by S, and D without shift.

You can also combine Shift, Alt, and Ctrl: +^{ESC} is Shift-Ctrl-Esc.

If you need to have pauses between key commands create a Multifunction and add Keypresses within separated by Delays with the desired Durations in milliseconds.

Note: Since +, ^, %, (, and ) have special meanings if you want to press those keys put them in curly braces {}. So sending a + key would be {+}.

Run Program, Open URL

Runs a program on the computer or opens a web site on the default browser.

Pause

Pause function is usable in Multifunctions to pause operations. Duration is in milliseconds.

Counters

Counters can be set to show on stream and controlled through the system.

The Amount field defines how the control works:

There are two ways to show counters on screen: through a Browser Source or a Text item

To show counter on the screen create a BrowserSource and set the URL as http://localhost:7496/Counter.html for it to show. Note: if you start OBS Studio before Stream Control PC app OBS might not open the counter. If this happens just right click on the BrowserSource you created, click Properties and OK. OBS will then reload the page.

You can always test the counter showing by making a Counter button with Amount of +0. This means nothing is changed but the counter value will still show and you can see it on OBS and make sure it's up. Counter will always count even if it's not shown on OBS.

You can also set a Text item on the screen if you want to show the text on screen all the time. Text template defines how it's shown. Use ### as placeholder for the value. For example, a template of "Death count is now ###" will make the text show "Death count is now 123".

The counters are defined in the Settings which can be accessed via the cog in top right part of the application.

Multimedia

Different multimedia keys like they would be pressed on a multimedia keyboard. Play/pause, next, previous, stop, mute, volume up, volume down.

Play Audio

Select the audio file you want to play and set the volume. The button will activate playback and pressing it again will stop it if needed.

Set Text

Select the text item name and content you want to set.

Set Image

Select the image item name and path to the image you want to set to it.

Random Image

Select the image item name and path to a folder containing images. Activating the button will select a random image from the folder and set it to the image item selected.

Animate Scene

Allows animating whole scenes with all items moving at the same time. This requires quite a bit of setup in OBS Studio to get it running properly. The Animation Scene selects which is the scene you show on screen and which should animate to look like the Source Scene. You select the Animation Scene to be shown on OBS Studio and when you press this button all the items there will move, scale, crop to the values they have in the Source Scene. This means you won't use Change Scene to switch to scenes, you use a temporary scene and Animate Scene to make things flow nicely.

This means you have to set up all items on every scene you want to animate between, even if they are not shown. This is easiest by cloning, but OBS still makes things difficult, especially when you've already made your scenes and just want to make them animatable. In the future we will hopefully add features to ease the use in this case.

To try this out, make a scene with items, name it Animate. Then duplicate that scene a couple of times. Edit those scenes however you want, move items around, rotate etc. Then add Animate Scene button with the Animation Scene set to Animate and Source Scene set to one of the modified scenes. Select Animate to be shown on screen and click on the buttons. You should see the items animate to look like the scenes you modified. Fancy! Don't forget to set the Duration or it'll happen in an instant.

Using Animations

This is outdated and will be updated with the new animation features

Move Item and Volume have Duration option on them. This controls during which time the moving/volume setting occurs. Use zero for immediate setting, anything larger will animate. All animations in a Multifunction will run concurrently so you can move multiple items at the same time. If you want to animate separately add a Delay between the items.

For example:

This will nicely fade game volume up while fading Beginning music down and in the end start a transition to game scene near the end of the fade. Assuming transition time of 300ms when the transition ends it will move camera from outside the screen to its position on the left side.

If more than 14 items are needed folders can be added. Later on Multifunctions will allow a bit better editability than at the moment.

Version History

Main fixes in different versions, all include also general enhancements.

Version v1.0.20:

Version v1.0.19:

Version v1.0.18:

Version v1.0.17:

Version v1.0.16:

Version v1.0.15:

Version v1.0.14:

Version v1.0.13:

Version v1.0.12:

Version v1.0.11:

Version v1.0.10:

Version v1.0.9:

Version v1.0.8:

Version v1.0.7:

Version v1.0.6:

Version v1.0.5:

Version v1.0.4:

Version v1.0.3:

Version v1.0.2:

Version v1.0.1:

Version v1.0.0:

Version v0.9.8 includes among other things:

Previous enhancements:

© Tokavuh Technologies oy