

video) but some such as html events do not have a fixed endpoint and listen for custom events from the client. Most overlays end automatically when they complete (i.e.

To trigger an overlay, just emit this event to the EventEmitter you passed in and the overlay will play on the server.

When an overlay is added to the server, it automatically has an event listener created in the format: overlay:(name):show where (name) is the name of the overlay that you passed in. See a fully functional example here: Firing Overlays show() or overlays:name:show The overlay server maintains a persistent state variable that is passed to react which keeps track of what is on screen and off screen at any given time.

Each type has an associated React client-side template that is rendered when you want to display the overlay. Overlays will be added to an array and stored with a set of event listeners (See below: Firing Overlays). To add an overlay, you need to pass a json object (or array of objects) with the following parameters:Įvents.emit('overlay:text:show', 'text to say goes here!') The easier overlay to get started with is video which just takes a single mp4 file and a name as a parameter. The basic types are text, video, or html (see 'Modules' below for more details). Hostname: 'localhost', // Binds server to this host (optional)ĭirectory: '/', // URL you want to point OBS/Xsplit at (optional, default: '/')Įvents: new Events.EventEmitter() // Listens to events to trigger overlaysįirst, you should decide what type of overlay you want to display on your stream. The start() function accepts the following optional parameters via a single json object: Start the overlay server: Overlays.start(options).Define any optional settings var options = (see Config below).Include the module in your codebase: var overlays = require('twitch-overlay').You can pair this with lots of other modules such as hpc-bot to integrate with a chat bot or twitch-soundboard to play overlays manually via your browser. You can load the default URL '/' into your OBS/Xsplit client which will render overlays with a transparent background. This library will add an express-based server that listens for events (via a simple EventEmitter) and plays overlays when it receives an event. Animated overlays for Twitch streamers that can be loaded into OBS or XSplit
