Full widget settings guide - Redo7/the-ultimate-streamathon-timer GitHub Wiki

Setup

Start time: (min) The time the countdown starts

Alignment: Left Center Right Which side of the bounding box should the widget be aligned to?

The widget may appear in an "expanded" state depending on a few factors like incoming alerts, or the display of the info chart, which when setup incorrectly may result in clipping the contents on stream.

If you want to display the widget on the left side of the screen, set this dropdown to Left. If the widget is nowhere near the edge of the screen you can leave it at Center

User currency display: Code ex. USD Symbol ex. $ What should the <currency> tag be converted to?

This will display the currency you have set up on StreamElements

It's not really necessary to change this at all since any text fields within the widgets are editable and you can put the text in manually if you'd like. But this way the widget comes pre-set with the currency you have set up on your StreamElements account.

Widget scale: The scale/size of the widget

Font name: (fonts.google.com) Name of the font you want the widget to use.

Only fonts listed on Google Fonts will work.

Do note some fonts have only 1 weight, meaning that you won't be able to change it with any of the XYZ font weight fields.

Font size: (px) This is the "Global" font size of the widget. Most of the values used internally scale from that one. You should most likely use Widget Scale instead.

Title & Subtitle

Title

Title Title text

Title font size: The size of the title text

Title font weight: How thick should the title font be?

Title font spacing: How spaced should the letters in the title font be?

Title angle: (deg) The rotation angle of the title text

Title X position: (%) The X (horizontal) position of the title within the widget bounding box.

Title Y position: (%) The Y (Vertical) position of the title within the widget bounding box.

Subtitle

Subtitle Subtitle text

Subtitle font size: The size of the subtitle text

Subtitle font weight: How thick should the subtitle font be?

Subtitle font spacing: How spaced should the letters in the subtitle font be?

Subitle angle: (deg) The rotation angle of the subtitle text

Subtitle X position: (%) The X (horizontal) position of the subtitle relative to the Title.

Subtitle Y position: (%) The Y (Vertical) position of the subtitle relative to the Title.

Countdown

Timer font size: The font size of the countdown

Countdown font weight: How thick should the countdown font be?

Clip the timer text Should the numbers be clipped if they were to go outside of the main widget body?

The countdown number can go outside of the widgets main body depending on the Animation setting. Some may like it, some may not.

Overflow

Force monospace font behavior Should the countdown digits be forced to have the same width?

Most fonts have varying width of different characters (e.g. 0 and 1), which may cause "jittering", or small shifting of the widget when the counter gets updated.

Enabling this setting and changing Monospace width should prevent that from happening, resulting in a nicer look and smoother animation. But it may result in slightly decreased readability and inconsistent visual spacing.

Monospace width: (px) What width should the digits be?

  • Requires Force monospace font behavior to be enabled.

Time's up text: The text to display when the countdown reaches 0

Time's up font size: The size of the Time's up text

Time's up text font weight: How thick should the Time's up font be?

Commands

