Stream Elements Typesafe Event Interfaces

samples/streamelements-events/extension/index.ts

@@ -17,45 +17,56 @@ module.exports = function (nodecg: NodeCG) {
             );
         });
 
+        client.onTestCheer((data) => {
+            nodecg.log.info(
+                `${data.event.displayName} just cheered ${data.event.amount} bit(s). Message: ${data.event.message}`,
+            );
+        });
+
         client.onFollow((data) => {
             nodecg.log.info(`${data.data.displayName} just followed.`);
         });
 
+        client.onTestFollow((data) => {
+            nodecg.log.info(`${data.event.displayName} just followed.`);
+        });
+
         client.onSubscriber((data) => {
-            if (data.data.tier) {
-                const tier =
-                    data.data.tier === "prime" ? "Twitch Prime" : "Tier " + Number.parseInt(data.data.tier) / 1000;
-                nodecg.log.info(`${data.data.displayName} just subscribed for ${data.data.amount} months (${tier}).`);
-            }
+            nodecg.log.info(`${data.data.displayName} just subscribed for ${data.data.amount} months (${formatSubTier(data.data.tier)}).`);
         });
 
+        client.onTestSubscription((data) => {
+            nodecg.log.info(`${data.event.displayName} just subscribed for ${data.event.amount} months (${formatSubTier(data.event.tier)}).`);
+        })
+
         client.onGift((data) => {
-            if (data.data.tier) {
-                // We want to display the tier as 1, 2, 3
-                // However StreamElements stores the sub tiers as 1000, 2000 and 3000.
-                // So we divide the tier by 1000 to get the tier in our expected format.
-                // We don't need to care about prime subs here because they cannot be gifted.
-                const tier = (Number.parseInt(data.data.tier) / 1000).toString();
-                if (data.data.sender) {
-                    nodecg.log.info(
-                        `${data.data.displayName} just got a tier ${tier} subscription from ${data.data.sender}! It's ${data.data.displayName}'s ${data.data.amount} month.`,
-                    );
-                } else {
-                    nodecg.log.info(
-                        `${data.data.displayName} just got a tier ${tier} subscription! It's ${data.data.displayName}'s ${data.data.amount} month.`,
-                    );
-                }
-            }
+            nodecg.log.info(
+                `${data.data.displayName} just got a tier ${formatSubTier(data.data.tier)} subscription from ${data.data.sender ?? "anonymous"}! It's ${data.data.displayName}'s ${data.data.amount} month.`,
+            );
         });
 
+        client.onTestGift((data) => {
+            nodecg.log.info(
+                `${data.event.displayName} just got a tier ${formatSubTier(data.event.tier)} subscription from ${data.event.sender ?? "anonymous"}! It's ${data.event.displayName}'s ${data.event.amount} month.`,
+            );
+        })
+
         client.onHost((data) => {
             nodecg.log.info(`${data.data.displayName} just hosted the stream for ${data.data.amount} viewer(s).`);
         });
 
+        client.onTestHost((data) => {
+            nodecg.log.info(`${data.event.displayName} just hosted the stream for ${data.event.amount} viewer(s).`);
+        })
+
         client.onRaid((data) => {
             nodecg.log.info(`${data.data.displayName} just raided the stream with ${data.data.amount} viewers.`);
         });
 
