dev-chat

[tough nimbus]

Not exactly what i need but good plugin thx

[whole crag]

okay, how much data can i store in it? is there a size limit or something?
Basically i want to store All superchats received as a record the name being the key for each the superchat, is there a limit to it?

[severe shell]

kvstore is a small database and there is a limit, indeed. We don't know if the limit is in the number of keys or the in bytes, though.
You can use it, but if I were you, I would only save the necessary info (like, donator name, id and img url, for example) and use it them to compare with the name in the onSessionUpdate or onWidgetLoad obj session data, for example. Also, would think about how it is going to be organized so you don't overwrite a key and make it easier to be retrieved.

One more thing: Each key you create cannot be deleted (at least in normal ways). You can overwrite its values, but not delete it (I have a lot of mistyped keys in my account, by the way).
If you need something "easier" to use (in terms of visual), but not a full database management system, you can Google Spreadsheets with Google Apps Script, for example.

[severe shell]

So let's see if I get it right:
She as a rotator widget in an overlay and wants the change of that to be reflected in another widget in another overlay. Is that correct? If she is using the default SE rotator, it isn't possible.

What you could do is creating a custom rotator widget and using SE_API.store, save the image(s) url, and retrieve them on the other widget. I will call them rotator-irl and rotator-non-irl. Once she updated rotator-non-irl, it would send the img urls via SE_API.store.set(), the rotator-irl could retrieve them using SE_API.store.get().

rotator-non-irl

window.addEventListener("onWidgetLoad", async (obj) => {
  const fieldData = obj.detail.fieldData;
  const toSave = fieldData.imgList;
  let counter = 0;

  // Save the image URLs on "ImageList" object. Feel free to change it to another name.
  await SE_API.store.set("imageList", toSave); 

  // Retrieve the saved data (not needed here, you could just use the fieldData.imgList)
  // But as we are creating two widgets, let's use the same code
  const imgs = await SE_API.store.get("ImageList"); 
  console.log(imgs);
  //  [
  //   "https://cdn.streamelements.com/uploads/374bb2be-d4d0-aec5-4b1e-3de6b27c6e7a.png", 
  //   "https://cdn.streamelements.com/uploads/3de6b27c6e7aa-d4d0-aec5-4b1e-374bb2b.png"
  //  ]

  // Image rotator
  document.querySelector("#img").src = imgs[0];
  counter++;
  setInterval( () => {
    document.querySelector("#img").src = imgs[counter];
    counter++;
    if(counter == imgs.length) counter = 0;
  }, 3000); 
});

rotator-irl

window.addEventListener("onWidgetLoad", async (obj) => {
  const imgs = await SE_API.store.get("ImageList"); 

  // Rotating images (I will let you do the CSS animations);
  document.querySelector("#img").src = imgs[0];
  counter++;
  setInterval( () => {
    document.querySelector("#img").src = imgs[counter];
    counter++;
    if(counter == imgs.length) counter = 0;
  }, 3000); 
});

In rotator-non-irl, create a field data with the following so she can upload the images:

"imgList": {
"type": "image-input",
"multiple": true,
"label": "Image"
}

I'm also considering you have an image HTML tag

<img src="" id="img" class="img" />

[whole crag]

I'll be keeping the object simple, a key value pair, key will be the name and value will be the avatar image.
As i don't get the images for monthly-top-donator and monthly-top-donation but i do get the names and amount i was thinking of storing each superchatters name and avatar and will fetch the avatar from their for top-donation and top-donator.

{
    "deva": "https://cdn.streamelements.com/assets/dashboard/my-overlays/overlay-default-preview-2.jpg",
    "natalya": "https://cdn.streamelements.com/assets/dashboard/my-overlays/overlay-default-preview-2.jpg",
    "value": "{\"felice\":\"https://cdn.streamelements.com/assets/dashboard/my-overlays/overlay-default-preview-2.jpg\"}"
}

this is the data right now.

how much data will i be able to store in the widget itself with this?
is there a more good way to store the data if it gets way too large for SE_API

[tough nimbus]

Thx !

I had completely forgotten about the store

[severe shell]

To be honest, I don't know how much you can store in there.
Another option I would use would be Google Spreadsheets

[whole crag]

how can i use spreadsheets? using the API?

any working example that i can use?

[severe shell]

1 - Create a Spreadsheet
2 - Name the columns "username", "id" and "img_url"
3 - Go to Extensions > Apps Script
4 - Remove everything and add the code at the end
5 - Click on Deploy > New Deployment
6 - Select Web app
7 - Description: Anything you want
7.1 - Execute as: Me / Who has access: Anyone
8 - Deploy and authorize
9 - Copy the Web app URL

// Handle POST requests
function doPost(e) {
  const data = JSON.parse(e.postData.contents);
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  
  // Check if the 'id' already exists in the sheet
  const existingData = sheet.getDataRange().getValues();
  let rowIndex = -1;
  for (let i = 0; i < existingData.length; i++) {
    if (existingData[i][1] === data.id) {  // Column 1 is 'id'
      rowIndex = i + 1;  // Rows are 1-indexed in Google Sheets
      break;
    }
  }
  // If the 'id' exists, update the existing row; otherwise, append a new row
  if (rowIndex !== -1) {
    sheet.getRange(rowIndex, 1).setValue(data.username);  // Column 1 is 'username'
    sheet.getRange(rowIndex, 2).setValue(data.id);  // Column 2 is 'id'
    sheet.getRange(rowIndex, 3).setValue(data.img_url);  // Column 3 is 'img_url'
  } else {
    // If no matching ID, append a new row
    sheet.appendRow([data.username, data.id, data.img_url]);
  }
  
  // No need to send a response as per the 'no-cors' mode
  return;
}

// Handle GET requests
function doGet(e) {
  const username = e.parameter.username;
  const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  const data = sheet.getDataRange().getValues();
  
  // Search for the username in the sheet
  for (let i = 0; i < data.length; i++) {
    if (data[i][0] === username) {  // Column 0 is 'username'
      const result = {
        "username": data[i][0],
        "id": data[i][1],
        "img_url": data[i][2]
      };
      return ContentService.createTextOutput(JSON.stringify(result)).setMimeType(ContentService.MimeType.JSON);
    }
  }
  // If username not found, return an empty response
  return ContentService.createTextOutput(JSON.stringify({})).setMimeType(ContentService.MimeType.JSON);
}

From your widget:

How to save data:
OBS: You won't get a response due to CORS, but the data is saved.

const appUrl = "YOUR_WEB_APP_URL";
fetch(appUrl, {
  method: 'POST',
  mode: 'no-cors',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    "username": "someoneUsername",
    "id": "abcd1234",
    "img_url": "https://example.com/img.png"
  })  
});

How to get data:

const appUrl = "YOUR_WEB_APP_URL";
const request = await fetch(`${appUrl}?username=someoneUsername`);
const response = await request.json();
console.log(response);

[steep elm]

Hey, can anyone help me create a custom command in StreamElements that pulls the leaderboard from my StreamElements website (https://streamelements.com/javionik/leaderboard) and displays it in the chat? Ideally, I want to avoid using external platforms or APIs.

[severe shell]

It's a Streamelements default command. It is !top, you can use with one of them !top points/alltime/online/offline

[steep elm]

The issue with !top and !leaderboard commands is that they only provide a link to the leaderboard page instead of showing the rank or detailed stats directly in the chat. How can I create a custom command to pull and display this information dynamically in the chat?

[severe shell]

As I told you, use it with one of points / alltime / online / offline
https://docs.streamelements.com/chatbot/commands/default/top

[whole crag]

Thanks alot for the detailed example, much appreciated 🙌

[steep elm]

Oh ok that works but i took Mortenroyale as an example i wanted it like that:
simon_329 hat 0 secs mit dem Schauen von Martin verschwendet und ist damit Rang 1/137759.
with the user first than the message and the all time viewer rank last

[severe shell]

Well, you could just check his commands page. I went there and found a !watchtime command with that response:
${user} hat ${user.time_online} mit dem Schauen von Martin verschwendet und ist damit Rang ${user.time_online_rank}.

[steep elm]

❤️

[severe shell]

But that's not the leaderboard, it's just the stats of a single user. You had asked for the leaderboard 😅

[steep elm]

Yeah, I meant that tough, you're the GOAT for real.

[wise nest]

hello am new to stream element and also am startign to stream on twitch as a new streamer and rly do not knowe how to fix up thing in streamelement like layer and theme for my twich page so if there is annyone here that can help me set up everything on my streamelement i would be glad

[runic venture]

hi !! not sure where to ask but im looking for a coder for future stream widgets for my etsy shop please dm me with your pricing if interested 🙂

[silk hull]

hello! Just wanted to ask in regards to superchat donations for custom widgets,

afaik for streamelements donation it gets converted to the streamer's local currency but im not sure if it does that for youtube's superchat, can anyone help confirm? I'm looking through the documentation but it doesnt explicitly say that anywhere

[severe shell]

It does:
#dev-chat message

[silk hull]

oh my god thank you, you're an absolute lifesaver!!! 😭

[golden raven]

I created a canvas layout yesterday for TT and linked it to my obs scenes but the scenes are not switching automatically. Do I need to do anything else?

[next turret]

where is the widget one

[royal geyser]

Could someone help me, we are looking for the saved quotes, how can we look on it, is there some API, where we could look on the added quotes

[severe shell]

Unfortunately, there isn't a way to see all the quotes. That's a feature people have been asking for a while, but nothing has been implemented so far.

[swift pendant]

hi, Im setting up stream elements multi stream and was looking to see if there was a way to add transitions for the vertical canvases?

as well as filters

[severe shell]

Not at the moment.
https://www.twitch.tv/streamelementshq/clip/ToughComfortableCoffeePipeHype-YtPqjuDk014KRHeO

[swift pendant]

ty for letting me know

[tawdry abyss]

hey can someone help me with a solution, i run a 2 pc stream setup using obs to stream twitch and tiktok and like normal i have obs instaled both on streaming pc and gaming pc, my problem is that i can not get the tiktok chat in obs in the gaming pc

[severe shell]

Better to ask in #tech-talk

[tawdry abyss]

thx

will do

[whole crag]

I'm working on a custom StreamElements widget for YouTube, and I need help with an issue. When a new event is received from the onSessionUpdate listener for the latest super chat, subscription, or follower, I only get the name and ID of the user. However, I don't receive the user's avatar. Is there a way to retrieve the avatar using the ID provided?

[severe shell]

It would be great if you just continued the conversation we had. Every time you post looks like a totally different unrelated conversation.
Try to get it from onEventReceived, instead.

[whole crag]

Noted.
What if i still don't get the avatar url with onEventReceivee, is there a way to get the image using the id with API?

[inner mauve]

Can I stream for no man sky and could I possibly get a url for that particular page that I can post on my YouTube?

[severe shell]

It depends if the user has a Streamelements account registered (which is not guaranteed). If so, you can do a GET request to this endpoint:

https://api.streamelements.com/kappa/v2/channels/ACCOUNT_ID

[cinder cairn]

Can I get legit help? Send in tickets doesn’t do shit

[severe shell]

Based on your message history, it should be related to sponsorships. Unfortunately, there is nothing we can do here, only the staff can help on it, through the ticket system.

[cinder cairn]

welp looks like ill never get what i need then

unlucky

been waiting a month and havent gotten a single response to any emails

[potent halo]

"Day 10 of no response to my emails"
- two days ago
"been waiting a month"
- today

time flies huh

[short sable]

@potent halo bro could you help me with the issue i got?

or i need to send some ticket

[potent halo]

don't know without knowing the issue. Generally know a bit about coding and some widget stuff. But so do others here.

[short sable]

nah i dont mean any coding stuff wait i will tell u whats wrong

guys i got a problem, my multistream tool is working literally for every single platform but twitch? Like sometimes its turning for 1 second then going off but the 'stream time' on twitch is still counting?
its working for yt(with like 30sec delay but i used it only for test purposes, tiktok works perfect, 0 lags or delays but twitch is never working for some reason..)

[potent halo]

Yeah nah. Also pasting the same message over and over in different channels might not be the smartest idea in the longrun. Wait a bit between bumps or make a ticket

[short sable]

xd

[cinder cairn]

Day 11 is from the most recent email lmfao you’re trying to point out something that means nothing 😂 the first email I’ve sent has been a month ago

[halcyon pilot]

Is there a way for me to export an overlay or otherwise share it with someone without publishing it? I mean apart from the obvious of giving them the code to copy and paste into their own build.

[severe shell]

Check option 3 here: #dev-chat message

[halcyon pilot]

Thanks. Not sure I know this guy well enough to even ask him that. Can I share an overlay on widget share, or do I need a higher set of permissions for that. Not sure how that works.

[severe shell]

Oh sorry, I mean option 4, using the overlay sharing tool page 😅

[halcyon pilot]

AH! This sounds much more like what I'm looking for! Is this how overlays are shared on #widget-share ?

[severe shell]

Not exactly. Widgets shared on #widget-share are the ones people used to share with the community using a form (which doesn't exist anymore, after the creation of Elements).
So I created that page which people could continue sharing overlays between each other.

[halcyon pilot]

I see. Well, that's great! Thanks for that! I do need to get into elements development. When I first started developing overlays, I didn't know enough about the service to understand the difference. I rather wish I had started there. I've got a stupid amount of hours of work into my overlays now.

[raven mason]

Im also having this problem and figured it out. User MattAllatt's reply put me on the right path.

To make a custom widget where you can upload an image to it and not have to reference an external image via a url:

1. Open the widget settings, and go to the 'fields' tab.
2. Add a field, something like this:

    "type": "image-input",
    "label": "Image for sleeping"
  },

then close the settings pane.
3. That field will now appear on your left panel fields ui editor - like in the attached image, and you can select an image file to upload.
4. Refer to the image location as the field name, in this example, {{sleepImage}}. Eg when using in css, do something like:
background: url("{{sleepImage}}");

Hope this helps someone!

[steady sierra]

Not sure if this is a question to be asked here, but the SE Live multistream beta, does anyone know how it works on the back end?

Meaning does it work similar to streamlabs ultras multistream where its basically routing your stream to a restream type service that replicates your stream across the services your logged into in the tool

or is it closer to multi RTMP where each platform your outputting to uses its own encoding resources meaning more outputs, more workload on your pc

Thanks in advance, or if i shouldnt ask here, my bad and route me to the correct channel please and thanks! Happy holidays!

[severe shell]

Yeah, we don't discuss that here, but answering that, it uses local resources, it doesn't route your stream to an online service.
That was informed during the livestream, you can check that here (39min 20sec):
https://www.twitch.tv/videos/2324161803?t=0h39m21s

[steady sierra]

sweet thats kinda what i was looking for was an article or video that addressed it!

Sorry for asking in the wrong spot but thanks for answering anyways your awesome!

[hearty horizon]

What happened to mercury streamelements description functionality?

[hardy walrus]

It unfortunately was removed.

[hearty horizon]

that’s sad I was really enjoying using it

[fair lynx]

Is there a way how to do a random roll where a viewer specifies the upper limit of the roll? I have the command for !roll [insert number here] and the command goes [${user} rolls a d${1} and gets a ${random.number 1-${1.number}}.] so it should do a roll between 1 and the specified number but it always comes back as higher than the upper limit.

[severe shell]

Almost there, just put the random.number argument in quotes.
[${user} rolls a d${1} and gets a ${random.number "1-${1.number}" }.]

[fair lynx]

Ah, I didn't think to use quotes! Thank ya!

[soft kiln]

curl -X GET "https://api.streamelements.com/kappa/v2/activities/CHANNELID?after=0&before=1544178274000&limit=25&mincheer=0&minhost=0&minsub=0&mintip=0&origin=%3F&types=tip" -H "Accept: application/json; charset=utf-8, application/json"
responds with 401 after providing _id from channel/me is it needs the JWT token somewhere ?

[severe shell]

Yes, you need to add it to the header:

curl -X GET "https://api.streamelements.com/kappa/v2/activities/CHANNELID?after=0&before=1544178274000&limit=25&mincheer=0&minhost=0&minsub=0&mintip=0&origin=%3F&types=tip" -H "Accept: application/json; charset=utf-8, application/json" -H "Authorization: bearer JWT_TOKEN"

[soft kiln]

🤦‍♂️

it passes thanks

[soft kiln]

can u detect bit redeems with the api ?

Gigantify emote and the other stuff?

[severe shell]

Unfortunately, no. Twitch hasn't provided any API for those ones 😦

[soft kiln]

to be clear there isn't any button what can export the activity feed filtered by subs/cheers/tip's into xlsx,,, so i didn't tortured the api for the past day for nothing ?

[hardy walrus]

There is not.

[idle cipher]