Commands are specific messages sent in your Twitch chat. It is recommended to have some kind of prefix (e.g. ! or anything you'd like) in order not to accidentally trigger widget functions.

Viewer commands: Which commands should be made available for ANY viewer to use?

Warning

Do not put any important commands in the Viewer commands field! I am not responsible for any havoc this may cause.

Moderator commands: Which commands should be made available for moderators to use?

Note

Any commands entered in the fields above will also enable their aliases and subcommands Example: Adding !additions would also enable !timeadditions, !pointadditions, and !goaladditions Adding !pause would also enable !pause additions, and !pause all

Aliases

Aliases should be separated with a comma within their fields. Any spaces will be ignored. E.g. !additions, !timeadditions, !pointadditions, !goaladditions will result in 4 commands bringing up the same function.

Caution

None of the aliases are hard coded. If you delete them from their field, the command will not work!

Start widget command alias: Start countdown

Pause widget command alias: Pause countdown. Any time or point adding events will still work.

Pause additions subcommand alias: Pause just the time or point adding events

Pause all subcommand alias: Pause time AND time or point adding events

Time adjustment command alias: By default, this command allows you to add or subtract time from the countdown by invoking it with it's subcommands and options.

E.g. !time add 1h30m will add 1 hour and 30 minutes to the countdown.

The options are as follows:

  • d - Days
  • hr - Hours
  • h - Hours
  • min - Minutes
  • m - Minutes
  • sec - Seconds
  • s - Seconds

Reset time subcommand alias: Subcommand to reset the time to the amount of minutes set in Start time: when invoking the !time command By default: reset

Add time subcommand alias: Subcommand to add time when invoking the !time command By default: add and +

Subtract time subcommand alias: Subcommand to subtract time when invoking the !time command By default: sub and -

Set current amount command alias: Set the current amount of points to a specified amount

Add to current amount subcommand alias: Subcommand to add an amount to the current amount of points. By default: add and +

Subtract from current amount subcommand alias: Subcommand to subtract an amount from the current amount of points. By default: sub and -

Expand / collapse goals command alias: This toggles the expansion of the 3 goals visible above the countdown.

Show all goals subcommand alias: Displays a scrolling box with all the remaining goals inside

Goal command alias: Allows you to add, edit, or delete a goal.

Any additions, edits, or deletion will refer to the <amount> value

Usage (if left default): <command> <subcommand> <amount> <options> !goal add 10 Chat choses my PFP for a week !goal edit 10 Chat chooses my PFP for a week !goal delete 10

!goal add <number> will edit a goal if it already exists, and !goal edit <number> will add a goal if it doesn't yet exist.

Goal add subcommand alias: Subcommand to add a goal when invoking the !goal command

Goal edit subcommand alias: Subcommand to edit a goal when invoking the !goal command

Goal delete subcommand alias: Subcommand to delete a goal when invoking the !goal command

Toggle time/point info chart command alias: Toggles the the display of the info chart containing time and point additions

The preference is saved. Meaning next time the widget is loaded it should automatically show up.

Toggle total amounts command alias: Toggles the total amount of subscriptions, donations, cheers, follows, and raids received.

This displays the Amount not the Count of events received Meaning when getting a $5 donation, the counter will increase by 5, and not 1

The preference is saved. Meaning next time the widget is loaded it should automatically show up.

Toggle end time command alias: Toggles the display of the time when the marathon will end at the current point in time.

The preference is saved. Meaning next time the widget is loaded it should automatically show up.

End time

End time label End time title label

End time font size: The font size of the end time text

End time font weight: How thick should the end time font be?

End time title font weight: How thick should the end time label font be?

End time locale: Which language should some of the variables be displayed in?

Please note that for some languages, there is both a generic language code and a country specific language code.

End time format The format to display the end time in.

Options:

  • seconds - Seconds
  • minutes - Minutes
  • hours12 - Hours in a 12-hour format
  • hours24 - Hours in a 24-hour format
  • ampm - am / pm
  • AmPm - Am / Pm
  • AMPM - AM / PM
  • dd - Day with a leading 0. E.g. 02
  • shortWeekday - Shortened day of the week. E.g. Tue for Tuesday
  • longWeekday - Full day of the week. E.g. Tuesday
  • mm - Month with a leading 0. E.g. 02 for February.
  • mon - Shortened month. E.g. Feb for February
  • month - Full month. E.g. February
  • year - Year. E.g. 2025
    • If you plan on traveling in time, please do not use the widget before January 1st 1970

By default:

Input: shortWeekday month dd year hours12:minutes:seconds AMPM

Output: Sat April 12 2025 01:58:20 PM

Goals

These all the goals you want to have during your marathon Visible above the countdown, as well as the scrolling view (!goals all).

Important

It is recommended to add the widgets using the !goal add command for best results. If you have OBS open (with the widget added to the scene), you may experience issues if you're going to add the goals through the StreamElements overlay.

Goal amount: (points) The amount of points of the goal

Goal text: The text description of the goal

Add / Update Goal Adds or Updates the goal with the amount you put in the Goal amount: (points) field

Delete Goal Deletes the goal with the amount you put in the Goal amount: (points) field

Current goal amount font size: The font size of the current goal amount text

Current goal amount font weight: How thick should the current goal amount font be?

Goal amount font weight: How thick should the individual goal amount font be?

Goal text font weight: How thick should the individual goal text description font be?

Scroll goal text if longer than # characters: If the goal text description is longer or equal to this amount, the text will scroll from right to left. (Like a news anchor)

Long goal text scroll time: (s) How long should the text go from right to left if it's too long?

Expand goals every # min: How long should the Goals stay visible after displaying?

Collapse goals after # min: How long should the Goals stay visible after displaying?

Requires Expand goals every # min field to be a non-zero value.

Delay initial goal expansion by # min: How long should the display of the goals` be delayed by after first loading the widget?

The widget will wait # minutes before first displaying the goals.

Point additions

The amounts of points to add to the current goal counter when any of the listed events occur.

Follow:

Tier 1:

Tier 2:

Tier 3:

Prime:

Tip: (points per min. tip amount) The amount of points to add per the Min. Tip amount: field

Cheer: (points per min. cheer amount) The amount of points to add per the Min. Cheer amount: field

Raid: (points per min. raid amount) The amount of points to add per the Min. Raid amount: field

Save Points

Important

Make sure you click the Save Points button to save the changes you made. If you save just the overlay the changes WILL NOT be committed

Time additions

The amount of seconds to add to the countdown when any of the listed events occur.

Follow:

Tier 1:

Tier 2:

Tier 3:

Prime:

Tip: (seconds per min. tip amount) The amount of time to add per the Min. Tip amount: field

Cheer: (seconds per min. cheer amount) The amount of time to add per the Min. Cheer amount: field

Raid: (seconds per min. raid amount) The amount of time to add per the Min. Raid amount: field

Save Times

Important

Make sure you click the Save Times button to save the changes you made. If you save just the overlay the changes WILL NOT be committed

Fractions

When disabled, the widget will add X amount of time for each Y event amount

E.g. If Cheer is set to 60 and Min. Cheer amount: is set to 100. The widget will add 1 Minute for every 100 Bits. So, if someone donates 250 bits, 2 minutes will be added, and the 50 bits will be ignored.

When enabled, there is no minimum amount that will add a time. Instead the widget will add a fraction of the time for the fraction of the Min. XYZ amount field.

E.g. If Cheer is set to 60 and Min. Cheer amount: is set to 100. The widget will add 1 Minute and 30 Seconds for 150 Bits, 1 Minute for 100 Bits, 30 seconds for 50 Bits, 15 seconds for 25 bits, [...]

Use fractions for tips

Use fractions for cheers

Use fractions for raids

Min. Amounts

Minimum amount that makes the event count towards time and point additions.

When fractions are disabled, this is also the amount used for rounding down the time and point additions. e.g. Min. Cheer amount is 200, somebody cheers 1250, the widget will only count it as 1200 was cheered, because it rounds down to the amount set in Min. Cheer amount. Which in this example is 200

Min. Tip amount:

Min. Cheer amount:

Min. Raid amount:

Info chart

Only events with a non-zero Time or Goal addition amount get displayed

Info chart label The label displayed on top of the info chart

Info chart label font weight: How thick should the info chart label font be?

Info chart font size: The font size of the info chart label text

Info chart font weight: How thick should the info chart font be?

Labels

Labels for each of the events

Follow label

Tier 1 label

Tier 2 text

Tier 3 label

Prime label

Tip label

Variables:

  • <currency> -The currency of your StreamElements account. The type it displays is controlled by User currency display field
  • <amount> - Amount in Min. Raid amount field

Bits / Cheers label

Variables:

  • <amount> - Amount in Min. Raid amount field

Raid label

Variables:

  • <amount> - Amount in Min. Raid amount field
Labels for each of the event descriptions

Variables:

  • <time> - The amount of time the event adds
  • <points> - The amount of points the event adds

Follow text

Tier 1 text

Tier 2 text

Tier 3 text

Prime text

Tip text

Bits / Cheers text

Raid text

Show additions chart every # min: Should the info chart show up ever # minutes?

Set it to 0 to not display the info every # minutes

You can still show and hide it via commands

Hide additions chart after # min: How long should the info chart stay visible after displaying?

Requires Show info chart every # min field to be a non-zero value.

Delay initial additions chart appearance by # min: How long should the display of the info chart be delayed by after first loading the widget?

The widget will wait # minutes before first displaying the info chart.

Total amounts

Totals X position: (%) The X (horizontal) position of the Total amounts within the widget bounding box.

Totals Y position: (%) The Y (Vertical) position of the Total amounts within the widget bounding box.

Labels

Each label has access to the <amount> variable.

Follow text

Sub text

Tip text

Variables:

  • <currency> -The currency of your StreamElements account. The type it displays is controlled by User currency display field

Bits / Cheers text

Raid text

Show totals every # min: How long should the Total amounts stay visible after displaying?

Hide totals after # min: How long should the Total amounts stay visible after displaying?

Requires Show totals every # min field to be a non-zero value.

Delay initial totals appearance by # min: How long should the display of the Total amounts be delayed by after first loading the widget?

The widget will wait # minutes before first displaying the Total amounts.

Pause

Countdown paused text: The text to display when the countdown is paused but events still go through

Additions paused text: The text to display when just the events are paused

Additions and Countdown paused text: The text to display when the countdown and the events are paused

Pause text font size: The font size of the pause text

Pause indicator font weight: How thick should the info chart label font be?

Sleep indicator font size: The font size of the sleep indicator animation (Zzz)

Sleep font weight: How thick should the Sleep indicator font be?

Alerts

Alert font size: The font size of the alert text

Alert font weight: How thick should the alert font be?

Alert tier font weight: How thick should the alert tier font be?

The tier is only displayed for subscriptions.

Toggles

Each of the toggles below toggles the appearance of an alert when it's event happens.

This does not prevent the event from adding time/points.

Show follows

Show subs

Show resubs

Show gifted subs (Direct) This event happens when someone gifts a sub to a specific viewer

Show gifted subs (Bulk) This event happens when someone gifts sub(s) to random people in the chat

Show tips

Show cheers (Bits)

Show raids

Labels

Each label has access to the <username> variable.

Follow text

Sub alert text

Resub alert text

  • Variables:
  • <amount>

`Gifted sub alert text (Direct)

  • Variables:
  • <gifter> - The person who sent the gifted sub
  • <recipient> - The recipient of the gifted sub

`Gifted subs alert text (Bulk)

  • Variables:
  • <amount>

Tip alert text

  • Variables:
  • <amount>
  • <currency> -The currency of your StreamElements account. The type it displays is controlled by User currency display field

Bits / Cheers alert text

  • Variables:
  • <amount>

Raid alert text

  • Variables:
  • <amount>

Sound

Note

Sounds may not play when you test your alerts directly in the StreamElements overlay, due to modern browsers "requiring the user to interact with the browser in order to play audio" If you add the widget to OBS, the sound should work just fine.

The fields are pretty self-explanatory

Follow sound Follow alert sound volume

Sub alert sound Sub alert sound volume

Resub alert sound Resub alert sound volume

Gifted sub alert sound Gifted sub alert sound volume

Bulk gifted subs alert sound Bulk gifted alert sound volume

Tip alert sound Tip alert sound volume

Cheer alert sound Cheer alert sound volume

Raid alert sound Raid alert sound volume

Theme

Theme: Default Coffee Eden Sakura Custom

Note

In order to see the changes made to the fields below take effect, the Theme field needs to be set to Custom

Background Background for the main widget body, and the subtitle pill

Light background (goals) Background for the goals above the countdown, info chart title, and the event label of each info chart entry

Dark background (end time) Background for the end time, and info chart

Text The text color (end time, info chart, goals)

Accent The color used for the timer, Time's up! text, alert text background, alert tier text, current amount text, individual goal amount, checkmark (goal completion animation), pause indicator text, title, subtitle, sleep animation (Zzz), and icons for the total amounts

Goal 2 fade amount: (%) How opaque should the fade color be for the 2nd goal?

Goal 3 fade amount: (%) How opaque should the fade color be for the 3rd goal?

Alert background The color used for alert icon background

Alert text The color used for alert text

Blink color - Warning Color for the blinking animation when the timer is below 1 Hour.

Countdown blinking (<1hr) needs to be enabled in order for this to work.

Blink color - Danger Color for the blinking animation when the timer is below 1 Hour, and the time meets other criteria.

Countdown blinking (<1min) or Countdown blinking (every 1 min when <1hr) needs to be enabled in order for this to work.

Title outline size: (px) Size of the title text stroke

Current goal amount outline size: (px) Size of the current goal amount text stroke

Countdown outline size: (px) Size of the countdown text stroke

Countdown outline color Color of the countdown text stroke

Current points outline size: (px) Size of the number which shows how many points you have currently

Widget outline size: (px) Size of the main widget body stroke

Widget outline color Color of the main widget body stroke

Time addition chart outline size: (px) Size of the info chart stroke

Time addition chart outline color Color of the info chart stroke

Animations

Countdown

Animation: Animation for the countdown text, Time's up text, and Current goal amount

Animation duration: (ms) Duration of the animation above. Best to leave this number pretty low in order for the countdown to display properly.

Countdown blinking (<1hr) The text changes it's color to Blink color - Warning every time the countdown updates when the timer is below 1 Hour

Countdown blinking (<1 min) The text changes it's color to Blink color - Danger every time the countdown updates when the timer is below 1 Minute

Countdown blinking (every 1 min when <1hr) The text changes it's color to Blink color - Danger every minute the countdown updates when the timer is below 1 Hour

Sleep (Zzz) animation when paused Should a sleeping (Zzz) animation play when the widget is paused?

Totals

The values inside of the (parentheses) is an example to help you figure out what values to use.

  • Bounce (50) - Pixels
  • Fade (0.75) - Percentage. 1.0 = 100%. Range: 0.0 - 1.0
  • Flash (1.25) - Percentage. 1.0 = 100%. Range: 0.0 - 2.0
  • Scale (1.2) - Percentage. 1.0 = 100%

Totals toggle animation: Bounce (50) Scale (1.2) The animation when the widget is toggled via the !totals command

Totals bounce animation value: This is the amount of pixels used for the animation when Totals toggle animation: is set to Bounce

Scale is pre-set and can not be changed to make sure the animation works correctly.

Totals toggle animation duration: (ms) How long should the animation for the toggling be?

This is the animation duration for each visible box.

Totals toggle animation stagger: (ms) How much delay should be between each box's individual animation?

The animation starts from the left-most box.

Totals event animation: Bounce (50) Fade (0.75) Flash (1.25) Scale (1.2)

Totals event animation value: The value to use for the animation when an event happens.

E.g. If the Totals event animation: is set to Scale and this fields value is set to 1.2, the boxes will enlarge by 20%, then go back to their original scale.

Totals event animation duration: (ms)

Totals event animation stagger: (ms) How much delay should be between each box's individual animation?

The animation plays outwards on each visible box, starting from the one the event happened for.

Check for updates

Check for updates when the widget loads Should the widget automatically check for updates whenever it loads?

This setting may cause the notification to show up when changing scenes in OBS

Check for updates On demand update check

Reset widget

Reset Widget Resets the widgets to a "default" state. Allowing you to configure it from a near out of the box point. Fields will not be reset since this can only affect the inner workings of the widget, and not the StreamElements overlay directly.

Deleting the widget and then re-installing it, does not reset it! Although it will reset the fields to their original values.

⚠️ **GitHub.com Fallback** ⚠️