-
Notifications
You must be signed in to change notification settings - Fork 4
Setup and User Guide
Thank your for using speedcontrol-layouts! This setup and user guide walks you through the setup process for all the new features added by these layouts, and shows you how to use them! Please note that this is not a user guide for NodeCG Speedcontrol, a full guide can be found on their Github repo.
As a reminder, if you're stuck and need some help, feel free to reach out to me on Discord!
This bundle includes full support for Tiltify, using Tiltify's v3 API. Therefore, it can show pretty much anything you want from your campaign on stream. The way it's setup in this layout bundle is to show the donation total in intermission, and show incentives/prizes in the omnibar.
To enable Tiltify support, go into the config (<path_to_nodecg>/cfg/speedcontrol-layouts.json) and change USE_TILTIFY to true. Then, copy and paste your campaign ID and your authentication token. You can change the the API refresh time by changing the value of TILTIFY_REFRESH_TIME. The value is in milliseconds.
Your campaign ID can be found in your campaign URL. It is a 5-digit number. To get your authentication token, go to Dashboard > My Account > Connected Accounts > Your Applications. Click on Create Application, enter a name (doesn't matter what), and enter a redirect URL. It does not matter what your redirect URL is as it is not used by the layouts. Finally, click on Save Changes and copy/paste the secret key to TILTIFY_AUTH_TOKEN.
Make sure to save the file, then launch NodeCG. If everything is correct, your donation total should be showing in the intermission scene and the omnibar! To customize what is shown in the omnibar, please look below at omnibar.
"USE_TILTIFY": true,
"TILTIFY_CAMPAIGN_ID": 12345,
"TILTIFY_AUTH_TOKEN": "YourTiltifyAuthTokenHere",
"TILTIFY_REFRESH_TIME": 5000,With this bundle, it's a breeze to edit the sponsor images shown! All you have to do is to specify the path of each image in the config (<path_to_nodecg>/cfg/speedcontrol-layouts.json)! Just edit/add each image path to the array, in theory you can have as many images as you want. The images will appear in the order of the array.
It's recommended that you put your images in <path_to_nodecg>/bundles/speedcontrol-layouts/graphics/img/logos for organization purposes, although you can also specify a full path if you want. If your putting your images in the logos folder, your image path would be img/logos/<image_name>
You can also specify the fade in, dwell, and fade out time of the sponsor images. The value is in milliseconds.
"fadeInTime": 1100,
"dwellTime": 10000,
"fadeOutTime": 750,
"sponsorImages": ["img/logos/HiG_Logo.png", "img/logos/Charity_Logo_White.png", "img/logos/Speedrun_Logo.png"]The omnibar is a must-have feature for every marathon! You're able to customize what's shown on the omnibar, from static text, hosts, next runs, incentives and more! This is very useful to allow your viewers to see upcoming incentives without them having to go to the Tiltify page manually.
The omnibar is always enabled by default in the config (<path_to_nodecg>/cfg/speedcontrol-layouts.json). In there, you can choose what's shown on the omnibar and how many items are shown. If an item is false, it is hidden on the omnibar and vise versa. The available options are explained below.
-
showHost: Shows the current host. -
showRuns: Shows upcoming runs. Can specify how many runs withnumRuns. -
showTargets: Shows all active targets. Can specify how many targets withnumTargets. -
showPolls: Shows all active polls. Can specify how many polls withnumPolls. Polls will only show the top 3 options. -
showRewards: Shows all active rewards. Can specify how many rewards withnumRewards. -
showGoal: Shows the event goal. This does not show the next milestone.
In addition, for some groups you can specify the number of items that are shown. For example, if numTargets is set to 4, it will show 4 incentives before moving on to the next group.
For any of the Tiltify features to work, USE_TILTIFY must be set to true with a valid campaign ID and authentication token. In addition, the omnibar is smart and can hide incentives that are expired or already met. Also, if there are no more items in a group, the omnibar will automatically skip that group. For example, if there are no more active targets, the omnibar will skip over the targets group and go to the next active group.
The omnibar shows these groups in a set order that cannot be changed. Again, the omnibar will simply omit any groups that are disabled and skip over them. The default order of the omnibar is Static Text -> Current Host -> Next Runs -> Tiltify Targets -> Tiltify Polls -> Tiltify Rewards -> Tiltify Goal. You can also specify the fade in, dwell, and fade out time of the omnibar. The value is in milliseconds.
Finally, you can also customize the text that is shown on the omnibar! Please go to Omnibar Text Customization for more information.
"showHost": true,
"showRuns": true,
"showTargets": true,
"showPolls": true,
"showRewards": true,
"showGoal": true,
"numRuns": 2,
"numTargets": 2,
"numPolls": 2,
"numRewards": 2,
"fadeInTime": 1100,
"dwellTime": 10000,
"fadeOutTime": 750This bundle includes a simple way to show the host on the intermission screen and omnibar! If you followed the installation instructions correctly, you should have a new text field in the Run Editor where you can input your host. Here's a hint, you can also autofill this field if you import your schedule from Horaro!
Similar to the host, you can easily specify runner pronouns! But unlike the host, you can do this on a per-runner basis! All you have to do is to edit the run data and add your runner pronouns next to their name. You can add any runner pronouns you want, it's not limited. The bundle will automatically format the pronouns with brackets, so for example you simply need to enter he/him in the box and it will show up as [he/him] on the layouts. If you leave the pronouns field blank, the layouts will simply not display any pronouns on the layout.
Unfortunately, unlike the host, you cannot import pronouns from Horaro due to a NodeCG limitation. Sad :(
To use these layouts in OBS or any other broadcasting software, it's easy! Since NodeCG graphics are based on HTML, they can be shown in any modern web browser, including the OBS browser source.
To import your layouts, click the Graphics icon in the top-right. This will bring you to a page with all the layouts on it. All you have to do is copy the URL of the layout you want and paste it into a web browser of your choice, for instance the OBS browser source.
For OBS, the width and height of these layouts is 1920x1080. Additionally, it is highly recommended to check Shutdown source when not visible for compatibility purposes. And this should be obvious, create separate scenes for each layout.
If you have NodeCG set up properly, you can actually use these layouts from another NodeCG instance running from another computer. What you have to do is port forward port 9090 on the host PC, then you should be able to access NodeCG using http://<public_ip_address>:9090. Finally, simply follw the steps above to import your layouts into OBS or any other broadcasting software!