ADDED Ko-Fi, Fourthwall, TipeeeStream and Patreon

js/app-mockup.js

@@ -216,7 +216,8 @@ function generateMockEvent() {
         
         'kick-follow', 'kick-sub',
         'kick-giftsub', 'kick-giftbomb', 'kick-raid',
-        
+
+        'patreon-membership', 'tipeeestream-tip',
 
         'streamlabs-tip', 'streamelements-tip',
     ];
@@ -723,6 +724,52 @@ function generateMockEvent() {
 
 
 
+        case 'patreon-membership' :
+
+            var data = {
+                attributes: {
+                    full_name:  user.name,
+                    will_pay_amount_cents: Math.floor(Math.random() * (10000 - 1000)) + 1000
+                }
+            };
+
+            patreonMemberships(data);
+
+        break;
+        
+
+
+
+
+
+
+
+
+
+
+        case 'tipeeestream-tip' :
+
+            var data = {
+                user: user.name,
+                amount: Math.floor(Math.random() * 2000) + 1,
+                currency: 'USD',
+                message: messagetext
+            };
+
+            tipeeeStreamDonation(data);
+
+        break;
+        
+
+
+
+
+
+
+
+
+
+
         case 'streamlabs-tip' :
 
             var data = {

js/fourthwall/module.js

@@ -0,0 +1,288 @@
+const showShopifyOrders              = getURLParam("showShopifyOrders", true);
+
+const shopifyMessageHandlers = {
+    'Shopify.OrderPaid': (response) => {
+        console.debug('Shopify Order Paid', response.data);
+        //shopifyOrderPaidMessage(response.data);
+    },
+};
+
+for (const [event, handler] of Object.entries(shopifyMessageHandlers)) {
+    streamerBotClient.on(event, handler);
+}
+
+
+async function shopifyOrderPaidMessage(data) {
+    
+    if (showShopifyOrders == false) return;
+
+    const {
+        username : userName,
+        amount,
+        currency,
+        message: text
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var money = formatCurrency(amount,currency);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.fourthwall.donation({
+            money: money,
+            message: text
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'fourthwall', messageData);
+}
+
+
+async function fourthwallOrderMessage(data) {
+    
+    if (showFourthwallOrders == false) return;
+
+    const username = data.username;
+	const total = data.total;
+	const currency = data.currency;
+	const item = data.variants[0].name;
+	const itemsQuantity = data.variants.length;
+	const text = stripStringFromHtml(data.statmessageus);
+	const imageUrl = data.variants[0].image;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var userName = '';
+    if (username == undefined) { userName = currentLang.fourthwall.someone(); }
+    else { userName = username; }
+
+    var money = '';
+    if (total == 0) { money = 0; }
+    else { money = formatCurrency(total,currency); }
+
+    var fourthWallImage = '';
+    if (showFourthwallShowImage == true) {
+        fourthWallImage = imageUrl
+    }
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.fourthwall.order({
+            money: money,
+            firstItem: item,
+            items: itemsQuantity,
+            message: text,
+            image: fourthWallImage
+        }),
+    ]);
+
+    const classes = ['order'];
+    if (showFourthwallBigImage == true) {
+        classes.push('giantimage');
+    }
+
+    const messageData = {
+        classes: classes.join(' '),
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'fourthwall', messageData);
+}
+
+
+async function fourthwallSubMessage(data) {
+    
+    if (showFourthwallSubscriptions == false) return;
+
+    const {
+        nickname : userName,
+        amount,
+        currency
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var money = formatCurrency(amount,currency);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.fourthwall.donation({
+            money: money
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'fourthwall', messageData);
+}
+
+
+async function fourthwallGiftMessage(data) {
+    
+    if (showFourthwallGiftPurchase == false) return;
+
+    const userName = data.username;
+	const total = data.total;
+	const currency = data.currency;
+	const gifts = data.gifts.length;
+	const item = data.offer.name;
+	const imageUrl = data.offer.imageUrl;
+	const text = stripStringFromHtml(data.statmessageus);
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var money = '';
+    if (total == 0) { money = 0; }
+    else { money = formatCurrency(total,currency); }
+
+    var fourthWallImage = '';
+    if (showFourthwallShowGiftImage == true) {
+        fourthWallImage = imageUrl
+    }
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.fourthwall.gift({
+            money: money,
+            firstItem: item,
+            items: gifts,
+            message: text,
+            image: fourthWallImage
+        }),
+    ]);
+
+    const classes = ['gift'];
+    if (showFourthwallBigGiftImage == true) {
+        classes.push('giantimage');
+    }
+
+    const messageData = {
+        classes: classes.join(' '),
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'fourthwall', messageData);
+}
+
+async function fourthwallGiftDrawStartMessage(data) {
+    
+    if (showFourthwallGiftDraw == false) return;
+
+    const {
+        offer: {
+            name: itemName
+        },
+        durationSeconds
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.fourthwall.drawstart({
+            gift: itemName,
+            command: fourthWallGiftDrawCommand
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'fourthwall', messageData);
+}
+
+async function fourthwallGiftDrawEndMessage(data) {
+    
+    if (showFourthwallGiftDraw == false) return;
+
+    const {
+        data: {
+            gifts
+        }
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.fourthwall.drawend({
+            winners: getWinnersList(gifts)
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'fourthwall', messageData);
+}
+
+
+
+
+async function getWinnersList(gifts) {
+	const winners = gifts.map(gift => gift.winner).filter(Boolean); // Remove null/undefined
+
+	const numWinners = winners.length;
+
+	if (numWinners === 0) { return ""; }
+	if (numWinners === 1) { return winners[0]; }
+	if (numWinners === 2) { return `${winners[0]} and ${winners[1]}`; }
+
+	// For 3 or more, use the Oxford comma style: A, B, and C
+	const allButLast = winners.slice(0, -1).join(", ");
+	const lastWinner = winners[winners.length - 1];
+	return `${allButLast}, and ${lastWinner}`;
+}

js/kofi/module.js

@@ -0,0 +1,184 @@
+const showKofiSubscriptions             = getURLParam("showKofiSubscriptions", true);
+const showKofiDonations                 = getURLParam("showKofiDonations", true);
+const showKofiOrders                    = getURLParam("showKofiOrders", true);
+
+const kofiMessageHandlers = {
+    'Kofi.Donation': (response) => {
+        console.debug('Kofi Donation', response.data);
+        kofiDonationMessage(response.data);
+    },
+    'Kofi.Subscription': (response) => {
+        console.debug('Kofi Sub', response.data);
+        kofiSubMessage(response.data);
+    },
+    'Kofi.Resubscription': (response) => {
+        console.debug('Kofi Resub', response.data);
+        kofiReSubMessage(response.data);
+    },
+    'Kofi.ShopOrder': (response) => {
+        console.debug('Kofi Order', response.data);
+        kofiOrderMessage(response.data);
+    },
+};
+
+for (const [event, handler] of Object.entries(kofiMessageHandlers)) {
+    streamerBotClient.on(event, handler);
+}   
+
+
+async function kofiDonationMessage(data) {
+    
+    if (showKofiDonations == false) return;
+
+    const {
+        from : userName,
+        amount,
+        currency,
+        message: text
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var money = formatCurrency(amount,currency);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.kofi.donation({
+            money: money,
+            message: text
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'kofi', messageData);
+}   
+
+
+async function kofiSubMessage(data) {
+    
+    if (showKofiSubscriptions == false) return;
+
+    const {
+        from : userName,
+        amount,
+        currency,
+        message: text
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var money = formatCurrency(amount,currency);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.kofi.sub({
+            money: money,
+            message: text
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'kofi', messageData);
+}   
+
+
+async function kofiReSubMessage(data) {
+    
+    if (showKofiSubscriptions == false) return;
+
+    const {
+        from : userName,
+        tier,
+        message: text
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.kofi.resub({
+            tier: tier,
+            message: text
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'kofi', messageData);
+}
+
+
+async function kofiOrderMessage(data) {
+    
+    if (showKofiOrders == false) return;
+    const {
+        from : userName,
+        amount,
+        currency,
+        message: text,
+        items
+    } = data;
+
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    var money = '';
+
+    if (amount == 0) { money = 0; }
+    else { money = formatCurrency(amount,currency); }
+
+    var itemsQuantity = items.length
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.kofi.order({
+            money: money,
+            items: itemsQuantity
+        }),
+    ]);
+
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    
+    addEventToChat(userID, messageID, 'kofi', messageData);
+}

js/lang/en.js

@@ -93,5 +93,71 @@ const en = {
 
         raid : ({ viewers }) => ` raided the channel with <i class="fa-solid fa-users"></i> <strong>${viewers} viewers</strong>`
         
+    },
+
+    patreon: {
+        membership: ({ money }) => ` pledged a membership ($${money})`
+        
+    },
+
+    tipeeestream : {
+        tip : ({ money, message }) => ` donated 🪙 <strong>${money}</strong>${message ? '<br>'+message : ''}`,
+    },
+
+    kofi : {
+        donation : ({ money, message }) => ` donated 🪙 <strong>${money}</strong>${message ? '<br>'+message : ''}`,
+        sub : ({ money, tier, message }) => ` subscribed <strong>${money}</strong>${tier ? '(Tier '+tier+')' : ''}${message ? '<br>'+message : ''}`,
+        resub : ({ money, tier, message }) => ` subscribed <strong>${money}</strong>${tier ? '(Tier '+tier+')' : ''}${message ? '<br>'+message : ''}`,
+        order : ({ money, items }) => ` ordered <strong>${items} ${items == 1 ? 'item' : 'items'} (${money == 0 ? 'Free' : money})`,
+    },
+
+    fourthwall : {
+        someone : () => `Someone`,
+
+        donation : ({ money, message }) => ` donated 🪙 <strong>${money}</strong>${message ? '<br>'+message : ''}`,
+        sub : ({ money }) => ` subscribed <strong>(${money})</strong>`,
+
+        order : ({
+            money,
+            firstItem,
+            items,
+            message,
+            image,
+            
+        }) => ` 
+        ${image ? '<br>': ''}
+        ordered <strong>${firstItem}</strong> ${items > 1 ? 'and <strong>'+(items - 1)+' other '+((items - 1) == 1 ? 'item' : 'items')+'</strong>' : ''} 
+        (${money == 0 ? 'Free' : money})
+        ${message.trim() ? '<br>'+message : ''}
+        ${image ? '</span></span><span class="image"><img src="'+image+'"></span>': ''}
+        `,
+
+        gift : ({
+            money,
+            firstItem,
+            items,
+            message,
+            image,
+            
+        }) => ` 
+        ${image ? '<br>': ''}
+        gifted <strong>${items}x ${firstItem}</strong>
+        (${money == 0 ? 'Free' : money})
+        ${message.trim() ? '<br>'+message : ''}
+        ${image ? '</span></span><span class="image"><img src="'+image+'"></span>': ''}
+        `,
+
+
+        
+        drawstart : ({ gift, command }) => ` 
+        <strong><i class="fa-solid fa-gift fa-beat"></i> Giveaway started!</strong> 
+        Type ${command} to have a chance to win <strong>${gift}</strong>`,
+
+        drawend : ({ winners }) => ` 
+        <strong>🎉 Giveaway Ended!</strong> 
+        Congratulations <strong>${winners}</strong>`,
+
+
+
     },
 }

js/patreon/module.js

@@ -0,0 +1,46 @@
+const showPatreonMemberships        = getURLParam("showPatreonMemberships", true);
+
+const patreonHandlers = {
+    'Patreon.PledgeCreate': (response) => {
+        console.debug('Patreon Membersihp', response.data);
+        patreonMemberships(response.data);
+    },
+};
+for (const [event, handler] of Object.entries(patreonHandlers)) {
+    streamerBotClient.on(event, handler);
+}
+
+
+
+async function patreonMemberships(data) {
+    
+    if (showPatreonMemberships == false) return;
+
+    const {
+        attributes: {
+            full_name: userName,
+            will_pay_amount_cents: money
+        }
+    } = data;
+    
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.patreon.membership({
+            money : (money / 100).toFixed(2)
+        })
+    ]);
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    addEventToChat(userID, messageID, 'patreon', messageData);
+}

js/streamelements/module.js

@@ -2,7 +2,7 @@ const showStreamElementsTips        = getURLParam("showStreamElementsTips", true
 
 const streamElementsHandlers = {
     'StreamElements.Tip': (response) => {
-        console.debug(response.data);
+        console.debug('StreamElements Event', response.data);
         streamElementsEventMessage(response.data);
     },
 };
@@ -32,7 +32,7 @@ async function streamElementsEventMessage(data) {
             message : messageFromUser
         })
     ]);
-    const classes = 'streamelements';
+    const classes = '';
     const messageData = {
         classes: classes,
         avatar,

js/streamlabs/module.js

@@ -2,7 +2,7 @@ const showStreamlabsDonations       = getURLParam("showStreamlabsDonations", tru
 
 const streamLabsHandlers = {
     'Streamlabs.Donation': (response) => {
-        console.debug(response.data);
+        console.debug('StreamLabs Event', response.data);
         streamLabsEventMessage(response.data);
     },
 };
@@ -30,7 +30,7 @@ async function streamLabsEventMessage(data) {
             message : messageFromUser
         })
     ]);
-    const classes = 'streamlabs';
+    const classes = '';
     const messageData = {
         classes: classes,
         avatar,

js/tipeeestream/module.js

@@ -0,0 +1,47 @@
+const showTipeeeDonations        = getURLParam("showTipeeeDonations", true);
+
+const tipeeeHandlers = {
+    'TipeeeStream.Donation': (response) => {
+        console.debug('TipeeeStream Donation', response.data);
+        tipeeeStreamDonation(response.data);
+    },
+};
+for (const [event, handler] of Object.entries(tipeeeHandlers)) {
+    streamerBotClient.on(event, handler);
+}
+
+
+
+async function tipeeeStreamDonation(data) {
+    
+    if (showTipeeeDonations == false) return;
+
+    const {
+        user: userName,
+        amount,
+        currency,
+        message: text
+    } = data;
+    
+    const userID = createRandomString(40);
+    const messageID = createRandomString(40);
+
+    const [avatar, message] = await Promise.all([
+        '',
+        currentLang.tipeeestream.tip({
+            money : formatCurrency(amount,currency),
+            message: text
+        })
+    ]);
+    const classes = '';
+    const messageData = {
+        classes: classes,
+        avatar,
+        badges: '',
+        userName,
+        color: '#FFF',
+        message,
+        reply: '',
+    };
+    addEventToChat(userID, messageID, 'tipeeestream', messageData);
+}