dev-chat

[severe shell]

You can, but just to let you know, I'm not part of Streamelements staff, so I have no use in the approval process and don't know how the process work internally

[candid nebula]

Of course! I understand that. I’m remaking a system similar to yours and wanted to show you and get your opinion on it.

I’d post it here but I don’t wanna release stuff until my verification process is done.

[vestal pelican]

Hello all, on Twitch Stream Elements dashboard I can see the leaderboard of users ranked by their watch time. I have a command that allows a user to check their rank ${user} has spent ${user.time_online|'0 seconds'} watching ${channel} and their rank is ${user.time_online_rank}. However, I want to make a command that shows the user the top 5 users on the leaderboard and how many hours each person has. Does anyone know if this is possible / how to achieve this functionality? Any feedback is appreciated, thank you!

[severe shell]

Actually, there is a top command for watchtime...
The command is !top online for watchtime and !top points for points

So you can ignore everything below.
~~There isn't a native command for that. But I had created something related to that and you can use it. ~~

Watchtime leaderboard
${customapi.https://seapi.c4ldas.com.br/api/watchtime/${channel}?amount=5&minutes=true}

You can specify the amount of users in amount=NUMBER. If you don't want to see the minutes, just remove the minutes=true (it will also remove the position number)
~~ Watchtime leaderboard is shown in minutes. I can try to convert it to hours/minutes later~~

Ok, I was able to convert the minutes to d, h, m (days, hours, minutes)

[finite robin]

Hi Im looking for assistance with making this code useable for stream elements **"!addcommand !battle A wild $(user) appears & attacks $(touser)! $(user) uses $(eval var a=$(urlfetch json https://pastebin.com/raw/qaTds0sF); a[Math.floor(Math.random()a.length)]). $(eval var a=["It misses","It’s super effective! $(touser) faints","faints","It's not very effective..."]; a[Math.floor(Math.random()a.length)];)." I found this custom code on reddit and appears to be formatted for nightbot how do I format it for SE. I have also submitted a ticket and was direceted to post my question here

[severe shell]

You don't

[finite robin]

so it wont work for stream elements ?

[hardy walrus]

Not as is as we don't support eval.

[finite robin]

oh ok so is there an equivalent for the eval function ?

[severe shell]

No, there is no option for Streamelements that does what eval does.
Maybe you can achieve similar results using Fyre API with pastebin, you can take a look at it here:
https://thefyrewire.com/docs/api/twitch/pastebin/

[finite robin]

Thank you

[finite robin]

i got it to work thank you guys

[late fern]

Hi

I'm using an overlay to help with a charity stream that I'm doing later this week. I've customised it in every way that I would like, except I don't know how to change the actual link to the donation page. This is a problem as the overlay relies on this link to work.

[severe shell]

Please delete your overlay link from the mesage. It is not safe to keep it on your message

The donation page on Streamelements is always https://streamelements.com/YOUR_USERNAME/tip. I don't know what you want to change, this link is fixed.

[late fern]

can i dm you the link?

[severe shell]

Oh, the message was deleted 😦

[late fern]

yeah

[severe shell]

I can see the link removed, no problem!
https://strms.net/justgiving-widgets_by_lx

Ok, but what exactly do you want to change?

[late fern]

this part here should be 0/500 if it is correctly linking to my dono page

but i've tried all that i can think of to link it and it stays at /7500

[severe shell]

Hmm, it seems there is a key called "goal" that was forgotten in the FIELDS part, just a minute

[late fern]

oh ok

a friend sent me the link to check it out, idk anything about the creation of this overlay

[severe shell]

The value of 7500 is fixed in the DATA tab. If you want to change, you can go there and put another number.
Click on "Open Editor", go to DATA tab and look for "goal":7500

Then you can change it to 500

[late fern]

oh

tysm

do you know if there's any way to test if it's correctly linked?

[severe shell]

Hmm, not sure, but probably there is a test button on the just giving website? On your donor page?

[late fern]

yeah

oh

i dont think so actually

this is on their website

but you cant really customise their alert

do you know where i'm supposed to change the campaign link?

i saw 2 or 3 possible places

[severe shell]

No idea, I don't know the justgiving system

[late fern]

aw ok

[candid nebula]

Did you find a way to fix this?

Actually just figured it out: for some reason the secret in the email is split up into another html element at the end, so it wasn't copied properly :)

[young saffron]

would anyone happen to know how i could possibly trigger an alert for when someone makes a purchase from an atsy shop?

[candid nebula]

Etsy have their own sales api

so maybe check that out

[young saffron]

yea i know they do, its just integrating them into SE somehow is the problem. though maybe someone would have a solution for setting it up

[topaz frigate]

Hey, I am trying to make a rotator widget and I want to add the all time/last gifter label but I am not getting any data. I am using emulate option to see the result. Here are the variables I want to get from the onWidgetSession event "data["subscriber-alltime-gifter"]["name"] i data["subscriber-alltime-gifter"]["amount"] " which I found at https://dev.streamelements.com/docs/widgets/6707a030af0b9-custom-widget-events

[severe shell]

For alerts, the recommended option would be a websocket to keep connection and receive update in real time.
I don't know how Etsy API works, so I went to their developers page to have a look. From what I could understand, their Real-Time feed is not generally available, so it needs to send an email requesting access.
https://www.etsy.com/developers/documentation/getting_started/real_time_feeds

Once you have access to that, you can connect to it and listen to events. Based on the events, you will need to create your own widget to show information on screen.

[severe shell]

There is no onWidgetSession. You have onWidgetLoad, onEventReceived and onSessionUpdate. The data you want can be found in onWidgetLoad and onSessionUpdate
However, using the emulate option, you will not have the subscriber-alltime-gifter values changed because it only updates with real data.

[topaz frigate]

so there is only way to see if my code works properly is having an access to an account to a person with gifted sub

[young saffron]

Thanks for the explanation. I’ll probably have to commission someone for this particular thing. It seems a little out of my league

[severe shell]

If I were you, I would use other key to test just to see if the formatting and everything is correct. You can see all keys doing a console.log(obj) and checking the browser console.

[floral prawn]

Is there anyway to add the help text under fields seen on default SE widgets to a custom widget?

[severe shell]

Unfortunately, no, but you can use a workaround. Just add a dummy field first with "type": "hidden" and then add another one with some small instruction. However, the label on the second one can only have around 32~36 characters, otherwise the text will be cut.

{  
  "fullNameDummy": {
    "type": "hidden",
    "label": "Your name",
    "value": ""  
  },
  
  "fullName": {
    "type": "text",
    "label": "Your entire name with no spaces",
    "value": ""
  }
}```
This is how it is going to look like:

[radiant hound]

I am not 100% sure where I should be asking this, so feel free to point me in another direction. I've put in a ticket on some chat overlays to use on stream for streaming on YT. The issue is none of them are made for YT, and so they are not working. I went the simple route to make my own, new overlay, add stream chat. It worked once and now is not working again. I am racking my head trying to figure out how to get YT chat on stream. Does anyone have anything to point me in a good direction for a fix?

[hardy walrus]

Is the stream explicitly public?

[floral prawn]

thanks

Is there a data variable for the number of months gifted ? I see no way to emulate this, and someone just gifted 3 months to one person and it only showed as 1 amount.

[severe shell]

There isn't. Multi-month gift will be seen as just one gift (as it is technically one gift)

[glacial forge]

Hello in the chatbox how do I customize the sender color and type of font?

@severe shellHello

[craggy osprey]

I'm pretty sure that the sender colour is determined by the colour set by the sender on Twitch.

I have a different question. Can I somehow add a support for BetterTTV and 7TV emotes in the chat box?

I am using those.

[severe shell]

Hello

[severe shell]

From the default chatbox, you can only change the font for everything, there is no option for only the sender part. I recommend that you get any other chat widget from #widget-share. Boxed chat has a great amount of options, for example.

[severe shell]

The chat box has native support for them.

[craggy osprey]

Really? That's fantastic!

[radiant hound]

Sorry, I missed this. Yes, public and live

[topaz frigate]

I am trying to add a subscriber counter for my webcam widget but when I use data["subscriber-session"]["count"] in the event onWidgetLoad is lagging my widget

[severe shell]

You can check on browser console on your Overlay Editor if it triggers any error. Probably it is Uncaught TypeError: Cannot read properties of undefined (reading 'count')
If so, the reason is the *-session keys are removed when session data is reset. So the best approach is always check if the key exists and if not, set the value of your variable to 0

[topaz frigate]

thank you for the advice

[last sigil]

I am unsure if I am doing something bad or it is on me. I am making a custom chat widget and BBTV/7TV/FFZ emotes are not showing. Looking at Google I am lead to believe that SE supports it in its API. I have none of the client extension installed, so I am wondering if it might have something to do with that.

[wraith anchor]

Is there a way to detrmine through stream elements if a chat message is from a follower? or would that need to be done through the twitch API via looking the user up?

[severe shell]

No, there is no info on whether it is a follower or not from a chat message 😦

[severe shell]

It has support for them. if it is not working for you, I would recommend that you check the code for another chat widget so you can understand how that works. Try Boxed chat from #widget-share

[last sigil]

@severe shell I've looked into it and even this one doesn't seems to be able to support it

So I am not sure what's wrong here

It basically use the same code from SE Blob that I've based myself on too

Well nevermind, seems I was confused at what emotes were allowed and the one I was using where not included

[stray steppe]

Hey there, don't know if this is the right channel but I thought I just ask u guys 😅
I'm currently personalizing my End Credit Roll.. everything is working fine. Now I'm trying to include "Sub Gifters" into the fields. Worked with the JS code "subGift" & "gifted-subs-session".. don't know if that's right. Maybe some of u have an idea for me 🙂 thank u!

[twin citrus]

Hello all I went to support(they quick with the responses!) and got redirected here..I am trying to create different personal counters in Streamelements so that when someone does a count command, it only will count for that user and nobody else. Please help. Thank you in advance!

[hardy walrus]

Depends on how you mean count.

Visually show on an overlay? Probably doable
Command chat? No possible at all unless you use some sort of third party API to keep track of who is trying to use it.

And alongside that also return the response.

[twin citrus]

Thank you for the response Sudo! I was meaning commands for chat...so I'll have to figure out a third party api to keep track. I appreciate your time!

[severe shell]

I'm not sure if I got your question correctly, but you can set a name for a counter command and stick a user using SE variables. Let's say you want to track how many times each user runs the command !hello.

${sender} said hello ${count "${sender}_hello"} times

Each user will have the counter attached to their username. So if I run the command, the counter name will be c4ldas_hello and only will increase when I run it. If you run the command, it would be mcx_hello, so two different counters.

[twin citrus]

Thank you so much! So for this part "${sender}_hello" the _hello is the specifier that allows the different counters?

[severe shell]

the _hello will be static, you can put anything here, and the ${sender} is the one that will be changing for each user as it is a variable from Streamelements. So when you wrap both into double quotes, it creates the variable USERNAME_hello. But you could change it to "${sender}_explosion" or "mycounter_${sender}", for example, it doesn't matter. Just remember to put them into double quotes.

[twin citrus]

Thank you for the help! I greatly appreciate it

[restive lodge]

trying to set up a tts redeem for a friend. !redeem tts <message> says the entire message. !tts (which is scripted to run ${redeem tts} ) only says the first word of the message. can anyone help out with what i'm doing wrong

[severe shell]

Change !tts from ${redeem tts} to ${redeem tts ${1:}}

[restive lodge]

thank you friend, i was pulling hair out

[rigid dome]

I'm trying to implement TTS with the Web Speech API, however it seems the Google voices available in the streamelements overlay page are not available once the widget is put into OBS?

Is there a way to get voices other than the standard Microsoft voices for this?

Or does stream elements have a TTS system set up that we can use in widgets maybe?

[severe shell]

The Web Speech API uses the local voices from your computer as far as I know.

Check here:
#dev-chat message

[severe shell]

From the screenshot, you are using the Elements Editor page, so you can ask it here, as it is more directed to that, #elements-editor-widgets20

[vital bluff]

I assume not, because it's not on the docs, but is there a way to send like a POST request to the /modules endpoint to turn on or off certain modules like the gambling ones? would like to find a way to bind this to a command or event listener

[pulsar willow]

Is there a way to modularize the JS scripts in StreamElements editor?

[severe shell]

A good thing in SE for devs is that we can frequently check how things work on browser console, as most of them are just API requests.

So checking the modules page, there is a GET request to check the values of each module
https://api.streamelements.com/kappa/v2/bot/modules/<ACCOUNT_ID>

And there is a PUT request to change each module
https://api.streamelements.com/kappa/v2/bot/modules/<ACCOUNT_ID/<MODULE_NAME>

Basically the headers are:
Accept: application/json
Content-type: application/json
Authorization: Bearer <JWT> // maybe oAuth would work here too, not sure
Body is the object you are changing. You can check the structure from the GET request. For example, in Announcements module:

{
  "announcements": {
    "enabled": false,
    "streamStart": {
      "enabled": true,
      "message": "${channel.display_name} is now online! Streaming {game}: {title}"
    }
  }
}```

[severe shell]

There is only one tab for JS code. You could bring other JS codes from HTML tab using <script> tag, but not sure if that would be benefical.
I believe you can do that using the Elements (beta) version, as you export it creating a .zip file. Here you can find the documentation:
https://dev.streamelements.com/docs/elements--sdk/9do3bhwlp2fdt-introduction

[pulsar willow]

Hi everyone i have a big problem since this morning

(gta) ➜ myproject git:(main) ✗ python3 app.py
Traceback (most recent call last):
File "/home/topitechroot/myproject/app.py", line 39, in <module>
sio.connect('https://realtime.streamelements.com/', transports=['websocket'])
File "/home/topitechroot/myproject/gta/lib/python3.11/site-packages/socketio/client.py", line 347, in connect
raise exceptions.ConnectionError(
socketio.exceptions.ConnectionError: One or more namespaces failed to connect
packet queue is empty, aborting
packet queue is empty, aborting

Why can't i run my project ?

)

sio = socketio.Client()
scenario_queue = deque()

# Connecter au websocket de StreamElements
sio.connect('https://realtime.streamelements.com/', transports=['websocket'])

# Créez une file d'attente pour les dons

@sio.event
def connect():
    print('Successfully connected to the websocket')
    sio.emit('authenticate', {'method': 'jwt', 'token': jwt})

@sio.event
def disconnect():
    print('Disconnected from websocket')

@sio.event
def authenticated(data):
    channelId = data['channelId']
    print(f'Successfully connected to channel {channelId}')

@sio.on('event')
def handle_event(event, data):
    # Vérifiez si l'événement est un don et contient un message
    if event['type'] == 'tip' and 'message' in event['data']:
        print("Donation received with message:", event['data']['message'])
        situation = event['data']['message']
        donor_name = event['data'].get('username')
        scenario = generate_scenario(situation, donor_name) # Fonction pour générer un scénario basé sur les données du don
        scenario_queue.appendleft(scenario)
        
@sio.on('connect_error')
def on_connect_error(data):
    print("Connection Error:", data)

@sio.on('connect_timeout')
def on_connect_timeout(data):
    print("Connection Timeout:", data)

Herre is an example of my code

@severe shell ? do you know why ?

[pulsar willow]

Someone ? Plizz

[severe shell]

I don't know why you tagged me here

[pulsar willow]

oh sorry i thinked that you were support for dev

[severe shell]

There is no "support for dev". Please, don't simply tag people asking for support. People will answer if they know the answer.
Also, check #welcome

☑️ No unsolicited DMs to staff and server members.

[pulsar willow]

ticket do'nt work

[rigid dome]

Is there a way to do speech to text in widgets? Or is there some sort of security issue preventing that?

Everything I've found requires 'allow microphone use' popup but I'm not seeing it happen in the streamelements.com widget I'm testing it in, and I'm not sure how that pop up would happen once the source is added to OBS?

[severe shell]

A good way to know is just adding it to OBS and check what would happen.

But answering your question, it won't appear anything, unless you added special flags to the OBS shortcut (and I don't even know if the flags for media stream are still valid). Some time ago the flags were --enable-media-stream or --use-fake-ui-for-media-stream.

In summary, I wouldn't recommend to have that in a browser source. Best option to convert speech to text would be having a closed caption plugin installed on OBS

[rigid dome]

I tried doing it but couldnt get it to work, was hoping there was something i wasnt aware of, but kinda figured a plugin would be the better route.

Thank you again for the insight!

[obtuse isle]

Did you people already have a chance to test the activity-feed-alerts-v2.BROADCASTERIDHERE topic from twitch for alerts that are not yet available from streamelements (or require you to write a custom handler with external token login)? I snooped it out while playing around the twitch build in alerts system. Its a websocket pubsub topic that seems to not require authorisation cause it works with no token and in incognito. Seems like smart way to write custom stuff (channel points being one of the most important ones for me at least). As well there seems to be alert-settings-update.BROADCASTERIDHERE topic that allows to hook up to "do not disturb" state and turning off alerts on the twitch end... ps: You don't have to have variants set up in the alerts for this to work, I deleted all of them and it still works like charm.

I have not digged into the whole thing yet to write any docs about data structes of the messages from the topics but I guess I throw it here is anyone wants to improve thier existing solutions or just mess around with this...

[severe shell]

Never worked on those specifically, but for Channel Points exclusively (I think it is community-points-channel-v1.${channel}). I created a simple (very basic) widget for devs be able to create their own widgets using that by the time:
https://github.com/c4ldas/streamelements-widgets/tree/main/twitch-channel-points

[obtuse isle]

Yea, I know about this pubsub topic, I have used it before actually for few of my projects. I just snooped out the "summarised one", it could simplify a lot of stuff for some people. I mostly wanted to let people know that the alerts stuff from twitch has a use case from within streamelements if people want to do some custom stuff.

[severe shell]

Yeah, those ones that don't require authentication are great to work with

[obtuse isle]

(and maybe it could as well be used by streamelements in the backend to simplify some internal logic)

[raven bane]

How do i call all or last 100 subscribers to my channel with the api? What would the url be? From yasterday to today would work.

[obtuse isle]

within streamelements api?

@raven bane I wrote in the past this piece of code for the "full" credit roll. I simplified it a little without double checking now so please check if I did not fuck it up. It needs a JwtToken thou.

let userId = null;
let token = null;
let subLimit = 100;
const openTime = (new Date()).toISOString();

const getActivityByType = async (type, limit, offset = 0) => {
      let activity = [];
      const url = new URL(`https://api.streamelements.com/kappa/v2/activities/${userId}`);
  
      url.searchParams.set('after', '1995-04-01T00:00:00.000Z');
    url.searchParams.set('before', openTime);
    url.searchParams.set('mincheer', 0);
    url.searchParams.set('minhost', 0);
    url.searchParams.set('minsub', 0);
    url.searchParams.set('mintip', 0);
    url.searchParams.set('origin', 'feed');
    url.searchParams.set('types', type);
    url.searchParams.set('limit', limit > 500 ? 500 : limit);
    url.searchParams.set('offset', offset);

    if (limit < 1) {
      return activity;
    }

      try {
        const response = await axios.get(url.toString(), {
            headers: {
                'Authorization': `Bearer ${token}`
            }
        });

        activity = [...activity, ...response.data];

        if (limit > 500) {
            const newLimit = limit - 500;
            const newOffset = offset + 500;

            activity = [...activity, ...(await getActivityByType(type, newLimit, newOffset))];
        }

        return activity;
    } catch (error) {
        console.log(error);
    }
}

window.addEventListener('onWidgetLoad', async (obj) => {
    let fieldData = obj.detail.fieldData;
    userId = obj.detail.channel.id;
    token = fieldData['jwtToken'];

    console.log(await getActivityByType('subscriber', subLimit))
});

