SBCanvas

SBCanvas is the overlay engine behind StreamBot. It runs inside an OBS Browser Source, connects to the backend over WebSocket, and renders alerts, chat, goals, and custom widgets. You write JavaScript against the global SBCanvas object. The runtime handles connections, event normalization, and platform differences. Your widget code stays the same whether the streamer is on Kick, Rumble, or Blaze.

Quick Start

First widget in 5 minutes

Build a Widget

Step-by-step tutorial

SDK Reference

Full API docs

REST API

Push events from external systems

Platform Support

SBCanvas normalizes events from three streaming platforms into a unified API:
  • Kick — livestreaming platform with subs, tips, raids, hosts, and chat
  • Rumble — video platform with rants (paid messages), subs, raids, and chat
  • Blaze — streaming platform supported through StreamBot’s unified Activity model, with subs, tips, and chat
FeatureKickRumbleBlaze
FollowsYesYesYes
SubscriptionsYesYesYes
Gift SubsYesYesYes
TipsYesNoYes
RantsNoYesNo
RaidsYesYesNo
HostsYesNoNo
Chat SendYesYesYes
Emotes (native + 7TV/BTTV)YesYesYes

How It Works

  1. The streamer adds their overlay URL as an OBS Browser Source
  2. The overlay connects to StreamBot’s backend via WebSocket
  3. When viewers follow, sub, tip, or chat, events arrive as typed Activity objects
  4. Your widget code reacts to those events through SBCanvas.activities.on()
  5. You use SBCanvas.store for persistence, SBCanvas.http() for external APIs, and the rest of the SDK for effects, timers, and UI
SBCanvas.ready(() => {
  SBCanvas.activities.on('follow', (activity) => {
    showAlert(`${activity.username} followed!`);
    SBCanvas.sound('/sounds/follow.mp3');
  });

  SBCanvas.activities.on('tip', (activity) => {
    showAlert(`${activity.username} tipped $${activity.amount}!`);
    if (activity.amount >= 50) SBCanvas.confetti();
  });
});

Version

Current SDK: 0.1.0