Spinning "Mood Ring" Emoji Wheel

Extensions Approved
, ,
1

Description

Spinning wheel of emojis to be used as a “Mood Ring” of sorts!

Video Example

Import Code (Download)

emoji-wheel.sb (1.3 KB)

Resources (Download)

Download the following zip containing everything you need
emoji-wheel.zip (5.7 KB)

Installation

In Streamer.bot click the Import button in the top menu. Drag the .sb file into the Import String field.

image
image715×546 10.5 KB

  1. Extract the zip’s contents into a folder (usually a folder containing your streaming assets).

  2. Go into the new folder named “Emoji Wheel” and then into the folder “Wheel Winner” then double-click the index.html file to open it in your default browser.

  3. Go to the top address bar and copy the entire address, in it’s entirety from the "file:///.." to the ending "../index.html"

  4. In OBS add a browser source, name it “Emoji Wheel”
    a. Paste the address you just copied
    b. Set size to be 1920 x 1080
    c. Tick both “Shutdown source when not visible” & “Refresh browser when scene becomes active”

  5. In Streamer.bot go to the action you imported and double-click the Set OBS Browser Source URL sub-action and paste the URL you just copied from the address bar in front of the ?slices=12&delay=3 that is already there so it is all one string.

  6. In Streamer.bot go to the action you imported and double-click the Set Source Visibility State sub-action, then the Scene and Source fields to point to the source you just created. Repeat this step for the other Set Source Visibility State sub-action.

  7. Enable the !emojiw command in Streamer.bot Commands tab

Updating

If you have already installed this extension, you can update by simply downloading the new zip under Resources back toward the top of this page and then overwriting the old files with the new by unzipping on top of them.

Configuration

Advanced configuration is done by editing the script.js file in your folder using any text editor (VS Code, Notepad++, Notepad, etc).

  • In the Set OBS Browser Source URL you can change the number of slices/emojis by adjusting the number where it says slices=12. In that same line you can adjust how long the delay it takes to start the spin after showing it.

  • In the script.js file you can add/remove the emojis you want to be able to use

Contributors

Lyfesaver74 & Whipstickgostop

This extension was developed from a Codepen by Sam Lee

2 Likes