const response = await fetch('https://api.streamelements.com/v1/active-subscribers', {
headers: { Authorization: 'Bearer YOUR_API_KEY' },

Can someone explain how i can find my api

[severe shell]

Streamelements dashboard > Your avatar at the top right > Your username > Channel Settings.
You will find your JWT Token in there.

But just to save you some time: The endpoint you are trying to use never existed.

[hasty shore]

Hello Guys!

How to connect my facebook here in stream elements?

[severe shell]

You can't. StreamElements doesn't support Facebook anymore. Here is the announcement:
#announcements message

[silver fox]

Hi guys, im trying to make a simple custom chat widget, nothing complicated im just design it. and im try to understand if there is a way to test what i am coding directly on vscode. because its annoying to always go to SE to test it

[hardy walrus]

First immediate and important question: which platform is the widget for?

[silver fox]

for twitch

[hardy walrus]

There's a few widgets in #widget-share that you can look at and one of them has a test button that you can glance at functionally.

As far as testing in an editor vs the SE.editor I actually can't answer that.

But generally once you have the widget created and saved in the editor all you need to do is open the overlay in broowser and send a message as is in the respective channel.

Also see in the browser's dev console if there's any errors.

[silver fox]

Okay, thank you so much! I’ll take a look at it. I’m trying to create a custom chat widget, and I basically wanted to understand the workflow of a designer who wants to create a custom widget (like animations, decorations, etc.). I find it a bit annoying to always have to go to the SE editor to check how it’s coming along

[tribal zenith]

you can also use the browser dev-tools to play around with the design/layout in real time and then just copy over your changed CSS to the editor to have it updated

[severe shell]

Hey guys, a quick info:

I took some time (a lot, actually) to review all endpoints in the dev documentation and ended up creating a personal page where you guys can use it to test.

All endpoints have now a description, body examples (where needed), response samples with types, notes for especial situations, accepted authentication for each operation, and many other endpoints that you won’t find in the original documentation.

It uses the same interface, although much faster, as it isn’t hosted in Stoplight servers. And it uses dark mode with better colours.

You can have a look at it here:
https://c4ldas.github.io/streamelements-api

if you guys have any suggestions, feel free for that.

PS: I’m not part of the staff, so I cannot control the API responses nor add any new feature to the endpoints, ok?

PS 2: I sent the API reference to a SE dev staff, so they can replace the official documentation if they want.

[arctic thicket]

hello folks i would like to ask if anyone knows if Ground Control will ever get the option to Edit Stream info -Title,Go live notification and the tags.

if that was added it would be perfect !

P.S also said this msg in general chat but i thought that it would fit more into dev chat

[severe shell]

We don’t have dev staff in this channel, and we don’t have access to that info, unfortunately.

Best option would be posting in #1278002102114848840

[arctic thicket]

oh okay thank you !

[neon pine]

hello?

[buoyant musk]

Hi

[graceful shadow]

Hey all new dev here! I’m creating a timer overlay and I’d like to add a chat commands into my JS file but for some reason whenever I input the command it doesn’t work. I know overlays are old school now so the documentation is a it out dated, does anyone know if I need to add an authkey to my file?

[tribal zenith]

are you talking about an external (HTML) file you put into a BrowserSource or code inside the overlay editor?

[graceful shadow]

Code inside the overlay editor

I have written - isbrosdcaster and ismoderator in the js, and when ever I type the command in the chat window in my obs it doesn’t do anything

[tribal zenith]

what's your code so far?

[graceful shadow]

May I post a snip?

[tribal zenith]

sure, you can post your JS code, but as a code block please

[graceful shadow]

  const { listener, event: eventData } = event.detail;

  if (listener === 'message') {
    const { text, username, badges } = eventData;
    const isMod = badges.includes('moderator') || badges.includes('broadcaster');

    if (isMod) {
      if (text === '!stop') stopTimer();
      if (text === '!reset') resetTimer();
      if (text === '!resume') startTimer();
    }
  } else if (
    listener === 'subscriber-latest' ||
    listener === 'tip-latest' ||
    listener === 'cheer-latest' ||
    listener === 'gift-latest'
  ) {
    onEvent(event.detail);
  }
}); ```

[tribal zenith]

IIRC badges is an array of objects and not strings, so the badges.includes('moderator') probably won't find anything.
Have you tried logging the value of isMod to see if it actually turns true?

[graceful shadow]

I have not, I will try that when I get to my computer. I’m still learning js as a product designer and i think my “badge” call comes from the little tokens beside the names on twitch

[tribal zenith]

if you want to learn and figure it out for yourself, you can take a look at the find function for objects
otherwise, if you want a quicker solution you can take a look at https://reboot0-de.github.io/se-tools/ and ChatMessage
there you could just do something like:

function onMessage(message) {
  if(message.isModerator() || message.isBroadcaster()) {
    if(message.isCommand('!stop')) stopTimer()
    // ...
  }
}

and then have the other event listeners for subs etc. in their own functions

[graceful shadow]

Awesome!! Thank you!!

[tribal zenith]

you could also convert it to a switch statement if you need command args

function onMessage(message) {
  if(message.isModerator() || message.isBroadcaster()) {
    const commandObj = message.getCommand(true)
    if(!commandObj) return // message was not a command
    switch(commandObj.command) {
      case 'stop': stopTimer() // or stopTimer(commandObj.args)
      // ..
    }
  }
}

[graceful shadow]

Thank you for the help. I realized I didn’t have an API call happening within twitch chat and my smooth brain can’t seem to figure anything else out besides an IRC websocket call. Is this the only option for having a chat listener in my JS? I want to be able to share this code with my friends and some of them will explode if they see code

[reef basalt]

Hello, is there someone who can help me out. I want a label that shows the name of the monthly sub gifter. I can't find this in the label tab and was curious if there is a code for and if someone can share a code with me for that.

[severe shell]

You don't need an API call or websocket for chat messages when using a custom widget. You just need to listen to messages using onEventReceived, like you did, or using onMessage function from Reboot0 se-tools.
One more thing, if you are using Reboot0 se-tools, you have to add this on HTML tab, so the code will load correctly:

<script defer src="https://reboot0.de/hosted/js/se-tools.min.js"></script>

[graceful shadow]

Does this work for the custom overlay stuff as well? That’s where I’m making my custom widget

[severe shell]

That's the only custom widget! The other new thing is called Elements (not very popular yet and still kinda confusing, in my opinion) 🙂

Streamelements dashboard > Streaming tools > Overlays > New overlay

• button > Static/Custom > Custom widget

[graceful shadow]

Yay! Thank you so much!! I’ll give that a shot. I’m really excited to produce something for my friends and tap into widget Dev

[severe shell]

If something is not working as you expected, feel free to ask here 🙂

[severe shell]

I believe you meant "latest monthly sub gifter" or "top monthly subgifter", right? Either way, none of them are available on Streamelements. I think you can't even get that info from Twitch API itself.
I was creating a custom widget similar to that some time ago, but it ended up going to the trash pile... Maybe I should recheck it as it seems there are people interested in that.

[reef basalt]

Yeah exactly, we have a monthly sub gifted in our stream but we need to put it in manually now every time it changes, would be cool to have it as a automatic thing

[severe shell]

Do you have a screenshot of the stream screen where that appears? I'm a little confused with the terms

[reef basalt]

It’s like this so just a bar with monthly sub king and the name of the person who has gifted the most subs behind it

[tribal zenith]

I guess you could just utilize the (SE_API) store to save that data in the form of { username, user_id, amount, month } and then just compare new gift events against that to update the top entry

[severe shell]

I created something that you can use. You can read the instructions (and install it) here:
https://github.com/c4ldas/streamelements-widgets/tree/main/top-monthly-subgifters

[reef basalt]

We will check it out thanks!

[graceful shadow]

@tribal zenith @severe shell big thanks!! I got the widget command to work as well as the stream elements listeners

[humble willow]

Is there an API endpoint to set kvstore values for custom widgets? Within the custom widget editor ofc there is SE_API.store.set and SE_API.store.get but I can't seem to find a way to set a kvstore value externally. I looked in this chat's history and found the https://kvstore.streamelements.com/v2/channel/channel-id/customWidget.test_imageURL endpoint but that appears to only work for GET requests.

context: I'm trying to trigger a widget's properties and visibility based on an external script I have, although not sure if this is the right approach for this. definitely a bit of js amateur

[idle cipher]

I press save and i'm waiting for 3min now and it still doesn't save

[severe shell]

I would open another tab, perform a logout and login on SE website and try again.

[severe shell]

#dev-chat message

body is:

{
  “key”: customWidget.YOUR_KEY_NAME,
  “value”: YOUR_VALUE
}

[severe shell]

~~Setting a widget visibility is sometimes a little problematic, as you have to obtain all the overlay code, change the piece of the widget that has the visibility value, and send everything back. (If using the API). ~~

If you set something wrong when changing that, you can break your overlay entirely.
Not sure how external you are, but if you have access to the OBS, you could just change the source visibility directly using OBS Websockets.

Oh, never mind, I thought too far. You can just set a “display: none” or “visibility: hidden” for a div. 🤦‍♂️

[humble willow]

ooooh thank you so much!

[indigo monolith]

Hello everyone, is there an end credit roll that can be expanded further to include not only subs, follows, and bits but also gift givers and everyone who watched?

[tough quest]

Hey guys, I wanted to ask—when we create a custom widget in an overlay, there are different places to input the code, but in the elements section, there's only a place for JSON. What should we do? Sorry for the dumb question!

[severe shell]

In Elements, you use your own IDE for coding. You can have a look at the Elements SDK documentation and how to use it here:
https://dev.streamelements.com/docs/widgets-elements-sdk

[idle cipher]

This doesnt fix it

[hardy walrus]

How many variations do you have in the alert types?

Because there's a 99% chance you made too many changes that won't be able to be saved.

[harsh sinew]

Hello, can you help me? I can't change my payment details, because I'm told: If you wish to change your details, please contact the helpdesk.

[hardy walrus]

Please keep your questions to your ticket. We can't help outside of it.

[soft kiln]

Hi, can listen to twitch channel point redeems with an overlay ?

[severe shell]

#dev-chat message

[keen iron]

Where do I get the oauth client id and client secret? The website is somehow down or? I need this urgently

[severe shell]

You don't get that urgently, you need to apply for it

https://dev.streamelements.com/docs/api-docs/cd02cda5171ea-o-auth2

[keen iron]

how long does it take?

[severe shell]

We don't have that answer, unfortunately.

[soft kiln]

works like a charm thanks for the lib

[wet nest]

Hey there, I have an issue with the code for a custom widget I made (Tip Goal to specify). It doesn't store the progress itself, the functionality runs well, but when the widget reloads or when restart OBS, it shows the starting amount instead of the progress amount. Hope you can help me. If the code is needed, I'll post it, just let me know it.

[severe shell]

Widgets don't save any progress, unless you save the data on SE kv store.
Check the options SE_API.store.set() and SE_API.store.get()
https://docs.streamelements.com/overlays/custom-widget#se-api

#dev-chat message
One more thing: it is not possible to delete the key once it is created. You can only modify its contents

[wet nest]

I'll try it out, thanks!!

[wet nest]

Speaking of my issue, I took what you told me. According to me, it's well applied, but it still doesn't do the function of loading the value of my “Tip goal progress”, it does everything well, except that. By not doing so, I can't wait for it to save that same value either. Here is the Javascript code, hope you can help me.

let titleText = "{{titleText}}";
let tipGoal = parseFloat("{{tipGoal}}") || 100;
let startingAmount = parseFloat("{{tipStartingAmount}}") || 0;
let tipCurrent = 0;

const titleElement = document.getElementById("titleText");
const progressBarElement = document.getElementById("progress-bar");
const amountElement = document.getElementById("tip-count");

function initializeGoal() {
    titleElement.textContent = titleText;
    updateProgress();
}

function updateProgress() {
    const progressPercent = Math.min((tipCurrent / tipGoal) * 100, 100);
    progressBarElement.style.width = `${progressPercent}%`;
    amountElement.textContent = `${tipCurrent}`;
}

function saveProgress() {
    SE_API.store.set("donationProgress", tipCurrent).catch(error => {
        console.error("Error al guardar el progreso:", error);
    });
}

window.addEventListener('onEventReceived', function (event) {
    const eventData = event.detail.event;

    if (eventData.type === "tip") {
        const donationAmount = parseFloat(eventData.amount);
        if (!isNaN(donationAmount)) {
            tipCurrent += donationAmount;
            saveProgress(); // Guardar progreso al recibir donación
            updateProgress();
        }
    }
});

window.addEventListener('onWidgetLoad', function (event) {
    const settings = event.detail.fieldData;
    const sessionData = event.detail.session;

    titleText = settings.titleText || "Support Our Goal!";
    tipGoal = parseFloat(settings.tipGoal) || 100;

    // Cargar progreso almacenado
    SE_API.store.get("donationProgress").then(value => {
        const storedValue = parseFloat(value);
        if (!isNaN(storedValue)) {
            tipCurrent = storedValue;
        } else if (sessionData['tip-total']) {
            tipCurrent = parseFloat(sessionData['tip-total']) || startingAmount;
        } else {
            tipCurrent = startingAmount;
        }
        initializeGoal();
    }).catch(error => {
        console.error("Error al cargar el progreso:", error);
        tipCurrent = startingAmount; // Fallback en caso de error
        initializeGoal();
    });
});

[severe shell]

In onWidgetLoad, the line that says tipCurrent = parseFloat(sessionData['tip-total']) || startingAmount; will always return startingAmount as the key sessionData['tip-total'] doesn't exist and will be always undefined.

I believe you want the sessionData like this:
const sessionData = event.detail.session.data;

Also, tip-total is a key with other subkeys, you should look for tip-total.amount, actually.

console.log(sessionData["tip-total"])

Would give you this:

{
  "activityId": "67805fab65cde61fd09758e9",
  "amount": 179.23,
  "sessionTop": false,
  "_id": "67805fab65cde61fd09758e9"
}

You can always check the browser console to check if there is any issue.

[wintry sparrow]

Hello! SE have an event that i can capture the current song has started playing?

[devout axle]

Hi ! Is it possible that streamelements blocks certain url or path for customapi variables ? I have a command in chat to retrieve some spotify informations and it's no longer working.
When i test on my side it works, even when i test it on a program i made on an SE overlay it works, i see it on my access log and it returns something, but when i trigger it in chat, i dont see anything on my access log.
On the other end, i have other commands, on the same domain but not the same path (or subdirectory) and those works great even in chat

[kind scarab]

Hi! is it possible to add messages to the stream elements multi chat? I made a program that allows me to extract tiktok messages, and want to be able to put them into the multi chat. Thank you!

[severe shell]

Hard to say, are you sending HTTP 200 status? I had issues in the past because I had forgotten to send the 200 status and the command wasn't even reaching my application.

[severe shell]

Nope

[severe shell]

Unfortunately, it seems it is read-only. I checked the Astro websockets and there is a channel.chat.message topic, but that doesn't accept inputs as far as I could see.
The only way to send messages using Streamelements would be doing a POST request to /bot/ACCOUNT_ID/say, but that will send the message as the Streamelements bot.

[kind scarab]

awh dang it. thank you so much for responding!

[silk imp]

i have a question to my OBS studio if i want to start the stream it doenst find categories for the stream like fortnite or sum can you help me with that?

[severe shell]

Nope, maybe you should ask that in #tech-talk

[silk imp]

ok thanks

[warm yarrow]

Hello, I need to get an API key, but this window pops up, what should I do?

[potent halo]

There are 3 kinds of API keys:

• JWT Token (When you only need stuff about your own account)
• widget token (When you need some request in a widget)
• OAuth Token (When you make a application designed to be used by anyone)
  Please specify which you would need

[junior hinge]

Can someone help me? I just did a bunch of alert variations for a client and now its not in the JSON editor but it still simulates correctly

[hardy walrus]

And this is in the legacy overlays and not Elements?

[junior hinge]

No Elements

Actually it just deleted everything. Took me over 6 hours and now all of it is just gone..

[hardy walrus]

Did you hit save and publish?

[junior hinge]

Yes and now when i go back into it and click edit, its as if I never did anything

Any idea? @hardy walrus

[hardy walrus]

Unfortunately no but I see you've made a ticket and they'd be better off taking a look since my reach is limited (aka almost nothing)

[junior hinge]

Okay thank you, Ill wait. Its for a huge creator and needed that to be done by tomorrow.

[shut arrow]

this is from way long ago, but wanted to ask, if the 2n to last line, i wanted the API to randomize b/w multiple outputs (ex.: You started a fight with @${touser}!, Starting another fight with @${touser}?, etc.), how would i be able to do tht?
i tried to input the stuff i had written out for SE, but i think the coding lang. is diff

[severe shell]

Use $(random.chatter)

[shut arrow]

Ok, thx

[viscid matrix]

is there a way to get a chat command where it displays the highest in one send donation or the highest sent gifted bomb ? I want to make like !subrecord Person X has the highest sub record with 10 Subs at once (maybe with) and Person Y has sent X Subs overall.

[gritty jetty]

I filled out the form for sharable links a while back but havent recieved a reply or any updates, is that still a thing? I just posted the link to the form but it got deleted

[severe shell]

That form is not used anymore. According to the staff, "It was 'retired' in 2023 when the new Elements Editor was released and the Dev Team added the ability to share alerts or overlays created in the Elements Editor".

[junior hinge]

Anybody knkow why the alert plays as many times as was gifted? For example someone gifted 5 and the alert played 5 times

[severe shell]

Nope, unless someone creates a custom api for that, but I don't know any.

[latent wedge]

Does anyone know how many users can go in the current/top leaderboard? and when does it get moved over to All time?

[severe shell]

There are no limit and they don’t get moved to all time, they are different leaderboards.

Current is based on the current amount of loyalty points.

[turbid sinew]

With the new multi-stream, how can I get the stream info popup to pop up when I press my go live button from my StreamDeck? Currently, if I push that button, only Twitch goes live, no pop up for TikTok stream details is presented, and streaming to other services doesn't go live. I do use the StreamElements SE.Live plugin command "Toggle Live Streaming" for my StreamDeck.

[hardy walrus]

Very certain it won't work with it and you have to manually go live for MS platforms.

[turbid sinew]

If so no biggie. Maybe an idea for the dev’s to update the StreamDeck Plugin to work with the new multistream capabilities

Another question: how do I set scene transitions in the vertical canvas?

[latent wedge]

Is it possible to set my own logic for the slots outcomes? as in set a weighted probability for each outcome?

[graceful shadow]

Hey yall I’ve been using Reboots script and I’m not sure what I messed up here for my total tracker. Cheers and tip data works perfect but with subs- it’s not only counting the sub that was just gifted but also the subs that the person had gifted in the past to others and adding that to the total. Here’s the code snip , would really appreciate some insights!

function onSubscriber() {
  updateTotalRaised(3); 
}

function onResub() {
  updateTotalRaised(3); 
}

function onSubGift() {
  updateTotalRaised(3); 
}

function onSubBomb(data) {
  const bombCount = data.count || 0; 
  updateTotalRaised(bombCount * 3); }```