+        client.onTestRaid((data) => {
+            nodecg.log.info(`${data.event.displayName} just raided the stream with ${data.event.amount} viewers.`);
+        });
+
         client.onTip((data) => {
             if (data.data.currency) {
                 nodecg.log.info(
@@ -64,6 +75,12 @@ module.exports = function (nodecg: NodeCG) {
             }
         });
 
+        client.onTestTip((data) => {
+            nodecg.log.info(
+                `${data.event.name} just donated ${data.event.amount} ${data.event.currency}. Message. ${data.event.message}`,
+            );
+        });
+
         client.onTest((data) => {
             nodecg.log.info(JSON.stringify(data));
         });
@@ -73,3 +90,13 @@ module.exports = function (nodecg: NodeCG) {
 
     streamElements?.onUnavailable(() => nodecg.log.info("SE client has been unset."));
 };
+
+function formatSubTier(tier: "1000" | "2000" | "3000" | "prime"): string {
+    if (tier === "prime")
+        return "Twitch Prime";
+
+    // We want to display the tier as 1, 2, 3
+    // However StreamElements stores the sub tiers as 1000, 2000 and 3000.
+    // So we divide the tier by 1000 to get the tier in our expected format.
+    return "Tier " + (Number.parseInt(tier) / 1000).toString();
+}

samples/streamelements-events/graphics/index.html

@@ -1,11 +1,11 @@
 <!DOCTYPE html>
 <html lang="en">
     <head>
-        <meta charstreamElementsReplicantt="UTF-8" />
+        <meta charset="UTF-8" />
         <title>streamelements-events sample bundle</title>
         <style>
             body {
-                font-family: sans-streamElementsReplicantrif;
+                font-family: sans-serif;
             }
             /* don't show container until vue has compiled all templates */
             [v-cloak] {

services/nodecg-io-streamelements/extension/StreamElements.ts

@@ -1,17 +1,28 @@
 import io = require("socket.io-client");
 import { Result, emptySuccess, error } from "nodecg-io-core";
-import { StreamElementsEvent } from "./StreamElementsEvent";
+import {
+    StreamElementsCheerEvent, StreamElementsEvent,
+    StreamElementsFollowEvent,
+    StreamElementsHostEvent,
+    StreamElementsRaidEvent,
+    StreamElementsSubscriberEvent,
+    StreamElementsTestCheerEvent, StreamElementsTestEvent,
+    StreamElementsTestFollowEvent,
+    StreamElementsTestHostEvent, StreamElementsTestRaidEvent,
+    StreamElementsTestSubscriberEvent, StreamElementsTestTipEvent,
+    StreamElementsTipEvent
+} from "./StreamElementsEvent";
 import { EventEmitter } from "events";
 import { Replicant } from "nodecg-types/types/server";
 
 export interface StreamElementsReplicant {
-    lastSubscriber?: StreamElementsEvent;
-    lastTip?: StreamElementsEvent;
-    lastCheer?: StreamElementsEvent;
-    lastGift?: StreamElementsEvent;
-    lastFollow?: StreamElementsEvent;
-    lastRaid?: StreamElementsEvent;
-    lastHost?: StreamElementsEvent;
+    lastSubscriber?: StreamElementsSubscriberEvent;
+    lastTip?: StreamElementsTipEvent;
+    lastCheer?: StreamElementsCheerEvent;
+    lastGift?: StreamElementsSubscriberEvent;
+    lastFollow?: StreamElementsFollowEvent;
+    lastRaid?: StreamElementsRaidEvent;
+    lastHost?: StreamElementsHostEvent;
 }
 
 export class StreamElementsServiceClient extends EventEmitter {
@@ -42,9 +53,10 @@ export class StreamElementsServiceClient extends EventEmitter {
             this.emit(data.type, data);
         });
         if (this.handleTestEvents) {
-            this.onTestEvent((data: StreamElementsEvent) => {
+            this.onTestEvent((data: StreamElementsTestEvent) => {
                 if (data.listener) {
                     this.emit("test", data);
+                    this.emit("test:" + data.listener, data);
                 }
             });
         }
@@ -103,46 +115,78 @@ export class StreamElementsServiceClient extends EventEmitter {
         });
     }
 
-    private onTestEvent(handler: (data: StreamElementsEvent) => void): void {
-        this.socket.on("event:test", (data: StreamElementsEvent) => {
+    private onTestEvent(handler: (data: StreamElementsTestEvent) => void): void {
+        this.socket.on("event:test", (data: StreamElementsTestEvent) => {
             if (data) {
                 handler(data);
             }
         });
     }
 
-    public onSubscriber(handler: (data: StreamElementsEvent) => void): void {
+    public onSubscriber(handler: (data: StreamElementsSubscriberEvent) => void): void {
         this.on("subscriber", handler);
     }
 
-    public onTip(handler: (data: StreamElementsEvent) => void): void {
+    public onTip(handler: (data: StreamElementsTipEvent) => void): void {
         this.on("tip", handler);
     }
 
-    public onCheer(handler: (data: StreamElementsEvent) => void): void {
+    public onCheer(handler: (data: StreamElementsCheerEvent) => void): void {
         this.on("cheer", handler);
     }
 
-    public onGift(handler: (data: StreamElementsEvent) => void): void {
+    public onGift(handler: (data: StreamElementsSubscriberEvent) => void): void {
         this.on("gift", handler);
     }
 
-    public onFollow(handler: (data: StreamElementsEvent) => void): void {
+    public onFollow(handler: (data: StreamElementsFollowEvent) => void): void {
         this.on("follow", handler);
     }
 
-    public onRaid(handler: (data: StreamElementsEvent) => void): void {
+    public onRaid(handler: (data: StreamElementsRaidEvent) => void): void {
         this.on("raid", handler);
     }
 
-    public onHost(handler: (data: StreamElementsEvent) => void): void {
+    public onHost(handler: (data: StreamElementsHostEvent) => void): void {
         this.on("host", handler);
     }
 
     public onTest(handler: (data: StreamElementsEvent) => void): void {
         this.on("test", handler);
     }
 
+    public onTestSubscription(handler: (data: StreamElementsTestSubscriberEvent) => void): void {
+        this.on("test:subscription-latest", handler);
+    }
+
+    public onTestCheer(handler: (data: StreamElementsTestCheerEvent) => void): void {
+        this.on("test:cheer-latest", handler);
+    }
+
+    public onTestGift(handler: (data: StreamElementsTestSubscriberEvent) => void): void {
+        this.on("test:subscriber-latest", d => {
+            if(d.data.gifted) {
+                handler(d);
+            }
+        });
+    }
+
+    public onTestFollow(handler: (data: StreamElementsTestFollowEvent) => void): void {
+        this.on("test:follower-latest", handler);
+    }
+
+    public onTestRaid(handler: (data: StreamElementsTestRaidEvent) => void): void {
+        this.on("test:raid-latest", handler);
+    }
+
+    public onTestHost(handler: (data: StreamElementsTestHostEvent) => void): void {
+        this.on("test:host-latest", handler);
+    }
+
+    public onTestTip(handler: (data: StreamElementsTestTipEvent) => void): void {
+        this.on("test:tip-latest", handler);
+    }
+
     public setupReplicant(rep: Replicant<StreamElementsReplicant>): void {
         if (rep.value === undefined) {
             rep.value = {};