[thick zealot]

Hi I am trying to get my custom font on to the text on Elements alerts, it is not in the drop down yet.
But I can get it on the normal style text can you please assist me with helping get around this I am shore I will have to add the right link into the JSON for ( Font - Unquiet Spirits ).

[raven bane]

Thanks i will check this!

[raven bane]

This worked as intended 🙂 And if someone ever need this but for python:

import os
from dotenv import load_dotenv
import requests
from datetime import datetime

load_dotenv()
TOKEN = os.getenv("JWTTOKEN")

class BearerAuth(requests.auth.AuthBase):
    def __init__(self, token):
        self.token = token
    def __call__(self, r):
        r.headers["authorization"] = "Bearer " + self.token
        return r
    
channel = "YOURCHANNELID"
currentdate = datetime.now().isoformat()

def getData(type, total):
    after = "1995-04-01T00:00:00.000Z"
    before = currentdate
    mincheer = 0
    minhost = 0
    minsub = 0
    mintip = 0
    origin = "feed"
    types = type
    limit = total
    offset = 0

    res = f"https://api.streamelements.com/kappa/v2/activities/{channel}?after={after}&before={before}&mincheer={mincheer}&minhost={minhost}&minsub={minsub}&mintip={mintip}&origin={origin}&types={types}&limit={limit}&offset={offset}"

    response = (requests.get(res, auth=BearerAuth(TOKEN))).json()

    return response

# Subs
subs = getData(type="subscriber", total=150)
#donations = getData(type="tip", total=50)
#cheer = getData(type="cheer", total=50)

print(subs)

Kudos to @obtuse isle

[worldly siren]

Does anyone know how to make a sub counter widget that only keeps count of new/recurring twitch subs? Also does anyone know how to save that data for future streams instead of it only being saved for that one session?

I can jimmy rig a way of getting the counts via javascript, but I have no idea how to save that count for future sessions

[raven bane]

You can get them with api from here. Then u either save it in a database or how ever you want.

[raven bane]

Above post was for you

[worldly siren]

oh ok so we can access a database from the overlay via javascript?

interesting I thought about doing that but wasn't sure if I could since I figured the code is running in a sandbox environment

I'll give it a shot then, thanks!

[obtuse isle]

Its more of you doing a api call to the endpoint that returns this stuff

[raven bane]

You can simply run a application to sort that data for you and then call for it in the overlay

[raven bane]

Yeah you can do all this from localhost, if you are the streamer. Otherwise you would need a VPS or something i guess 🙂

[worldly siren]

im not the streamer, just a mod that codes for them lol

but cool, I'll spin something up in the cloud and see if i can connect from the overlay

[raven bane]

Im working with this right now, i bought a shitty VPS for all this and then created apis from their streamelement api.

[worldly siren]

interesting

[raven bane]

tbh dont do overlays when it come to data, you give them data instead with the api. Maybe you are short of time idk but if you want to be in control and you need to save data etc or manipulate.

Its better

[worldly siren]

now that you mention it.... I feel like I wantto be lazy

im just gonna setup a simple db to store number of new/recurring subs and then have a web server running that will grab the numbers whenever someone requests them

[raven bane]

Remember to use dotenv and configurate cloudflare 😄

Post here if you get stuck bud

[worldly siren]

sure thing but also question

how do overlays work when the stream is offline lol

[raven bane]

An overlay is basicly an iframe

[worldly siren]

oh

well crap lol

[raven bane]

You should not put tokens etc in there 👀

[worldly siren]

there wouldn't be any tokens

but I think a bot may be best to keep track of the subs

since i need to seperate gifted from non gifted

[raven bane]

sounds smart

[worldly siren]

alright i think I have a way forward, thanks again for all the help!

[raven bane]

Any time

[raven bane]

What happends now when streamelements API is down and people donate, subscribe, cheer etc. Will it get data losses or do you still fetch that somehow and it will sync later on?

[severe shell]

Subscriptions, follows and cheers are data that come from the platform the streamer is using, so it would be able to sync again with no issues.
As regards the donations, it would depend on what exactly went out during the outage. But I believe those are fine to be recovered as well, otherwise it would be reported in the #known-issues announcement

[crystal lotus]

Hey there !
I joined the Discord because I want to find some insight about custom widgets. I'm a total javascript noob and lack some knowledge.

Basically I want to add custom messages in my chat widget when people sub, follow, etc. but without using the StreamElements bot. I've found some examples on Etsy but I don't know if they actually use the bot and then tweak the visuals using HTML and CSS or if they fetch the info then display it...

I can provide some screenshots of the examples if necessary of course

[dim hound]

there is a way to pause the event queue on my custom widget temporally?

with SE_API or smh

[red totem]

Hello there, may I ask why the "WebSocket" API is using outdated Socket IO and also why not use pure websockets? Is there like alternative endpoint that runs v4 or higher socket io or are there plans updating the endpoint at some point or introducing one with pure websockets?

There is no crate/library that supports 2.x socket IO in Rust ecosystem, only v4 so if I wanted to use this I would have to write my own implementation of Socket IO by the protocol reference for 2.x https://github.com/socketio/engine.io-protocol/tree/v2

so before I do that I wanted to ask

[severe shell]

You can use SE_API.resumeQueue()

https://dev.streamelements.com/docs/api-docs/775038fd4f4a9-stream-elements-custom-widgets#resumequeue-method-and-widgetduration-property

[severe shell]

There is no other option of socket implementation, only socket.io.
Also, v4 client is able to reach a v2 server with no issues. Most of the version updates are related to server side only.
As regards the other questions (why using an outdated version / plans to update it or use pure web sockets) I suggest that you open a ticket sending an email to [e-mail] so they can answer those.

[red totem]

I tried it with v4 client and it did not work

I got errors like InCompletePacket and such

so there is version mistatch

The crate I was using was compatible with v4 and v5

[severe shell]

What do you mean by “without using the Streamelements bot”? You can write anything on screen when people sub and does not need to be a text sent on chat.

[red totem]

I found this "The v3 server can communicate with v2 clients, but v3 client can't connect to a v2 server."

so I assume v4 client cannot connect to v2 server too

I think my only option is to implement 2.x myself

[severe shell]

Yeah, I was reading the Rust implementation documentation for socket.io and there is an issue open about supporting v2, but the last message is from last year, unfortunately.

https://github.com/1c3t3a/rust-socketio/issues/132

I don’t believe the SE will update the server version anytime soon. So my suggestion would be looking for another library/implementation that has support for v2 or as you said, implement your 2.x version yourself.

Either way, I would open a ticket with SE if I were you, so at least you know if there are any plans to update it (or suggesting they to do so)

[red totem]

Mhm, there is no crate that supports 2.x so I will have to maybe edit this crate and make PR for it

Thank you for the help

It seems simple enough so It should be doable but yeah I really don't want to do it but I must now :/

Maybe there is something I missed, basically I want to get realtime info about tips when they arrive

nothing else

I think using the websocket is the only way from what I seen in docs

[crystal lotus]

I have found what I was searching for!

But basically it was using JavaScript to fetch data from the API and display those datas in text in a custom chat widget

I lacked the knowledge but I have found a free chat widget that has this feature and it helped me understand how it works and how to replicate

[severe shell]

Great! If you need, there are some more in #widget-share 😊

[balmy thorn]

I'm poring through the API docs for anything which shows how to subscribe to events like chat messages, subs, bits, or the like and what the payloads for that look like so I can build a chat widget. Is it in there? I have a feeling I overlooked it

[severe shell]

If you want to create a chat widget, you don't need to subscribe to those, you can use the Overlay Editor for that. Also, there are some chat widgets in #widget-share you can check the source code and customize the way you want.
In case you need help, the Custom Widget documentation can be seen here: https://dev.streamelements.com/docs/widgets/3cf52461e4e34-before-starting
You can go to Widget Events page from the link above and you will see how to have access to them.

I'm not sure if the new Elements (beta) has added support for chat messages. If not, I believe it will in the future.

[balmy thorn]

Ooh, thanks a lot! I had trouble finding documentation for what I need to do to handle chat messages and tip/sub/bit alerts, particularly what the payloads are and how the widget receives them. I see lots of stuff like the latest sub or the latest follow, but nothing related to individual events. Did I miss that or do I have to learn by example/experimentation?

(My preference is usually to write things from scratch because of how few SE widgets have free and open source software licenses)

I could also just be misunderstanding the point of the big list of "-latest", "-recent", and so on fields

[severe shell]

All widgets from #widget-share are created by the community and are open to use and modify the way you want.
As regards the payload, well... There are some schemas in the documentation, but they are not very well documented, to be honest.

*-recent is an array with the (usually 25) most recent events happened about that item, for example, the last 25 subscribers.
*-latest is the event that just happened, i.e.: when the viewer follow the stream, it will trigger some events, and the most useful is the follower-latest, that will contain the information of who followed.

[balmy thorn]

Awesome! Looks like the best way to learn is by example, then

What specific license is stuff in #widget-share under?

[severe shell]

There is no specific license for them (unless some developers put in the widget code itself). But they are submitted with condition to be free to use and modify.
The ones that aren't free for that are not submitted and you can find being sold in fiver, nerdordie, own3d, etc.

[balmy thorn]

Hmmm, ok. It's preferable IP/copyright-wise to have details on that before creative derivative works. Maybe I'll check out the submission form and see what is in its license grant

I appreciate your help!

[tribal zenith]

time for the monthly plug of my own stuff.
If you want to get started with chat processing, you can also take a look at: https://reboot0-de.github.io/se-tools/tutorial-ChatMessage.html
that requires a 3rd-party script tho

[lapis trail]

Hey there, maybe i am dumb and use the wrong event listener, but when i make an

`window.addEventListener('onEventReceived', function (obj) {
let data=obj["detail"]["session"]["data"];
let follower=data["follower-latest"]["name"]
let channelName=obj["detail"]["channel"]["username"];

setTimeout(() => {

  document.getElementById("lFollower").innerHTML = follower
  
}, 500)

});`

I should get followers that come in the activity feed or do i not understand anything?

Anyway i have an second event listener for the load

`window.addEventListener('onWidgetLoad', function (obj) {
let data=obj["detail"]["session"]["data"];
let follower=data["follower-latest"]["name"]
let channelName=obj["detail"]["channel"]["username"];

setTimeout(() => {

  document.getElementById("lFollower").innerHTML = follower
  
}, 500)

});`

That uses the exact same code and this works, so what am i doing wrong? 😅

[thorn stream]

Make sure that the HTML element with the ID "lFollower" exists in your HTML document for this code to work properly. Also, ensure that the event structure matches the one you're expecting to receive.

try this

window.addEventListener('onEventReceived', function(obj) {
try {
let data = obj.detail.session.data;
let follower = data["follower-latest"].name;
let channelName = obj.detail.channel.username;

setTimeout(() => {
  document.getElementById("lFollower").innerHTML = follower;
}, 500);

} catch (error) {
console.error("An error occurred:", error);
}
});

[thorn stream]

lmk if it works or not

[lapis trail]

the code should works because it sets the lFollower in the onWidgetLoad event listener
i also geht this error like 6 Times when i Emulate an alert

[thorn stream]

In this updated code:

window.addEventListener('onEventReceived', function(obj) {

try {
if (obj.detail && obj.detail.session && obj.detail.session.data && obj.detail["follower-latest"]) {
let data = obj.detail.session.data;
let follower = obj.detail["follower-latest"].name;
let channelName = obj.detail.channel.username;

  setTimeout(() => {
    document.getElementById("lFollower").innerHTML = follower;
  }, 500);
} else {
  console.warn("Missing required data in event object.");
}

} catch (error) {
console.error("An error occurred:", error);
}
});

Before accessing any properties, it checks whether the necessary properties (obj.detail, obj.detail.session, obj.detail.session.data, obj.detail["follower-latest"]) are defined.
If any of these properties are missing, the code does not proceed with data extraction and instead logs a warning that required data is missing.
This prevents attempting to access properties of undefined objects and should prevent the original "Cannot read properties of undefined" error.

Remember that this code assumes that the event object's structure matches what's expected. Make sure that the event you're listening for actually provides the properties in the structure you're accessing. If the structure varies, you might need to adjust the checks accordingly.

[proud spade]

If you put three backticks around your code, it will format it better. You can also tell it what language I think.

```javascript
code here
```

[slate peak]