[tribal zenith]

I don't think the structure changed, so it should be data.amount instead of data.count

[graceful shadow]

Ahhh ok and this will ensure that past subs aren’t calculated onto the amount raised?

[tribal zenith]

yes, amount should be for the current event and count is probably the total

[graceful shadow]

Ohhhhhh!!! Thank you!!!

[tribal zenith]

no problem, let me know if it works now 😄

[graceful shadow]

I’ll have to test it later when I stream but I’ll def report back my findings!

[digital saddle]

anyone has an idea how to solve this, i've been trying the whole night

[severe shell]

Your token is wront or not present in the authorization header.
You can use oAuth (if you have it) or your own JWT, you can check here how to use it (read the Token section):
https://c4ldas.github.io/streamelements-api/#/#how-to-use-it

[digital saddle]

iam using the JWT, but still showing 401

[severe shell]

If you are sure your JWT is correct, check if you are using bearer as the authorization prefix.
Other than that, maybe your token is expired, you can check it on https://jwt.io (hover the cursor over the exp key after pasting your token there)

[digital saddle]

alight, i ill try

[hot scroll]

You need to be logged in to use this feature.

If you did log in previously, please logout and login again.

how do i fix this?

[hardy walrus]

?

[severe shell]

Probably logging out and logging in again 😄

[hot scroll]

def did that lol

[hardy walrus]

Still need some context.

[hot scroll]

on the stream elements multi streaming tab it says i am Unauthenticated it usually shows my twitch and tik tok

i have tried restarting my pc and obs. i have also tried loggin back into twitch and it still does not show up

nvm pookies i figured it out

[icy latch]

Sup

[analog kelp]

Huh. Is there truly not a python library (at least that I can find on pypi) for interfacing with SE (for monitoring the event feed and such)?

[severe shell]

Nope

[analog kelp]

That is both surprising and disappointing.

[analog kelp]

Do SE JWT tokens expire?

[severe shell]

Yep. #dev-chat message

[analog kelp]

Is there any way to auth a bot that doesn't require manual steps to reauthorize every month?

[severe shell]

Using oAuth, you can check on how to apply for it here: https://dev.streamelements.com/

By the way, the expiry date is not one month anymore, it is around 6 months last time I checked

[analog kelp]

6 months is better, but I'd still prefer being able to have a bot that doesn't periodically break for no reason other than someone decided it should.

The oauth pages suggest that oauth is intended for companies making large commercila projects, which I am definitely not. :/

[severe shell]

Well, I would try it either way. Explain your use case and wait for the response.
I'm not a company and was able to have access to it with no issues.

[analog kelp]

I guess we'll see.

[potent halo]

Hey there, I've got a question.
Topic: Twitch EventSub
Background: I'm developing a Server-Server application. I also need to get some twitch events. Naturally that sounds like a EventSub WebHooks Job.
Problem: How dafuq do you locally test your code?! WebHooks literally need a public domain. Having a ddns and nginx server with certbot running locally seems a bit excessive. Is there any better solution?

[severe shell]

I think the easiest way is using the website https://webhook.site. It will create a webhook URL and you can configure to redirect that to your localhost.
After creating the URL, there is a button called "XHR Redirect". Click on it, enable it and put your localhost address as a target.
You don't need to install anything.

[potent halo]

Thx dude looks good. Don't know if it'll work with the challenge stuff twitch does as a handshake tho. I'll try it tho :)

[fierce dove]

Heyaa!~
I'm currently working on a custom chat overlay, using this (https://github.com/StreamElements/widgets/tree/master/CustomChat) as a basis.

I'd like to have new messages scrolling upwards from the bottom, with existing messages smoothly scrolling upwards aswell. How can I achieve that? Currently the old messages just instantly move higher within 1 frame, without a smooth transition and I was unable to change that myself. Can anyone help me with that?

[potent halo]

I'm not the best at styling but my idea would be to animate the height of the newest incoming message. That way everything else should get pushed up since it's just html. Don't know how it'll look with cut off tho. I'll play around with it when I get back on my pc

[potent halo]

Got it working with css only.
define the keyframe animation at the top, add the animation property to message-row class

@keyframes customSlideIn {
  0% {
    max-height: 0;
  }
  100% {
    max-height: 100%;
  }
}
/* ... */
.message-row{
    /* ... */
    animation: 5s ease-out 0s 1 customSlideIn;
}

it is a bit abrupt at first. I tried to hide that using fadein:

@keyframes customSlideIn {
  0% {
    opacity: 0;
    max-height: 0;
  }
  10% {
    opacity: 100%; 
  }
  100% {
    max-height: 100%;
  }
}

[stark river]

Hey, does anyone have any ideas about how to set up a chatbot command that just returns the current riot id's of the players in current league game? (Not sure if this is the channel to ask for it, sorry if it isn't)

[severe shell]

You want to know the players that are in the current game?
What information do you have to query for that current game? A player name? Match id?

[stark river]

Yeah just for it to list players in the current game, just a return like this - There's a liveclientdata paste that shows riot id's for each player but I'm unsure how to have something return the ids from it

Or would it be easier to make it return data from a site like lolpros & Just list off the 5 players on either side

[severe shell]

