Streamer.bot Actions Docs General Extensions Widgets Tools OBS Plugins With Streamer.bot

Progress Bar v3

Make an easy to set-up dynamic progress bar with Streamer.bot

Action Imports

Twitch

Cheers Followers Subscribers Channel Goal Charity Goal Channel Points

YouTube

Super Chat

Ko-fi

Donations

StreamElements

Tips

Streamlabs

Donations

TipeeeStream

Donations

DonorDrive

Donations

Installation

In Streamer.bot select Import in the top left. Drag and Drop the Import File into the Import String.

Preview of the installation

Configuration

Streamer.bot

  1. Make sure you've imported the import code above.
  2. Make sure that the Server/Clients --> Websocket Server is enabled.
  3. Edit the sample actions to your likings, and link them to their events.

OBS Studio

  1. Make a browser source in OBS Studio with the settings: Width = 1920, Height = 1080.
  2. Put the URL of the widget in the Browser Source, find URL here.

Requests

Request variables can be updated server side. E.g. if you want the update request to contain an extra variable, you can request it and I can add that in the widget and you don't need to re-import your actions, you only need to add a new set argument.

create

Variable Description
id Unique id for the progress bar.
title The title of the progress bar.
maximum The maximum amount before the progress bar finishes.
minimum The lowest value the progress bar can get.
startValue Where the value starts in the bar bewteen minimum and maximum.
‎ ‎
progressBackgroundColor The background of the progress bar.
progressBarColor The color of the bar for the progress bar.
‎ ‎
prependIcon An URL to an image before the progress bar.
appendIcon An URL to an image after the progress bar.
‎ ‎
actionOnFinish An action to run when the progress bar finishes.
actionOnRemove An action to run when the progress bar gets removed.
actionOnUpdate An action to run when the progress bar updates with the update request.
actionOnProgress An action to run when the progress bar progresses.

progress

Variable Description
id Unique id for the progress bar.
value The amount to increase the progress bar.

remove

Variable Description
id Unique id for the progress bar.

update

Variable Description
id Unique id for the progress bar.
value The new value of the progress bar, this doesn't increment or decrement it, this replaces it.
progressBarBackgroundColor The background of the progress bar.
progressBarColor The color of the bar for the progress bar.
progressBarTitle The new title of the progress bar.
progressBarMaximum The new maximum of the progress bar.
‎ ‎
actionOnFinish An action to run when the progress bar finishes.
actionOnRemove An action to run when the progress bar gets removed.
actionOnUpdate An action to run when the progress bar updates with the update request.
actionOnProgress An action to run when the progress bar progresses.

Widget

Put this URL into OBS: https://ik1497.github.io/Extensions/Progress-Bar/

GIF preview of the widget

Preview image of the widget

URL Parameters