Good evening, I need help calling the users avatar and displaying the image in the AlertBox Subs widget.
I know that with this api (https://decapi.me/twitch/avatar/) + username I can get the image of the user, but I don't know how to display it.

[severe shell]

Let's get each part.
This event listener "onEventReceived" will be triggered every time some event happens in your live stream, like a follower, subscription, chat message, etc. So session information will not be available here.

window.addEventListener('onEventReceived', function (obj) {
  let data=obj["detail"]["session"]["data"]; // This key doesn't exist, so your code will fail here and not proceed
  let follower=data["follower-latest"]["name"] // Therefore this is invalid
  let channelName=obj["detail"]["channel"]["username"]; // This key also doesn't exist

  setTimeout(() => {
    document.getElementById("lFollower").innerHTML = follower 
  }, 500) 
});```
This event listener "onWidgetLoad" will run just once. When the widget is started (or reloaded). Here it will load the basic info of your channel, like session data, last recent events (i.e.: the last 25 subscribers). The idea here is to have initial values.
```js
window.addEventListener('onWidgetLoad', function (obj) {
  let data=obj["detail"]["session"]["data"]; // This is correct
  let follower=data["follower-latest"]["name"] // This is correct
  let channelName=obj["detail"]["channel"]["username"]; // This is correct
  
  setTimeout(() => {
    document.getElementById("lFollower").innerHTML = follower // Here you will see the last follower before the overlay is started
  }, 500)
});```
In your case, you want to change the follower name. So you need to change the "onEventReceived" part. When in doubt of the values, run a `console.log(obj)` so you can see the keys/values available.
```js
window.addEventListener('onEventReceived', function (obj) {
  console.log('on Event Received: ', obj)
  if(obj.detail.listener != 'follower-latest') return // You don't want anything different from follower-latest, i.e.:chat message or subscriber
  let follower = obj.detail.event.name

  setTimeout(() => {
    document.getElementById("lFollower").innerHTML = follower 
  }, 500) 
});```

[severe shell]

You will need to customize the Alert box enabling the option "Custom CSS" and then write your code for that.
To get the image URL, do a fetch to the API and use the result in the <img src="RESULT_HERE"> tag.

My personal recommendation: Don't do that unless you take extreme care with the image shown. You never know what profile image a user will put and depending on the image that appears on your stream, it can get you account suspended or even banned. I saw that happened once.
Twitch has some control over username creation, preventing offensive usernames when it's possible. However, this control does not extend to images.

[lapis trail]

Ok wow, @severe shell - My Highest respect, You managed to explain it to an idiot named Skytro in a way that he understood even more than you need, Just Wow - Big Thanks

[slate peak]

thank you so much

[wise fog]

hey there, hope everyone's doing fine.
I'm using the Credits Roll by Grot, which are great and I managed to customize this template as I wished.
I still have some questions though, cause i didn't understand the documentation.

1. I want to use the raid-recent command in order to show all the raids that occurred during the session and not just the last one, but can't seem to make it work
2. I wonder if there is a command related to subs that can show not just the newest subs but also the latest re-subs, prime subs, gifted subs, etc. I'm currently using the susbscriber-session command but it only seems to get the new subs (not prime, gifted or resubs).
   Hope i'm making myself clear, don't hesitate if my code is needed to understand the case better 🙂
   The commands are listed here https://dev.streamelements.com/docs/widgets/6707a030af0b9-custom-widget-events#on-widget-load

[cold glen]

Hi. I hope I am posting this in the correct place. I am searching for a developer for a paid project. The short and simple description is just a website that give people credit when they donate through streamelements that they can then spend on things for the stream to do. To give a longer explanation, we use a system for charity currently that doesn't tie in with the streamelements API, it just uses the charity api for everything. I tried to reimplement the same software for a non charity event and it just isn't built to work with stream elements api. The failure is we use email addresses for everything and those are only part of a transaction if they use PayPal. So any donation where they use credit card outside of PayPal doesn't work with our existing system. The dev that wrote that currently exists for charity doesn't want to make big modifications for a non charity event. So in the long run we have decided it might be best to just write a new system for non charity events that we can manipulate better without messing with our charity system. To further describe the event, it is a subathon, which uses the streamelements api currently for the subathon timer. The streamer will be living in the woods and the chat can use their donation points to buy things like food/water/etc for the streamer. The goal is every donation awards the viewer with equal fake currency in the system that is developed that they can spend. So the site would probably want to use something like twitch authentication to verify the donor with the donation or something like that. Again hopefully I am posting this request in the right place. If not please direct me to the correct location. Thank you!

[vital flicker]

I can't find a real answer, is there any way to create a !daily command that gives a random number of points and is limited to a user cooldown of 24 hours

[indigo dawn]

hallo, im making a sub widget, but the documentation for events isnt the best it seems (looking at https://dev.streamelements.com/docs/widgets/6707a030af0b9-custom-widget-events#on-event), so i was wondering how can i get the sub tier from the event object, and what will it return for each tier? also what would be the best way to test the code in an event listener? for anyone who needs this, look at the github page in the pins, super useful

[severe shell]

You can use jebaited.net for that. Check the second pinned message and you will find instructions on how to do that.
You can change the points number in the example command for ${random.1-100} and a number between 1 and 99 will be randomly selected, or any range you want.
The cooldown you can set in the command dashboard for user cooldown. 24 hours is 86400 seconds

[severe shell]

When the subscription happens, you will receive something like that as subscriber-latest. Tier is on obj.detail.event.tier.
The sub tier is shown in the tier key, as 1000, 2000, 3000 and prime (tier 1, 2, 3, and prime, respectively).

{
  "type": "onEventReceived",
  "timeStamp": 803435,
  "detail": {
    "listener": "subscriber-latest",
    "event": {
      "providerId": "874616659",
      "amount": 4,
      "tier": "1000",
      "quantity": 0,
      "avatar": "https://static-cdn.jtvnw.net/jtv_user_pictures/1234-1234-1234-profile_image-300x300.png",
      "name": "maawawal",
      "_id": "68e74de6d12757411661344f",
      "sessionTop": false,
      "type": "subscriber",
      "message": "this is a message from the subscriber"
      "originalEventName": "subscriber-latest"
    }
  }
}

There is some variation when it is a gifted sub. A wild key called gifted: true appears (or 1, don't remember exactly)

[inner prawn]

heyy guys just wondweing is it possable to get like a glow effect on lables like mu sub goal and total subs?

[vapid crater]

does real alert contains msg-id?

[severe shell]

Not with the default ones, you will need to create a custom version of them

[severe shell]

This is a real event I just captured:

[inner prawn]

How would I do that?

[vapid crater]

thank you ❤️

[severe shell]

You will need to create a custom widget for that (using HTML, CSS and JS).
Or maybe you can find some widget that has what you need in #widget-share

[inner prawn]

Am I best going to fiverr looking for something like that

[inner prawn]

@ancient lynx id like to chat here if you want to help as im not trying to be scammed or anything so please kindly not dm and have a conversation here

[ancient lynx]

Yep, that's not a problem at all. I know it sounds like a scam hahah

[inner prawn]

has happened before and i was scammed/robbed over 4000$ so im just worred about it

[ancient lynx]

lol

ye I understand

maybe I can just guide you on what you need to do if you want, over call or something like that

as I said, not something really hard to do

[inner prawn]

yeah is there a channel here we can join into

[ancient lynx]

not sure

I guess we can use gaming room

it should be less than 10 mins

[inner prawn]

yeah sound good

[ocean steeple]

Hello, not sure if this is the right place to ask, so please let me know if there's a better channel.

I'm trying to create an overlay that includes a textbox which is editable via a chat command (only usable by mods). The intent is to have text on the screen that can be updated by a mod (e.g. a Win-Loss counter for the stream).

Is something like this possible? And if so, has someone got a template I could use as I'm not very good with coding.

[wise fog]

Hey, I'm sorry I don't want to spam but I am on a bit of a rush with this and haven't received an answer... Is there a way to achieve what I'm describing ?

[rigid dome]

Is there a way to detect if the user is on youtube vs twitch from the widgetload?

I couldn't find a 'provider' in the event

[severe shell]

If the idea is just to update counters, you can use the counter one for that.
+ > Labels > Other > Bot counter

Put the counter name in { }, for example:
Current wins: {wins} <br />Current losses: {losses}
(<br /> means a line break)

So create a command to update the wins and losses and done. The current value will appear in the screen.
In case you want for other things, you will need to create a custom widget for that.

You can also fetch this without token: https://api.streamelements.com/kappa/v2/channels/{obj.detail.channel.id}

[severe shell]

raid-recent shows the last 25 raid events from anytime, not specific from the last session. I don't think there is a raid for session.
subscriber-session is for any kind of subscription. For new subs, it is subscriber-new-session. For resubs, you can check subscriber-resub-session.

Although the documentation can help, there are some useful info missing sometimes, so if I were you, I would go to the browser console to check the values you have. Doing a console.log(obj) in your code can give better idea of the keys available to use.

[wispy oasis]

anyone else having problems in overlays custom widget accessing the sessiondata for follower amount, subscriber amount and bits amount? its just telling me its undefined since yesterday and streamelements says nothing is wrong :/ im using:
window.addEventListener('onSessionUpdate', function (obj) { let data=obj["detail"]["session"]["data"]; document.getElementById("det").innerHTML = "session update - "+ data["tip-latest"]["name"];)} but since yesterday it doesnt work and error is Uncaught TypeError: data is undefined
<anonymous> about:srcdoc:338
<anonymous> about:srcdoc:42

[ocean steeple]

Thanks for the response. Yes I was hoping to be able to pick up a specific text string rather than just increasing a counter. An example of this is a bet percentage for Blue vs. Red. The number following a specific command would be used as the new value for the custom widget.

Example: !blue 70 (meaning !red 30) would update the widget/overlay to show "70" in a predefined text box which is part of a wider graphical image to display the betting split.

Although a counter might work if we can force update a specific number rather than just increasing by increments of 1

[severe shell]

Yeah, in that case you will need to create a custom widget for that. Here some basic things.
HTML

<div id="modText" class="modText"></div>

CSS

.modText {
  font-size: 2em;
  color: white;
}

JS

window.addEventListener('onEventReceived', function (obj) => {
  if(obj.detail.listener != 'message') return
  const sender = obj.detail.event.data.nick
  const text = obj.detail.event.data.text
  if(sender == 'wingofchicken' && text.startsWith('!blue')){ // if the person who sent the message is "wingofchicken" and the text starts with !blue
    document.querySelector('#modText').innerText = text.split(' ')[1] // that will show the first word after !blue
  }
})```
From then, you can create your calculation, change the text, colour, etc etc

[severe shell]

Probably that's the issue:
#dev-chat message

[ocean steeple]

I'll try this out now, thanks

[wispy oasis]

sadly not, it just stopped working mid stream without any session reset. also, i did set the session values via the website, and that doesnt make it work :/ im not really good at programming, can u tell me how to check if the value is zero and also how to get the output that alessandro has so i can check mine?

[severe shell]

Just do a console.log(obj) in your code and the values will appear on browser console.

[wispy oasis]

console.log(obj)
Uncaught ReferenceError: obj is not defined
<anonymous> debugger eval code:1
debugger eval code:1:1
console.log(data)
Uncaught ReferenceError: data is not defined
<anonymous> debugger eval code:1

and my code is let data=obj["detail"]["session"]["data"];

[severe shell]

Where are you adding the code? It should be in the "onWidgetLoad"

[wispy oasis]

window.addEventListener('onSessionUpdate', function (obj) { ""HERE IS MY CODE""}); it has been working like that for at least a month

[severe shell]

Did you put console.log(obj) in ""HERE IS MY CODE"" place and it shows that error?

[wispy oasis]

oh no i went into the f12 console and put it there, my bad, will redo

[severe shell]

Oh, ok... Yeah, it should be inside the code 🙂

[wispy oasis]

i think this is what it gives me now:
Source-Map-Fehler: Error: NetworkError when attempting to fetch resource.
Ressourcen-Adresse: https://streamelements.com/overlay/scripts/vendor.js

|| window.addEventListener('onSessionUpdate', function (obj) {
let data=obj["detail"]["session"]["data"];
document.getElementById("det").innerHTML = "session update - "+ data["tip-latest"]["name"];// +latestFollow + " &&& "+ latestSub;
console.log(obj)
});||

and i emulate a follower to trigger the session update, if thats important

[severe shell]

Ok, console.log(obj) should be added first thing inside the code, but no problem, we can move from here.
The problem is: The key obj["detail"]["session"]["data"] doesn't exist in "onSessionUpdate". It only exists in "onWidgetLoad".
It will work if you remove the ["data"] part from the variable.

window.addEventListener('onSessionUpdate', function (obj) {
 console.log(obj)
 let data=obj["detail"]["session"];
 document.getElementById("det").innerHTML = "session update - "+ data["tip-latest"]["name"];// +latestFollow + " &&& "+ latestSub;
});

[wispy oasis]

damn thanks, that worked, i just wonder how it stopped working when it was working no problem before 😄 but thanks so much, i was brooding over this for the last 24 hours! ❤️

[severe shell]

Yeah, I have no idea on how that was working before 😄 Glad I could help

[wispy oasis]

on the streamelements API it says for onWidgetLoad to use " let data=obj["detail"]["session"]["data"];" and in the sessionUpdate part it says "use same as onWidgetLoad to access data" so... thats why i did that
maybe i misread / misinterpreted but as its working now i dont care anymore 😄 😄

[severe shell]

I've just read that in the documentation and it is really confusing, so I understand your pain! Either way, that documentation really needs to be updated.

[wispy oasis]

yeah, would be nice if they just gave more examples somewhere to clarify 😄 anyway, hope you have a good rest-weekend

[wise fog]

Thanks so much!!
Last time I tested subscriber-session I was live and someone subscribed with prime but it didn't show up in the credits, hence my question.
If I understand well, I have to use a command for subs and a command for resubs otherwise resubs won't show up?

[severe shell]

subscriber-session shows only the count of all subscriptions in the session (new subs, resubs, prime, etc), everything in just one count.
The list of subscribers will appear in obj.detail.recents. In there you will need to filter the "type" to "subscriber"

There is also a subscriber-recent from obj.detail.session but it doesn't separate new subs or resubs. But I think you can separate each one using the amount value. If 1 is a new sub, if more than 1, is resub. Prime is shown in tier as prime

[wise fog]

I use it so that is shows the names and not just a number, and it didn't show the primes, I'll dig into all of that and see what I can get from it

[severe shell]

console.log(obj) is always useful

[wise fog]

thanks

[raven bane]

There is a limit to pull subscribers from activities, i wish to pull all active subscribers and then from there sort out tier1, tier2, tier3 and not gifted. Is there a way?

[quaint gazelle]

Hi there! I'm currently writing an application where users can join to participate in a giveaway, but the winner will be determined by my application, not by streamelements.

Can i create a giveaway and - once i determined the winner by myself - close the giveaway without calling the /winner endpoint?

And is there some example data for the body of the /v2/giveaways/{channel} endpoint?

E.g. How to setup the amount of Tickets, the Ticket price, the string to join the giveaway and so on.

If thats not possible - is there an endpoint to try remove points from a User which tells me If the User had enough points? E.g. returns HTTP 400 If User had 500 points, but i wanted to remove 1000, and Returns HTTP 200 If the User had 2000 points

[vapid crater]

maybe skip the individual event from bulk gifts?

if (evt.gifted) {
    if ("playedAsCommunityGift" in evt) {
        console.log("skipped individual bulk gifted alert")
        return
    } else {
        giftedLatest = obj.detail.event;
        sender = evt.sender;
        prepareArray();
        if (evt.bulkgifted) {
                        //bulk gifts
            newEvent = sender + " gifted x" + amount;
        } else {
                        //single gift
            newEvent = sender + " gifted a sub to" + name;
        }
    }
} else {
    subLatest = obj.detail.event;
    prepareArray();
    newEvent = name + " x" + amount;
}```

[quaint gazelle]

i'm getting 403 - Not allowed to perform this operation when calling the API, but and using Authorization Bearer + my JWT token found under https://streamelements.com/dashboard/account/channels in my channel row. what am i missing?

Resolved: channel needed to be the channelID not the plain channel name.

Is there a possibility to "try-remove" points from user via API? Lets say, the user has 2000 points, and i want to remove 3000 from him. I'd like to distinguish if the user has enough and if they were successfully removed from the user

i mean u could call /:channel/:user GET and immediately call /:channel/:user/:amount PUT afterwards, if he has enough, but that leaves a small gap for the user to remove points inbetween.

[still juniper]

I find that race condition extremely rare to happen, but in any case you should check what the PUT endpoint really does/returns, it shouldn't let you remove a number of points larger than what the user has, but you'll have to test

[quaint gazelle]

i did test, it returns newAmount: 0 and returns 200 HTTP

[tribal zenith]

What is the use-case for this?
It seems like a setup to rig or influence a giveaway, that is seemingly hosted by StreamElements

[quaint gazelle]

Yes indeed i want to specify the winner, but i want to implement a same algorigthm as rollbit does with their provably fair games. The winners are determined by an algorithm that can be verified to be 100% random and cannot be manipulated

So its even more fair / transparent to All users

[vital flicker]

is there a way to enable a custom command for everyone but take away the ability for mods to spam it? i.e. I have a daily command that's locked on user cooldown but my mods can bypass the cooldown

[thorny warren]

straight to the point: how do I modify the credit roll widget to show recent followers and subscribers instead of just session followers and subscribers? I want the credit roll to always show a list of people instead of being empty when my stream has been devoid of new followers and subscribers.
I have a basic understanding of coding but I'm willing to learn more.
I've managed to fix the font size issue and the overlapping issue with the credits roll widget through my own research and using the search box.
But now I want to better understand the credit roll widget so I can modify it for my wants and needs.
I'm not demanding anyone to hold my hand through all this, just point me in the right direction; thank you.

disregard my previous post
I just realized something, I can do a workaround and make a "credit roll scene" with overlay labels
while I appreciate what the credit roll widget is trying to do, it just feels so incomplete

[hardy walrus]

Not possible

[quaint gazelle]

Anyone has an idea?

[keen iron]

Getting this error message while using the Tip Event: {"statusCode":400,"error":"Bad Request","message":"child \"currency\" fails because [\"currency\" is not allowed to be empty, \"currency\" must be one of [AUD, BRL, CAD, CZK, DKK, EUR, HKD, HUF, ILS, JPY, MYR, MXN, NOK, NZD, PHP, PLN, GBP, RUB, SGD, SEK, CHF, TWD, THB, TRY, USD, INR, UAH]]. child \"provider\" fails because [\"provider\" is not allowed to be empty]. child \"user\" fails because [child \"email\" fails because [\"email\" must be a valid email]]","details":[{"path":["currency"],"message":"\"currency\" is not allowed to be empty"},{"path":["currency"],"message":"\"currency\" must be one of [AUD, BRL, CAD, CZK, DKK, EUR, HKD, HUF, ILS, JPY, MYR, MXN, NOK, NZD, PHP, PLN, GBP, RUB, SGD, SEK, CHF, TWD, THB, TRY, USD, INR, UAH]"},{"path":["provider"],"message":"\"provider\" is not allowed to be empty"},{"path":["user","email"],"message":"\"email\" must be a valid email"}]} What should I do

[grizzled rock]

Hey there! I'm currently working with the Stream Marathon Timer Widget and I'm trying to add a pause/restart Button to the existing menu. I'm pretty new to programming and tried if (obj.detail.event.field === 'pauseTimer') { if (!isPaused) { pauseTimer(); } else { resumeTimer(); } } return;
But this doesn't work. Any Ideas?

[tribal zenith]

https://streamelements.com/dashboard/overlays/share/63347c8c7ad9f59330d60d0e

[grizzled rock]

Thank you very much!

[severe shell]

Can you check if that is still happening? How exactly are you obtaining that error message, could you detail the steps?
I have just tried to emulate a tip event from Overlay Editor and it works fine from my side, maybe it was a temporary error.

[keen iron]

i use kotlin at the moment. So i must sendind a curl request to the endpoint in kotlkn

[severe shell]

Ah okay, it's the API request. Which endpoint are you sending the request to? How did you fill the body of the request?

[keen iron]

val mediaType = MediaType.parse("application/json")
val body = RequestBody.create(mediaType, "{\n  \"user\": {\n    \"userId\": \"\",\n    \"username\": \"\",\n    \"email\": \"com\"\n  },\n  \"provider\": \"\",\n  \"message\": \"\",\n  \"amount\": 0,\n  \"currency\": \"\",\n  \"imported\": true\n}")
val request = Request.Builder()
  .url("https://api.streamelements.com/kappa/v2/tips/channel%20id")
  .post(body)
  .addHeader("Content-Type", "application/json")
  .addHeader("Accept", "application/json; charset=utf-8, application/json")
  .addHeader("Authorization", "Bearer my token")
  .build()

val response = client.newCall(request).execute()```

[still juniper]

Your request body is malformed as the error clearly detailed. But probably the most important question is what you're trying to achieve, because that post request doesn't make any sense to write. I'm smelling ChatGPT here

[severe shell]

Yeah, the request looks like just a copy-paste from a boilerplate code.
/channel%20id from the URL should be your account ID
"Bearer my token" should be your JWT
And the body should be something like this:

{"currency":"USD","payFees":true,"user":{"username":"JILENCE","email":"[e-mail]"},"amount":100,"message":"MESSAGE HERE","imported":true}

[still juniper]

I just find it hard to believe he really wants to POST a tip when he's not even providing an amount/currency, that's the very least you'll be providing. My bet is he wants to fetch them instead

[novel goblet]

Hey guys how do I add a custom chat box in overlays in stream elements to combine rumble and YouTube chat to show on stream in obs , I don’t know how to build custom widgets is there any way I could learn it? Any help is much appreciated

[vital wadi]

I have widgets that trigger on chat commands, can anyone point me in the right direction how to use them with channel point rewards?

[hardy walrus]

@vital wadi closest we have is something in #widget-share that only works with redemptions requiring text input.

[hushed pivot]

Hi, can you help me change app logo and app name in my app?

Who is better to turn to?

[keen iron]

When someone donates, I want the message to come as normal TTS (i.e. the completely normal Settings "TTS"). But in addition, other voices should be used that are played from an external website. So that means you can do a normal TTS donation, but you should also be able to add “CustomVoice: Hello, I am a custom voice” to the donation. What is the best way to implement this?

[severe shell]

If you know Javascript, you can use this piece of code to help you create something:
https://github.com/c4ldas/streamelements-widgets/tree/main/twitch-channel-points

[severe shell]

Open a ticket and the staff will help you on that. #submit-support-ticket

[keen iron]

is there an event which get called when a alert starts playing or stop playing?

[north ivy]

Have there been any significant advancements in workflow for developing things locally aside from this?

If not, thinking of making something to help, but don't want to reinvent the wheel

[severe shell]

If you use the new Elements Editor, you can use this:
https://dev.streamelements.com/docs/elements--sdk/bult8ogswaeu2-setup-guide

[north ivy]

Thank you, I'll check this out too

[severe shell]

There is no event, but if you enable Custom CSS in the alert, you will know when it is triggered because your code will run at that time.
Not sure about when it stops, but maybe you can try and let us know.

[severe shell]

You will need to code an alert to read the donations and look if the body has the "CustomVoice" string. If so, play the TTS from your external website.
Donations appear in "onEventReceived". You can check the listener called "tip-latest"

[thick cairn]

I hope this is the right channel, if not please direct me to the proper one :)
So, I want to create a custom widget, taking in custom events. (Or any events for that matter.)
After hours of searching, I've come across the /:channel/items POST endpoint, which seems to serve my needs.
Now, I've been trying to test it but I keep getting an internal server error nothing more.
Any ideas?

I have no idea what the intended usage of the API endpoint is https://dev.streamelements.com/docs/api-docs/81b436931060a-channel-items

[hardy walrus]

That's for loyalty store items by the looks of it.

Not external things if that's the case.

[thick cairn]

the custom widget docs mention this specifically https://dev.streamelements.com/docs/api-docs/775038fd4f4a9-stream-elements-custom-widgets#se-api

unless there is yet another "store" in the SE api

referring to this bit

SE_API.store.set method emits an event received by every custom widget. Example payload:

Ultimately what I'm trying to do is have custom events anyway, so if there's an easy way to go about it then that'd be a better solution

e.g. I want some endpoint where I can send data to like "custom-event" with payload "text": "hello"

and then process that event

[hardy walrus]

For context this is what I mean with your original link https://streamelements.com/l1l_f3ll4/store

[thick cairn]

or is there anything about the usage of https://dev.streamelements.com/docs/api-docs/e93446cffb4dd-channel-socket

also not much info about what it expects

also hard to try anything

yea I have no idea of figuring out what to even put into the event and where

all I get is a bad request and the docs have neither descriptions nor helpful examples

[severe shell]

This endpoint, /:channel/items is used to create a new item in Streamelements store https://streamelements.com/TWITCH_USERNAME/store
Token is your JWT
channel is your Account ID
Accept is application/json
Body is an object, this is an example that will work:

{
  "accessCodes": {
    "keys": [
    ],
    "mode": "multi"
  },
  "accessLevel": 100,
  "alert": {
    "audio": {
      "src": null,
      "volume": 0.5
    },
    "enabled": true,
    "graphics": {
      "duration": 8,
      "type": "image"
    }
  },
  "allowMessages": false,
  "bot": {
    "identifier": "itemCommand",
    "sendResponse": true
  },
  "categoryName": "",
  "cooldown": {
    "category": 0,
    "global": 5,
    "user": 10
  },
  "cost": 1500,
  "description": "Item description",
  "enabled": true,
  "featured": false,
  "name": "Test Item",
  "quantity": {
    "total": -1
  },
  "sources": [
    "bot",
    "website",
    "extension"
  ],
  "type": "perk",
  "userInput": [
  ]
}

[severe shell]

SE_API is another thing completely different. This is a key/value pair (like a small database) to store informaton where you can store and retrieve using custom widgets. The "store" here is a verb, to store data.
The store I mentioned in my previous message is the store like a place where you can "buy" items using Streamelements loyalty points.

[severe shell]

From your custom widget, you can add this and it will create an entry on SE kvstore (the SE_API) with that info

window.addEventListener('onWidgetLoad', async function (obj){
  SE_API.store.set('customEvent', { text: "hello"} )
})

When the widget loads, it will trigger the following for the each custom widget you have:

{
  "detail": {
    "event": {
      "data": {
        "key": "customWidget.customEvent",
        "value": {
          "text": "hello"
        }
      }
    },
    "listener": "kvstore:update",
    "timeStamp": 443.10000000149,
    "type": "onEventReceived"
  }
}```

However, that only works inside a custom widget. But yeah, you can use sockets like you said. Let me try to explain how to use it.

[severe shell]

/:channel/socket is useful to send arbitrary info to SE outside overlays and custom widgets. You can put anything on the body, the only required key is "event"

This will work to send "text": "hello"

const accountId = 'YOUR_ACCOUNT_ID'
const jwt = 'YOUR_JWT'

fetch(`https://api.streamelements.com/kappa/v2/channels/${accountId}/socket`, {
  "method": "POST",
  "headers": {
    "Content-Type": "application/json",
    "Accept": "application/json",
    "Authorization": `Bearer ${jwt}`
  },
  // You can send any information on body, the only required one is event: 'eventName'
  // The eventName can be anything you want, but 'event:test' is a useful one that shows on custom widgets
  "body": JSON.stringify({ 
    "event": "event:test",
    "data": { "text": "hello" }    
  })
})

In your widget you can see the info with this:

window.addEventListener('onEventReceived', (obj) => {
  console.log(obj)
})

obj will be something like this:

{
  "detail": {
    "event": {
      "text": "hello"
    },
    "listener": "event:test"
  },
  "timeStamp": 298855.899999999,
  "type": "onEventReceived"
}```

[sacred cobalt]

Hello I am investigating if I can integrate a chat widget for my youtube channel, when I enter console to investigate I see the following error:

when I access the link I get: {"statusCode":400, "error": "Bad Request", "message": "Failed to get youtube chat"}

does anyone know if something is going on with the api for youtube chat?

correction: It was my mistake, I tried to stream in "hidden" but the streaming should be in public to work!!!

[rigid dome]

Are there more Field options than what's listed on the site?

Would be nice to have checkboxes linked to text inputs or a dynamic list so users can decide how many of a certain field to include?

Anything in that direction available?

[keen iron]

Accessing this area requires additional permissions from Twitch.

But I have full Control? What should I do

[hardy walrus]

Context?

[zenith fossil]

heya!
is it possible to play text to speech in a custom widget? It's in the typical Modules, but I wanna use it in my own custom widget. :)

[still juniper]

#dev-chat message

[brave ginkgo]

hey, does anyone have an idea on how to implement TTS voices from the Eleven Labs API? So that donations get read out by the custom voices? I looked into the SE API documentation but I'm not sure if it's possible with it. thanks in advance :)

[scarlet reef]

hello everyone, in the dashboard, "streaming tools" tab, "alert and widgets (beta)" in edition of the alert, component on the screen, "alert video" you can change the hue, saturation, position but no possibility of changing the duration of the display, will a function be provided? THANKS.🙂

[brave ginkgo]

i thought about using a custom widget for that, but not exactly sure how to continue

[severe shell]

Well, you would need to enable Custom CSS on the overlay. And in there you can code your own JS and make the API calls for that

Just create the donation alert, as usual, and enable the custom CSS. From there you will see the part called "Open Editor"

[severe shell]

That would be good to ask and suggest in #elements-editor-widgets20

[brave ginkgo]

so basically i could just add it to the existing alert? or should i still create a new one?

[severe shell]

You can add it to the existing alert. But you will have to code how it would work after enabling Custom CSS

[brave ginkgo]

do you know if the audio from eleven labs will be played back via the browser source of the widget or how this will work?

[severe shell]

Once you enable custom css, you will have to code the alert (using html, css and javascript) the way you want.
You will see a basic code once you click Open Editor, so you can use it to create a new one and make your API call to read the donation message.
The way the alert appears and how it is going to sound will depend on the code you put in the Editor. In case you don't know how to code in javascript, that will be useless to you.

[brave ginkgo]

i have basic knowledge from school and would use chatgpt for assistance. is there any limit to code complexity if I want to add more features? like that the api call is only made starting from a specific donation amount etc? or can i only do basic stuff in there?

[severe shell]

You can do whatever you want, there is no limit. Once a donation arrives, you will have access to some inline variables, like shown in the page below:
https://dev.streamelements.com/docs/widgets/62d6299fe71df-custom-code-in-alertboxes

So you can use the {{messageRaw}} variable and make a fetch request to the Eleven Labs endpoint using that as the message to be generated. And then you play the audio received.

[brave ginkgo]

alright, thank you very much :)

[still juniper]

and would use chatgpt for assistance
if you want to avoid headaches, don't.

[rigid dome]

is there an event for twitch hype trains? or another way to get that kind of information?

[severe shell]

Not in Streamelements.
Easiest way (and not officially supported) is using twitch pubsub. The messages will come from hype-train-events-v1.{channelId}
Messages are like this (not sure if it's updated, just found it online): https://pastebin.com/WLK1frBZ

I think this should give you some idea (but it needs to do the work for ping/pong responses, reconnections, etc):

window.addEventListener('onWidgetLoad', async (obj) => {
  const providerId = obj.detail.channel.providerId
  const username = obj.detail.channel.username  
  const eventTopic = `hype-train-events-v1.${providerId}`
  const socket = new WebSocket('wss://pubsub-edge.twitch.tv')  

  socket.onopen = (event) => {
    const info = {
      "type": "LISTEN",
      "data": {
        "topics": [eventTopic]
      }
    }
  }
  socket.onmessage = (event) => {
    const data = JSON.parse(event.data);
    console.log(data)
  }
})```

You can also use Twitch API and work with the authentication process
https://dev.twitch.tv/docs/api/reference/#get-hype-train-events

[shrewd copper]

This is almost ready. Stay tuned…

[grave remnant]

@pseudo siren hi, I'm a fan of your clock widget but I would like a date stamp as well though I'm bit inexperienced with javascript, could you teach me how to make your widget display date as well?

[zenith pond]

for the Stream Elements API does anyone know what the Origin Query Param for the Activities endpoint is? Fixed. Origin = feed

is there any way to suggest edits to the API docs? a couple of small things that could do with being tweaked. Annotating what Origin does would be super useful, as well as making it clear how types are supposed to be input.

[severe shell]

There is, and I’m doing that, but they need to approve the changes and that takes months or more.

The API is outdated and incomplete, many changes need to be done. I did some and requested approval, once they commit the changes I will continue and update more endpoints.

[severe shell]

Although the API says it is required, you can omit it when doing the request outside stoplight webpage

[keen iron]

i have the problem, when i restart my server, the streamelements overlay, dont fetch the data i need anymore (i fetch it with the custom js code in the overlay menu).
So, its not fetching the data anymore, but when i open the overlay editor in my browser, its working. But not in OBS (So, its worrking in obs but when i restart my server, that receive the data, its not receiving anymore. How do i reload the overlay in OBS without restarting obs? )

[severe shell]

Select your browser source and click on "Refresh" button (below the preview screen)

[hearty ocean]

hi! im going through the documentation but struggling a bit with it. Where can I find all the badge type names (moderator/admin/artist/partner/etc)? im trying to use custom badges for a chatbox, but i couldn't find all the basic badge names to replace them with different urls

[severe shell]

https://www.twitchdatabase.com/global-badges

[hearty ocean]

exactly what i needed! thank you very much!!

[uncut horizon]

Yo, I was trying to figure it out how to make this simple layout to a recent event list were the logic works like "{name} {kind of event} {description}" - As an example it would be something like "Robert followed the channel" or "Robert subbed the channel". Any tips on how to do it? or somewhere I can find something similar so I can adjust...

[dim hound]

ih ala um br?

[severe shell]

When you create a custom widget, the example code is an event list that shows the username and the action.
You can modify it to meet your needs.

[raven bane]

Im helping a streamer with subathon and we are working alot with the Streamelemetns API, his JWT token get automaticly updated. Why so?

[uncut horizon]

Yeah I tried to customize but I didnt understand what to change to get that result.

I messed with the JS and CSS and I couldn't get to work as one line

[uncut horizon]

I'm pretty much clueless about it. I'm more of a designer than dev. I can somewhat understand what the example code is doing but not enough to get to work as I described

[pale echo]

Hello, I was experimenting with the Stream Elements API and the
GET https://api.streamelements.com/kappa/v2/activities/{channel}
returns an empty array, I also tested with the in browser request and result is the same, did I do something wrong?

[severe shell]

Probably. What did you put in types? It expects an array of strings, like this:
["follow", "tip", "raid", "subscriber", "cheer", "redemption"]

[pale echo]

that was it, thank you much

[crude merlin]

This was a long time ago, but recently came back onto my radar and realised I never got an answer for it, anyone got any clue?

[hardy walrus]

While I can't specifically answer your question: I think category refers to the particular "section" or top chatters as shown here and then the specific user/number

[raven bane]

Bumping this one. Why do SE automaticly renew the token? Is it something the streamer do wrong or do it update because of to many requests maybe?

[hardy walrus]

@static wigeon ^^^^

[crude merlin]

Ok, so something like /chatstats/{streamer}/chatters/1 or /chatstats/{streamer}/chatters/{username} is what you think, I shall give it a shot and see the outcome 👍 Thanks

[hardy walrus]

It should give a clue in the example but not at PC so cba to look on mobile

[crude merlin]

There is no example

That's why I have asked before, and now

[hardy walrus]

Mind linking that page?

[crude merlin]

https://dev.streamelements.com/docs/api-docs/24c3ad81002f0-username-category-item

even the description is lacking help

[hardy walrus]

I stand by that idea but yeah it does appear to be missing an example response.

[crude merlin]

Yeah, I assume it's not really used since no one has asked about it here from checking, and I did some digging through the public stats page and the endpoint isn't used there either, so it seems it's not used internally or externally, just a mystery endpoint

[crude merlin]

Just ran this, doesn't work

[crude merlin]

I also attempted /chatstats/{streamer}/stats/chatters
My thought process was maybe {category} would be epm | stats but that also doesn't work, the mystery endpoint continues to elude

[lucid tinsel]

Hello! Is there a way to obtain a list of subscriptions filtered by date and by type, such as Prime, Tier1, Tier2, Tier3, or gifted? I've noticed that the Twitch API doesn't offer this information, and the StreamElements API only provides an activities endpoint that is not accessible without a OAuth Token. While using widgets, I've observed that events can be captured, but I need a solution that captures all events continuously.

[severe shell]

If you are talking about this endpoint, it can be used with JWT:
https://dev.streamelements.com/docs/api-docs/861a5d5450bbb-channel

Where it says "Token" put bearer in front of your token

As regards the parameters:
channel is your Account ID
after and before are in this format: YYYY-MM-DD
origin you can put feed
types is an array of strings, like this: ["follow", "tip", "raid", "subscriber", "cheer", "redemption"], you can use just ["subscriber"] for your case

[regal steppe]

Hi I have a question. Can the custom widgets be programmed in JS to post to chat? My widget already reads chat and reacts accordingly, but it would be nice if the overlay could post to chat, perhaps under the chatbot username?

[lucid tinsel]

thanks! I was confused by the documentation. It works perfect!

[crude merlin]

Shameless plug to upvote my #1153284807883767909 idea to improve documentation for cases like this 👍

[lucid tinsel]

done! we really need an improvement! thank you for the suggestion

[severe shell]

That's something we have been asking for so long... But it seems a new documentation page is on its way and that one will be able to receive and update Pull Requests.
Fingers crossed! 🤞

[crude merlin]

That's great news, I noticed since my last look through the documentation many months ago that there's a sandbox api now, although I haven't looked into it.
When you say receive and update PRs, do you mean that it'll be public and the community to contribute? Because I'm happy to sit and improve documentation, it'd be great to also suggest API updates in a centralised way with some form of developer communication from SE side, granted it's not the primary part of the business, or profitable, so will always be neglected, but community input would help support it without SE input (past reviews)

[severe shell]

Yeah, it will be public to the community to contribute.
I'm very excited for that because I really like to work with documentation and make them easier to understand.

[crude merlin]

Yeah, I'm the same, that's why I've been so keen to figure out this mystery endpoint, it's probably got no use to my project what so ever, but I really want it to be documented in some way for those who could use it. I know before lx was tagged in my original question, but unfortunately they only replied to other support and not my question 😦

And obviously, I'm not about to go tagging SE devs in the hope for an answer, one day I will get my answer though

[severe shell]

It's really hard to have dev staff in here, unfortunately. It would be amazing if we have someone kinda dedicated to be present in this channel.
As regards that endpoint, I also have no idea on how that works. I tried to perform some tests in the past, but no success. And I've never seen that call anywhere, I wonder whether that endpoint is just a legacy and it is deprecated now or never worked.

[crude merlin]

I fully understand not having dev staff in here; they'd spend more time answering questions than building features or fixing bugs which is the profitable part of the business - my full time job is also as a developer so I know that pain.

I think everyone has tried that endpoint to no avail I did the same as you, checked across the whole website to find it being used, clicked every button and nothing uses it! Depending how the twitch bot is built though it could be being used internally to retrieve certain chat command outputs, but unlikely, I'd assume it has it's own DB connection to get the information.
But I will not rest until I know what that endpoint does

A side note, one endpoint I'd love to have is a "user profile" endpoint, the chatbot side can retrieve information such as time_offline or lastseen but the API has no access to these details, I've been integrating SE into a discord bot for a specific streamer, and I have a /userstats command to see watchtime position, points position, messages sent, etc
But I can't get these other details at all from the API which is a huge shame, really limits what I can do

[hardy walrus]

This may help https://docs.decapi.me/twitch?endpoint=uptime%2F%3Achannel

[crude merlin]

Sorry, my explanation wasn't clear
My bot handles a single streamer, for the example I'll call them StreamerA a viewer viewerX can go onto discord and run /userstats username: viewerX and the output is something like the attached image.
The idea is viewers can see their stats for StreamerA's channel.
My issue is I cannot get information such as "offline watchtime" or "lastseen" for a viewer from StreamElements - which is tracking this information already

Hope that makes more sense

[hardy walrus]

offline watch time technically doesn't exist.

as it's only earned while online.

[crude merlin]

There is a "time in offline chat"

you can use !top offline on Twitch and SE will return a leaderboard of top offline users

That information exists from a chatbot perspective, my point is I'd love for that information to exist on the API

🙂

[hardy walrus]

Yeah. I don't think that's anywhere but there.

And even then probably not even accurate.

[crude merlin]

It's accurate enough for smaller channels, obviously the limitation on Twitch is around 1000 users in chats will switch from sending JOIN | PART and batch them instead, from SE side it just increments in 10 minute intervals based off of who has not left with a PART

it's no different to online watchtime, it's the same incremental counter with a switch on if the channel is live or not, the logic from the IRC chat is still the same using JOIN and PART

either way, it's irregardless of my point; SE has the information for the chatbot, it would be nice for that information to be exposed on the API for people to make cool content with it

[pulsar willow]

How dose I have a custom Photo for a chat message

[crude merlin]

You might need to provide some more information, this is a very vague question

[pulsar willow]

So for my chatbox, I want this certain image to be the message bubbles. How would I do that?

[crude merlin]

It would depend what overlay you are using, not all of them will support customisation like that, the one I have seen people use is "Chat Bubbles by Zaytri" - which does not support images for the bubbles, but allows customising the colours, design, etc through the editor

[pulsar willow]

Ok, so should I start simplier and try that first?

[crude merlin]

That'd be my suggestion - Chat Bubbles by Zaytri is a really powerful overlay, lots of customisation involved that can mean it looks unique to you also, if you wanted an image as the background you'd probably need to find something that allows that or start looking at making your own overlay to use

[pulsar willow]

ok but how do i now put it into OBS?

[crude merlin]

On the https://streamelements.com/dashboard/overlays page, you can click the 3 dots (to the left of EDIT) and press "Copy URL" - the copied URL is what you use on OBS, just add a new Source as a Browser Source and paste in the URL

[pulsar willow]

ok, But how will I know if it worked?

[crude merlin]

You can type in your twitch chat even while not streaming and messages will show up on the overlay

that's a good way to also check you're happy with the proportions on-stream, spam a bunch of messages into chat to check the height/width matches what you're after

[pulsar willow]

Ok so i did that, but nothing is showing up in the source

nvm

it works

Thank you for all your help Ryno

[crude merlin]

No problem, happy I could help 🙂

[warped bridge]

I have a question regarding the API and the store endpoint. I try to add a new item via API to my store.
I'm sending this in my post field:
{
"name": "TestItem",
"description": "New TestItem via API",
"type": "code",
"accessCodes": {
"keys": [
"key1",
"key2",
"key3"
],
"mode": "multi",
"random": true
},
"quantity": {
"total": 2
},
"cost": 1,
"cooldown": {
"global": 0,
"user": 0
},
"channel": "'.$channelID.'",
"enabled": true,
"public": true,
"userInput": [
"Dont know if needed?"
]
}

$channelID contains the ID of my channel, the one i get than i trigger the "channels/me" endpoint

i got an 200 back and
"{"bot":{"sendResponse":false},"cooldown":{"user":0,"global":0,"category":0},"accessCodes":{"keys":["key1","key2","key3"],"mode":"multi","random":true},"subscriberOnly":false,"sources":[],"userInput":["Dont know if needed?"],"order":0,"_id":"650b42bac33d4d269b7a55e5","name":"TestItem","description":"New TestItem via API","type":"code","quantity":{"total":3,"current":3},"cost":1,"enabled":true,"public":true,"featured":false,"channel":{channelID},"createdAt":"2023-09-20T19:06:34.672Z","updatedAt":"2023-09-20T19:06:34.672Z"}"
but nothing seems to happen.

Did i miss something??

[severe shell]

You didn't mention the source where the user can redeem the item.
"sources": ["bot", "website", "extension"]

Here you can have a working example:
#dev-chat message

By the way, "userInput" is optional, you can have an empty array. This is a personalized field where you ask the user some custom information, like this screen when you create the item manually:

[warped bridge]

Ahh thank you, I will try this

[warped bridge]

It worked 😄 But i broke my store at first, i guess because i had no graphics setted. I updated the item via API and now my store is back

[warped bridge]

It's not possible to upload thumbnails with the API right? I have to upload them by hand and edit the Items after the upload

[hardy walrus]

Taking a look at the store endpoints I don't see anything referencing them either.

Only one I do see is for audio.

[severe shell]

Well, you can... If you have a base64 image, you will need to send it using FormData:

// Upload Image to SE
const base64Image = "";
const accountId = "";
const jwt = "";

fetch(base64Image).then(res => res.blob()).then(image => {
  const formData = new FormData();
  const file = new File([image], "imageName.png", {type:"image/png"} );
  formData.append('file', file);

  fetch(`https://api.streamelements.com/kappa/v2/uploads/${accountId}`, {
    method: 'POST', 
    body: formData, 
    headers: { 
      authorization: `Bearer ${jwt}`, 
      accept: 'application/json'
    } 
  })
  .then(res => res.json())
  .then(res => console.log("Uploaded! Image URL: ", res.url))
})

[warped bridge]

Wow this looks promising, i will try this

thanks

[timber python]

hey everyone! Im making a little widget to show the !duel command results onscreen, and maybe play a little animation, is there a way to obtain them? I been reading the chat messages to get the last ones but I feel is not the best way

[severe shell]

I checked here and it seems the duel commands (!duel, !accept, !deny, !cancelduel) don't trigger any specific event. So yeah, listening to chat messages using onEventReceived would be the option. 😦

[timber python]

yeah I will endup doing that, thanks so much!

[paper ingot]

i am looking to create an alert from an external purchase but it looks like they have not released that functionality yet. does anyone know of another way to acheive this?

[severe shell]

If "they" is the company who sells the item, there is no way you can send an alert to Streamelements. Unless they have an API or a Websocket you could connect to and request/receive notifications.

[ruby sable]

Is it me or is having StreamElements speak not working? It was working before but now its not (JWT Token is also there)

[odd sundial]

Who can remind me how to change sounds from twitch?