Well... Not sure if we are talking about the same file, but as far as I know, liveclientdata is a local JSON file that is generated when you join the match (https://127.0.0.1:2999/liveclientdata/allgamedata). That info is only reachable from local machine, so SE bot or any other bot won't have access to it.
Riot has an endpoint for active game, however, it need authentication and isn't reachable directly, you'd have to setup a server for that (due to CORS).

You will need the puuid and the region of a player that is in the game using their gameName and tagLine:
https://developer.riotgames.com/apis#account-v1/GET_getByRiotId

After that, you call the active-games using the puuid
https://developer.riotgames.com/apis#spectator-v5/GET_getCurrentGameInfoByPuuid

That will give a JSON with the riotId of each player and the championId (not the champion name). You will need to call another endpoint (I suggest community dragon for that) to get the champion name based on the championId
https://raw.communitydragon.org/latest/plugins/rcp-be-lol-game-data/global/default/v1/champion-summary.json

As you can see, it is not that simple to get the response you need, unless someone have it already created.

[naive mesa]

there's no way to have a custom widget change settings in another widget, right? like taking in a chat command in a custom widget and using that to turn off TTS display or setting visibility to off in the alert widget?

[potent halo]

There actually is. You can use the Key store. Every value in the Keystore is shared among all widgets. And afaik there is even an event for when any value is updated.

[naive mesa]

would that be kvstore and kvstore:update?

[potent halo]

Yes sir

[quiet sentinel]

Hi. I've been using Stream Elements for a while now to read messages using a command, !v (text). Today it only happened with one of my moderators, but it works fine for other mods and subscribers. It says to him; you are deeeming to fast. Is there anything I can do?

[severe shell]

Check the global and user cooldown of the command as well as the store item they are redeeming. Also, when they redeem many times in a row, that message is triggered to avoid spam.

[quiet sentinel]

The cooldown seems to be correct. He never sent spam messages. From the first message he got an error, but for the rest of the people it worked without any problem from the first minute.

[severe shell]

In this case, ask the moderator to logout and login on Streamelements webpage, that usually fixes some strange issues.
https://streamelements.com/logout

If still happening after logout/login, then the only option would be opening a ticket with the staff.

[quiet sentinel]

ty ty!!

[gleaming parcel]

@severe shell bro, I wanted to ask, so I chat widget which I encrypted then I described it in the stream element but the problem is that if I put the key on GitHub the code can't run, even though if it's not hosted on GitHub it runs, I've debugged it and it really produces results. I even have the original key, console.log, my original js code is also there but it still can't be run

[formal dagger]

hello

[whole mural]

If I want to have my Twitch alerts pick between one video or another randomly to display, would it be done in the HTML of the custom editor?

[hardy walrus]

You can create variations and have that choose.

Otherwise you'd probably need to create a custom widget.

[gritty jetty]

is there a way for two custom widgets in the same overlay to interact with each other? or are they two completely separated elements

[tepid flint]

How about fixing the se.live installer to allow installs on OBS portable installs in non-standard folders?

[analog kelp]

For listening to events (via websocket), should I be using realtime or astro? dev.streamelements.com seems to imply I should be using realtime, but the documentation for astro (via docs.streamelements.com) seems to be much, much more complete (and if I look at what an overlay page connects to when it runs, it connects to... both). What's the better path?

[formal dagger]

[potent halo]

I've only been using realtime. Personally I hate that endpoint. It uses socket.io. A layer over websockets. Therefore making it incompatible with default websocket implementations.
If you can get everything you need from astro, then why shouldn't you just use it?

[sharp sentinel]

Hello guys! I have a question, is there any way to get the data that the user is monitored as supicious? I'm making a chat alert box, is pretty much done and I want to just return and dont show the message if the user is sus

[analog kelp]

Well, I don't know the history, or if one is supported and the other is on its way out, or if one is more complete than the other, or if one has hidden gotchas that the other doesn't, etc, and most of that is unknowable based only on the docs. So I ask. 😉

[potent halo]

Fair. Afaik astro is newer. Haven't heard about stoplight being shutdown.

[analog kelp]

Here's an incredibly silly/stupid question. When using an overlay, the overlay code authenticates to both realtime and astro endpoints using the latter part of the overlay's URL as an api key, and starts listening to events that way. Overlay URLs don't change or expire... is there any reason I can't just crib that token from one of my overlay URLs and stop having to worry about oauth (if I can even get approved) or expiring JWT tokens?

[severe shell]

You can use that. For Astro or socket.io, it won't make a difference.

That is called apiToken or Overlay Token, you can also get directly from the overlay, when using onWidgetLoad listener. The key is obj.detail.channel.apiToken.
Or in https://streamelements.com/dashboard/account/channels

The difference is the overlay key doesn't have access to all endpoints from Streamelements API. But that doesn't affect Astro or Realtime.

I mean, unless Astro needs the JWT for specific topics. I haven't tested that.

[analog kelp]

For the most part, all I really care about are tip events, so that should work out for my needs and save me a bit of pain down the road.

[severe shell]

Not directly from SE. That suspicious user information comes from Twitch PubSub, topic low-trust-users.ID.ID, you would need to connect to pubsub directly and subscribe to that topic to have access to that info.

This is the message:

{
  "type": "MESSAGE",
  "data": {
    "topic": "low-trust-users.28057703.28057703",
    "message": "{\"type\":\"low_trust_user_new_message\",\"data\":{\"low_trust_user\":{\"id\":\"629674320\",\"low_trust_id\":\"MjgwNTc3MDMuNjI5Njc0MzIw\",\"channel_id\":\"28057703\",\"sender\":{\"user_id\":\"629674320\",\"login\":\"c4ldasbot\",\"display_name\":\"c4ldasBOT\",\"chat_color\":\"#008000\"},\"evaluated_at\":\"2022-02-07T05:13:44Z\",\"updated_at\":\"2025-01-22T19:57:08Z\",\"ban_evasion_evaluation\":\"UNLIKELY_EVADER\",\"potential_harasser_evaluation\":\"UNKNOWN_SUS_CHATTER\",\"treatment\":\"ACTIVE_MONITORING\",\"updated_by\":{\"id\":\"28057703\",\"login\":\"c4ldas\",\"display_name\":\"c4ldas\"},\"shared_ban_channel_ids\":null,\"types\":[\"MANUALLY_ADDED\"]},\"message_content\":{\"text\":\"Test message from suspicious user\",\"fragments\":[{\"text\":\"Test message from suspicious user\"}]},\"message_id\":\"4464ae1d-4a14-4c58-908f-7f268efa1ec4\",\"sent_at\":\"2025-01-22T20:59:21Z\"}}"
  }
}

[formal dagger]

hey

[potent halo]

Uhh.. isn't pubsub being shut down in favor of EventSub in April?

[severe shell]

Yep! I just looked at twitch front end chat to check how they deal with those. Didn’t even check the pubsub or eventsub docs 😅
Well, the event sub docs for that is https://dev.twitch.tv/docs/eventsub/eventsub-subscription-types/#channelsuspicious_usermessage

[toxic vale]

Anyone help me with this?

[hardy walrus]

https://discuss.dev.twitch.com/t/legacy-pubsub-deprecation-and-shutdown-timeline/58043

[toxic vale]

OBS was working fine streaming my twitch account till I downloaded SE Live and now this pops up and cant stream anything

[severe shell]

Yes, the best place to ask that is #community-helpdesk or opening a ticket.

[potent halo]

Some of my old projects will just nuke themselves

[wheat jackal]

Is isCommunityGift still a thing? Replayed bulk gifted subs don't have that data anymore?

[severe shell]

I suggest that you ask that in #community-helpdesk

[silent garden]

TY

[inner haven]

Hey!
I want to develop an extension for StreamElements. This extension has to access the StreamElements API. But only for my account. Is this possible without an application to gain OAuth access?

[keen storm]

Eyy!

Reached out earlier in General Chat - I think I'm onto something new - There a way to horizontally display chat - they then sliiiiiide across the bar with a character limit?

Like a Stock or News Ticker?

[severe shell]

Yes, you can use your JWT, no need to apply for oAuth

[keen storm]

If it helps, I have rough (real rough) documentation with what I'm trynna do

[naive mesa]

I just tried this out in my widget and it looks like changing any values to one of the built-in widgets (in this case an alert box) doesn't emit an event like a custom widget would do. am I misunderstanding or is this only possible between 2 custom widgets?

[severe shell]

SE_API is only supported in custom widgets, not alert boxes, unfortunately.

[naive mesa]

so there's no way to affect values from SE's own widgets then like I thought?

[severe shell]

If it's an alert box, no. It would work if it was another custom widget

[short pine]

Anyone know how to get media request to work ?

[analog kelp]

Hmmm. so connecting to realtime with the bog-standard python socketio library... I can connect, I get events, I see pings coming in (and pongs going out)... but it seems like I get disconnected every few minutes (though sometimes it lasts a bit longer) and have to reconnect/reauthenticate. Is there something I need to do (beyond respond to pings) to stay connected?

[severe shell]

Socket.io takes care of that, actually. It isn't normal to get disconnections. SE uses socket.io server version 2, so maybe try to use an older client version library.

[analog kelp]

Hmmm. Might be a version mismatch. Which means I get to use a half-decade old version of this library. Whee.

[analog kelp]

I really prefer protocols where the protocol version is explicit and not "try it and pray", heh.

[potent halo]

I'm also using python. Here the line that connects. Maybe it'll help

    sio.connect(SOCKET_URL, transports=['websocket'], wait_timeout = 10)

Since you're getting events, your auth msg should be fine.
There is nothing else in my code that does anything non standard

Oh and I'm getting events for connect disconnect authenticated and event.

[inner haven]

Hey dev peoples!
I want to create a custom command in streamelements which should execute a script.
The problem is: I only that I can create custom widgets and elements to run scripts, but those don't support custom commands. What is the way to go?

[hardy walrus]

I'm going to say what you wanna do probably isn't viable but even if it were you'd need the actions to be done via a custom api call to a server that executes it.

Downside is because the bot is not hosted locally you'd need to have the server connected via a public IP/domain.

[inner haven]

Okay, I already thought I have to do that. Thank you!

[strong falcon]

Help. I created custom code in an alert box that worked all the time, but suddenly randomly my code stopped reading values ​​from this custom fields (it worked before). I use console.log to make sure and it shows "undefined"

aaaand a new error appeared in the console when calling my custom code that wasn't there before

[severe shell]

It doesn't seem that error is related to that part of the code.
It looks like a JSON is not correctly structured, so the code is giving error when trying to parse it.

If you click on VM22 about:srcdoc:47:22, that should show where the issue is located. It is supposed to be on line 47, but as we are talking about custom widgets, that doesn't always reflect as we expected (due to the sandbox).

[strong falcon]

It shows me this piece of code

[severe shell]

So that's it. it says your "initData" variable isn't correct.

[strong falcon]

But how if my code worked before?

And i dont think my custom fields are initial data

[severe shell]

Copy that variable (removing the `), paste it on https://jsonlint.com and click on "validate JSON" to confirm if the JSON is valid. If so, we would need to check for other issues

[strong falcon]

A said, this code work before and i nothing touch

Its just randomly stopped working

[severe shell]

Maybe it is just a bug, then. Try to duplicate the widget to another overlay, just to test if the same error will appear in the new overlay... I had some widgets in the past that presented errors with no apparent reason and when moved to another overlay, they worked again. Maybe it's happening again with you.

[strong falcon]

Ok i will try

I duplicated this alert box to another overlay and the problem is the same

I have now tried to completely clear the fields and used this simple code (without my fields data) and the problem is still the same

Even if i remove const {fieldData} - same error

[severe shell]

Hmm... I think you maybe have custom code in other parts of that widget. Maybe inside some variation...

[strong falcon]

No, same code everywere

In all variation of my alertbox

I checked my custom fields and this JS in just a normal custom widget and 'onWidgetLoad' works

So this is problem of custom code in alert box

[severe shell]

Yeah, and you said it was working before. It would be very hard to find the issue checking the overlay itself. 😦

[strong falcon]

I created a new overlay with a new fresh alert box with one tip variance - same problem

I checked now and 'onEventReceived' also causes an error

(console log with 'BBBB' not showing because error)

And this is still fresh overlay with fresh alertbox

[severe shell]

onEventReceived shouldn't be used on alertboxes. It will never trigger, afaik. The custom code in alert boxes runs when the variation is triggered, which means only onWidgetLoad will run.

I just created a new overlay, new alertbox and created a new variation for tip alert for at least $5.
Inside that variation, I enabled "Custom CSS" and replaced the JS tab with the following:

window.addEventListener('onWidgetLoad', function (obj) {
  console.log("TEEEST");
});

It worked fine when I emulated a tip of $10.

Do you mind sharing your overlay, so I could review it? If so, you can generate a code of it here: https://seapi.c4ldas.com.br/share

Then you can send me the code

[strong falcon]

Ok so yes. I create this overlay for another person who has errors. I have now switched to my own account and the same code worked! I went back to the other person's account and the error reappeared.

So its looks like issue with his account on StreamElements?

[strong falcon]

here: 1737770597375

[severe shell]

Oh, that's weird... But possible, we never know what happens with SE 😄
My suggestion: Ask that person to logout and login to SE again to refresh the token... I know it's a basic thing, but many times it solves lots of problems.

[severe shell]

Thanks, let me check, just a minute

[strong falcon]

Thanks, and thanks for your help 😄

[severe shell]

No errors here. "TEEEST" is shown on console.

[strong falcon]

:/

[severe shell]

Wait, that overlay is for Youtube, right? I'm on my Twitch account

[strong falcon]

Yea, for youtube 😄

[severe shell]

Ok, let me duplicate to my Youtube, just a moment

[severe shell]

Yeah, no errors on Youtube account either. So it seems you're right, the issue seems to be on the other person account

[strong falcon]

Yea, as I said, the same code on my streamelements account also worked 🤔 But no on this specyfic account

So whats now?

[severe shell]

Ask them to logout and login to Streamelements, that will refresh their connection and update some backend things. https://streamelements.com/logout
If after that the issue still persists, my only recommendation is to ask them to open a ticket with Streamelements staff and informing the issue is happening only in that account (and we tested here in this channel with your account and mine as well).

[strong falcon]

Ok, thanks, now I have to wait because this person is already sleeping 😄

[severe shell]

Well, better sleeping than looking for errors 😄

[strong falcon]

Is this ticket I created is enough?

[severe shell]

I should be doing that too... 2:15AM right now here 😅

[severe shell]

I think so, but maybe the staff will ask the account owner to open it.

[strong falcon]

Ohhh there may be a problem, this person does not understand anything about programming at all haha

But we will se

[severe shell]

Yeah, I know how that is. But you can try to work with the staff yourself

[strong falcon]

And again, thank you for your help. I appreciate it

[severe shell]

You're welcome! If you have any more questions, just let us know 🙂

[somber shard]

my multi stream for tik tok wont work

[severe shell]

Go to #community-helpdesk and provide more details. We cannot help with that here.
In there, try to inform what you have done, if there is any error message, what steps you are performing until the issue, things like that.

[strong falcon]

Oh my god i probably found the issue....

Someone with his nickname makes a error....

And its a "latest sponsors"

But i dont know how to clear this list like last tippers

[severe shell]

The old sanitization...
You can go to Widget data. Activity Feed > Cog icon > Widget data
Or the direct link:
https://streamelements.com/dashboard/session

[strong falcon]

And if i remove -> " " json works correctly

ITS WOOOOOOOOOOORKS

OHH MYYY GOOOD

I HATE THIS SPOSNOR USER

[severe shell]

I would say it's a SE issue. They should escape the quotes on the user name.

{
  "name": "Adonis \"HILL\" Potwór z los santos",
  "tier": ""
  "amount": 1,
  "createdAt": "2525-01-24T19:19:11827Z"
}

[strong falcon]

Yeah, soo i will tell SE support about this issue

[severe shell]

Great, I will also report that!

[gleaming parcel]

Why doesn't it work, even though the console has sent it correctly, but the problem is that on widget load, on event received it doesn't work? can anyone help?

[severe shell]

We can help, but first we need to understand what doesn't work and what you mean by " the problem is that on widget load". Please remember we have no idea what you expect your code to do or what the issue is.
Also, for coding issues, always prefer to send it as a text, instead of screenshots. We cannot even translate your code, unfortunately.

[gleaming parcel]

So I think the problem is simple, the problem lies in why the stream element can't run my code that I took from the server? actually it's possible if it's just console.log and pure js functions, but for example, if one event is received, on widget load it doesn't work, you understand, right?, even though my code is directly pasted in a custom widget which functions normally

[severe shell]

Well, you now even removed the screenshot, which makes even harder to help. What I could remember the code is that you were trying to add a <script> tag into the DOM, right? I was trying to read it but the screenshot was removed. Don't remember how you were doing that, but I just tried here on my side and it worked fine. Probably you weren't loading the script correctly.
Here, it will load a gsap script and move the box when loaded:

HTML

<div class="box"></div>

CSS

.box {
  width: 50px;
  height: 50px;
  background-color: green;  
}

JS

const script = document.createElement("script");
script.src = "https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js";
document.getElementsByTagName('head')[0].appendChild(script);

script.onload = function() {
  console.log("Script loaded and ready");
  // Move and rotate the box
  gsap.to(".box", {rotation: 360, x: 200, duration: 2});
};

[inner haven]

Is it possible to increase the maximal char limit of the response type for a custom command?
I need to execute $(customapi ...) with a long url which is longer than 500 characters.

Or is there a way to store the URL in a variable?

My question is related to my community post: https://support.streamelements.com/hc/en-us/community/posts/24189926141458-JWT-Token-via-variable

[severe shell]

It is not possible to increase the amount of characters in the response.
There isn’t a way of store the URL in a variable.
If you really need to access an URL with that amount of characters, the best option would be creating a man-in-the-middle service, like Google Apps Script

[inner haven]

Hm, I don't think this would work, because passing the JWT token as query parameter increases the length of the url. And that won't change by using a service like Google Apps Script

[severe shell]

Pass JWT as query parameter? Thats why you need more than 500 characters? Sorry, but that doesn’t make sense.
Just store the token on GAS or any other man-in-the-middle service and use GAS URL on your customapi command.

[inner haven]

But the JWT token changes every two weeks. I don't want to update it every two weeks

I can also store the token as a ENV variable or as a Github Variable. But this would lead to manual work every two weeks

[severe shell]

Even if it expired every two weeks (which doesn’t) you would need to change it somewhere else. If you had it in a custom command, you would need to change it in the command anyway.
It is just the place you would need to access to change it.

[inner haven]

You are absolutely right! In the linked ticket I asked if it's possible to get the JWT token via a variable. I didn't ask that here - sorry.
But please correct me: The JWT token does NOT change every two weeks for security reasons?

[severe shell]

It takes 6 months last time I checked. Check the exp key: #dev-chat message

[inner haven]

Oh, you are right! 🤔 Okay, that is actually good information! Thanks for the clarification

[narrow dagger]

Is there an endpoint to get current points not the alltime? as 71029635 is a big difference to 40085 https://dev.streamelements.com/docs/api-docs/2087afad62747-channel-alltime

[severe shell]

https://c4ldas.github.io/streamelements-api/#/operations/Get/points/channel/:channel/top

[strong falcon]

Hi! If https://api.streamelements.com/kappa/v2/tips/{channel}/top
gives top tippers list, so how get top superchat donations list?

I created my own top tips list in a custom widget, but it only includes SE.Pays

[celest sable]

Does anyone know if there's a way to know when the 'tts' is meant to play on an alert?

I'm making a custom TTS and so far I'm listening to when the activities are happening, but some streamers have alerts with videos and variations that should delay when the TTS plays.

I checked the API Documentation but I couldn't find anything about it, is this even possible?

[strong falcon]

It is possible to play audio through custom widget? Because i have error:
"play() failed because the user didn't interact with the document first."

Alertbox can, soo... 🤔

[severe shell]

There isn't. Maybe you will need to look for that in the Youtube API itself.

[severe shell]

TTS will play after the sound alert. Or you can set the activation delay in seconds on the alert itself.

[severe shell]

That's expected... browsers block audio without user interaction first. You can add streamelements.comas an exception for media autoplay on your browser settings, so you won't have that issue:

On Edge, you can access the URL edge://settings/content/mediaAutoplay
In Firefox, the URL is: about:preferences#privacy (or just look for "Autoplay")
Chrome should have something similar, but I don't have it here to test.

I don't know how alertboxes bypass those restrictions, I believe they aren't in an isolated sandbox like custom widgets, so you are interacting with it when clicking on the page already.

[strong falcon]

I solved the problem. In the browser it actually didn't work but when I added an overlay to OBS the audio started working! 😄

(best js developer 😎 )

[severe shell]

Yes, OBS doesn't have that limitation. The suggestion was for your tests when developing the widget

[celest sable]

And the goat replies!

I'm making an AI TTS for my stream so I was wondering if there's a way to do what the streamelements overlay does, but through the api

Or detecting which variation is playing

I believe some alerts are odd based more than condition based so detecting through api would be ideal, but I don't think it's possible, is it?

[gritty dock]

Streamelements question - so im using streamelements for creating chat overlay. I signed into both twitch and youtube in streamelements. changed youtube studio to live, added streamelements as moderator. However, only twich is showing up in the chat, not youtube. any other suggestions? Cant seem to find anything else on google. 🙂

[obtuse isle]

Streamelements does not support multistreaming in the overlays systems... Idiocy if you ask me but as they always say "Twitch forbids merging of chats with their TOS and we want to keep a good relationship with Twitch so this will not be supported feature". I wrote "handlers" to have alerts "cross send" so they do not overlap weirdly and handle chat (no I will not publicly this code cause its way too buggy) but do yourself a favour and move to streamerbot (like I did for chat).

[gritty dock]

Aye... explains why I cant get it to work then. THank you so much

[grizzled ravine]

hola necesito ayuda alguien que hable español

[severe shell]

#🇪🇸︱español

[vital night]

Quick one - Does the new stream elements multi stream also do Vertical replay buffer / clipping?

[severe shell]

You will get better answer about that in #community-helpdesk

[thin wraith]

Hello, I want to create a custom chat that also displays notifications for new followers/new subscribers. Is there any documentation or tutorial for that? Thankyou

[severe shell]

I would suggest that you get one of the chat widgets in #widget-share and modify it.

The documentation is here: https://dev.streamelements.com/docs/api-docs/775038fd4f4a9-stream-elements-custom-widgets#custom-widget
For new followers and subscribers, you can check the keys follower-latest and subscriber-latest in "obj.detail.listener" from onEventReceived.

window.addEventListener('onEventReceived', function (obj) {
  if(obj.detail.listener == "follower-latest" || obj.detail.listener == "subscriber-latest") {
    console.log(obj); // You can see the structure of the obj for followers/subscribers in browser console
  }
});

[severe shell]

Do you need any help?

[plain jasper]

Hello everyone, thank you to those who respond and also to those who read my message.

I have a question: I would like to create a chatbox in such a way that the user's message is inside a box, and the sender's name is displayed above it. Could you tell me how to do this or give me some advice on how to make this modification?

Thanks to anyone who responds, and thank you for your patience (I’m attaching a picture to help you understand what I mean).

[severe shell]

I think the Boxed Chat by Cocahh is like that:
#widget-share message

If it's not exactly what you are looking for, you can use the code as an example and modify what you want.

[slow rune]

how long does it generally take to get to a ticket? :o

sorry if I asked that in the wrong chat fasdjjkfasd

[severe shell]

The ticket is opened immediately. But it depends on the staff backlog to have your ticket answered. We don't have access to that information.

[slow rune]

I gotcha! Thank you :>

[plain jasper]

Thanks!

[plain jasper]

Sorry, one question, but did he add an overlay and then put custom widgets or 'stream tools'?

[hardy walrus]

Clicking the link will add the widget in its own overlay in your library. You add that as a browser source in OBS.

[plain jasper]

Ah thanks, sorry

[vivid trellis]

Hi, one question I can't find an answer: is it possible to handle a chat command from a Custom widget JS with reply to Twitch chat? I use SE_API store to store number and strings values, I can render my widget but i would need to have one command using informations stored for a chat reply

[severe shell]

You can use jebaited for that.
#dev-chat message

[stiff rock]

is it me but SE multistream has bug

if is they need fix that asap coz provent others connect or stream other channels

[wheat kelp]

what seems to be the problem?

Got it. Rolling out a resolution right away.

[stiff rock]

partly some random accoutn linked my profile as looks like dev/test account thats not on my profile but already did ticket way before bot mention it

but this proventing me stream twitch and etc

[wheat kelp]

Can you re-try now?

[stiff rock]

okay let me reopen obs

yep that did trick

other issue now adding custom RTMP some reason unable add facebook but i try that again since that acc gone

nope thats broken too

[wheat kelp]

Can you describe what you're experiencing?

[stiff rock]

when press add rtmp wont add custom rtmp so update on there broken too or could be my account issue again not sure if is addon or account

when add it does nothing then keeps as that and no logs too or errors

[wheat kelp]

When you add it, the fields should become empty, allowing you to easily add another one if you want. Otherwise you can close the modal and then the custom RTMP will be displayed in the multistreaming list. You might need to scroll down a little bit to see it.

[stiff rock]

nope

so button broken custom rtmp or somethign cant be debugged my end

all started after SE live update on beta and tried live version as on rn and same thign so checked both branch before i was checking account issue

plus i seen lot messages in general chat too people had issues newer update so not like im only 1 facing se update issue

[ivory gyro]

I get application error when i try to login with twitch

To dashboard

[gritty panther]

with the Prize Wheel by pjonp is there a way to remove the pjonp text when you start the wheel spin?

[severe shell]

You’ll need to open a ticket for that, we don’t have access to that information.

[uneven oxide]

@ivory gyro ⤵️

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!

[severe shell]

There always is, but you need to check the code clicking in “Open Editor” and modifying what you want manually.

[gritty panther]

yeah i might have to go into the editor thanks for the help !

[ivory gyro]

I dont have my Account ID

[uneven oxide]

Please provide your account ID found at the top of this page: https://streamelements.com/dashboard/account/channels This ID is public info and safe to share here.

[hardy walrus]

It's right there by your email.

[ivory gyro]

I Cant login in my Dashboard !

[shut ether]

Hello, I was wondering if there is a way to get alerts from Tiktok in the SE Multi Stream OBS plugin?

[hardy walrus]

Not yet. We don't have access to that yet.

[shut ether]

Thank you for the quick reply I hope your day/night is going great. This tool is incredible BTW.

[severe shell]

What's your Twitch username?

Nevermind, I was able to find it on your Discord profile. Well, it says your account is suspended you Streamelements API:
https://api.streamelements.com/kappa/v2/channels/Palette213

That's why you are not able to login to your dashboard.

[ivory gyro]

I dont know why i am Suspended i didnt do anythink wrong

[ivory gyro]

Can i Anythink do that i get unsuspended ?

[severe shell]

We don't have access to any of that info.

[ivory gyro]

okay

but what can i do

[severe shell]

I don't think there is anything that can be done. You can try to submit a request, but I'm not sure if that will work, unfortunately.
https://support.streamelements.com/hc/en-us/requests/new

[stiff rock]

hey Darko, it did it again some how refuses do same thign but this time facing errors not loading anything multistream addon so had to go safety mode disable SElive till needs fixing all channels disabled on mutistream but thinks theres acc turned on thats not on my view

[potent geyser]

Not sure if this is the channel for feature requests so delete if needed. Is there a plan to add individual bitrates for each platform? Also, I set up thumbnails for my YT stream but then they didn’t carryover since I used the multi plugin. Is there a plan to add that?

[severe shell]

No need to delete, but this is not the place for feature requests. This link should be the one you are looking for:
https://support.streamelements.com/hc/en-us/community/topics/115000018311-Feature-Requests

[sharp sentinel]

Question, how can you customize this to look different? And also is it fine to add "author" in fields ? like:

    "type": "hidden",
    "value": "Author"
  }```

Is that the correct place ?

[severe shell]

Customize what exactly?

The widgetAuthor key is correct.

[sharp sentinel]

The image of the overlay before going into edit mode, like the cyan image that I just showed

Change that to something more accurate

This

[hardy walrus]

The image is based on the set game.

[sharp sentinel]

Oh wow, lol didnt know! Thought it was fully customizable

[hardy walrus]

Case in point

[severe shell]

That is changed when you choose a new game in Properties. Well, you can do it via API, changing the "preview" key, but it's kinda risky (doing something wrong and you lose your overlay).
If you want to change the image either way, I suggest that you first create a new blank overlay, change the preview key using API and then work on your widget.

https://c4ldas.github.io/streamelements-api/#/operations/Put/overlays/:channel/:overlayId

[sharp sentinel]

Perfect!
Regarding the author and widgetName , what does widgetName does? Don't you change it right there

[sharp sentinel]

Nah is okay I will just do "Just Chatting" , thank you very much for your answer

[severe shell]

It just adds by WidgetAuthorName in the overlay when sharing it. But as not everyone has that sharing capabilities, it basically does nothing. It is a good way to know the widget creator in case you need some "help"

[sharp sentinel]

Oh I see, good, thank you!

[severe shell]

Like this

[sharp sentinel]

Cool, thank you!

[inner lagoon]

alright i think im having a major brain fart. its been a while since ive worked with streamelements and stuff

but suddenly one of my overlays stopped working. I was making a call to the twitch api like

  var gameDetails = await $.get({
    type: 'GET',
    url: 'https://api.twitch.tv/helix/games?name=' + game,
    headers: {"Client-ID": "*********"},
    success: function(data) {
      return data;
    }
  });
  if (!gameDetails.data[0]){
    console.error("No game returned 2");
    return;
  }

which worked even though i wasn't supplying an actual token, just client-id. but now this doesn't work, saying it needs an oauth token

so i guess my question is, if i need to supply an actual token, how do i do that without leaking the client secret in the streamelements overlay code?

or do i need to have the user manually supply a client id and secret and then i generate the token?

[hardy walrus]

Are you sure that endpoint still works and hasn't changed?

(I can't answer the actual question and know they're making API changes that may be breaking things over the next few months)

[inner lagoon]

yeah the endpoint works. this method worked up until a few hours ago.

so they might have just changed things

[hardy walrus]

What error responses are you getting in console?

[inner lagoon]

{
"error": "Unauthorized",
"status": 401,
"message": "OAuth token is missing"
}

[hardy walrus]

Okay that I'll leave for big brain person here

[severe shell]

You don't. You don't use clien't secret for the endpoints. Client secret is just to exchange the code for an access token.

[severe shell]

Yeah, you will need the oAuth:
https://dev.twitch.tv/docs/api/reference/#get-games

[inner lagoon]

i know, but i cant just manually generate an access token then put that into my code, because the token would eventually expire. so i would need to put the client secret into the code to generate a token

or some other solution im not thinking of

[severe shell]

Unfortunately it won't work that way. It always need a manual request to have the access token first (and it will need to be refreshed from time to time). That can only be done automatically if you have a server to store the access token and refresh token. Otherwise, the user will need to change the token every time in the widget 😦

[inner lagoon]

right... i bet a lot of people are going to come here with broken overlays soon because i just copied the method other overlays used to query the twitch api without an oauth token

i wonder if decapi would work

[severe shell]

But that endpoint doesn't return too much info, do you need something specific? Maybe we can look for other APIs for what you need

[severe shell]

It doesn't have any endpoint for that info

[inner lagoon]

yeah. and this same overlay uses a few other calls to the twitch api that decapi doesnt support

[hardy walrus]

You're just trying to get the current set game?

[inner lagoon]

seems like really my only solutions:

1. have the user generate their own client id and secret and supply it to the overlay
2. use my own website to make the calls

right?

[inner lagoon]

its a shoutout clip overlay. so i get the user, their last played game, the cover art for that game, their avatar, and then a list of their clips

[hardy walrus]

Decapi can grab the last game from what I see. https://docs.decapi.me/twitch?endpoint=game%2F%3Achannel

[inner lagoon]

yeah im already using decapi for the endpoints i can

but some things need the twitch api

[severe shell]

Well, it depends how much you are into that. I, for example, have an endpoint the user can create/close/cancel predictions and they just need to authenticate to my server first time, so I generate a specific code for them. But I needed to setup a server with oAuth and store the tokens in a database.
Every time they create a prediction, it goes to my API and my API goes to Twitch API.

[inner lagoon]

i'm wondering how long until the 400+ people using this overlay start bugging me

[inner lagoon]

right, but is this integrated with an SE overlay? that makes perfect sense for server based calls but not for an SE overlay

unless my brain isnt braining?

[severe shell]

Yes, it was initially only for chat commands, but then I created an overlay using the same idea.
It starts and close Twitch predictions for League of Legends. It reads if the user is in a game and if so, starts the prediction. When the game finishes, it reads the results and close the prediction with win/lose

https://github.com/c4ldas/streamelements-widgets/tree/main/league-of-legends-scoreboard
You can just ignore the scoreboard part because it needs some OBS and certificates workarounds, but the part of the prediction works without that.

But as I said, the user needs to go to my webpage to generate a code beforehand

[inner lagoon]

i seem to be missing a step because

1. people load the overlay, theres instructions to go to my site to authenticate
2. they authenticate, my server stores the oauth credentials
3. so now the se overlay needs to make calls to my website, which then acts as a middleman and calls the twitch api using the user oauth credentials

however, how do you tell the se overlay to call your website api in a way that ties it to the user? thats where my brain isnt working.

[severe shell]

When you store the oauth credentials, you can generate a value (a random code) and store it together with the tokens.
Then the user will put that code in the widget and the widget will make a call to your website using that code. With that code you know who it is and then use check the respective token you stored

[inner lagoon]

ohhhhhh

i understand now

[severe shell]

You can also use the user id, username or anything like that... If isn't critical, you can store any value to link the token with the user. I don't recommend the username because they can change it on Twitch

As my code is related to predictions (create, close and cancel), I generated a random code, otherwise other people could use that info to start and stop predictions for that user...

[inner lagoon]

right. mine is just pulling boring old data from the api so it doesnt need to be secure. but that makes sense

[severe shell]

Yeah, and depending on how many requests are made per minute, you could use your own tokens (like decapi does) and users wouldn't even need to authenticate on your website

[inner lagoon]

yep, thats likely what i was going to do

unless a LOT of people suddenly start using my overlay, i shouldnt have to worry about rate limits

thanks for your help

[severe shell]

Yeah! Even decapi that is extremely popular doesn't worry that much with rate limits

But I would always add something that we could know if someone is abusing, for example, getting the account id or the username when doing the request to your website

[inner lagoon]

good call

[severe shell]

I found a lot of people doing requests per second with no need, so I blocked them.

I have an endpoint that people can use to show their Valorant rank in the overlay. And the request is made every other minute. I found people that changed the code to do the request every 10 seconds...

Like, why? The game duration is around 30 minutes, why someone needs to get it updated every 10 seconds?

[inner lagoon]

i just realized something. why cant i use twitch's "Device code grant flow"? that doesnt require me to show a secret to the user. it could all run within the SE overlay, however they would need to visit twitch to authenticate

[severe shell]

That token expires quickly if I'm not mistaken

[inner lagoon]

haha i am now 🙂

[pure drift]

To be fair, DecAPI's caching layer does a lot of heavy lifting since there are a lot of frequent (unnecessary) requests to the same endpoint in a short timespan.
Some data is very easy to cache while still being accurate - such as follow date (for calculating follow length), stream start (for calculating uptime) etc.

At peak times, DecAPI handles around 60 requests per second. Not all of it is to Twitch's API, but if I had forwarded all requests to Twitch without any caching, there'd be some struggling :P

[quick harbor]

Don't know if it's asked before but
Is there a way to read sub from two channels when they are on Twitch shared chat feature

[inner lagoon]

interestingly, someone in portugal using my overlay can still query the twitch api with no oauth key, but the people in the US can't.

i guess this is a good excuse to learn the new widget editor and remake the entire overlay

[inner lagoon]

i asked the twitch api discord about it, and i think the client-id i was using had special permissions. i dont think i ever changed that client id to my own since i started with someone elses code. and they said there used to be "Extension client ids" that did not need tokens but those should have been removed a while ago

oopsies

[severe shell]

Oh, so you were using someone else’s client id? That’s weird

[inner lagoon]

yeah, i had used someone elses code and never changed it apparently

[severe shell]

I saw your message on Twitch API discord, and saw you mentioned you failed to use SE_API to store tokens in the past.
Well, you can try to implement DCF tokens and store there, replacing the old one for the new one.
If you have questions on how to set and retrieve the keys from SE_API (or having any error), just ask here and we can help you

[inner lagoon]

yeah im working on that now. i think i got it to work

i'm just trying to figure out the best way to give the user the link to authenticate

is there a way to add a button field that opens a link?

i'm thinking the best way would be to just have the overlay have a div that prompts them to authenticate if they arent already, then hide the div once authenticated

[severe shell]

No, anchor links or buttons that open new pages don't work on the fields panel.

[hexed stone]

Is there a way to access a users last seen time on a specific channel through StreamElements API?

[severe shell]

Only for the users that are in "User management" table:
https://c4ldas.github.io/streamelements-api/#/operations/Get/:channel/users

[cold creek]

Sorry for my bad english. I want to make a chat widget (custom) which have animation for old chats. When a new chat come , old chats will be pushed up and have a little animation for this process. Could someone tell me what to do? I have no idea about it

https://www.youtube.com/watch?v=AswnOkqYXCE&t=1614s

like this

[severe shell]

Well, how much you know about HTML, CSS and JS?
You can simply get a custom chat from #widget-share and change some code to have the animation you want.

[cold creek]

I only know a few. I have searched but there's nothing I need. Most of them only have entry animation but not animation for old chat.

Like when a new chat come, all old chats move their position to make space for new chat. I want a bit animation for that movement.

[severe shell]

Yeah, because in those widgets, the "old chat" is not in a separated div to be animated. Each new message comes in a div that is appended to the main container.
What I thought it could be a possible "fix": have a separated div for old messages, animate it moving the messages up, so it would leave an empty space. After that animation, replace the empty space with the new message (animating it with the entry animation).

Unfortunately, my CSS skills are the worst.

[potent halo]

I think I answered something like that a few days ago

#dev-chat message
Question above; Details and code below.

[balmy barn]

Hi, is there going to be a MacOS version of SE live?

[severe shell]

There isn't any information about that

[balmy barn]

ah shame! was hoping this was going to move me away from aitum vertical

[icy tusk]

Is there going to be extra chat controls for TikTok? I was literally just forced to end stream bc I had a bot or a troll spamming the N word in my chat. I had no way to mute/block/ban them so I had to kill stream before I got banned

[proud spade]

Soon™️

[vocal gorge]

What is wrong with oauth2/authorize

return redirect('https://api.streamelements.com/oauth2/authorize?' . http_build_query([
            'client_id' => $site_configs['streamelements_client_id'],
            'redirect_uri' => $site_configs['url'] . $site_configs['streamelements_callback'],
            'response_type' => 'code',
            'scope' => "channel:read activities:read",
        ]));

{
  "error": "invalid_request",
  "error_description": "The request is missing a required parameter, includes an invalid parameter value, includes a parameter more than once, or is otherwise malformed."
}

[severe shell]

If the code structure is correct (I don't remember how to do that in PHP), check if your redirect_uri confirm if it matches the one here:
https://api.streamelements.com/oauth2/clients/YOUR_CLIENT_ID

[vocal gorge]

https://streamelements.com/oauth2/authorize worked
https://api.streamelements.com/oauth2/authorize not working
I discovered it by chance

[vocal gorge]

I checked, redirecturi is wrong. I provided it with HTTPS and the www. subdomain, but they wrote it as HTTP instead.

and without subdomain. how can i report it

[severe shell]

Open a ticket and explain that to them

[uneven oxide]

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!

[vocal gorge]

Thank you

[inner lagoon]

so i finally got the twitch device code grant oauth flow working in an SE overlay. i had to add a lot of code for managing if multiple windows are open so they dont fight with eachother by both getting codes from twitch and overwriting eachother. maybe you guys can check it out and help me simplify things 🙂 i probably did some unnecessary or dumb things, but this is my first working attempt

https://streamelements.com/dashboard/overlays/share/67a2fc33198f297d6780aeb8

[sharp sentinel]

Guys I have a question, when creating fields, I saw that we can do:

    "type": "checkbox",
    "label": "Some checkbox"
  }```

Now, What I want to achieve is to give the user the option to have an image for a border of a container or just a regular border of "Xpx" , how should I approach that ? I want to make it more user friendly to edit

I'm using image links btw, not uploads directly. So basically a URL

[severe shell]

Not sure if I understood, but if you want to check the value of the checkbox to decide how the border is going to be, just check the value of obj.detail.fieldData.someCheckbox during onWidgetLoad. When checked, its value is true, otherwise is false.

window.addEventListener("onWidgetLoad", (obj) => {
  const someCheckbox = obj.detail.fieldData.someCheckbox;
  console.log("someCheckbox value:", someCheckbox);

  if(someCheckbox == true){
    // Code for "give an image for a border of a container"
  } else {
    // Code for "just a regular border of 'Xpx'"
  }
})

[sharp sentinel]

I see, so I need to code in javascript and check on widget load, my question was basically have a checkbox, if the user wants a border-image it will display the border-image, if not just display a regular border that the user would input.

Oh wait I figured it out

Since I made a text field where u input the image link, you can just leave that one blank and it will show the regular border, thank you @severe shell anyways! ❤️

[sharp sentinel]

@severe shell I'm sorry for bothering, but is there any way to leave notes in the fields? Or I have to tell the person on a dm ? Sorry for tagging!

[severe shell]

It depends on how big the notes are. You can create a field with type: hidden and the label would be your note, that would show something at a maximum of 24 to 34 characters (depending on uppercase and lowercase).

If you need longer notes, a simple trick is to use type: checkbox. That one accepts longer texts, can confuse users with that checkbox to enable.

Just don't use type: text because that one is terrible for notes

[sharp sentinel]

Ahh I see, wonderfull, thank you!

[severe shell]

As regards the DM thing, that isn't possible

[sharp sentinel]

Oh yeah I was just saying like dm the actual person saying yeah this is for that and leave this blank for x and stuff lol 😛

[sharp sentinel]

@severe shell Hey, the dense guy here asking another question lol! I have an object with keys on my javascript, I want to make a field to easily swap the link containing them but I'm unsure how to approach this, I was thinking of a dropdown for each character ? I'm not really sure though, this is what I mean:

    'eminem': 'https://c.tenor.com/bXdedfgSlSoAAAAd/tenor.gif',
    'deadpool': 'https://c.tenor.com/75pugaOjFG0AAAAd/tenor.gif',
    'trump': 'https://c.tenor.com/I68LhspUdXoAAAAd/tenor.gif'
};```

is there any way to have a field to swap the link of "eminem" or "deadpool" or "trump" ?

[severe shell]

type: dropdown

  "someDropdown": {
    "type": "dropdown",
    "label": "Choose an option:",
    "value": "eminem",
    "options": {
      "eminem": "eminem",
      "deadpool": "deadpool",
      "trump": "trump"
    }
  }

Then, just check the dropdown value and choose your characterImages[someDropdown]

[obtuse isle]

Hmmmm... Do we know by any chance if the realtime websocket emits the client disconnect events by any chance and under what "event" they are?

[sharp sentinel]

Hmm, I see, but how can the user change the link though? May be a dropdown is not the best approach, not sure though. so basically I was thinking of a dropdown because I have a list of characters so the user would just select one from the list and have a input text blow it to change the link

[severe shell]

I think it's a simple socket.on("disconnect", (data) => console.log("Disconnected:", data))

[obtuse isle]

That is for the current client if it gets disconnected from the server. I want to know if any of connected clients disconnected.

aka. I want clients to know between each other that other one disconnected.

[pulsar willow]

anyone know how to enable the tippers message on tts ?

[obtuse isle]

I was thinking about just using beforeunload event on window and just emit something under event:test but I been having spotty experience with that event often not firing stuff it needs to do before website closes.

[severe shell]

Oh, in this case, I'm not sure. By the way, how do you connect clients in the same place so they can see each other?

[obtuse isle]

They all talk via the event:test

In my case its one visible receiver (twitch overlay) many hidden emitters (overlay from youtube channel 1 and youtube channel 2). I want just events to be sure that from some reason connected emitters do not duplicate if by any chance emitter from one source will be "open" multiple times. (I had that happend before)

tldr: I am walking around the "no multstream support in overlays" idiocity.

[severe shell]

If using Overlays:
Go to your alertbox and click on the cog icon for "Tip alert"
Open TTS settings and enable "Enable text-t-speech" checkbox
Choose the TTS voice and save it.

If you are using Elements Editor:
https://www.youtube.com/watch?v=XohZrNBLMAc

[pulsar willow]

i already did but it wont read out the tippers message

[severe shell]

If you want the user to change the link, create a text field for that

[hardy walrus]

Go here then screenshot tipping moderation https://streamelements.com/dashboard/tipping-settings

[severe shell]

If you already did, then it should have worked.

[sharp sentinel]

Yeah I was thinking of creating fields for each character but sounded kinda messy , Iguess is my only option 😛 , thank you ❤️

[severe shell]

Well, everything you need user interaction, you need to create some field. If you want the user to type a URL, you need to give them the option to type the URL, and the text field is the only option.

[sharp sentinel]

Yep, thank you very much you've been a great help!

[pulsar willow]

do i have to add {message} ?

[severe shell]

Nope, just enabling TTS and choosing the voice is enough to the bot read the message. Try to change the voice (Brian, for example) and check if it works.

[celest sable]

@severe shell sorry to ping Caldas, but do you happen to know if there's an api endpoint for this or something planned?

[severe shell]

I don't understand what you're looking exactly. What do you mean by "a way to do what the streamelements overlay does"?

As regards to anything planned, the only things we know are the ones in #announcements. Unfortunately, we've never seen anything related to SE API.

[robust pollen]

I think they are suggesting leveraging the Alert function from StreamElements to pull resub messages and bits messages and such, and them pump it into some AI TTS they are creating.

In which case, you can look at the dev.streamelements website, find the variables and it will show the raw message for each relevant Twitch entry, use that.

Is the dashboard not loading for anyone else? Not getting any errors, just a blank white screen.

[severe shell]

Well, so the best way is using Astro websockets or Realtime socket.io, both will provide notifications with the data needed.

Astro websockets documentation: https://docs.streamelements.com/websockets
Realtime socket.io documentation: https://dev.streamelements.com/docs/api-docs/5a84cc101a9c5-connecting-via-websocket-using-o-auth2

The part on socket.io where it says // Structure as on https://github.com/StreamElements/widgets/blob/master/CustomCode.md#on-event, the correct URL is https://github.com/StreamElements/api-docs/blob/main/docs/Widgets.md#on-event, which doesn't help that much. My suggestion is that you emulate events on Overlay Editor checking the option "Preview LIVE on stream" to check the "nearly" correct structure.

[severe shell]

It is loading fine to me. Try to logout/login, clear the cookies, refresh the page with CTRL + F5 (so it won't use the cache) or open it in another browser.

[robust pollen]

Can't logout, it's an empty page. Cleared cookies and cache already, done Control + R and Control + F5 :/

[severe shell]

https://streamelements.com/logout

[robust pollen]

Thank you. Unusual one, working 🙂

I found the issue. Whenever I load a certain persons profile as editor, it white screens.

But even after logout, same issue.

[severe shell]

Ah okay, if that's the issue, ask them to perform a logout and login as well

It happened to me in the past

[celest sable]

Apologies! I must've not explained myself correctly. When you make an alert using the streamelements overlay maker you can decide for things like variations and the time the alert lasts, I'm wondering if there's a way to know which alert is going to play so I can properly delay when my custom TTS should play

[severe shell]

No, that's not supported on API. The only way is to do a custom widget

OR #dev-chat message

[celest sable]

Thank you for the help to both you and @robust pollen ! I think for myself I could make my own widget but won't solve the issue with other streamers using my TTS. I'll just avoid implementing this for the time being. Thank you again!

[severe shell]

Another option is using Custom CSS for the variations, so you can add your own code for each type of variation

[celest sable]

Oo yeah that's what I was thinking when I said widget, making my own system which would solve my problem but right now I have Rubius and IlloJuan using my service and I don't think they'd feel comfortable moving all their alerts someplace else

I'll hold tightly and hope for an api endpoint

[severe shell]

I wouldn't if I were you... 😦

[celest sable]

Hahaha yeah I don't think it will happen but I'll just avoid adding that feature altogether, none of the alternatives are doing it either so that's good

Can't really expect the team to add a feature that would probably only benefit a few

[candid coral]

Is there a way to know for sure when streaming verticle that they are going to the shorts feed

[potent geyser]

When going live on YouTube, SE multi stream automatically makes YouTube the default output. When going live on Kick, I have to make Kick the main stream in the main settings in OBS. Will the latest Kick / SE integration fix that?

[proud spade]

#community-helpdesk

[nova onyx]

Hello all, i'm currently using another chatbot only for 1-2 commands. I want to complety switch zu SE. Is there a way to build a chat command to show my 5 top cheerers (all time) in such an order: 1. FirstName - 10000 Bits, 2. SecondName - 5000 Bits... with SE as well?

[potent geyser]

Sorry. Thought I deleted this one here

[severe shell]

Not by default, but if you are using some api on the other chatbot, maybe it is possible.

[nova onyx]

Well I don’t want to use the other Chatbot anymore, and when I’m on the go I can’t use it because it has to run on my pc. So there is no way doing that with SE?

[severe shell]

In order to have access to your cheerer list, it would need Twitch authentication. As you are using a local bot, it probably has its own authentication method with Twitch.

Although the SE bot is authenticated with Twitch as well, it doesn’t provide any way to have access to that list to create a command. So, it is not possible by default.
You would need to find an external API for that (I don’t know any).

So, to sum up: it’s not possible with SE, unless you find an external custom API that does that to add it as a command.

[scenic path]

https://dev.streamelements.com/docs/widgets/6707a030af0b9-custom-widget-events , why there is nothing here?

[nova onyx]

Well that’s strange because the informations and top cheered list is available thru my SE dashboard. So it should be an api or access problem, right ?

[severe shell]

That’s normal, not everything from SE is accessible via commands. Even when SE has access to that information internally.

[severe shell]

Because that doesn’t exist

[scenic path]

i wanted to see the api docs for socket connection, but can't find it anywhere. is there any docs available for that?

[severe shell]

#dev-chat message

[dawn onyx]

Where can we make suggestions to the backend to help with streaming?

[dusky hedge]

Hey Im currently storing a value in my custom widget using "SE_API.store" and now Im trying to modify this value from an external script. However, I cant find a way to do it via the API. For example, the endpoint (/kappa/v2/store/) is sadly meant for the store page ):
Am I overlooking something completely obvious?
How could I achieve persistently storing a value and modifying it from anywhere at will?

[weak herald]

Does anyone know why my followers are not showing up on my activity feed?

I am trying to make alerts for when people follow, sub, tip, etc. But when people follow me it is not being recognized by StreamElements.

I have tried connecting/reconnecting everything already

[severe shell]

The route for kvstore is different. It is https://kvstore.streamelements.com/ and it isn't documented.

To list all the entries:

https://kvstore.streamelements.com/v2/channel/ACCOUNT_ID/customWidget
Method: GET
Headers: 
  Accept: application/json
  Authorization: bearer JWT or apikey OVERLAY_TOKEN

To list a single key (just add the name of the key at the end)

https://kvstore.streamelements.com/v2/channel/ACCOUNT_ID/customWidget.KEY_NAME
Method: GET
Headers: 
  Accept: application/json
  Authorization: bearer JWT or apikey OVERLAY_TOKEN

To create/modify a key

https://kvstore.streamelements.com/v2/channel/ACCOUNT_ID
Method: PUT
Headers: 
  Accept: application/json
  Content-type: application/json
  Authorization: bearer JWT or apikey OVERLAY_TOKEN
Body: { "key": "customWidget.KEY_NAME", "value": "YOUR_VALUE" }

[severe shell]

What is your Twitch username?

[lavish osprey]

yo @severe shell can you help me?

[strong falcon]

It is possible to dynamically change alert duration in AlertBox with JavaScript in custom code?

Im currently using ElevenLabs API for AI voices but cant fit AI voice duration with AlertBox duration (because AI voice have diffrent length)

[dusky hedge]

Okay, I can retrieve the value without any problems, but when I make the PUT request, I get a 405 response. I tried the following:

    def set_value(self, value):
        url = f"{self.base_url}/customWidget"
        headers = {
            "Accept": "application/json",
            "Content-type": "application/json",
            "Authorization": f"apikey {self.overlay_token}"
        }
        body = {
            "key": f"customWidget.{self.key_name}",
            "value": value
        }
        response = requests.put(url, headers=headers, json=body)
        if response.status_code == 200:
            logging.info(f"Value set to {value}")
        else:
            logging.error(f"Failed to set value: {response.status_code} - {response.text}")

also tried these versions:

        body = {
            "key": f"customWidget.{self.key_name}",
            "value": {
                "value": value
            }
        }

    body = {
            "key": f"customWidget.{self.key_name}",
            "value": f'{value}'
        }

and many other things like only the key_name without the "customWidget." etc but I keep getting the 405 response with no further response.

Nevertheless thanks for the help so far (:

[severe shell]

Oh, sorry, the PUT endpoint doesn't have customWidget in it, my bad.
The correct URI is https://kvstore.streamelements.com/v2/channel/ACCOUNT_ID. I edited the previous message and fixed it

[nova pasture]

using the socket api route how do I create a community gift sub?

{
"event": "event:test",
"data": {
"listener": "subscriber-latest",
"event": {
"amount": 1,
"name": "MrSim",
"sender": "MrGifter",
"gifted": true
}
}
}

this is the body for a single gifted sub

[hardy walrus]

In the context of doing this via the editor you would specify the amount of 2 minimum as community gifts with a single gift requirement would repeat the alert for each person receiving a sub (aka 50 subs would return 50 consecutive alerts)

As far as your question: No idea what it'd be.

[nova pasture]

what about something like this

I'm testing the endpoint using postman

I'm checking out this part of the docs
https://dev.streamelements.com/docs/api-docs/e93446cffb4dd-channel-socket

[hardy walrus]

That would indeed be the community gift variation with the amount at least set to 2.

I "might" have something to help that but I'd need to go digging for that in my streamdeck settings.

You'd actually wanna change it to bulkGifted in the last entry of that body.

[nova pasture]

this:
{
"event": "event:test",
"data": {
"listener": "subscriber-latest",
"event": {
"amount": 2,
"sender": "MrGifter",
"gifted": true
}
}
}
does this:

[nova pasture]

oh ok

yoooo it works

where did you find this in the docs??

[hardy walrus]

I actually have "presets" using a 3rd party plugin with the streamdeck that simulates API calls testing alert emulations.

last pinned message in here for those presets

[nova pasture]

https://github.com/tehbasshunter/SE-Misc/tree/main/Templates

yeah

bruh, I didn't see the sub bomb.ninja lol

why isn't any of this listed in the official docs?

[hardy walrus]

"Complicated".

[nova pasture]

fair enough

[hardy walrus]

The reason lots of other things aren't listed yet pretty much.

[nova pasture]

huh

at least the discord exists for questions

[hardy walrus]

[nova pasture]

is there anyway I can have the events also list in my activity?

[hardy walrus]

I'm going to say "no" but pinging @severe shell since he'd know better than me.

[severe shell]

I don’t remember how to do that via socket route (it’s been some time since I used it). But using POST activities you can send an event and it will list in activity feed and generate the alert like a real one.

https://c4ldas.github.io/streamelements-api/#/operations/Post/activities/:channel

[nova pasture]

that works displaying the bulk gifts in the activity feed, but for some reason doesn't play in the alertbox

even when I hit replay it doesn't play it

ok now it works when I replay it, just not when it's initially sent

strangly I have to refresh my activity for it to show too

I assume since it isn't socket lol

[severe shell]

That’s not the expected behaviour. Perform a logout and login from Streamelements and try it again
https://streamelements.com/logout

[upper lodge]

yeh im having a similar problem as @nova pasture alerts stopped working for no reason, not even the preview works on the SE website.

unlike him im not using any third party tools. just the SE website and overlay link on OBS.

if i press replay on the activity feed it does not play the alert, then i tried to go to the wesite to check the overlay, and on the overlay edit page, if i trigger an emulation for an alert, it does nothing.

this has to be a backend problem

[severe shell]

#submit-support-ticket

[tawny raptor]

Having the same issue, really weird,
maybe because of some recent update?
My alerts worked just fine a few days ago and suddenly some of them only play for half a second and get skipped it seems

please ping me if there are any news related to that

[severe shell]

This is not the place... If you are having issues, you can ask for help on #community-helpdesk or open a ticket

[nova pasture]

I relogged and now the activity feed updates but the alert doesn't play

even on obs

still just the socket endpoint that plays the alert

I wonder what could be the reason

if there truly is no solution I suppose I could make two calls, one on the socket endpoint and one on the activity endpoint

[severe shell]

Yeah, unfortunately, the official documentation is not good. The page I sent is a collection of what I was able to get and document, but it is not official.
I tested on my side and the community gift in my notes doesn't seem to be 100% correct to create the alert (or it was and something was modified since my notes).

[nova pasture]

and I retry on the calls that fail

[severe shell]

I will check that in the future and update my own documentation.
If you still want to check the socket endpoint, open an overlay, open the devTools, go to Network > WS and check the socket.io connection. Emulate an alert with the "LIVE preview enabled" and check the events in there. Then you can try to mimic them on the socket endpoint

[nova pasture]

interestingly, when I make a call using the activity endpoint it does actually send data through the socket.io WS

how the socket endpoint call compares

[severe shell]

Yes, the activities endpoint is the real one that Streamelements creates the notification and activity feed info

[nova pasture]

so even when making a call on the socket endpoint, SE just makes a seperate activity call?

I'm gonna try sending tips a different body template and see if it's just the community gifts that's not working

[severe shell]

AFAIK, the activities endpoint will make the socket request for overlay alerts and the activity feed.

So probably just need to work on the communityGiftPurchase structure

[nova pasture]

✅ follow works
✅ subscriber works, but you're missing a comma after activityGroup
✅ cheer works
✅ raid works
❌ charityCampaignDonation doesn't work
❌ host doesn't work
✅ yt subscriber works
❌ yt member doesn't work
❌ yt superchat doesn't work
✅ SE purchase works
❌ Redemption doesn't work

hold on I didn't have charity donations enabled in the editor

[severe shell]

CharityCampaignDonation will only work if you enable that in the alertbox (it is disabled by default)
Host doesn't exist anymore, so it will not alert.
Youtube will only work if you are on Youtube account
Redemption is a separated alertbox

[nova pasture]

charity donations don't show up in my activity and don't play even after enabling it in the editor

[severe shell]

Yeah, not sure why. Something might have been changed since then.

[nova pasture]

that's a shame, I suppose I can do what I said earlier and make two calls. Maybe I can modify the subscriber template since it works for saying someone gifted, just not how many gifted

[severe shell]

I found the issue with charityCampaignDonation. It misses the currency. So, for a EUR 3 donated by MrSim, the body would be:

{
  "type": "charityCampaignDonation",
  "provider": "twitch",
  "data": {
    "amount": 3, // value
    "currency": "EUR", // or any other currency
    "username": "mrsim",
    "displayName": "MrSim", // optional
    "avatar": "https://link/to/image.png" // optional
  }
}

I will update the page to reflect that.
I wanted to check the communityGift thing, but I'm not willing to give Twitch money at the moment.

[nova pasture]

lol fair enough

[vale whale]

Made a small proof of concept Python app to alter the config not visible in OBS, going to make an OBS plugin this week to do the same. Will throw code over to github if anyone wants to use it etc etc.... (assuming this is ok to post here).

[supple dove]

Is it possible to create a page on my website with the store items from streamelements?

[shut notch]

How do I make me, the broadcaster a bot on my channel. I used to be able to do so but decided against it and let stream elements do the botting. Now that I would like to make myself be able to use butt commands, there isn't an option on the menu anymore. Is there anything I can do to fix this?

[severe shell]

Open a ticket and ask to enable the option for custom bot name.

[uneven oxide]

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!

[wheat palm]

if you want to have subgift alert for multiple subs you can use mock:1

it would display in activity list and play the alert

there is no other way to have that afaik

I was working on a bridge that replicates kick events in stream elements and I couldn't figure out how to do it via activities endpoint. Then I decided to send it as a mock and nobody really cared.

fun story: at twcon rotterdam i talked to one of the co-founders of se and i begged him to have a better docs for devs etc. 😛 it was a great short talk and someone from SE team was supposed to reach me about api docs that i never recieved but unfort. no one reached (yet ^^) 😄

[severe shell]

It plays the alert and it shows on activity feed indeed, but it vanishes from AF if refreshed. Probably the best of both worlds is running the POST for /activities endpoint and the /mock for the alert.

[severe shell]

We've been asking that for soooo long (years), glad you also asked that, maybe with more people, they can understand how important it is.
I even created my own documentation for their API and sent to them. https://github.com/c4ldas/streamelements-api

[wheat palm]

The only reason 3rd party SE developers keep developing is because of you and your awesomeness.

❤️

[nova pasture]

are you talking about the socket endpoint with "event": "mock:1" in the body?

instead of "event": "event:test"

[chilly portal]

Hello, I am trying to build a widget with a countdown that can be extended to a certain limit, and I wanted to use the SE_API to store the updated time, in case OBS crashes.

let initialTargetTime = new Date();
 initialTargetTime.setHours(21, 0, 0, 0); // 8:00 PM Start
async function saveTargetTime() {
            if (typeof SE_API !== "undefined" && SE_API.store) {
                try {
                    await SE_API.store.set('DCcountdownTargetTime', {"time":targetTime.getTime()});
                } catch (error) {
                }
            } 
        }
 async function loadStoredTime() {
            if (typeof SE_API !== "undefined" && SE_API.store) {
                try {
                    let value = await SE_API.store.get('DCcountdownTargetTime');
                    if (value && !isNaN(parseInt(value))) {
                        targetTime = new Date(parseInt(value));
                    } else {
                        resetDailyCountdown();
                    }
                } catch (error) {
                    resetDailyCountdown();
                }
            } else {
                resetDailyCountdown();
            }
        }

When I try to debug in my console, it erroring out on SE_API is not defined, Am I missing something?

[potent halo]

FYI using three backticks instead of one makes it more readable when multiline. Also you can define syntax highlighting this way.
For Example this:
```js
function bruh() {
[...]
}
```
Would render like this:

function bruh() {
  [...]
}

That being said..
You're storing a json and load it as an integer?

[chilly portal]

That was the furthest I could decipher form the documentation, but even when when I used SE_API.store.set('DCcountdownTargetTime':targetTime.getTime()); it cam up undefined

[potent halo]

Personally I'd cut down on that. {"time":targetTime.getTime()} to just targetTime.getTime()

No need to have 2 keys

also don't know if storing json is even supported

[severe shell]

It is 🙂

[potent halo]

okay then nvm :)

[chilly portal]

because of the 'must", I was starting to think it was an absolute requirement to send json 😅

[red quiver]

I've seen a lot of people ask about this over the years but could never find an answer.
How does one get started with stream pets? Not Kappamon, the type you can fully customize.
I don't know code, but I can do all the visuals myself. I'm willing to learn a bit of code, I just have no clue how to get started

[severe shell]

Never seen that type of question around here, but the only one I know is PP (Personal Pet), not sure if that's what you're looking for #widget-share message

[red quiver]

It's the closest thing I've been able to find, but I think it wasn't entirely finished from what I last saw? Maybe this one is more updated
I see people selling them on etsy and such, but I'm surprised more people haven't figured it out, or I guess the secret is too tight-lipped beyond what you linked haha

[analog kelp]

Stream Avatars?

[red quiver]

It's different than stream avatars, those are moreso just to show the viewers and occasionally their chat mesaage
I'm thinking of something where it shows the follows/subs etc

[analog kelp]

hrrm

[red quiver]

https://www.etsy.com/listing/1357923190/pink-bunny-stream-pet-cute-animated

This kind of widget

[tough quest]

Hey guys, I have a question. I made a custom widget on SE under "Overlays." How do I create it in "Elements" now? I only see a JSON option there. I'm really confused and not sure how to transfer my HTML, CSS, JS, and JSON to the Elements section.

[severe shell]

You don't transfer the data between each one, they are not compatible.
They are totally different, and you would need to recreate something from scratch, what you use on Overlays will not work on Elements.

[tough quest]

ah...that's.....weird lol

[severe shell]

Agree

[hardy walrus]

Don't feel bad.

We're still trying to get the "How in the hell does this work" explanation with it internally.

[tough quest]

Another question—Is there any way to show the emulation of widgets in OBS? When an event is emulated in SE, it doesn’t show in OBS. I understand that it will work when a real event happens, but I want to record the emulation in OBS. Is there any workaround for this?

[severe shell]

Check the option "Preview LIVE on stream"

[hardy walrus]

Do you have a streamdeck?

[tough quest]

I did try that, but for some reason, it didn’t work. do i need to be live in order for that to work?

[severe shell]

Nope

[hardy walrus]

Was the bit at the top enabled?

[tough quest]

sorry?

[hardy walrus]

Preview live on stream

That is needed if you intend to view it via OBS.

[tough quest]

i did enabled it, Didnt worked

[severe shell]

It should have worked. Try to logout and login. Also remove the overlay from your OBS, copy the URL again and test it one more time.

I've just tried here on my end and it is working as expected

[uneven oxide]

The default resolution for StreamElements overlays (theme and custom) is 1920x1080. Please add them in OBS at their full resolution and use CTRL+F to fit to screen if necessary. You can then downscale your stream in OBS settings > Video if you'd like https://i.imgur.com/6bWXxjR.png

[hardy walrus]

That along with control audio via OBS would determine if audio isn't getting caught by you

[tough quest]

sadly its still not working for me. I tried loggin out and in, add a new source in obs, also added SE tip goal to test along with my custom goal widget.

[severe shell]

Goal widget won't work. The value will not be added to SE data to update the goal, that is expected. If the values changed like real events, emulation would mess with the goals really hard.

[tough quest]

oh ok got it

thanks

So on which event it does work?

[severe shell]

Alerts, basically

[lost sage]

how long do oauth application review usually take? no rush, just wondering!

[severe shell]

We don't have that information, unfortunately. I would open a ticket to ask that

[uneven oxide]

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!

[severe shell]

And let us know 😄

[lost sage]

ah ok! thanks

[smoky cloak]

Can I make a suggestion for an addition for the SEmultistreaming? Can the ability to stream the feed from OBS out to 2 separate Twitch channels at the same time using RTMP protocols be included. I have done this before using an obsproject plugin that just needed the twitch rtmp url and the streamkey from the other twitch channel.

[severe shell]

That won't be seen by the staff... Maybe you should add the suggestion to the ideas board:
https://strms.net/ideas

[smoky cloak]

thanks @severe shell

[plain anvil]

When will Tiktok and Kick be added to the multichat?

[severe shell]

Kick integration was announced 10 days ago, #announcements message
Tiktok, no idea. By the way, SE never informs a date when a specific feature will happen.

[inland tundra]

Help! I can't give the chatbot a unique name.

[uneven oxide]

@inland tundra ⤵️

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!

[light summit]

Hi, does anyone know how I can share an Overlay so that another user can access and edit it?

I've seen that some Widget creators use some kind of executable file that takes you directly to the Overlay

[severe shell]

#dev-chat message

[light summit]

Thank you so much

[spring obsidian]

hello, anyone know how to Stream to Twitch and YouTube? And Widgets for both data?

[rugged citrus]

Are there any plans to add age restrictions to the TikTok stream info? I play some games that may not be suitable for all audiences, mostly lightgun arcades with a Sinden lightgun controller, and I don’t wish to get strikes or banned.

[hardy walrus]

That's something we're waiting from them I think. Not sure what we can/will be able to do.

[queen field]

im having this weird issue where my alert box for follows and whatnot doesnt show up when im live. but works when i test it in obs. anyone have an idea?

[meager dew]

Not sure if I should ask here or in creative channel...
I'm having trouble getting a custom font to work on my alerts that use custom css. I've tried adding a src link and that didn't work.

[upper lodge]

Hey, SE devs, is there any plans to have an option to have the follows, subs and tips from all platforms combined in 1 overlay?

so we can have just 1 label showing the name of the last follow, sub, tip.. regardless of platform.

[median raptor]

Sugestion - As the multi chat progress's can I Suggest a audio notification when new chats come up. It's almost a tool for people with disabilities but more of a hey I didn't miss a chat

[severe shell]

SE devs do not post here, this channel is community-driven.

Unfortunately

[bleak fiber]

Hey Everyone! Is there a tool/plug in/tracker (I don’t know the technical name) where it tracks how many times I play with viewers individually that works with discord?, like for example, I play Fortnite squads, and I wanna rotate with my community evenly

[nova onyx]

Quick question about the Subathon Widget. I'm planning my first subathon on friday and testing the widget. Is there a way to pause the timer but letting events still trigger them so time can be added for example by subs but it wont count down as long as i am a sleep for example?

[stable ruin]

Sorry guys but I need a little help, I don't know anything about programming, I asked chatgpt to create a custom twitch chat code and I really liked the result, but I believe that chatgpt configured it the wrong way, because there is a "fixed" message and when I send a message in the twitch chat it doesn't appear in this widget

Does anyone know what to change to fix this?

[severe shell]

This is a Streamlabs widget, you should ask in their Discord

When you ask there, you need to show the JS part especially.

[stable ruin]

So sorry, but would it be possible to make this model in streamelements?

Same problem on streamelements

[severe shell]

Yes, it is possible.

[severe shell]

That's not a problem, the widget is showing what is written in HTML. If you don't want that text, just remove them

I wouldn't use Chat GPT for that, as the documentation for Streamelements is not that good, unfortunately, and Chat GPT doesn't have anything to use as a base.

But if you don't know anything about coding, the best option would be getting one of the chat widgets in #widget-share instead.

[stable ruin]

Got it, thank you very much @severe shell

[fair orchid]

hello

[keen pulsar]

Is there anyway to get se.live to stream to Facebook also. I see that it is no longer supported but wondering why? I like the convenience of everything else this offers, being able to multistream. Just wish I could get facebook also

[severe shell]

Probably using custom rtmp. But you should ask that in #tech-talk instead, they will know better about it.

[thorn steeple]

every time I'm going to simulate this is happening

I tried clearing my browser cache it doesn't seem to have helped

anyone know how I'd fix it? I'm pretty sure I've got my code ready but without being able to simulate I can't test it

[thorn steeple]

figured it out (the issue was I was trying to simulate before saving & publising, so even though my changes were "saved" in that I could close and open the widget with those changes, they needed to be saved and then published from the top right)

moved

[severe shell]

I would recommend to ask in #elements-editor-widgets20, most of people here don't use Elements, but only Overlays.

[thorn steeple]

ah okay ty

I didn't have that channel in my list so completely missed it!

[iron gull]

Hey!
When creating a command with the StreamElements bot, what is the difference between $(customapi.<url>) and $(customapi <url>)?
I know the documentation shows $(customapi <url>) but both seem to work. Is $(customapi.<url>) deprecated?

[severe shell]

Both will work the same way. But I personally prefer $(customapi.URL)... I've seen cases where $(customapi URL) would show the URL in the command list, don't know if it was fixed.

[daring jackal]

How do I get the channel.alias via API? I want the alias to be able to access another StreamElements API

[severe shell]

It is /channels/me https://c4ldas.github.io/streamelements-api/#/operations/Get/me

Which endpoint do you need the alias, exactly? I don't remember any of them. Most of them use account id.

[daring jackal]

I think that for the idea I had, this wouldn't work

about the api, it's watchtime, I'm making a kind of command that currently takes the current channel and accesses the top, but if the channel alias is different, it can't

an example is the twitch channel "v1tor" which, when trying to access, goes to a yt channel, which is why you would need the alias

I don't know if I explained it very well

[severe shell]

Yeah, I got it. Well, if I understood it correctly, you can do the following:

• Get the ${channel.alias} from the chat command and send it to your server.

• Then, you make a GET request to /channels/:channel using the alias as the channel name to get the Account ID.
  https://c4ldas.github.io/streamelements-api/#/operations/Get/channels/:channel

• With the Account ID, you can get the watchtime using /points/:channel/watchtime
  https://c4ldas.github.io/streamelements-api/#/operations/Get/points/:channel/watchtime

After that you can return the watchtime users.

Both endpoints are open, don't require authorization

[daring jackal]

perfect

One more question, instead of {channel} could it be the channel ID of an account or just the name/alias? I think it would be easier

[severe shell]

You mean this endpoint? https://c4ldas.github.io/streamelements-api/#/operations/Get/channels/:channel
You can use the channel ID or the alias, both will work

You can get the channel id from ${channel.id} from the chat and skip one of the requests, by the way

[daring jackal]

No, no, in this

[severe shell]

You use the channel Id

If you look below, in "Path Parameters", it says channel is a guid - channel id

[daring jackal]

I hadn't seen that, sorry

but for example: https://api.streamelements.com/kappa/v2/channels/v1tor returns a YouTube channel "V1tor" but I wanted the Twitch channel "V1tor", is it possible to make something to work just for Twitch or just knowing the Alias ​​itself?

Because I would need the alias to get the channel ID of the right channel (Twitch), right?

[severe shell]

It isn't possible to work only for a specific platform. I'm trying to understand your workflow, so I can help you to point the correct endpoints.

You are creating a chat command, or another thing? How would be the steps you are thinking?

[daring jackal]

basically, I made an api by joining other apis, one of them being StreamElements

Basically my twitch bot (not streamelements)
I would use this api, but for example if I use !teste Canal as !teste v1tor it would result in the YouTube channel, not the Twitch one (in this case)

I just wanted to know if it was possible to work just for Twitch, but since it isn't, I think I already have an idea, I'll do some workarounds

[hardy walrus]

I think part of the problem is due to having multiple accounts connected for the same name and getting the username-1234 for one.

[daring jackal]

but anyway, thank you very much c4ldas , it helped a lot ❤️

[daring jackal]

literally this, it would be nice to have an API that based on the name results in all alias results, e.g. [{"YouTube": "test"}, {"Twitch": "test-1234"},
{"Fb": "Test-321"}] and so on, but I have no idea how difficult that would be

[severe shell]

Ahhh, your own bot, got it... Yeah, unfortunately, you won't be able to get the Streamelements channel alias this way.

[severe shell]

Yeah, that doesn't exist 😦

[runic hawk]

Is anyone around to help me with something please?

I have an issue which I can't seem to resolve no matter how hard / what I try.

[proud spade]

#general-chat was fine, #community-helpdesk would have been better. Please stop spamming the discord with your question.

[runic hawk]

Sorry

[analog kelp]

So if I wanted to take the javascript for https://widgets.streamelements.com/element/subathon-widget and fix it so my viewers stopped getting ripped off... do I end up needing to host the updated javascript somewhere myself? I'm not super familiar with the widget ecosystem, but I'm not seeing an obvious way to update the code within the SE site.

[brisk pumice]

hey guys, how to get message count from streamelements

[last agate]

How did you get the missing endpoints? I've managed to get some counter API, that is not documented, but that's it. By the way, thank you.

[severe shell]

I spent too much time (not proud of that) on Network tab on browser devTools while on Streamelements dashboard, so I could take note of every request to https://api.streamelements.com/kappa/{v2|v3}.
And others I just use trial and error.

[last agate]

Oh! Why did I not come up with that, when I did the exact same thing for Twitch.

By the way paging fields are integer and not string.

prevPage: string or null
nextPage: string or null

However I have not found a query param to actually query the next page. I still have to use limit/offset.

[severe shell]

Which endpoint is that with prevPage and nextPage?

[last agate]

ListTips.

GET https://api.streamelements.com/kappa/v2/tips/{channel}

[severe shell]

There is no prevPage or nextPage in that endpoint. In fact, SE doesn't use prevPage or nextPage in their endpoints, they have limitand offset for that.

[last agate]

Called it right now from Postman, you can see flieds in the response.

[severe shell]

Ahh okay, from the response, great! Fixed, thanks!

[wintry wolf]

hey everyone,

can i set the volume from an overlay through an iframe?

[paper jetty]

Have there been any thoughts or developments with adding a variable that shows subscribers for each stream? For example, I know there is a total subs overall but if streamers could show subscribers for this specific stream, that would be good.

That may be confusing still so like if I said !substoday, it would show subscribers gained from this stream only

[oak plank]

https://api.streamelements.com/kappa/v2/tips/:channel
https://widgets.streamelements.com/widgets/editor/:channel/XXXXXXXX-xxxx-xxxx-xxxx-XXXXXXXX
XXXXXXXX-xxxx-xxxx-xxxx-XXXXXXXX (id widget)

Need POST /:channel + /:widget
https://api.streamelements.com/kappa/v2/tips/:channel/:widget
This is necessary to use multiple widget designs, but we don't have this option, due to the POST API limitation at the moment it's tips/:channel, but we need /tips/:channel/:widget

[thorn steeple]

You could probably make such a variable yourself 🤔

[paper jetty]

I’m not that talented

[fleet minnow]

much love

[uneven dove]

hello, I have a basic CSS question, is this where I'd ask it?

I'm having issues removing the : from usernames in the chat widget and the usual

.colon {
display: none;
}

isn't working

I'm very new at this and I havn't been able to hunt why this CSS works in other chat widgets external from StreamElements but not in the CSS editor in streamelements

[severe shell]

If you are seeing the CSS Editor, you are not using the default chat widget, but a custom widget instead. That .colon CSS class is from the default SE chat widget.
You will need to check in the code what CSS class is wrapping the colons (if any). Or you can also just remove the colon from the code itself.

[uneven dove]

Appologies, I'll break down what I did

I dumped the information from the StreamElements Github into a custom widget, then put my own formatting CSS into it

Again, the colon is the only thing defying me right now

Specifically this one for HTML, CSS, Fields, and JavaScript
https://github.com/StreamElements/widgets/tree/master/CustomChat

I do remember I had to re-learn what some of the defined classes were so it makes sense .colon might not be in this one

[severe shell]

Ok, the simplest way is just removing the colon itself on the code. On the JS, go to line 100 and remove the + ":", so it will look like it:

let username = data.displayName;

[uneven dove]

Ah! Thank you, I'll try that now

[severe shell]

Let me know if that works for you 🙂

[uneven dove]

That did it! Thank you, this was the last thing I just couldn't solve with tutorials.

And that's why

It makes sense that it was hidden in the Javascript, in hindsight

[nova pasture]

does the stream elements api have a chat endpoint, so that I can send chats to their multi chat overlay/dock @severe shell

[gleaming parcel]

Does anyone have an example of water animation code like this?

[pearl crypt]

Is there a way to use a variable in my command which accepts whole sentences?

[severe shell]

Probably it is using ai variable, so you should point to something like this:
${sender}, ${ai $(1:)}

[severe shell]

The sentence can be captured using ${A:B}, where A is the initial word position and B the ending word position you want to capture. If you want the whole sentence, you can use ${1:}.
That means it will capture the word in the position 1 (what comes after the command) until the last one.

Let's say someone types in the chat:
!command Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum

If your command is ${1:2}, the result will be:
Lorem ipsum

For ${1:3}, this is the result:
Lorem ipsum dolor

Using ${0:1}, you even get the command:
!command Lorem

For the whole sentence, you can use${1:}:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum

You can use any number you want.

[pearl crypt]

massive thanks for this i search a lot in the documentations but didnt find anything about this.

[severe shell]

Yeah, the variable is called $(args)... It is not clear indeed, especially if you aren't familiar with those terms:
https://docs.streamelements.com/chatbot/variables/args

[jovial vessel]

Bro please please I'm not a dev so can you please tell me what should I type in streamelements for this ai variable
And what's quarry

[severe shell]

• Go to your SE dashboard > Chatbot > Chat commands.
• Click on "Custom commands" > Add new command
• In "Command name", you type the command you want to create (in the example you sent the command was neha, but it can be anything, it's up to you)
• In "Response type", you type what I told you ${sender}, ${ai $(1:)}
• Click on "Save" and it's done.

[jovial vessel]

Thaanks bro 🫂

I typed this in response ${sender}, ${ai $(1:)}

Ok ?

[severe shell]

Yes!

[jovial vessel]

Ok sir

[jovial vessel]

@severe shell bro love you it worked I checked

[uneven dove]

Hello! I'm back ;_;

I'm trying to get the "as on twitch" colour option to work in the Githhub chatbox widget found here:
https://github.com/StreamElements/widgets/tree/master/CustomChat

but I've discovered that users with no custom user color selected do not appear in the chatbox when this option is selected. Their messages do not display

Is there a way to fix this issue? I'm not proficient enough to troubleshoot this issue but I suspect the issue is the JS line 102 which governs the "as on twitch" option

const color = data.displayColor !== "" ? data.displayColor : "#" + (md5(username).slice(26));

I've seen other chatboxes handle this so I'm not sure what wheel needs kicked to fix it

I can kind of fix this by changing the line to
const color = data.displayColor;

The chat will show up properly then but names with no set name colours show as white instead of the what the twitch chat colour shows

[severe shell]

"As on Twitch" means the colour the user choose on Twitch. However, if the user doesn't have a colour set, Twitch will show a random colour on the live chat (but that information is not sent to StreamElements). What the widget is supposed to do is choose a random colour for the user.
However, that widget needs a fix on the HTML part to work. Due to some (inexplicably) changes on Overlays, you now need to add https: on the scripts urls.
So change the HTML part to:

<script src="https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/2.12.0/js/md5.min.js"></script>
<div class="main-container"></div>

That should make the messages appear again with a random colour.

[uneven dove]

Huh!

Interesting

I would never of found that, thank you

That did it! Appreciated

[potent halo]

Fun fact.. the color is chosen at random on the client side.
Meaning of you refresh the page the user has a different color. Therefore everyone that sees this person has a different color for them on their side.
Which also means sending this info is impossible.
The way I did it some time ago was refreshing multiple times and noting down the color each time. Then choose randomly between them. It'll line up at least some times

[crude osprey]

can anyone help me get started wit hthe AI Game highlighter. I'd love to test it out

[hardy walrus]

Not sure what thing you're talking about

[grave parrot]

Does anyone know how to create a widget for a combined total sub count? (YouTube & Twitch)

[dark raptor]

Not sure if this is the right place for this, but FYI, the 'biblethump' emote has been removed from twitch, so the !slots command in streamelements needs to be updated with something else.

[sharp sentinel]

Hey guys, is there any way to get the profile picture from a chatter? Or from the data when someone subs/tips/etc ?

[slate pollen]

not sure if this is the place to ask but- would it be possible to add more animations to element overlays in the future

I want to use them more bc I liek the customization but I dont like being limited to either fade or slide in when I'd prefer a bounce animation

[crimson matrix]

Hello!
Working on making a norwegian donation system integrating with SE. Cant find anything about posting custom tip sound over the api? Are there a endpoint for sending custom alerts that is not a "tip"?

[viscid matrix]

    "subscriber-total": {
        "count": 0 // Startwert
    }
};

let subscriptionGoal = 20; // Zielanzahl der Abonnenten
let currentSubs = data["subscriber-total"]["count"]; // Aktuelle Anzahl der Abonnenten

function updateUI() {
    const filledPercentage = (currentSubs / subscriptionGoal) * 100;
    document.getElementById('filled-bar').style.width = filledPercentage + '%'; // Aktualisiere die Breite der gefüllten Bar
    document.getElementById('subCount').innerText = currentSubs.toLocaleString(); // Aktualisiere die aktuelle Abonnentenzahl
}

function resetCounts() {
    currentSubs = 0; // Setze die aktuelle Abonnentenzahl auf 0
    data["subscriber-total"]["count"] = 0; // Setze die Abonnentenzahl in den Daten auf 0
    updateUI(); // Aktualisiere die UI
}

window.addEventListener('onWidgetLoad', function (obj) {
    // Setze die Abonnentenzahl von StreamElements
    data["subscriber-total"]["count"] = obj.detail.subscriberCount || 0; // Nutze 0 als Fallback
    currentSubs = obj.detail.subscriberCount; // Setze currentSubs auf die aktuelle Anzahl
    updateUI(); // Aktualisiere die UI
});

window.addEventListener('onEventReceived', function (obj) {
    if (!obj.detail.event) {
        return;
    }

    const listener = obj.detail.listener.split("-")[0];

    if (listener === 'subscriber' || listener === 'resub') {
        data["subscriber-total"]["count"] += 1; // Erhöhe die Anzahl der Abonnenten
        currentSubs = data["subscriber-total"]["count"]; // Setze currentSubs auf die neue Anzahl
        updateUI(); // Aktualisiere die UI
    }
});

// Optional: Event-Listener für den Reset-Button
document.getElementById('resetButton').addEventListener('click', function() {
    resetCounts(); // Rufe die Reset-Funktion auf
});```

Can someone help, it updates correct if a new sub comes in but it should say 32 not 0, i canˋt get the api info to be read correctly

[severe shell]

If you want to get the "Subscription goal progress" (or goals in general), the best option is to do it via "onSessionUpdate" instead of "onEventReceived", so you don't need to calculate anything (except your progress bar).
Load the initial progress via "onWidgetLoad". If the key doesn't exist, show 0 instead (this happens when the goal is reset):

window.addEventListener('onWidgetLoad', function (obj) {
  // Check the browser console
  console.log("Current subscriber goal progress:", obj.detail.session.data["subscriber-goal"].amount || 0);
});

Then, when any session update occurs, it will read the subscriber-goal value:

window.addEventListener('onSessionUpdate', function (obj) {
  // Check the browser console
  console.log("New subscriber goal progress:", obj.detail.session["subscriber-goal"].amount);
});

OBS: If you pay attention, the location of the session data is different in onWidgetLoad and onSessionUpdate.

By the way, when you emulate, the value won't be updated, but it will work with real events.

[viscid matrix]

I am going to try it

Thank u

[mint wyvern]

here is a pen that resemble your wave : https://codepen.io/giorgioGTelian/pen/PoLXdXN

[gleaming parcel]

thank you sir🙏, you is the best🥰

[grave parrot]

Do any developers think they’d be able to create a custom widget that would combine total sub counts together from twitch & YouTube?

[blissful coyote]

are you still having issues with this? Tried to reach out via DM so one of our devs could get some more information and possibly troubleshoot with you

[strong falcon]

I found a solution to this problem but this error is repeated regularly and the easiest solution to this error is click session data in overlay and instant click save without changing anything and error gone for a while

[jaunty rune]

Hi, is there anywhere that the event object structure is explained? I checked the links on the chat description and I couldn't find it. I'm sort of mostly confused as to why a subscriber event has "items", but it'd be a great help for everything

[swift dome]

Is there a way to set up an alert specifically for anonymous gifted or anonymous community gifted subs?

[severe shell]

Subscriber events don't have "items", the thing is that you are using emulated events, which just to create a notification example. If you want to have the event object closer to real ones, check the option "Preview LIVE on Stream".

Unfortunately, SE doesn't have the events object structure documented completely. I mean, there is this page, but it doesn't cover everything: https://docs.streamelements.com/overlays/custom-widget-events

[jaunty rune]

Alright, thank you very much.

[gleaming parcel]

anyone know, eventlistener for bits in stream element ?

[severe shell]

cheer-latest
https://docs.streamelements.com/overlays/custom-widget-events#on-event

[gleaming parcel]

oh cheer latest is the same as bits on twitch? does that mean for example if someone gives bits on twitch it will be detected in the stream element called cheer latest?

[severe shell]

Exactly, cheer and bits are the same thing, just two different ways to call it. Cheer is the action of sending bits, basically.
https://help.twitch.tv/s/article/cheering-for-partners-affiliates?language=en_US

[gleaming parcel]

okay thank you sir, you are the best

[torn rivet]

Hi there! I would like to work on custom widgets locally, outside of the StreamElements overlay editor. This is what I have done so far:

Fetched the fields.json into script.js.
Mocked the events: "onWidgetLoad" and "onEventReceived".

The next thing I would like to implement is passing fields data into styles.css. But as far as I understand, the StreamElements overlay editor has a templating syntax that allows access to fields data via "{{ }}" placeholders.

At this point, I realise that I need to refactor the CSS to work locally and then refactor it again to be compatible with the StreamElements editor. It's a headache.

Do you see any other solutions?
How do you work on custom widgets locally?

[hardy walrus]

Pinned messages with my localdev repo.

[torn rivet]

Thank you for reply! So if styles require accessing .json values in .css it's better just to work within StreamElements editor? Due to issue I mentioned earlier

[hardy walrus]

I only uploaded that to a more visible place than here and I got no clue.

I big dumb dumb with API shit.

[vast heron]

I am trying to make a custom widget chat box for my stream so that serybot responses in the overlay for things like good bot and capyfacts, whilst being shown in chat, will not be shown in the chat overlay box onn screen, whilst also adding some other fun customisation. Try as I might I can't get this to work. The background shows up but twitch chat does not. I'm not sure if there is an easy way to do this, but if anyone has an ideas I'd be more then grateful! Thank you. Tbh I'm not sure if this can be done or if there is an easy way?

Sorry not 100% sure where to post this or get help

[clear geyser]

Hello! For some reason, the fields don't show anymore — anyone know how to fix this issue?

[potent halo]

Looks like the editor itself isn't loading.
I'd look in the console, if there are any related errors or look in the devtools networking tab to see if anything is blocked.
Could also be caching related (as always with browsers)
Resolution could be to refresh using CTRL+F5 or disable some content modifing extensions (e.g. adblocker)

[potent halo]

Hey there! To assure you a bit.. This is absolutely the right channel for that kinda stuff. Just not the channel if you expect a response for any official se dev. Help here is mostly community driven.
That being said, what did you try? It honestly sounds like you do not have enough base code to display a chat.
If that's the case and you would rather not do everything from scratch, I'd suggest taking any chat you like from #widget-share or the se chat example from github (https://github.com/StreamElements/widgets/tree/master/CustomChat) and modify it to your liking.

[vast heron]

thank you so much!

[boreal kite]

Hi! I really need help with some code, who might be able to help me with some chat bubbles? @potent halo

[vivid cave]

Heya; I've been working on a streamelements widget using the Elements JS widget api. I'm curious -- does anyone know if there's a typing library to provide a types and parameters reference for the library functions? dev.streamelements.com has some of it, but it doesn't lay out any of the function signatures - just examples, I think, right? I didn't notice any myself.

[outer otter]

I created types by myself following the docs, in some pages in the last lines you have all the types which are referenced in that specific guide

[vivid cave]

Darn. I was hoping that wasn't the case. 🥲

[outer otter]

Yeah unfortunately I found no types

[vivid cave]

Well, thanks nonetheless!

Much appreciated. 🙂

[boreal kite]

Hey could you help me? I have no clue about coding

[outer otter]

no worries!

[outer otter]

what you need help for?

[potent halo]

Don't ask to ask just ask.

[boreal kite]

But I did

[boreal kite]

I need help with chat bubble coding

[severe shell]

Pasting your message here:

In the hopes that it won't get filtered..
https://dontasktoask.com/

[potent halo]

thx dude

In short. You should probably write down your actual question

[severe shell]

What he wants to say is: Instead of saying "I need help with something", just inform what exactly you need help.

[median ravine]

are you stuck with something specific? got something working and wish to improve it or nothing at all?

[lilac crescent]

i need help to find solve for this problem

did logged out and in

[severe shell]

#community-helpdesk

[boreal kite]

I followed a tutorial on how to make a custom chat bubble widget and I tested it and it doesn’t do anything

Or I don’t even know how to make sure I implemented it correctly

[median ravine]

can you show me the js code and/or the tutorial?

[boreal kite]

Yes I can when I get home I’m currently in class

Can I send it to you via DM?

[median ravine]

sure

[viscid matrix]

let subscriptionGoal = 20;
let currentSubCount = 0;

function LoadWidget() {
    LoadFont();
    document.getElementById("subGoalTitle").innerHTML = subGoalTitle;
    updateUI();
}

function UpdateSubGoal() {
    document.getElementById("currentSubCount").innerHTML = currentSubCount;
    document.getElementById("subGoalCount").innerHTML = `/ ${subscriptionGoal}`;
    updateUI();
}

function updateUI() {
    const filledPercentage = (currentSubCount / subscriptionGoal) * 100;
    document.getElementById('filled-bar').style.width = filledPercentage + '%';
    document.getElementById('currentSubCount').innerText = currentSubCount.toLocaleString();
}

window.addEventListener('onWidgetLoad', function (obj) {
    const fieldData = obj.detail.fieldData;
    subGoalTitle = fieldData.subGoalTitle || subGoalTitle;
    subscriptionGoal = fieldData.subscriptionGoal || 20;
    currentSubCount = obj.detail.session.data["subscriber-goal"]["amount"];
    LoadWidget();
    UpdateSubGoal();
});

window.addEventListener('onSessionUpdate', function (obj) {
    currentSubCount = obj.detail.session["subscriber-goal"]["amount"] || currentSubCount;
    UpdateSubGoal();
});`

Currently it loads and displays correctly but i wanna change it so it loads on the opening of the widget or obs and not if a new sub comes in, cause it says 0 until i emulate a sub than it gives the sub goal progress as it should, but it looks weird in obs if it shows 0 and than 8 if someone new subs

[potent halo]

Code looks fine to me.
Since I can't really check rn, I'd suggest looking if obj.detail.session.data has the expected data by doing console.log with it.

Uhh new idea.. it might crash at LoadWidget() because there is no LoadFont().
Try removing either of those function calls or add a LoadFont function.

[viscid matrix]

Got that Part ☺️ thanks, but I had to refresh the whole editor page, will the widget refresh if any sub events come in cause if i emulate nothing happens, i have to change the sub goal progress in widget data, or is it only at like the start of the stream ?

[potent halo]

@viscid matrix See this answer by c4ldas.

[hearty bane]

is this a good place to talk about custom chatbot commands?

[keen pier]

When I had a channel last time, we could custom name a bot in Se.live, can we still do that? if so, how?

[severe shell]

You can do that on the SE website, but you need to open a ticket and ask the staff to enable the option. Just type here !ticket enable custom bot name and follow the instructions