🔨The Helper Function

Within the JavaScript file you will have full access to the Pixel helper function. This is how you're going to receive events, load external resources, and generally make your overlay.

Loading Scripts

The Pixel.loadScripts function can be used to load external libraries from unpkg or other CDNs. Please note that if you use any CDN's other than unpkg the editor will not be able to attempt to find the corresponding type files and you will not get auto-complete for that library.

This function returns a promise that will resolve once all of the scripts provided have been loaded into the global namespace. Since custom Pixel Chat overlays allow you to use top-level awaits, it is recommended that you await Pixel.loadScripts() at the very top of your file.

Subscribing to events

The main part of the Pixel helper function is the ability to subscribe to the events that Pixel Chat tracks. This includes things such as follows, chat messages, etc. For most of these events, Pixel Chat will do most of the heavy lifting for you, dealing with things such as getting user avatars, parsing out emotes from messages, and giving you the image links instead.

Subscribing to events is pretty simple, as the Pixel class is an event emitter, all you have to do is:

Pixel.on("eventName", (data)=>{})

As for the events available, we'll go over that in the next section!