[paper ingot]

no i was talking about streamelements. these are my products with my API that i would like to connect to. I was watching some videos on the new system and it had a drop down for "External Purchaes (API)" but there is no option for that so I am assuming they haven't released it yet but was wondering if anyone has pulled this off in the older system?

[pseudo shale]

Typewriter Effect

[latent shale]

Hi,
Im trying to figure out when I created a command and someone told me i could use this site: https://dev.streamelements.com/docs/api-docs/d4c2345a85e1c-channel-command-id
Unfortunately you need to have some knowledge about the SE API which i dont have. He told me maybe one of you guys could help me with this. Would be great if there is someone who could help me

[severe shell]

channel is your account ID
Accept is application/json

[severe shell]

That "External Purchases (API)" is just for oAuth users. You can request it here (it takes some days or weeks to have it approved): https://strms.net/oauth2_request
But if you don't want to have to wait for the oAuth request approved, you can send a request to the socket API with the information you want:
#dev-chat message

[paper ingot]

wow very cool its as simple as sending a post request?

[severe shell]

Hmm, for this endpoint you would need to have the command ID, which is not something you can find so easily.
First find your Account ID here (replace YOUR_USERNAME to your Twitch username):
https://api.streamelements.com/kappa/v2/channels/YOUR_USERNAME

Account ID is the line called _id
Then put your Account ID in this URL and it will show all commands you have.
https://api.streamelements.com/kappa/v2/bot/commands/ACCOUNT_ID/

Each command will be shown in this format:

{
  "cooldown": {
    "user": 15,
    "global": 10
  },
  "aliases": [],
  "keywords": [],
  "titleKeywords": [],
  "enabled": true,
  "enabledOnline": true,
  "enabledOffline": true,
  "hidden": false,
  "cost": 0,
  "type": "say",
  "accessLevel": 100,
  "_id": "605e361af793764bb57387a0",
  "command": "cadeira",
  "reply": ".me A cadeira assumiu controle da live pela ${count cadeira}ª vez",
  "channel": "5f2de5dd9a474a2c2dc4d0ab",
  "createdAt": "2021-03-26T19:29:30.182Z",
  "updatedAt": "2021-11-20T00:24:37.170Z"
}```
The command name is on `command` and the date the command was created is `createdAt`

[vestal elk]

Am I allowed to promote my stream in here when I stream

[severe shell]

Well, you will send the POST request with the info you want, but you will need to have something in the overlay to read it, otherwise it won't show anything in the overlay. It is not a basic alert.

And it won't work with the new Elements (Beta) as far as I'm aware, just the old overlay system. You need to create a custom widget to read the info you sent and show it.

[severe shell]

No

[vestal elk]

Oh ok

So you know how people have rewards that people can get with with points from watching for how every long in someone’s stream how do I get that on my twitch streams

[paper ingot]

thank you for the info. i just tested that in postman and got a 200 response. I am not into the widget part quite yet. just seeing if this is even possible

so that data won't just come in the onEventReceived event? I guess i'm a bit lost on the command name part

[severe shell]

It depends if you are talking about Streamelements Loyalty points or Twitch Channel Points
Streamelements Loyalty items can be created here:
https://streamelements.com/dashboard/store/items
And you can open the store clicking on "Open Store" in that page

Twitch Channel Points rewards can be created here:
https://dashboard.twitch.tv/viewer-rewards/channel-points/rewards

These ones will appear in the Twitch chat, below the chat box:

[vestal elk]

I have to be on computer?

[severe shell]

It will! If you create a custom widget with the code below, the result will appear on your browser console:

window.addEventListener('onEventReceived', (obj) => {
  console.log(obj)
})

[vestal elk]

What app was that how do I get to that thing

[severe shell]

I don't know, you can test that.

[paper ingot]

thank you for the help! i will try to play with all this a bit later

[vestal elk]

Ok

We’re do u go

[last goblet]

Trying to figure out how to get StreamElements to ignore "ä, ö, ü, ß, Ä, Ö, Ü, ẞ" as singular characters but time people out if it's in words more than 3 characters

[paper ingot]

so what is the best way to debug when making a custom widget since you cant log to the console?

[severe shell]

You can log to console. Just open the browser console (DevTools) and it will be there.

[severe shell]

You would need to use regex (Google RE2), but I'm not sure if you would be able to have that using RE2, unfortunately.

[paper ingot]

I cant get that working for me. Also, I have found this in the docs...

[severe shell]

You cannot access the info that's in there. But you can log to there. Create a custom widget and use this code in JS and open the browser console:

window.addEventListener('onEventReceived', (obj) => {
  console.log(obj)
})```
Then, send a message to your Twitch chat, for example. The object will appear in the console

[paper ingot]

not sure why i can't get it to work for me...onEventReceived is triggering and everything is working but nothing in the console

I am using chrome so I switched to edge and console logs are working...still not sure of the culprit though. Never had this happen before. What browser are you using @severe shell ?

[severe shell]

In my example I was using Edge.

[jagged vigil]

Hey all! Let me know if there's a better channel for this, but I'm a manager for a very large YT streamer who uses StreamElements, and we're looking for a developer who can help us build some custom features and integrations. I have a list of functions we want built, but the first one we'd be tackling is something that automatically pulls names from the chat for giveaways. If there's anyone reading this who has time and knowledge on how to do this, please DM me and I'd be happy to share more info!

[limber delta]

Hello, had a quick question. I build a custom widget for an overlay that grabs the current stream title from the twitch API, was wondering if there is anyway to set Environment Variables in Stream Elements to avoid putting credentials or sensitive secrets in the Javascript file?

[severe shell]

There is no environment for protecting variables in overlay editor. You could use SE_API.store(), which is tied to the account, but it isn't recommended.
A suggestion is to use another API that doesn't need credentials, like DecAPI:
GET https://decapi.me/twitch/status/:channel

Response is in plain text. The only thing to keep in mind is that this endpoint is cached up to 3 minutes.

[limber delta]

Thanks for the reply! I appreiciate the advise gonna look at the DecAPI see if that fits my needs 🙂 the caching doesn't bother me as were only using this widget once a stream during the intro screen. So DecAPI might be a good alternative. Much appreciated!

[soft jasper]

Hey all! I'm in the process of setting up a suite of custom widgets for youtube and am trying to wrap my head around the currency issue for superchats and donos. In the emulator there's no currency information in the event. Is there another source of that information?

[vital python]

For /:channel/socket it's mentioned the eventName can be anything you want, but when passing anything other than event:test or event, the data doesn't make it to the custom widget (nothing in console). Wondering what I'm missing?

[severe shell]

Exactly! As the comment says,event:test is one that the custom widgets are able to capture by default (as well as event). Overlay Editor listens to those by default, you don't need another one, to be honest. If you want to have different rules, you can simply add another key, name it the way you want and process it.

Using another one for eventName is useful only if you are connecting to the socket outside the overlay editor (when you have an external application, for example) and want that not to be read by the overlay editor.

[vital python]

Gotcha, thank you! Is it still the case where event/event:test are not included in the Queue? With the Widget readme (https://github.com/StreamElements/api-docs/blob/main/docs/Widgets.md#resumequeue-method-and-widgetduration-property) including event/event:test in it's skippable section (due to them not being included in the queue) how could a custom widget be entered into the Queue?

[vital python]

The recent updates to that documentation (https://github.com/StreamElements/widgets/issues/28) indicated event comes in first, then the 'underlying event' is broadcast, which does add it to the queue, but I'm not sure how that's accomplished when sending events via the socket.

[still juniper]

Ah the queue, my favourite topic... So basically if you need to add a custom widget to the queue you need to use one of the predefined underlying events, otherwise it won't go there. My nasty workaround for almost 2 years has been to use host-latest with some values incompatible with any alert configuration (I used the solution even when hosts existed, now they don't but SE still has this event into account):

socket.emit('event:test', {
  listener: 'host-latest',
  event: {
    amount: -10,  // to prevent real host alerts from triggering
    // whatever other data you need to send here
  },
});

And then like I said in that old Github issue, first you'll get a event:test event that you can ignore, and then you'll get a host-latest event that's queued and you can process there

[vital python]

This is for OAuth2 Websocket connection, correct? Any way to achieve this when connecting via JWT Token?

[severe shell]

Just change the method from oauth2 to jwt

[vital python]

Got it. Testing now, seems to be working! Appreciate all the help, learning a lot 🙂

[burnt oxide]

Is there any reason why my custom CSS in OBS isn't being applied to the SE Custom widget i wrote myself? classnames, variables and properties are copypasted so no typos there. and the OBS remote-debugging doesn't show the custom CSS anywhere. is the iframe isolating it? I wouldn't have thought that was the case though

[severe shell]

Sometimes you need to add the !important to your Custom CSS in OBS (I'm not saying that is the cause, but you can try)

[burnt oxide]

nope, already tried important

even on the straight font size setting !important does nothing. I would have belived it working on the property but not the variable, but if it doesn't work on the property there's something more fundemental at play

[severe shell]

Try to remove the extra space in the class name, it is set as "user-box "

[burnt oxide]

nice observation, but that didn't do it (fixed the bug there too, thx). I do think this is an OBS thing vs an SE one, but exploring to see if there's a common gotcha when doing this from an SE dev perspective

applying it manually in chome's debugger works, so this does suggest an OBS thing

[burnt oxide]

so i found out the cause, and I'm not sure it's fixable. So putting this here mainly for reference/education

The custom css in OBS is added in the DOM before the SE stylesheet for the widget, so the widget's takes priority (which is why !important is needed in many cases). Furthermore the widget is in an iframe, so is isolated from any stylesheets outside of the iframe, like the OBS custom CSS.

yellow is the custom CSS from the source properties, red is the widget which includes the iframe, and css from the widget itself

[charred pewter]

Is there any way to fetch userId stats for a channel, I'd like to get each viewer's total bits/gifts/tips

[hearty ocean]

Hi! Is the code of the kappagen/emote wall available anywhere? I'd like to change some things about it.

[severe shell]

https://dev.streamelements.com/docs/api-docs/f337dd80fb783-channel

[severe shell]

Unfortunately, the code for default widgets are not available. You can try to check if you find something similar made by the community in #widget-share, but I think I haven't seen any in there.

[hearty ocean]

yeahh thats what i suspected. thanks anyway!!

[charred pewter]

I am not sure that's exactly what I'm after. I would like to be able send a request, with a user ID, and return the total bits that ID has donated to my channel

[hardy walrus]

We unfortunately do not have that kind of data.

At least with bits/gifts.

[severe shell]

Ohh, ok. For bits, you can get it from Twitch API adding the twitch user_id in your request.
https://dev.twitch.tv/docs/api/reference/#get-bits-leaderboard

As for tips, you can use this one from Streamelements:
https://dev.streamelements.com/docs/api-docs/704e5580be2d9-channel
The panel says all parameters are mandatory, but actually none of them are. You can filter by the username, the email address, etc etc... But this will show each donation made, you will need to collect the donation amount of each one and sum them.

Not sure about sub gifts API request. But I know when the user sends a subgift, there is a key showing how many in total that user has given in total. So maybe there is anyway to collect that from Twitch itself.

[green jetty]

Widget noob here, but is there a way to add a "raiders" field to the credit roll?

I tried searching the discord to see if another person has asked and i appear to be the first

[rugged iron]

@kindred orchid I was looking at your border widget and was wondering where in the code was there to change the Alert sound? I dont particulary want the John Cena alert for every single item.

[severe shell]

If you are talking about this border alert widget here, it doesn't emit any sound. Maybe you have your default alerts configured to play the John Cena alert.
#widget-share message

[severe shell]

There isn't a raid-session key you could use to show the raids from that day. A raid-recent key exists, which would show the last 25 raid events from anytime, not only that day. So, not a very easy task to add "raiders" to the credit roll.

[green jetty]

Fair enough, what other keys are there?

[twin canyon]

@severe shell Is this deprecated or has it changed by chance? I am trying to use this right now. I get the Authenticated message but I can't seem to get any function to trigger on an actual event.

that socket.on('beatsme',... I just can't seem to get working

[rugged iron]

If that is the case how do you change that LOL

[severe shell]

It won't trigger any alert. You listen to that event name in your overlay ('beatsme' in the example) and decide what will do with the message. The example just shows a message on browser console.

[twin canyon]

Right I understand. I don't even see the console.log here sadly. I just can't ever catch the event

[severe shell]

I'm not sure if I follow. There is no configuration of sound in that custom widget. If you are hearing any sound, it comes from another widget.

[rugged iron]

I think i found it lol

[severe shell]

I have just tried here and it works with no problem. Do you see any error when you run the code in any side?

[twin canyon]

I see a ton of these posts? app.js:397 editor mode: will not report channel event: hidden

I see this when I look at the issues tab:

[severe shell]

That's the "issues" tab, not that important for the custom widget. You should check the "console" tab.

I mean the screenshot you sent

[twin canyon]

I found it. I had the wrong account id.

[charred pewter]

Bouncing back to trying to collect gifts and cheers etc.
Streamelements has its own leaderboard extension, which can show you ranked monthly top cheerers. Is it possible to access this via API so I can present the top 5 monthly cheers in my own way

[vital python]

Is there any way to send custom messages to the Activity Feed (either directly, through bots, etc)?

[severe shell]

Only if you use oAuth authentication (which needs to apply). But it isn't really custom, it is a Purchase activity.

POST request to https://api.streamelements.com/kappa/v2/activities/ACCOUNT_ID

Body (items should be an array):

{
  "channel": "5f2de5dd9a474a2c2dc4d0ab",
  "provider": "twitch",
  "type": "purchase",
  "data": {
    "username": "testUsername",
    "avatar": "https://repl.c4ldas.com.br/images/c4ldas.png",
    "items": [{
      "name": "Item_name",
      "image": "https://repl.c4ldas.com.br/images/c4ldas.png",
      "price": 123,
      "quantity": 2
    }]
  }
}```

[vital python]

That'd be fine. Thank you! I'll look into applying for oAuth.

[severe shell]

There is no SE API for that leaderboard extension available for us.

[vital python]

Actually, mild clarification, you're referring to oAuth for a created app via Dev Console (ie, getting auth from the individual streamer) not WebSocket oAuth, correct?

[severe shell]

I'm just referring to the authentication mode. Instead of using "Authorization: Bearer JWT", you would use "Authorization: oAuth ACCESS_TOKEN"
More info and how to apply to it here: https://dev.streamelements.com/docs/api-docs/cd02cda5171ea-o-auth2

[inner kestrel]

i'm getting 401 unauthorized (not allowed to perform this operation) in several operations i did before with no problem, any idea why? it even happens in the se api docs, with the same credentials that give me a 200 in other operations... could it be an api limit? the ones i'm trying right now (and really need to work) are /channel/socket and /channel/commandid (get)

[severe shell]

Both of them are working fine, just tested on my side.
Unauthorized means you are either using an invalid token or trying to access a channel you don't have access to (based on your JWT).
Try to confirm if you still have access to the channel you are trying and also get your JWT again on https://streamelements.com/dashboard/account/channels. Also confirm that you are logged in the correct account and correct platform, so you are getting the correct JWT.

[vital python]

Is there something I'm missing with SE_API sanitize? SE_API.sanitize({message: "badwords"}).then(sanityResult => { console.log(sanityResult) }); always returns the original string and skip: false, regardless of Tip Moderation settings (on/off) or the message contents.

[severe shell]

It depends on how the moderation settings is configured, actually.
If you enable the option Automatic Tip Message Filtering Enabled and set the Filter Action to Replace bad words with emotes, it will show the emote instead of the bad word (as long as the bad word is a standard one or you have added to "Filtered words").
Also, in case you are in the overlay editor, you need to reload the page.

For example, for each message sent in chat, I want to show only the sanitized message:

window.addEventListener('onEventReceived', (obj) => {
  if(obj.detail.event.listener != 'message') return
  const chatMessage = obj.detail.event.data.text
  SE_API.sanitize({ message: chatMessage }).then(sanityResult => {
    console.log(sanityResult)
    document.getElementById('message').innerText = sanityResult.result.message
  })
})

[glad birch]

I have a command that I'm working on that pulls statements from a pastebin. For example if a user does !action <username>, the response would return user bonks <username> with a hammer.
However when I include ${touser} in the statement on the pastebin, the response I'm getting when I try the command is User bonks ${touser} with a hammer.
Is there a way to have the command read through the pastebin and also include the @${touser} in the middle of the statement?

[severe shell]

Yes, if you show the command

[glad birch]

The command itself:
$(sender) $(random.pick $(customapi. https://pastebin.com/raw/NmUgvAvU))
The Pastebin:

t-bags ${touser} "in game", 
headpats ${touser},
shaves ${touser},
roza-ults ${touser},
gets drunk with ${touser},
grabs coffee with ${touser},
goes on a date with ${touser},
goes to dinner with ${touser},
grabs boba with ${touser},
plays games with ${touser},
virtually marries ${touser},
starts a fire with ${touser},
survives a zombie apocalypse with ${touser}, but fails, 
calls ${touser} "baby girl",
enjoys the kitty bong with ${touser},
forcefully washes ${touser}'s hands WITH SOAP.,```

I would've done it through random.pick with ' ' but the streamer wanted more options and the character limit isn't the best

[severe shell]

Try this:
$(sender) $(random.pick $(customapi.https://pastebin.com/raw/NmUgvAvU?user=$(touser)))

Also, replace the ${touser} with ${user} in the pastebin lines

Let me know if it works for you

However, if the random.pick has only that option, you don't need it. You can just run:
$(sender) $(customapi.https://pastebin.com/raw/NmUgvAvU?user=$(touser))

[glad birch]

https://gyazo.com/fbb6eb56355b480a5b6ed5027c06b102

oh that image didn't work

Uhh

Ok so I tried your command but now it just returns the whole pastebin

[hardy walrus]

1 sec

[severe shell]

Oh, the URL is actually wrong, it should be:
$(sender) $(customapi.https://api.thefyrewire.com/twitch/pastebin/NmUgvAvU?user=$(touser))

[hardy walrus]

When I said 1 sec I didn't literally mean it

[severe shell]

🤣

[glad birch]

LMAO

Does Fyrewire separate the statements line by line or would I need a delineator or something

[severe shell]

Line by line

https://thefyrewire.com/docs/api/

[glad birch]

This helped a lot

Thank you 😄

It's working now

[vital python]

Got it. Was missing the refresh overlay after changing settings. Appears to be working now, thanks!

[fierce dove]

I designed a custom chat for a friend of mine, we used semi-transparent backgrounds (.4 alpha) and noticed it mixes with black when we use the browser plugin in OBS. Aparently it behaves like this since OBS 27 with the update to Chromium 95.
Is there any known fix to get around that problem? Wasn't able to find anything online.. Example picture, left: result in OBS with darkened areas; right: reference, how it should behave on that background color. Hope anyone already stumbled across that and can help out.

[still juniper]

Hard to know what's happening without a reproducible example. You could be using now deprecated/unsupported properties, or some default changed. From the looks of it, it could be related to mix-blend-mode. In any case this is something you should debug inside OBS

[fierce dove]

omg i was totally unaware this exists inside OBS tbh. changing this to SRGB off fixed it actually

Thanks mate

[rustic grove]

Hi!! I want import Three.js in my widgets but its show an error "ReferenceError: THREE is not defined"
I import cdns and i call THREE.Scene()... why? 😦

[severe shell]

Probably it is incorrect

You could have shown the code and the error

[hearty ocean]

i ended up finding what the problem was lol

is there a place where I can find all the "user-type"s in event listeners? like 'mod' for moderator. struggling to navigate through the documentation

[severe shell]

That user-type comes from Twitch API IRC Tags: https://dev.twitch.tv/docs/irc/tags/

user-type: The type of user. Possible values are:
"": A normal user
admin: A Twitch administrator
global_mod: A global moderator
staff: A Twitch employee

[rustic grove]

but we can user threejs in streamelements?

in html:

<script type="importmap">
  {
    "imports": {
      "three": "https://unpkg.com/three@0.157.0/build/three.module.js",
      "three/addons/": "https://unpkg.com/three@0.157.0/examples/jsm/"
    }
  }
</script>

in js:

import * as THREE from 'three';

const scene = new THREE.Scene();

now...

and error is: Uncaught SyntaxError: Cannot use import statement outside a module

[severe shell]

Hmm, I never used import in custom widgets before, but don't you have to have script type="module" when using it?

[rustic grove]

This is explained in the library documentation.

threejs works with modules now

Anyway, would you know any library that can be used with 3D objects in streamelements?

[severe shell]

I don't know any 3D library at all

[tribal zenith]

the import * as THREE from 'three' part has to be in a <script type="module"> block below <script type="importmap">

[wet carbon]

Hi folks, I am hoping I can find some help. I am looking to import information from a table on a Google Sheet to then paste the information as a table into my stream without using a screen capture. I know it is possible to copy information from a sheet to a HTML web app but is it possible to so thew same using a customer widget?

[severe shell]

Are you trying to read the sheet info and update the info on the custom widget?
Google Sheets has an API and you can use Google Apps Script on the sheet as well to provide data when requested.
Here is a good playlist you can learn more:
https://www.youtube.com/playlist?list=PLRmEk9smitaVGAAhgU0Pdc2sEs7yxDrEk

[obtuse isle]

Hey folks, how does one test custom chat for youtube within streamelements? I want to make a custom chat for someone but I have hard time testing styles from within the overlay editor cause I don't see any way to connect to youtube "live room" from there...

[stray dome]

there is a alert widget code samples I want to add tiktok alert with my alert with this library https://github.com/zerodytrash/TikTok-Live-Connector

[severe shell]

This seems to be used locally, with Node installed in your computer. It won't work with Streamelements custom widget.
NOTE: This JavaScript library is intended for use in Node.js environments. If you want to process or display the data in the browser (client-side), you need to transfer the data from the Node.js environment to the browser. A good approach for this is to use Socket.IO or a different low-latency communication framework.

[stray dome]

I already begin to work for a client-side version ( I hope I'll succeed ^^')

[twin canyon]

Have you ever considered a rest api call that updates the contents of the file in a custom widget? Does that already exist? It would be amazing if you could develop your custom widget in vscode and then call a quick command and have it automatically be updated. I just have found myself editing in the stream elements editor so much and I somehow lose my changes.

[vital wadi]

is it possible to access a users webcam through StreamElements overlay/custom widget? I want to do some fun VTuber type face tracking stuff (using p5js). I got "DOMException: Invalid security origin" when I tried it

[severe shell]

Not possible

[severe shell]

PUT request to https://api.streamelements.com/kappa/v2/overlays/ACCOUNT_ID/OVERLAY_ID
Body of the request is the same as the result of the GET request to the same endpoint:
https://dev.streamelements.com/docs/api-docs/af02de52998ec-channel-overlay-id

[knotty thorn]

Twitch just announced no more simlucasting rules - although i've read you can't show combined chat on stream, other than that, is it even possible to combine alerts into a custom code widget?

[hardy walrus]

Immediately: No.

System isn't designed to combine them.

[knotty thorn]

ok all good

[stray dome]

It's seem to work well with babel standalone. can I get an exemple of a widget alert somewhere ? 🙂

[wanton latch]

I need a little help I want to display a list of names on my screen. I do Discord Karaoke. I want to be able to add and remove people from the list so people can see the singing order. Has someone made something like that or is it even possible for the bot?

[severe shell]

You can just enable Custom CSS on any Alertbox and you will see a code example in the editor.
Other than that, you can check #widget-share to check if there is anything that relates to what you want. All widgets in there are open to see the code and edit it.

[wanton latch]

What I mean is go to pixelchat.tv and look under overlays their add to group overlay that's what I was thinking of

[stray dome]

with the custom css I can modify the alert but not add a new kind of alert. I'll check https://discord.com/channels/141203863863558144/457957557470887947 maybe I can find something

[lost sandal]

Hola, alguien me puede ayudar con algo de los sponsor?, ayer me aparecia el de call of dragons pero hoy ya no me sale, y si hice todos los pasos justamente para empezar hoy

[uneven oxide]

@lost sandal ⤵️

If you need to fill out a support ticket, please use the command !ticket in chat, following the subject of your issue! For example, please type "!ticket My chatbot isn't working", and then follow the prompts from our bot!

[loud surge]

Hello! For AlertBoxes playing a WEBM file, does SE have to request/download the WEBM each time? Or are they cached somehow? Asking because my alerts run slow, are jerky, or get cut off, and I'm wondering if it's because they're too big/complicated (e.g. a ~10mb WEBM file). I was wondering if that's how SE Alertboxes work and is why I'm seeing bad performance. Only seems to happen when I'm streaming, in the overlay editor they run fine. Thank you in advance! 🙏

[rugged iron]

Does anyone know; since Twitch announced Multi-streaming is allowed; is there a widget that was created for combining your chats?

[still juniper]

Combining chats to show on stream is not allowed by Twitch anyway

[rugged iron]

Do you really think people are going to listen to that?

[still juniper]

If they don't want to be banned from the platform, yes.

[rugged iron]

A lot of streamers have been doing this for awhile and more are going to start.

It was just a question of; was there a widget created in Streamelements by Someone to do so. That is all Im concerned about

[still juniper]

I was just providing information in case you weren't aware of it. Because you know, normal streamers who follow the rules appreciate knowing such rules.

[rugged iron]

There are "normal" streamers who care about rules and would like to know them. Yet these same "normal" streamers like to include all of their community within their streams; so by creating a guideline that prohibits the combine of chats which was already being done just destroys the community experience that Twitch is so "proud to cultivate"

[still juniper]

Not sure who you're trying to convince/discuss with here. Like I said, I just provided clarification since your initial message implied you thought combined chats were allowed with the new simulcasting rules, which is not the case. That's all.

[hardy walrus]

But short answer is we do not support multistreaminf with any of our features.

Will this change? No idea.

So no combining of alertboxes/chats/feeds

[severe shell]

I would try to optimize the webm file in that case. Even caching the video, the bigger problem is running it, decoding it. I have seen fullscreen webm alerts that are not even half of that size.
But the question if SE requests/downloads the video every time would be more a browser behaviour than SE.

[uncut tusk]

Good morning,

I'm trying to include some JS in a simple widget on Streamelement.
I imported the library into HTML.
But the latter is not played out.
https://codepen.io/idreamsx/pen/GRzJJzX

I must not understand something.

it writes the line in the background

Ah well I found it.
I'm a bit stupid!
Be careful if the div tag is closed at the end..

[quaint gazelle]

Looks like the PUT /:channel/:user/:amount endpoint is broken? i suddently receive 401 from the endpoint, even though the credentials are correct (tested it other endpoints like GET /:channel/:user , for which i get the points)

[severe shell]

It worked fine to me

Maybe you are using apikey instead of JWT? apikey is able to do GET requests (in some endpoints), but not PUT, POST or DELETE

I tried the same endpoints you mentioned using apikey and was able to do the GET request, but not the PUT (401 error, as expected)

[quaint gazelle]

No, i am using JWT token. It did work fine for the last weeks and did work yesterday, then it stopped working.

[severe shell]

Well, the endpoint is working fine now. Try to go to your SE account and copy the JWT again to test.

[quaint gazelle]

Thanks, i finally found the reason with the help of your screenshot. I used to send the JWT Token as Bearer token - Bearer eyXYZ... which did work fine until yesterday. If i now remove the Bearer prefix, everything works fine again. Thanks for the screenshot, i would have searched for ages.

[last niche]

OK, so, I am completely new to coding javascript, and I'm learning as I go - I'm an artist first and formost

BUT

I have coded a price is right style of wheel that randomly cycles between a set of symbols or sources as it spins until it lands on a random option. My issue is that wherever it lands, it stops showing more options in the reel beyond it - and no matter what I try, it refuses to generate more beyond the character it lands on and it's driving me up the wall

Would this be the place to ask for help with that?

[molten shard]

Question, has anyone created a means for when donations come in to charity or something, random alert, example, it could be 1 of 5 short videos pop up thanking people for their donation.

[severe shell]

Based on what you described, it looks like you just need to add variations to the tip alert.
Make the variations with the same chance and they will appear randomly when the user send a donate.

[severe shell]

If you are coding something for SE and have questions, that’s the place. 😊
Unfortunately, I could not understand it very well… let’s see if someone else have an answer for that.
Maybe it could help more if you showed an example, or even the code you have…

[remote juniper]

Am I missing something or are the songrequest API endpoints not accessible through oAuth tokens? I see no scope in the docs and I get 403 when trying. It's working fine using the JWT token tho.

[molten shard]

Yeah wanting to line up things for Extra Life donations

[severe shell]

It isn't available for oAuth, unfortunately 😦

[remote juniper]

gotcha

[nova haven]

Hi, everyone! I'm trying to create a chat widget that also displays events like follows, bits, subs, etc.

Is there a code sample somewhere, or an easy way for me to find out how to configure this? I've checked the SE dev docs and can't find it, but I might be overlooking something.

[severe shell]

In case you are using the overlay Editor, you can get chat widgets from #widget-share. All the widgets in there have the source code available and open to use and modify.
You can also try to find some alert widgets from the same channel, and then you can create your own chat version that combines both of them.

[nova haven]

Oh, thank you! I wasn't aware the code there was open source. :D

[nova haven]

Another question: is there a way to combine Twitch and YouTube chats into one single chat widget for StreamElements?

Or otherwise: how do we only show YouTube chat in a custom-coded chat widget?

[severe shell]

Unfortunately, no. Each widget is tied to the platform (Youtube, Twitch, etc), so not possible to put them together (unless you collect the chat outside the overlay editor and put it into the widget somehow). This answers both questions, I believe.

[nova haven]

That's unfortunate indeed. Thank you for the response. :)

[ancient lynx]

Does anyone know if SE is currently down? I'm trying to access my dashboard and I get Error: KV GET gailed: 401 unauthorized

[raven umbra]

Same Fr

I’m trying to make Mech

And I get error 401

[harsh shoal]

quick question for the Widget system. how in the name of everything unholy can i get the users icon for the chat message? i would love to get the full phone vibe you know haha

[harsh shoal]

nevermind figured it out 🫡

[severe shell]

User icon you mean the user avatar? If so, that is not available on onEventReceived (used for chat messages). You would need to get that from Twitch API itself (using an app access token or user access token). Not very useful, too much work...
https://dev.twitch.tv/docs/api/reference/#get-users

[harsh shoal]

found a way to do it via https://decapi.me/twitch/avatar/"+ PersonName

[severe shell]

Yeah, but just be careful of rate limits on that decapi endpoint because it can reach it very quickly when using chat messages

[harsh shoal]

eh it's no biggie for now as my channel is dead 🫡 but i am planning ahead and caching all images in an array for re-use instead of calling the api every time the same user chats

will most likely even store them in a local DB with 7 days refresh or something if i ever end up getting enough people where having it save between sessions is important enough LMAO

[full wyvern]

hello gamers I design my own overlays, panels, graphics and was hoping to dive into creating my own custom chat box. I am a baby coder but i know how to read some languages. i'm most comfortable with js. I'm mostly looking for resources that might be helpful for someone like me. Any help is appreciated :)

[harsh shoal]

i can suggest taking apart the boxed chat in #widget-share , that's how i figured out how chatboxes work 🙂

[nova haven]

So I got everything working for my custom chat box. But with the sample Custom Chat code from the StreamElements GitHub comes an empty Fields group to the left, which isn't in the actual Fields input. How do I get rid of it?

[severe shell]

Everything that is "type":"hidden" or not in a specific group, will be in "Fields" group. That's the default group and it is normal.
In case you want to remove it, you can either delete the hidden items or add them to a group. In case you add to a group, there will be a blank space in those groups for the hidden items.

My recommendation: Just ignore that Fields group as it won't cause any trouble. Most widgets are like that when shared to keep the widget author, version, name, etc.

[nova haven]

Ah, thank you! I did not know this was a thing. I'll see if I can put all items in a specific group.

[nova haven]

Ok, last question for today. I'm trying to share the custom chat widget with my community, but it brings them to the StreamElements home page. How do I properly share the widget? I currently have it formatted like streamelements.com/dashboard/overlays/share/<widget-code>.

[severe shell]

You don't... Sharing link is for companies who sell widgets, SE partners or people who shared widgets with the community (the ones from #widget-share). There was an application for for that in the past, but it is now retired and no new submissions are accepted.

But you have some options:
1 - If you are using the Elements (beta), you can create a sharing link clicking on the Share button on top right of the screen. But you will need to redo your code as the system here is completely different from Overlay Editor. Documentation: https://dev.streamelements.com/docs/elements--sdk/bakm03srisuqq-chat
2 - If using the Overlays page, you can send the HTML, CSS, JS and FIELDS to them
3 - In case you are sharing your widget with some colleagues or friends, you can ask your friend to add you as Editor in their Streamelements account, then you can roleplay their account and import the overlay
4 - You can use my overlay sharing tool, which you can generate a code/link and send to a friend to install in their account. Here is the link: https://seapi.c4ldas.com.br/
Instructions here: https://github.com/c4ldas/c4ldas-seapi#readme

[nova haven]

Ohh, I might submit my widget in #widget-share or use your overlay sharing tool then. Thank you. :)

[severe shell]

I don't want to disappoint anyone, but I should say that to avoid frustrations... I'm not sure when submitted widgets are going to be released again, it seems they are not working on that anymore. There are widgets that were marked as approved in November (1 year ago) and were never released to the community.

The last one released was in March after many requests and pinging people. Since then, other widgets were sent to approval but never published. The last time I asked the staff about that (again) was in August, but never received a response, so I simply gave up trying to get them published as well 😦

[nova haven]

Oh wow, that sucks. :(

[zenith pond]

Have the API auth methods changed? I had an activity system working, but after going away for a couple of weeks the system is no longer working. Responding with a 401 Error for unauthorised. I tested on the API website too and that is returning the same error.

[severe shell]

Which endpoint are you trying to run the request? Can you send the link from the API website?

[harsh shoal]

back to oldschool sharing (copying everything into a document for CTRL+V)

[hardy walrus]

Nothing a fancy looking codepen link can't help

[broken coyote]

If you want a share link, let me know. i could install the widget on my account and get you a share link for your community

[topaz frigate]

Who I need to contact with to get sharing link for companies?

[severe shell]

I don't know if there is any newer process, as the new Elements (Beta) is in place and it has sharing capabilities for everyone, but...

[uneven oxide]

@topaz frigate ⤵️

One-Click Overlay Sharing Application

Use this link to submit an application: https://strms.net/shareoverlay_request

[severe shell]

With the new Elements (beta) you don't need to apply for anything, you just create your widget in there and are able to generate a public link to share.

https://dev.streamelements.com/docs/elements--sdk/9do3bhwlp2fdt-introduction

[hollow ledge]

Any plans for the actual API to get any updates? Such as a way to skip an alert via API

[devout axle]

Hey, is there a way to reset goal from API or any other way to do it from custom widgets? I can't find anything on the documentation

[severe shell]

#dev-chat message

[hollow ledge]

You're an angel

[severe shell]

https://dev.streamelements.com/docs/api-docs/5ff1cbc9251c1-channel

To reset the session goals, just set the item to 0 in the body, like that (the example resets all goals):

{
  "follower-goal":{"amount":0},
  "subscriber-goal":{"amount":0},
  "tip-goal":{"amount":0},
  "cheer-goal":{"amount":0}
}

[hollow ledge]

Oh, v3

@severe shell Any pointers how to auth w/ v3?

or is it only JWT?

[devout axle]

Oh I didn't know that was possible, thank you! 😄

[severe shell]

I don't think oAuth is supported on that endpoint, I just tested and received HTTP 500 (which means it is on SE side). So, just JWT for now.
For skipping, you can send a socket event, that will work. It also works with JWT and apiToken (the overlay api key you can get from onWidgetLoad):

URL: https://api.streamelements.com/kappa/v2/channels/ACCOUNT_ID/socket
Method: POST
headers:
Content-type: application/json
Authorization: oauth ACCESS_TOKEN // apikey API_TOKEN // bearer JWT_TOKEN

Body (choose one of them):
{"event": "overlay:mute", "data": { "muted": true }} // Mute alerts
{"event": "overlay:mute", "data": { "muted": false }} // Unmute alerts
{"event": "event:skip", "data": {}} // Skip alert

[hollow ledge]

OH MAN

I love you

Is that a POST ?

[severe shell]

Yeah, let me edit it

[hollow ledge]

Thanks ❤️

For the scope, I just should need overlay:write?

Got it working

[severe shell]

No, you are not running overlays endpoints (although modifying the overlay), but a socket event. So, channel:read is enough

[hollow ledge]

Oh nice, okay. Thanks!

Appreciate all your help

[nova haven]

This is amazing, thank you! I have submitted it to the #widget-share channel for now, but I'll let you know if I need a share link. :)

[broken coyote]

10-4! just let me know!

[zenith pond]

So my activity feed is getting all the Twitch Activity fine, but now Youtube Activity isn't showing?

[hardy walrus]

You can only be logged into a singular platform at a time. Can't show both.

[zenith pond]

Using the API, you can only show one?

[hardy walrus]

What are you trying to do 0.o

[zenith pond]

I have a custom Activity Feed.

Using the API

it's used so multiple people can connect to the Activity Feed and check them off for all others to see

it works fine, but I also want Youtube

[hardy walrus]

Fairly certain whatever you're trying to do probably isn't going to work as our feeds aren't intended to work with more than one platform/account at a time.

[zenith pond]

Ok well that's a shame

Now that Twitch Allows Multi Streaming it would be worth looking into I reckon

Since We're Streaming on Twitch and Youtube at the same time now.

I mean looking at the API, since you never actually Specify Which Platform you're using, how could it be the case?

[hardy walrus]

given the activity feed is usually seen either by SE.Live or on the website it's entirely handled by the platform you login with.

[zenith pond]

but if that's the case, why can you connect multiple accounts together?

[hardy walrus]

ease of switching between them.

along with duplicating overlays.

[nova haven]

We can't create chat widgets with Elements, can we?

[hardy walrus]

In the top right change view to json editor

[severe shell]

It is based on your JWT or access token. Each JWT is tied to a specific account and platform.

[nova haven]

Ah, time to start studying JSON more then.

[severe shell]

I've never played much with Elements, but I think reading chat messages is now possible, so it should be fine to create a widget for that.
https://dev.streamelements.com/docs/elements--sdk/bakm03srisuqq-chat

[nova haven]

Ok, thanks!

[severe shell]

If you want to know more about Elements and widgets in it, you can jump on #elements-editor-widgets20. One of the staff devs is very active in there, so maybe he can help you.

[grim dove]

Hi! I created overlay with Contest and I set to "Hide after Winner is Chosen" but is hidding in 20 sec :/

[pulsar willow]

https://github.com/j3channel/StreamElementsWidgets/tree/main/Channel Points/Slash-Bot#linking-your-channel-point-rewards im trying to set up an add on for a stream elements alert - and im lost at step 9 - do you know if the twitch api has changed - because when i try to generate a token v5 and chat_login dont exist here,

[still juniper]

@pulsar willow v5 was decommissioned long ago. And in any case that Github code won't work because commands via chat for 3rd parties were also decommissioned by Twitch

[torpid plover]

hey, i have question and idea in the same time. is there a way to create Credit Roll, but only with people who was active on chat on recent stream?

[wooden basin]

Hi there,
My StreamElements chat widget does not animate Twitch Animated Emotes anymore. They are coming as Static images, frozen on the first frame. I'm 100% sure they were working before. Let's take the DinoDance animated twitch emote for example, the API is currently returning it as "non-animated" and "non-gif", and the URL does point to a static image. Did something change with the SE emote API ?

[wooden basin]

The Emote URL seems to have changed from :
"https://static-cdn.jtvnw.net/emoticons/v1/emotesv2_dcd06b30a5c24f6eb871e8f5edbd44f7/3.0" (Currently returned by the v2/kappa SE API, which is static but should be animated)
To :
"https://static-cdn.jtvnw.net/emoticons/v2/emotesv2_dcd06b30a5c24f6eb871e8f5edbd44f7/default/dark/3.0" (Currently working animated Emote)

[still juniper]

are you talking about the default chat widget or some other chat widget?

[wooden basin]

Yes, default chat widget, Github Custom Chat base, etc

[hardy walrus]

@static wigeon @wheat kelp Not sure which of you 2 would be better to poke about it. ^^^^^

[static wigeon]

Ehm, I will take a look.

[static wigeon]

@wooden basin I'll release an update in the coming minutes that should enable animated Twitch Emotes

Seems to be working now

[wooden basin]

Thank you so much for your swift responses and fix 👍

[vital wadi]

Anyone have any tips for minifying JS code for my custom widget? It's having a problem when I reference custom fields. For example const webcam_width = {webcamWidth} + 'px'; ----------- the {webcamWidth} part gets changed to {webcamWidth:webcamWidth} -------- it's treating it as an object?

[vital wadi]

well, I learned it works to reference the fields that way in JS but it is not recommended. I fixed it by referencing the field like this webcam_width = fieldData["webcamWidth"] + 'px'; instead of {webcamWidth}

[dreamy birch]

i have a stream label using custom font play size 20, and i have same thing for my alert box text using custom css. Both same text settings however when I test them simultaneously the label seems to be bolder? any idea why?

[still juniper]

font size and font weight are different things. You seem to be using different weights

[dreamy birch]

no I have the same font size and weight

that's why it's so weird

they're both set to 20px font size and bold weight

label text settings:

alert box text settings: .awsome-text-container { width: 256px; /* Match the width of the follower label */ height: 46px; /* Match the height of the follower label */ font-family: 'Roboto'; font-size: 20px; text-transform: uppercase; color: white; /* Replace with whatever color you need */ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8); text-align: left; line-height: 2; }

[dreamy birch]

SUCCESS!

looks like it has a default letter-spacing of 1px; i added it and it works perfectly now

ahh shit

nvm its still lsightly off

see you can still see the white under just very slightly

gotten closer i guess

[tough crane]

Hey I've found some deal breaking bugs regarding Trovo implementation, who should I report those to? thanks 🙂

[severe shell]

Maybe with a ticket. I think there is no exact place to report bugs directly.

[uneven oxide]

@tough crane ⤵️

If you need to fill out a support ticket, please use the command !ticket in chat, following the subject of your issue! For example, please type "!ticket My chatbot isn't working", and then follow the prompts from our bot!

[tough crane]

Thanks, that’s what I did 🙂

[dreamy birch]

c4ldas can you help me with my issue?

[left rampart]

Question: Is the uptime of a stream available to a custom widget in any of the payloads? I've got a friend who would like to track how much they have streamed toward a specific goal.

I see the chatbot variable, but I need to be able to add the previous stream times to it.

[brave tulip]

Hey guys! I am trying to do a custom widget that will play video after given time, I have the javascript from the prev version I made but I used discord to copy source and linked in as an image. But now I have WebM (video) and can’t really use it with the discord method I was using so my question is how could I code my html to be able to upload my video as in default video element?

I have this in my Fields

{
  "someVideo": {
   "type": "video-input",
   "label": "Some Video"
 },
}

Okay, problem solved 😄 I had to copy the whole Fields example from the API site to get it working properly

[mild glen]

I just issued a PR on the Socialite library that fixes the OAuth flow and removes this error. v5.1.0 is the one to target

[severe shell]

There isn't, but you can do a GET fetch https://decapi.me/twitch/uptime/CHANNEL_NAME and it will show the uptime. From there, you just need to get the initial value and then sync again each minute or so.

[severe shell]

Thanks, that one was pending for so long!

[mild glen]

Happy to help

[gusty cedar]

That sounds great. So now it works? I saw the email today from GitHub about the PR.
I will try it out when I get back to my office. 🙂

Thanks in advance!

[mild glen]

You need to send the following header on oauth requests

Authorization: oAuth <access_token>

[ancient lynx]

Hi, just realized that when using emulated events from overlays, if you emulate a gifted sub for twitch, sender and name are now the same name, but usually they were different. However, for real events (I repeated my events from my dashboard) this values are different. For instance, I emulated a gift sub and recived name: winifred, sender: winifred, gifted: true. But repeating my event, I received name: winifred, sender: anotherName, gifted: true. Is this a bug or is it supposed to work like that?

[severe shell]

That only happens in emulated events. Real events will show the alert correctly (as long as you are using {sender} and {name} for the gifter and the gifted, respectively).

[ancient lynx]

Yep, I realized that but this is intended or is it a bug?

[severe shell]

That's a good question, I believe it is a bug (maybe some dev forgot to change the variable). I reported that some months ago (August), and I was informed it was sent to the dev team, but... no results so far.

[ancient lynx]

Oh, I actually though you were part of the dev team haha well I guess we should just wait, luckily this does not break anything

[severe shell]

hahahah no, I'm just a normal user like you, not part of the staff... 😄
The ones with blue name (SE.Champion and Support Heroes) are the ones who usually help people here on SE Discord.

[coral ledge]

Hello, is it possible to send a message in Twitch chat directly from a custom widget? The doc suggests we can use SE_API to "access basic functionality", but except the examples in the doc, how can I know exactly what I can access and how? I'm probably missing something.
https://dev.streamelements.com/docs/api-docs/775038fd4f4a9-stream-elements-custom-widgets#se-api

[severe shell]

You can send messages to a Twitch chat directly from a custom widget. However, you would need to put your JWT in there (which is not safe) or use a third party authentication method (jebaited.net for instance, that's a good one)
#dev-chat message

The basic funcionalities are the ones mentioned in the doc.
SE_API.store.set() / SE_API.store.get() -> Stores and retrieve a key/value on se database. With that, you can share data between all custom widgets
SE_API.counters.get() -> It retrieves a value of a chat command counter
SE_API.sanitize() -> That is for sanitizing words (based on your moderation filter)
SE_API.cheerFilter() -> Filter the bits emotes from the message
SE_API.setField() -> Set a field on overlay editor. Only works with the overlay editor open, it doesn't save.
SE_API.getOverlayStatus() -> You can use it to check if it is on Editor Mode or muted. Useful if you want to show an example only on Editor mode, but not on OBS itself when streaming.

[coral ledge]

I see, thank you very much.

[dreamy birch]

is there a way to make a different alert show up when someone gifts a sub

i see only option for normal subs

[severe shell]

Click on "Subscriber alert" cog and then click on "Variations settings". You will see some variations in there, you can edit them or create a new one.

[dreamy birch]

how come when i emulate a gift my label just says:

even tho the message is set too:

[dreamy birch]

@severe shell any idea

[severe shell]

Label is different from Alert. You probably want to edit the label settings, not the alert

[dreamy birch]

that is the label setting

im just saying when i emulate a gift it doesnt change

the text

[severe shell]

Please send a screenshot of the entire window, so I can understand which option is which from your overlay page

[dreamy birch]

like this?

wghen i click on emulate gift

the label which is set to this:

just says - 0 subs!

i made the label using this:

[severe shell]

Ahh ok. Unfortunately, the Emulate will not update that information, as it comes directly from Twitch. It will work with real time events, though.

[dreamy birch]

oh ok so if someoone actually sends a gift itll work fine

?

[severe shell]

Yes!

[dreamy birch]

good to know

[severe shell]

I know how you feel... It's frustrating having to configure the overlay and not be able to test it.

[earnest trout]

Hi everyone, I'm building a custom chatbox with my brother for someone and we can emulate everything we needed to test but are trying to figure out a way to emulate VIP messages. Is there a way to do that or is it limited to just subs/mods/etc.?

[severe shell]

Why are you trying to emulate a chat message? Wouldn't be easier just set any of you as a VIP and type on the real chat?

[earnest trout]

My testing account didn't have access to making people VIPs (it's just a burner account) but I actually just realised I might me able to do it on the account I used to stream on. I thought it was something that was reserved for affiliates

Well now I feel dumb turns out it was so easy all along LMAO sorry I got my testing account to be a VIP on my old channel and i'll test it on there

[inner lagoon]

i'm giving the new elements editor a try and can't seem to get the wheel of fortune example to work. i go to add element and select it and nothing happens.

i do see this in console logs:

[severe shell]

Try to check that on #elements-editor-widgets20, the dev staff is active in there to help.

[coral ledge]

Does someone know if http://jebaited.net is owned by SE? I have a connection issue on their website but I don't see any way to contact them.

[hardy walrus]

It is not owned by them though it is by someone who does happen to be staff.

@lx would be the person to ask though.

Since mobile oopsed that ping @viral patrol

[celest robin]

Any idea why it says the top part?

Wait nvm

my bad

[coral ledge]

Thank you. 👍

[merry plume]

Hi guys, I have sort of a wide question. I would like to create a website that allows to create a poll based on multiple Twitch chats. Classic use case is two/three/four streamers collaborating in some kind of format where they need the chat to vote for something (for instance a contest in which streamers are judges and the chat is a judge aswell). There are no tools at the best of my knowledge that can make a "shared" poll among multiple twitch chats. I would like chatters to be able to vote with a simple message in chat, such as 1, 2, etc. I would also need some sort of overlay that displays the choices AND the result of the poll in real time.

I wonder how I could implement such a thing tho. Connecting to IRC chats via javascript appears to be unfeasible, moreover I wouldn't know how to properly create an overlay that can be shared among different creators. Is any developer here able to run me thru the architecture of such a tool? I have some ideas but they all seem very wacky.

[merry plume]

Mkay, this seems to be good for my issue: https://github.com/tmijs/tmi.js/releases

[coral ledge]

You can receive Twitch chat messages (the votes in your case) directly in your overlay.

[merry plume]

So, as a first solution i was thinking of a simple webpage in which you configure the settings of the poll, the channels, it uses the tmi.js and renders the results. You capture that, and that's it.

An alternative would be to have all the config via GET into a webpage that has no config and just run the config provided via get parameters

but the point of having an actual overlay without anythingelse is to have a unique url that i can just keep in obs

[coral ledge]

The event "message": https://dev.streamelements.com/docs/widgets/6707a030af0b9-custom-widget-events#on-event

[merry plume]

oh so you suggest the creation of a widget in streamelements

[coral ledge]

Oh sorry I thought it's what you wanted. You talked about an overlay.

But in your case I think an overlay could do a lot of what you need.

The overlay could receives messages, filter the vote messages (messages starting with "!vote" for example), and send the votes to your backend.

And of course display the results.

[merry plume]

could be a good solution indeed, i'll think about it! thanks

[hardy walrus]

You're actually in Luck

There's a widget that specifically shows multiple chats in the overlay. Not sure how many it supports but.....

#widget-share message

[still juniper]

the issue with relying purely in SE overlays (or any other kind of frontend-only solution) is the potential lack of sync among the streamers. If you use the overlay to count votes/display results without a centralized backend, one streamer might activate the overlay late and their results will differ with those of the rest of the streamers, which will be confusing to viewers at the very least. So if I were you, I'd start by asking myself how the tool is supposed to be run, starting with who will need to/be allowed to config the poll and start it

[coral ledge]

Just a first diagram done quickly, some parts are probably missing.

[merry plume]

this looks like a very smart solution

[merry plume]

Green solution kinda solves it tho, since every streamer is managing its own chat

a much much simpler approach is the one I was proposing: one webpage that does it all, no server involved at all and you capture that as a source. Of course one of the streamers would have to manage the whole thing, and share the results with the others either via virtual cam or vocally

much dirtier, but much simpler to implement

also: no widget is required, and works with any chat

[still juniper]

you'll soon find out that if you let the core logic of your tool in the streamer hands, either the streamer or the viewers will complain as soon as someone misses to activate their part of the poll

[merry plume]

that's a smart take

[still juniper]

like I said, at the end of the day it all depends on how you expect the tool to work/be managed and what tradeoffs are acceptable

[merry plume]

I know i would probably be the only user of the tool itself, i do a lot of just chatting formats/competitions and right now having to merge votes manually is horrible

The single webpage solution seems like a improvement and an immediate fix

I could also think about having a second browser with two tabs. One has a obs.ninja url that captures the second tab. The second tab is the website. I can just give anyone the obs ninja link, which is gonna be "always the same" and serve a source in my and other obs, and that would make the thing super easy for my collegues

at least for my personal use case, that would be nice

but, anyway, thanks for the feedback from all of you and the time dedicated to me

really appreciate it, SE community always reveals itself as a great place to discuss and brainstorm ideas 🙂

[coral ledge]

My solution involves a server, the rectangle at the bottom left. The server receives all votes from all streamers. Then each overlay receive the result updates by socket or by polling from the server.

[calm matrix]

Hello, I would like everyone to be able to use the Prize Wheel by pjonp but when a viewer uses the !spin command, it doesn't work...
I already tested leaving only has perm=true.
Which line should be deleted please?
Thanks a lot

[nova haven]

Hi again! I have a backdrop-filter: blur(10px); style in my chat widget code (in the Overlay Editor) and it looks to be working in StreamElements. But then when I import the overlay into OBS it's not displaying any blur; it's transparent. Does the backdrop filter not work, or do I need to use another value?

[last niche]

I need a sub counter to NOT count subscriptions given by the broadcaster. How would I achieve that?

[nova haven]

And when the chat message slides in from the left in OBS, there's a weird visual glitch that displays a solid black drop shadow under the text. But only in the sliding animation. How do I get rid of that?

[pastel root]

If you are expecting the blur to be applied to an OBS rendered source, it does not work like that

It will only work with the elements within the SE overlay

[nova haven]

Alright. Do you know how I would get it to show up in OBS?

[pastel root]

It is not possible. You need to achieve that with some trickery, like applying the blur via OBS, there's no way around.

[nova haven]

Ah, I see. I'll see if I can find a workaround, thank you. :)

[raven nacelle]

Hello, I've made a custom alerts box using the default one in StreamElements by adjusting code, but for the cheer and tip alerts, I want to be able to adjust the size of the emotes in {{message}} but can't seem to find a solution for it.

Is there a class that I have to access? cause for the custom chat in the SE github there is a .emote class but I don't think there is one for the alertsbox

Adjusting the size of the .message class changes the actual text but not the emote size so I'm a bit stumped

[nova haven]

I'm trying to define a theme/palette for my chat widget that users can choose. But how would I call upon that actual theme? Would the CSS and Fields be enough, or would I have to add JS?

[severe shell]

There is no default class created for custom codes. All classes are created manually.
The .emote class in the customChat code is created in JS in the function attachEmotes() (line 138) which is called in line 89 (data is part of the object message).
From each message, there is a obj.detail.event.data.emotes, that shows the emotes sent on chat, it seems (on mobile right now, cannot test it).

Lines 166 defines the size of the emote.
You will need to create a function to separate the emotes and define the size of them in your alertbox, like the custom chat.

[severe shell]

I’m not very good with CSS, but how did you created themes on that? Can you show the code?
Maybe you could call it just defining the name of the theme based on the choice from FIELDS section.

[raven nacelle]

I'll give that a go, thank you!

[hardy walrus]

@coral ledge I'm looking at which "link" is supposedly getting bot filtered but I cant ffind out what is

[coral ledge]

I'm scared to try one more time. 😨

[nova haven]

I'll see if I can call on a theme using FIELDS and CSS, I'll get back to you if it's not working out. :)

[coral ledge]

Yes HTML, CSS and Fields are enough, JS is not required.

First create a FIELD to select a theme:

"theme": {
    "type": "dropdown",
    "label": "Select Theme",
    "value": "Default",
    "options": {
      "default-theme": "Default",
      "pink-theme": "Pink",
      "green-theme": "Green"
    }
}

Then in CSS, create the variables for each theme. Here ":root" contains the default theme. Use var(variable) to apply the theme value in a class:

:root {
  --color: white;
  --background-color: black;
}
.pink-theme {
  --color: black;
  --background-color: pink;
}
.green-theme {
  --color: green;
  --background-color: white;
}

.main {
  color: var(--color);
  background-color: var(--background-color);
}

Last thing to do: you can get a field value using {{fieldName}} in the HTML, CSS or JS (doc: https://dev.streamelements.com/docs/widgets/ec99002224803-code-editor#usage-example). In the HTML, pass your theme value as a class.

<div class="main {{theme}}">
  <div>My {{theme}} is beautiful</div>
</div>

Now you can select a theme and it should change the colors. I think you could either use {{theme}} in a global div, or in any div you want the theme to be applied.

[hardy walrus]

Well that answers that question partly

[coral ledge]

Is it possible to use a SDK like the Datadog SDK in an overlay?

I use this code directly imported from the doc:

<!DOCTYPE html>
<html>
    <head>
        <title>Example to send logs to Datadog</title>
        <script type="text/javascript" src="redacted_script_url"></script>
        <script>
            window.DD_LOGS && window.DD_LOGS.init({
                clientToken: 'MY_TOKEN_HERE',
                site: 'datadoghq.eu',
                forwardErrorsToLogs: true,
                sessionSampleRate: 100
            });
            window.DD_LOGS && window.DD_LOGS.logger.info('my message');
        </script>
    </head>
</html>

Copying the line to send a log in the JS part (when an event is received) doesn't seem to work neither.
It works if I open this html code in my browser, but it does not work in an SE overlay. I don't see any warning/error/request in the devtools.

[nova haven]

Ahhh, thank you so much!

[severe shell]

I had no idea what that would do, so I created an account in datadog website to test it, generated a client Token and tried that code from the documentation.
From a local html file, it was possible to register something in the website. However, I was not succeeded doing the same on SE overlay.

Checking the differences between each request (local file and SE overlay), I could see there is a POST request to a URL. That post request collects some information and send them to datadog website.
Looking at the datadog logs, I found the request and the details I could see the browser info, file origin, IP, geo information, among other things. Those info are not allowed to be shared using a custom widget, so it makes sense that doesn't work.

[coral ledge]

I see, thank you for your investigation.

[lyric tinsel]

Had a quick question about the SE webhook https://api.streamelements.com/kappa/v2/activities/

How long does it take for tips to show up in the API? I poll the webhook every 5 seconds and that seems too short to see donations through the API.

[wheat palm]

How can i set a variation trigger for merch?

It seems so amount and name is not valid for merch and it does not trigger variation

[wheat palm]

at this point i just wanna die

[severe shell]

Ask that in #elements-editor-widgets20. As the Elements editor is still in beta, the staff can help you in there and confirm if that's a bug.

[wheat palm]

uh it was also happening in overlays but already found the issue

i was declaring amount under items

...

[severe shell]

Oh, yeah, amount should be outside items array, right? Good catch.

[wheat palm]

i just inspected mock request from event similator

and i asked myself why the hell amount is so above in payload

then just tried it

[cobalt river]

Hello guys can i still apply One-Click Overlay Sharing?

[hardy walrus]

"Yes".

I'm saying that we I'm fairly certain you still can but things are a bit more funky ATM with this process.

[cobalt river]

I tried filling out Google Forms, so I just need to wait?
Is there any other process, bro?"

[hardy walrus]

Correct

It's just the responding on our end that's a little fun.

[cobalt river]

Okay, thanks for the info bro

[coral ledge]

I created an overlay for a streamer. In prod, the overlay sometimes refreshes, I can see it disappear for one second. It's not supposed to happen. Do SE sometimes force a page refresh or is it related to something else like OBS config?

[pastel root]

I don't think SE ever forces an overlay refresh. The only cases are if you are manually refreshing the overlays, if you edit an overlay and press "Save", or maybe if there are some scripting errors (but even in that case it does not refresh).

[coral ledge]

Thank you, it's gonna help me to debug.

[warped bridge]

Hello Guys, did Streamelements removed the uploads API endpoint?

[severe shell]

Which endpoint is that?

[warped bridge]

This one:
https://api.streamelements.com/kappa/v2/uploads/${accountId}

I got it from you a few months ago, but it doesn't seem to work anymore. Or other thinks have changed, i don't know, i never could find anything about this endpoint in the documentation 😅

[severe shell]

This endpoint is not documented (therefore not supported), so it is expected to have changes on it. The example I gave you was a workaround from the actual upload image endpoint when inspecting it on devTools from Overlay Editor.
Unfortunately, I could not understand why it is failing now. It seems the image is not being converted correctly to binary when uploaded, not sure.

[warped bridge]

Okay, now i know that it isn't my fault 😅 Thx

[wheat palm]

could anyone trigger this variant for twitch's own alert system

i tried merch and purschase as type but did not work

[hardy walrus]

That's something best asked with them since that's their system and not ours.

[severe shell]

That alert will trigger when a user purchases some product from your SE Merch.
Unfortunately, it seems to be triggered only during a real event.

[nova haven]

Hi again! How would I go about adding YouTube chat to the JavaScript code in a custom chat widget? There's close to no documentation about that, that I can find at least.

[coral ledge]

I know you can easily listen to Twitch chat messages, I'm not sure if it works for Youtube though. There is a "message" event you can listen to: https://dev.streamelements.com/docs/api-docs/775038fd4f4a9-stream-elements-custom-widgets#on-event

[fast snow]

So at some point the JWT token on dashboard for "personal" access to the api was changed to have an "expiry" and not be permanent anymore. But there is no refresh token. So now there's the choice between constantly manually replacing the token with a new one every few weeks, or applying for oauth :S

[severe shell]

Ohhh, that's true, just noticed that... I think it would be better if they had an endpoint to invalidate the token, instead.
I'm lucky I saved a token before the change so it doesn't have an expiry date

[fast snow]

The old non expiring token is dead for me and gives invalid

[shy dagger]

Hello developers!

I know this might be a very basic question, but I'm really curious so I'm going to ask here.

When and for what purpose do you use the SDK and API available at dev.streamelements.com? Could we code and create custom widgets or overlays? I saw a section for editing where I can upload JS, HTML, CSS, etc. Can I create stuff there also? Is there any difference?

I'm not familiar with development, but I'm curious if the provision of something like OAuth allows for the possibility of doing something new.

[severe shell]

Let me break down some things first. To create overlays and widgets for Streamelements, you have 2 options:
Overlay Editor and Elements (Beta). Both will work when creating new overlays and widgets.

Elements (Beta) is the new way of creating widgets and published this year. It is still in beta and staff devs are open for suggestions and bug reports in #elements-editor-widgets20. I suggest that if you are trying to create something in Elements (Beta), you ask questions in there (as the staff devs are very active in there and not in this channel).
The SDK documentation is related to that. It is a little overwhelming (in my opinion, as I'm someone with not advanced javascript knowledge), but it is promising and there are things you cannot do in Overlay Editor by default (like sharing options, local development, control panel to use on OBS as a dock, sending chat messages, etc).

Overlay Editor has a smaller learning curve and the documentation is on "Widgets & Overlays > Creating a Custom Widget" section on dev.streamelements.com. It is simpler, but powerful, and most of the overlays created by community were developed in there. You can see them in #widget-share.
However, it does not have an option to share your widgets (unless you have sharing approval permissions) and to make your widget to send a message on chat, you will need a third-party tool, like jebaited.net (you can find instructions on how to use it on pinned messages or looking for it in this channel).

Most of the questions related to Overlay widget I was able to help in here (except some internal questions), so if you have any questions on Overlay Editor, you can ask it here.

As regards the API documentation, it is a general way of requesting and sending data to Streamelements in general. You can use it externally in an application you are developing as well as on Overlay Editor and Elements (Beta)

One more thing I think I need to put in here:
I'm not part of the SE staff, so I am not able to answer questions related to internal aspects, like "when will feature X be available?", "why this option is not available in the editor?", or even "do you have plans of adding Y feature?"

[shy dagger]

Wow, Thank you so much, your answer really cleared things up for me, and I'm surprised you're not an SE staff. Anyway thanks a lot !

[digital fog]

hii, I was wondering for elements(beta), would it be possible to create several animations say in after effects for a follower goal? like the follower goal would be on top of the animation and it would update accordingly to the animations? like say as i gain a follower, my animation would change as my goal progresses. i know this is possible in custom widget but i have no coding knowledge ;;

[oak plank]

how to make this code work?
what data is needed for "userId" and "channel"
i get a - 400 Bad Request error

[humble ice]

Hello, looking for a way to to add text in front of the recent sponsor label without it repeating the text before each name. Thanks!

[urban harness]

There any way to setup custom ranges on goals ex: 0-10, 11-20, etc. I want to have multiple meters with selective ranges and when I tried they all started at 0 to (X).

[severe shell]

**Channel **is your account ID, you can get it here:
https://streamelements.com/dashboard/account/channels
userId is an optional value, you can use anything or keep it empty. It can be used by the provider, for example.

[severe shell]

Create a static text and put the name of the sponsor, not sure if I understood it well.

[severe shell]

Maybe level up goal widget can help you. You can customize it if you know how to code.
#widget-share message

[oak plank]

Thank you
The only problem now is that i can’t turn off the notification so that the moderator can check it and allow the notification on the stream (checking is enabled in the moderation settings), or I don't understand how it works

Perhaps they should appear in this menu, but how can I make them appear there?

[severe shell]

Yeah, that seems to bypass the restriction, not sure. I'm going to pass that to the devs.

[torpid sierra]

I've made a bot for a friend's account (ChickenWingCandy) and one of the features is to alert on a donation. My bot checks the Streamelements API for any recent donations. My feature works for a while, but then her StreamElements JWT appears to keep changing without me or her requesting it.

Does the JWT only have a limited number of calls before it changes? Am I hitting API limits?

[uneven oxide]

Currently renaming the bot fully works with SE.Live plug-in for OBS. You can follow this video guide to set it up in your activity feed dock: https://imgur.com/a/CY8P0oc

[spice citrus]

hey !rename off?

[proud spade]

!rename was removed a few months ago

[oak plank]

How to request a reset of "tips" notifications that are not deleted?

[torpid sierra]

Anybody know if / where the API limits are documented?

[severe shell]

It seems the JWT now has an expiry date, and it's around a month.
You can check the current status of the JWT from this page:
https://jwt.io

Put the JWT in there and you can see some information on the right panel. One of them is "exp", you can hover the cursor to see the date

[torpid sierra]

Oh my gosh, I had no idea they were just encoded JSON. Thank you!

[severe shell]

They are not documented, but you can check the headers response of your request.

x-ratelimit-limit
x-ratelimit-remaining
x-ratelimit-reset

If I'm not mistaken, it's global for the entire API and 1000 per minute

[torpid sierra]

oh cool, I'm not going to hit that at all!

[severe shell]

Yeah, very hard to hit that for simple mortals like us 😄

[severe shell]

But instead of checking the API, you could connect to it via socket.io and wait for the donation event. You can use JWT for that as well.
Just set the JWT, and comment/uncomment lines 35 and 36 from the code example.

https://dev.streamelements.com/docs/api-docs/5a84cc101a9c5-connecting-via-websocket-using-o-auth2

[brisk frigate]

Hi, how can I use the API service, can you help me with that?

[severe shell]

What do you need to know exactly? To use the API, just send a request and receive a response.

[oak plank]

What is the "Ad controls" function for?
What exactly does she do?
and why she does it turn off after refreshing the page?

[severe shell]

Ad controls is the option to show or hide the ad controls, literally. The buttons to play ad and snooze ad

As regards it turns off when refreshing the page, must be a bug, I'm going to report to the devs

[oak plank]

Thanks @severe shell
In which menu is the advertisement itself created?
I just don't have these "PLAY AD" "SNOOZE AD" icons

[severe shell]

Are you Twitch Affiliated? If so, logout and login from Streamelements website and it should appear when enabling "ad controls".
In case you are not affiliated, then it would not appear for you because you don't have the option to play ads on Twitch.

[potent hornet]

A custom widget I made is working when subs and gift sub events occur, but not community gift subs - very specifically, only when live. It works offline with emulated events for all three. I've tried to follow the custom widget / events docs. Its a train widget, built from scratch, for use with Twitch sub / gift sub / community sub events. I'm trying to distinguish when a community sub happens, then wait for the individual sub events to add the recipient names to that train, then off it goes.

I'm trying to understand what's different with live events that makes community sub events not work.

[oak plank]

Thanks, I don't have a Twitch affiliate (maybe that's why the "Ad controls" button doesn't work)

[severe shell]

Are you using the Overlay Editor or the Elements (beta) to create your custom widget?

[potent hornet]

Hi c4aldas, thank you and great question. I'm using the Overlay Editor.

[severe shell]

There is an easier way to work with community gifts (as they are sent in multiple notifications and easy to make some confusion) called Reboot0 Widget Tools. It is actually an easier way to work with Overlay Editor in general, it is a small library and it simplifies almost everything in there.
In the example below, it will put together all the gifted subscribers from a community gift in a single place, so you don't need to deal with multiple notifications:

function onSubBombComplete(data, receivers){
  console.log(`${data.name} just gifted a sub to the following ${data.amount} people: ${receivers.join(', ')}`);
}

This is the library: https://reboot0-de.github.io/se-tools/

What you basically need to do is:
Add the script on HTML tab:

<script defer src="https://reboot0.de/hosted/js/se-tools.min.js"></script>

Check the events here, add the function on your JS tab and put your code inside the function:
https://reboot0-de.github.io/se-tools/tutorial-Events.html

When a subscription happens:

function onSubscriber(data){
  console.log(`${data.name} is our newest subscriber!`);
}

When you have a new follower:

function onFollow(data){
  console.log(`${data.name} just followed!`);
}```

[near mantle]

Hello everyone, I have a question. Do you know how to export a widget (alertbosx) from StreamElements?
So that i have in one Zip Folder the files for Follower alert , Subscriber alert, Tip Alert, Cheer alert , Raid alert.

[quiet crest]

hi everyone, I'm an editor for a Twitch streamer and I'm building a custom widget for them. I'm trying to use SE API's /bot/:channel/say. I've had success sending messages in chat with a JWT token, but I don't want the streamer to constantly have to update the JWT token every time it expires. Is there another way to have a widget on their channel make the SE bot say something in chat? I've tried jebaited.net too and that seems to be okay, but I'd rather not rely on third party applications if possible.

[severe shell]

You don't. But you can export the "source code" of the entire overlay using the Streamelements API. It is not entirely the source code (that's why I put it in quotes), but using it you can recreate the entire overlay again if needed:

• Get the overlay ID here: https://dev.streamelements.com/docs/api-docs/b642d46bee583-channel
• Get the overlay details ("source code"), using the ID obtained from the previous request: https://dev.streamelements.com/docs/api-docs/af02de52998ec-channel-overlay-id
• Save the code in case you want to use it later.

In case you want to create a new overlay with the code

• Do a POST request to the same URL you got the Overlay ID and use the code as the body

Alternatively (in case you don't have coding skills), you can use this web page tool to generate a code number for the overlay
https://seapi.c4ldas.com.br/overlays

• Click on Share and authorize it with your SE account
• Select the overlay and copy the code
• Use this link to see the "source code" generated for the overlay (replace CODE with the code you received previously)
  https://seapi.c4ldas.com.br/overlays/get/CODE
• Save the code

There is no way of recreating an overlay using the tool mentioned based on the "source code", but I'm planning to add it in the future.

[severe shell]

Yeah, this new way of having JWT expiring is causing a lot of issues for personal tools.
Well, there is no way of sending messages to the chat without using a tool or a JWT, because sending message on chat is an API POST request
https://dev.streamelements.com/docs/api-docs/1e22a4ed3ad16-channel-say

The only accepted authorization options are JWT and oAuth (which would need a third-party tool for that). Jebaited.net uses the second one and was created by a SE staff.

I mean, it seems there is a way using Elements SDK, but I never tried (it was created with Elements (beta) in mind):
https://dev.streamelements.com/docs/elements--sdk/bakm03srisuqq-chat

[quiet crest]

Alright, thanks for the info anyway! I hope there's some way to just update JWT tokens automatically within personal tools at some point! It'd also be awesome if the API was modified so that the apiToken we get onWidgetLoad would allow us to send messages to chat

[severe shell]

Yeah, but being honest with you, I wouldn't expect any improvements on Overlay Editor.
The Elements (beta) is in constant update and staff devs are very active in #elements-editor-widgets20. It will be the default tool for widgets and overlays.
From my point of view, the Overlay Editor will be kept only for compatibility, but not getting new features.

[hybrid trench]

Hello, I would like to know about the Streamelements API. Is it possible for me to pull information from lives that use the tool? Example of the points store, if the person does not activate the watchtime command, is there a way for me to pull this information externally with the channel ID of the target channel using the API? If this is possible, could you give me an example of how I can do it?

[severe shell]

Loyalty points and watchtime will start counting as soon as the streamer enable loyalty. Once enabled, watchtime can be checked using this endpoint (no authorization needed):
https://api.streamelements.com/kappa/v2/points/ACCOUNT_ID/watchtime
So, if loyalty is enabled and the watchtime command is disabled, it is still possible to check from the endpoint above.

[hybrid trench]

I understand. And where can I get the account in id format?

tried it this way here, it wasn't https://api.streamelements.com/kappa/v2/points/529564947/watchtime

[severe shell]

You are probably using Twitch ID, you should use the Streamelements ID. This endpoint will give you the ID based on the channel name:
https://api.streamelements.com/kappa/v2/channels/CHANNEL_NAME

Look for _id

[keen iron]

Hello! I need an idea on how best to implement this, as I currently don't know 100% how the Streamelements API works. I would like to have a Custom Alert with Custom TTS and Custom Alert on an external site. However, this alert should be triggered when someone donates something. The Streamelements alert should not be played, but rather my own alert on my external website. When this is over, things should go back to normal!

Don't know if you understand that.

[severe shell]

In case you are talking about donation received on SE, you can just disable the alertbox for donation and you won't be notified.
Regarding to the external website, you can simply connect to Streamelements socket on your website and listen to the event of donation. Once the donation arrives, you can do whatever you want with the information.
Here you can find some instructions on how to connect to Streamelements socket. You don't need oAuth2, you can use your JWT for that.

https://dev.streamelements.com/docs/api-docs/5a84cc101a9c5-connecting-via-websocket-using-o-auth2

[keen iron]

yes. I have the problem, that the websocket instantly send me the data when a user tips. So i only need the data when the queue is at the current tip?

[hybrid trench]

It worked, thanks. Can you tell me how counting the distribution of store points works, in more detail?

[severe shell]

It is defined by the streamer in the loyalty settings. You can open the loyalty and check. But the streamer can decide how many points will be given by a follow, a subscription, bits, etc…
Points are updated every 10 minutes.

[severe shell]

I don’t know what you need. But yeah, when the user sends a tip, you will receive an event on the socket immediately.

[spark knoll]

Guy does anyone know when se will release complete docs for their websocket
https://docs.streamelements.com/websockets

[hardy walrus]

WIP is the best we can say atm unfortunately.

[spark knoll]

well at least it's wip

[severe shell]

Astro is not completely written, but you can use this one:
https://dev.streamelements.com/docs/api-docs/5a84cc101a9c5-connecting-via-websocket-using-o-auth2

You don't really need oAuth2, you can use JWT if you want, just adapt the code example

[keen iron]

why does https://api.streamelements.com/kappa/v2/overlays/{channel}/action/{action} not work?

{
  "statusCode": 403,
  "error": "Forbidden",
  "message": "Not allowed to perform this operation"
} ```

nvm fixed it...

[severe shell]

This error means you are using a non-valid authentication method or using the wrong token. But even if using it, I noticed it needs something else like a websocket request to make it work. So to make things easier, you can use this one:
#dev-chat message

[keen iron]

oh perfect thank you

[keen iron]

is there a skip alert event? So when the broadcaster/moderator skips the current alert?

with websockets or something?

[keen ivy]

Giveaway enpoints on v3 API, when listing entries, ignores limit or offset parameters and show only max 100 entries regardless, is there any fix or workaround?

[severe shell]

The same endpoint, but using {"action":"skip"}. I'm going to edit my original message to include it

[severe shell]

It seems there isn't. Even the SE dashboard uses the same parameters and have the same issue on the response. I'm going to report that to them.

[keen ivy]

yes, that's what I though when I saw the dashboard always shows 100 entries and the limit is set to 10 in the request.

also would really like to see, how the winner is picked, because in a few instances, the winner was always one of the last entrants, might be coincidence, but starts to be suspicious 😄

[severe shell]

We will never know how that works 😅

[keen ivy]

yeah, that's why I would like to have full entries list, so I can eventually do my own pick 😄

[severe shell]

Well, if you are good to have some work, you can connect to the SE socket.io, subscribe to the room giveaways::ACCOUNT_ID and listen to giveaway:entry. That will show each entry individually in real time like the example below (you will have to take the username and amount of tickets and save to a list to pick your own later):

[
  "giveaway:entry",
  {
    "channelId": "5f2de5dd9a474a2c2dc4d0ab",
    "data": {
      "entry": {
        "new": true,
        "providerId": "629674320",
        "subscriber": false,
        "tickets": 3,
        "username": "c4ldasbot"
      },
      "totalTickets": 8,
      "totalUsers": 2
    },
    "event": "enter",
    "giveawayId": "6578d06cc57ca7d5398e12a5",
    "state": "running"
  },
  {
    "nonce": "b03a6683-f52e-4417-8434-df1d65a0b820",
    "ts": 1702416998727
  }
]

Instructions on how to connect to the socket here (you can use your JWT instead of oAuth2, just comment/uncomment the respective lines)
https://dev.streamelements.com/docs/api-docs/5a84cc101a9c5-connecting-via-websocket-using-o-auth2

To subscribe to a room, you can use the following (it was hard to find that information):
How to send message as 420 on socket.io (just add a callback as a third parameter. Useful to subscribe to rooms)

socket.emit("subscribe" , {"room": "giveaways::ACCOUNT_ID"} , (response) => console.log(response) )

To listen to the each entry:

socket.on('giveaway:entry', (data) => {
  // Do your magic here, save the usernames, tickets, etc etc
  console.log(data);
});```

If you subscribe to the room correctly, you will receive:

{
  "room": "giveaways::ACCOUNT_ID",
  "message": "Successfully joined room"
}

[keen ivy]

well, this might work but whole list still would be prefferable, thanks 😄

[severe shell]

I sent the information about the bug, let's hope they fix that soon