#dev-chat

1 messages · Page 54 of 1

elfin arch
#

i'm not sure if you get a bad response or if you have to do a ping/pong thing to check connection

#

🤣

#

ya; i'ma have to defer to someone else that's played with the sockets. i only use those for local stuff and not sure how to handle the auth

neon pendant
#

Yeah, its the first time for me also messing with sockets 😛

#

Have set it up pretty nicely if i say so myself. But I can leave it like this and put in the documentation, if you don't see "this" message popup authentication is failed and you check your JWT token.

#

Thanks for your time though @elfin arch silver31Lov

tribal zenith
#

have you tried the default error handler?

LFSocket.on("error", (e) => {
  console.log(e);
});
elfin arch
#

^ there's gotta be an error handler in there somewhere ^^

neon pendant
#

@tribal zenith Yep, no repsonse either.

tribal zenith
#

and you're using socket.io-client?

neon pendant
tribal zenith
neon pendant
#

Using it in a browser though.

#

Works perfectly fine

tribal zenith
#

then you'll probably need the client

neon pendant
#

everything works, except i don't get a "not authorized" notification from streamelements

#

if i refactor the code to use streamlabs (BLEGH) it actually disconnects

foggy fossil
neon pendant
tribal zenith
neon pendant
#

🙂

elfin arch
# foggy fossil

DM this info KeiZar; red name in the user list: ... quickly .... he's off shift in 5 minutes!

Username:
Email:
Account ID:
JWT Token:
Reason for closure:
Error when using the closure form:
#

ignore the last part; i sent him your screenshot

foggy fossil
#

thank you for help 🙂

tribal zenith
#

@neon pendant It might just be a version mismatch. The socket.io version from the example docs uses 2.2.0, while you have 4.0.0.
So you probably need to use something like this:

 LFSocket.on('connect', (socket) => {
    if(socketService === 'StreamElements') {
      socket.emit('authenticate', {
        method: 'jwt',
        token: authToken
      });
    }
  });
LFSocket.on('authenticated', (data) => { console.log('Succes! ', data); })
elfin arch
#

it's the auto fail though....

#

how to handle if token is invalid

neon pendant
tribal zenith
#

you can't connect with that?

neon pendant
#

Wait, i don't think you understand. If i use a proper key it works flawlessly 🙂

#

i want to catch an invalid key

#

So when a user puts in a wrong key, i want to catch that.

tribal zenith
#

yeah, I know, but LFSocket and socket are different things. So you might have to catch the error on socket and not on LFSocket

neon pendant
#

LFSocket is my name for the socket.

tribal zenith
#

that's the io namespace, but socket is the established connection

neon pendant
# 
const LFSocket = io(socketURL, {
  transports: ['websocket']
})
#

So what do you wnat me to do / test?

tribal zenith
# 
LFSocket.on('connect', (socket) =>
{
  if(socketService === 'StreamElements')
  {
    socket.emit('authenticate', { method: 'jwt', token: authToken }, (response) => { console.log("Server response: ", response); });
  }
});

LFSocket.on('authenticated', (data) => { console.log('Success! ', data); })
neon pendant
#

socket isn't defined

#

if i use

LFSocket.emit('authenticate', {
  method: 'jwt',
  token: authToken
}, (response) => {
  console.log(response)
});

I get a undefined back as response

#

With a proper key, also undefined

tribal zenith
#

hm, so the server doesn't respond with any data

neon pendant
#

Nope, it pushes an event when its authenticated though. But not on failure

#

Doesn't disconnect either.

elfin arch
neon pendant
elfin arch
#

i think we are guessing for the fail event

#

socket.on('authenticated_failed', () ); ? socket.on('nope', () ); ?

neon pendant
#

Nope and Nope 😛

tribal zenith
#

That depends on how the backend is configured. We can only guess how the server reacts to invalid credentials, unless @viral patrol knows more

elfin arch
#

🤣 im just guessing

neon pendant
# 
connect
Sent when the websocket is connected
disconnect
Sent once the websocket disconnects
authenticated
Sent once the websocket is fully authenticated
event:update
Sent when a session value is updated
event
Sent when a new activity is registered
overlay:refresh
Sent when an overlay reload command is issued
session:reset
Sent when a session is reset
#

This is from the documentation

#

so i guess they haven't implemented that?

elfin arch
#

i'm guessing most people don't handle that error 🤣 .... 🤞 there is an event if auto fails

neon pendant
#

AAAAAAAAAAAAAAAAAAND I Found it 😄

# 
LFSocket.on('unauthorized', (res) => {
  console.log(res);
})

Gives me

{message: "Invalid token"}

@elfin arch @tribal zenith

elfin arch
#

🤣

tribal zenith
#

okay, so it just implements the jwt flow. Yeah that maybe should be in the docs

elfin arch
#

well played sir. good guess. ... i was hoping the 'nope' was the answer

neon pendant
#

yeah, i was trying everything 😛

tribal zenith
#

I mean on the other hand we emit an authenticate event, so it probably should have been clear then LUL

neon pendant
#

If my knowledge of JWT and Socket would have been better it would have been clear 😛

#

thank you guys @tribal zenith and @elfin arch silver31Lov

elfin arch
#

you figured it out; ... i just had to make you struggle around it because i've never dealt with 'not auth'ing' 🤣 .... also ... whatcha making?

neon pendant
#

Making an extension for Lioranboard 🙂

elfin arch
#

hmmm... i had to google it ... stream deck? ... that's something awesome i've neverlooked into.

neon pendant
#

yeah its a pretty awesome tool 🙂 Looks horrible though

#

You can make your stream very interactive

elfin arch
heady cove
#

Is the Tiltify Widget not able to change the text settings? Changes made to that tab do not appear to actually affect the widget.

sturdy oak
#

Have you tried to save and reload?

heady cove
#

yes

tender estuary
#

Hi all - Does anyone know about the countdown timer in the Talkshow animated overlay start screen?

zenith canyon
#

is there aa way for a single command to trigger a sound from the store and display text in chat?

cursive spear
#

Hi folks, I'm trying to figure out how to both play a sound and post a chat message on stream when someone calls a command. I already have the sound redemption set up in the store, and the widget enabled in my overlay. What seems to be happening right now is that when I use the $(redeem) variable in the chatbot response, it no longer posts any of the rest of the chat message.

Ex: !sound triggers a chatbot command: This is a chat message $(redeem sound)

This only plays the sound, and does not post "This is a chat message" in the stream chat. If I remove the variable, the chat posts, but the sound doesn't play (obviously). Is there any way to do both?

fervent yacht
#

^ looking for this also

cursive spear
sullen perch
#

@terse pier hi there!
Im using your sub points widget, but it seems to reset to 0 after I end my stream, can i change that? so it keeps the goal untill I reset it myself?

sturdy oak
#

Might want to start using API Save

hollow venture
#

Hey, why do I keep getting 403 unauthorized from https://api.streamelements.com/kappa/v2/tips/{myAccountIdHere}/leaderboard ?

#

I provide accountId and the jwt correctly

#

It works for my friend's account and jwt token, but not for mine

trim wraith
#

Morning , I am havjng a issue where the credits by grot does not show any updates credits on followers , sub, bits , etc . Has anyone run across this issue ?

viral patrol
#

Hi. The best for that overlay is to keep it on separate browser source with "shutdown source when not visible" ticked on (as this widget collects data on load only). Within the same overlay there's alternate version which should work on in both ways - shutdown being enabled and disabled.

#

Also - it requires some events to happen during streaming session, so with 0s in session data it will show no events.

trim wraith
#

Neither version worked

viral patrol
#

So maybe this is because of xsplit is not shutting browser source at all? Try "alternate version" from within same overlay.

#

Did it work in overlay editor?

trim wraith
#

No just the scrolling of the title name and that’s it @viral patrol

trim wraith
#

The cinematic one seems to work ok but that’s not my style of credits

viral patrol
#

Those widgets grab number of events that should be displayed from this page.

#

So like there were 3 followers during this session, show last 3 followers.

#

Also - Alternate version can collect data while running, so you can emulate events and those should be added to the list as well

trim wraith
#

It shows names and numbers but none of these pop up on my credits

viral patrol
#

@trim wraith

unknown.png
#

Check those numbers

trim wraith
#

Ok stand by one

#

Where is this located @viral patrol

viral patrol
trim wraith
#

As of now it shows zeros , my last stream was last night , I assume I should do another stream and try it again

viral patrol
#

You can just set those values in that pages to any number and save it

#

After you are done testing, just click "Reset session"

trim wraith
#

Ok so it pulls the info to test ok let me try that brb

#

Ok so I changed it to 5 now they come@up@

#

Followers do not show however , I am having a issue where se can not alert me to followers and such can that be part of the issue

terse pier
#

@sullen perch Hi, that widget doesn't have any persistent memory so it resets each time. The idea was to just track what happens within a particular stream, with the ability to set the starting number manually.

sullen perch
terse pier
#

This one does save the count in memory using SE_API

#

and has a bit more functionality in terms of tracking different events - if you wanted just the counter you could modify it to not show the bar

serene turtle
#

With StreamElements modded, a POST to the say endpoint with the message: "/followers" can activate followers mode along with other chat commands.
However, a POST to the say endpoint with the message: "/delete {uuid}" does not delete the message. It posts as a string.
Is there anything I can do about this?

unknown.png
sullen perch
muted moat
#

How can I make a variable $ {count wins}, which is the difference of a number, minus the count wins?

#

I don't know if I explain myself

trim wraith
viral patrol
#

@trim wraith I think it would be "keep source in memory"

trim wraith
#

Ok let me see how it goes

pulsar willow
#

Is there any way to make a label repeat when scroll is enabled?
(because thats howscrolling works in obs)
so I want it to match
like immediatly after the text it repeats
so it never goes "offscreen"

#

i donate 5€ if someone knows the answer

pulsar willow
#

hey 🖖

Is it possible to write a custom field button in such a way, that it forces the widget to refresh / reload? 😅

I've thought something like the following might work ... but it doesn't. 😶

    if (obj.detail.event.listener === 'widget-button') {
        window.location.reload(false);
    }
});```
tribal zenith
pulsar willow
# tribal zenith why would you need that?

It's a bit complicated:

I'm writing a widget that shows images from a pool and allows moderators to change those via commands.
There is a limited number of slots, but significantly more pictures.

On initialization a slot is empty.
Unfortunately, that's why the widget doesn't show anything when it is resized.

As a comfort feature, I would like to add a 'test mode' in which a static image is used (to better assess where the widget should be positioned etc.).

To make it temporary permanent, I did implement this as a checkbox ... however, the widget does not refresh itself automatically after activating it.

Of course it refreshes when a value is changed, but I would have found a refresh button more intuitive.

tribal zenith
pulsar willow
#

thank you @tribal zenith ! 👍

untold garden
#

how do you format a time for the ${time.until <utc time>} command?

hardy walrus
#

@untold garden not possible with that variable. There's a 3rd party api that allows decent customization.

elfin arch
#

@vale tapir you'd have to work out the art or whatever you want for the portals; but basically something like this if you are going to use the editor

#

on each side there is an upper image and a lower image; the text is hidden behind the top but covers the lower.

#

so you'd want a left half and right half portal graphic. This is an example of a 'static' option; it's always there. To make it alert based... then it gets more complicated and you'd need to build this 'container' each time.

vale tapir
#

oh alright! i appreciate it

untold garden
hard dagger
#

Hey I've got a custom overlay I was working on and I made a mistake with my JSON for the fields section. Now I can't access the settings to fix this. Is there another way into that area to fix my mistakes?

# 
    at app.js:299
    at Array.reduce (<anonymous>)
    at bs (app.js:299)
    at ws (app.js:299)
    at Object.invoke (vendor.js:15922)
    at $controllerInit (vendor.js:21882)
    at nodeLinkFn (vendor.js:20734)
    at vendor.js:21155
    at processQueue (vendor.js:27933)
    at vendor.js:27977```
#

Looks like it's trying to parse the JSON and failing, breaking the button to get to it.

elfin arch
#

is your JSON loading? or is it JS error?

hard dagger
#

Well I didn't follow the required layout for the fields in the JSON, the JSON is good. I realise this is my mistake; I want to correct it though 😄

elfin arch
#

dm me you json.

hard dagger
#

I can't get to it

#

The button doesn't load up the panel to access any of the HTML/CSS/JSON

elfin arch
#

what is the console in the browser telling you?

hard dagger
#

What I put above

elfin arch
#

close over and don't save?

hard dagger
#

Well here's the funny part: It wasn't updating the dimensions of the overlay so I saved and reloaded

elfin arch
#

you can't really break an overlay with json.... cause it is ... json

hard dagger
#

Yeah I've not broken the overlay, I am saying I can't access the editor panel to correct the JSON

elfin arch
#

can you try a different browser?

#

i'm looking for shift-ctrl-i -> console

unknown.png
hard dagger
#

So here's a way to replicate it:

  • Make a custom widget
  • Open editor for it
  • Change Fields to:
{
  "prop": "value"
}
```- Save
- Reload
#

After that the Open Editor button will not work

elfin arch
#

what browser are you using?

hard dagger
#

Brave, with the blockers disabled

#

So chromium-based

elfin arch
#

can you try Chrome?

hard dagger
#

Yeah I'll download it now

elfin arch
#

i don't know Brave

#

or Edge

#

try edge to start

hard dagger
#

Edge I can try now

#

Yeah same thing with Edge

#

It's definitely a bug

elfin arch
#

wtf. is this a new overlay?

hard dagger
#

I'll find a way to raise a bug

elfin arch
#

i'll make one.... one sec.

hard dagger
#

Try my steps above

#

And I made a new overlay to replicate the issue

elfin arch
hard dagger
#

And you did the same JSON?

elfin arch
#

i created a new overlay. new widget. my json is 'error'

hard dagger
#

Try a valid JSON like:

  "prop": "value"
}```
elfin arch
#

ooo...

#

niiice

hard dagger
#

You see it?

elfin arch
#

you are 💯

#

@viral patrol ^ help

hard dagger
#

Thank god! (But also nooooo!)

#

So in your console do you get the error about $$key missing?

elfin arch
#

good find.

hard dagger
#

Luckily I've not lost too much since I was copying and pasting from VS Code into the editor for the most of it

#

Exactly the same error

elfin arch
#

ya; i'm not sure what triggers that... but you broke it 🙂

#

normally i get an error cause i missed a } or an extra ,

hard dagger
#

Shame on me for not reading the documentation first 😄

#

Normally my IDE protects me against these things but a full-blown IDE for something like this feels overkill 😄

elfin arch
#

the overlay editor isn't a great IDE... best to copy and paste into. this is for sure a bug though... cause it breaks everything

hard dagger
#

Well the overlay is technically working right now

viral patrol
#

@hard dagger @elfin arch TY. Forwarding that to devs.

hard dagger
#

I appreciate it.

elfin arch
hard dagger
#

Years of working in support early on have taught me the value of steps to replicate 🤣

elfin arch
#

much appreciated. saved us both 30 minutes and you having to install chrome to prove me wrong 😉

hard dagger
#

Was this the right place for this kind of question by the way? I wasn't sure

viral patrol
#

Of course. Definitely better than platform specific.

hard dagger
#

Cool cool.

viral patrol
#

And... there's no better place for this TBH 😉

elfin arch
#

^ yup; if it were posted in Twitch ... it may have been an hour before you were directed here

#

and i gotta ask @hard dagger ... whatcha making?

hard dagger
#

Nothing special at the moment, I was looking for a real simple camera border as a way to see how it works

#

I mostly do data-driven dashboard stuff at work so looking to practice and flex some CSS in my spare time 😄

elfin arch
#

ya... streamers looovee CSS. i hate it. but welcome 🙂 and good intro breaking stuff

hard dagger
#

Thank you!

pulsar willow
elfin arch
iron field
#

@viral patrol Hi there!
I am having trouble setting up "GoFundMe Alerts by LX", can you help?
my campaing is
gofundme.com/f/cs43dp-thirst-project-n-nova-sbe
So in the settings of the alert I just have to change "Fundraiser short name"? To "cs43dp-thirst-project-n-nova-sbe" ?
Thanks in advance

viral patrol
#

Hi! Yes. After that your goal widget should display proper values.

iron field
#

i was just trying to receive the alert when someone donates to the campaign

#

that's possible right?
Also, I didn't notice this widget could display the goal (can you guide me through it?)
I am a little bit stressed because the event is tomorrow... They changed the platform 2 days ago, I didnt't had a lot of time, just found your widget and would love to make it work @viral patrol

frigid coyote
#

hey. i know this is a little old. but i just imported it and it works great. i was just wondering two things.
is there a way to make the background transparent? and how can i change the font?

floral lance
#

Hello, when OAuth2 application form will be available? thanks

burnt yoke
#

What/where is the best place to store StreamElements custom widget data that needs to persist through a refresh of the overlay?

pulsar willow
#

^ that's a question i'm also very interested in 👍 (Is there any way to achieve data persistence, without storing it on an external server?)

mild cipher
burnt yoke
#

@mild cipher that is what I thought/am using, but wanted to make sure. TY for the reply.

pulsar willow
#

hey,
I'm a bit puzzled about storing values via the SE_API. 😅

I would have thought that something like the following is working, but it isn't 🤔



window.addEventListener('onWidgetLoad', function (obj) {
    SE_API.store.get('test1').then(obj => {
        test1 = obj;
    });
    
    console.log("test1: " + test1);
});


window.addEventListener('onEventReceived', function (obj) {
    if (obj.detail.listener !== 'message') return;
    
    let data = obj.detail.event.data;
    let message = data['text'].toLowerCase();
    
    if (message !== "!test1") return;
  
    console.log("command recognized");
    
    test1 = 37;
    SE_API.store.set('test1', test1);
});```

The goal was to restore the last value of *test1*, but it's always 0.
tribal zenith
frigid coyote
pulsar willow
#

@tribal zenith thanks, that makes sense 🤯

tribal zenith
#

@viral eagle So the widget has a field for the counterName, did you set that correctly?

viral eagle
#

Yes

#

In the Goal Tab

tribal zenith
#

the widget itself has settings. if you click the layer you should have a settings submenu

viral eagle
#

Yes

tribal zenith
#

under General the first field is the countername

viral eagle
tribal zenith
#

right and to trigger the counter update you need to assign that to a chat command

viral eagle
#

Already done

tribal zenith
#

in your dashboard under Bot -> Chat commands -> custom

viral eagle
#

I have used your widget before (thanks btw)

#

Nut right now I only need the value of the counter

#

Making everything else transparent could work

#

But the goal is still there

#

And I want the number alone

tribal zenith
#

okay, so you already set the type to Counter?

#

if you also leave the title blank it should just display the number

viral eagle
#

Huh

#

Wait wait wait

#

That's not the widget I'm using then

#

This is how the settingls look for me

#

there's no "General" tab

tribal zenith
#

oh I have a suspicion then LUL

#

yep, the widget-gallery link is for an older version

viral eagle
#

LUL

#

That explains it

tribal zenith
viral eagle
#

Ah yes

#

It's so simple now

#

I love you ❤️

tribal zenith
#

yeah, versioning with widgets can be an issue sometimes LUL
I'll have to tell lx tomorrow

viral eagle
#

Thanks a lot mate!
I need to learn to code for web

#

My background is just different

#

You're a lifesaver!

tribal zenith
#

no problem, web-development gets pretty easy after you get used to the markup and styling SeemsGood

pulsar willow
#

How do I ensure that the keys used by the persistence SE_API are already created when a widget runs for the first time?
I assume I can test for a key and create it, if it doesn't already exists?

    // How to make sure, that there is already a 'test1' key?
    SE_API.store.get('test1').then(obj => {
       ...
    });
});``` 

(Sry if it's obvious ... 😶)
plucky hawk
#

I'm not sure if this is the right place to go because I am far from a developer but I figured this is where the people who know how to do what I'm trying to do could give me some well needed knowledge 😅

I'm trying to pause an alert at the end of the video so that I can use it as a static part of my overlay as well

#

If I don't do it that way then I have a duplicate icon during my alert video and I can't find a way to create the design I'm going for without doing that

elfin arch
# pulsar willow How do I ensure that the keys used by the persistence SE_API are already create...

simple solution is to check the obj that loads and if it is null or doesn't match what is expected, then redefine it locally. Here is how I went about it on my last widget ... kind of all scrapped together:

//main settings to store on first load. MASTER SETTINGS
const GAMES_SETTINGS = {
  "chatQuestion": { ... },
  "randomPin": { ...  }
  };
//store get
const getDB () => { //load database
    return new Promise((resolve, reject) => {
      SE_API.store.get('chatGamesDock').then(obj => {
        GameDB = obj;
        resolve('Database Loaded!');
      }).catch(() => {
        console.log('Error loading Database!');
        reject('Error loading Database!');
      });
//Widget load ->
window.addEventListener('onWidgetLoad', obj => {
getDB().then(load).catch();
});
function load() {
//*** HERE IS WHERE I CHECK IF THE STORE ALREADY HAD DATA ***
  if (!GameDB) GameDB = GAMES_SETTINGS; //error on first load of database.
//.... check if something changed from the GAMES_SETTINGS in this code and is different from the last save in the STORE (GameDB) as needed...
};
elfin arch
plucky hawk
#

I know that logo is amatuer-ish but I'm trying to stop it from showing underneath the alert because I want it to stay where it is

elfin arch
#

you want the 'faces' on the left and right with the blue bar always on screen? then the text to so has alerts when needed?

plucky hawk
#

Yeah, the animation I have right now has the faces in the center, spreading to reveal the bar, then going back to the center but I want them to stay in the center afterwards

elfin arch
#

ahh. i gotcha. so it's like an expand, then collapse. but have it stay on screen with it collapses

plucky hawk
#

Yeah I'm not sure if there's a way to do that I'm new to stream design tbh

elfin arch
#

i'm not sure of a way to do that with the alert box... you'd need to kind of 'trick' the overlay to do it i think

#

basically; if the center collapsed was less tall then then alert; it could always be there. The the bar animation would be 'on top' of that image

#

then set the animation to 'zoom-in' and 'zoom-out' to try to make it look right

viral eagle
#

It's me again! Is there a way to rotate an element in my overlay in a degree different than 90° multiples?

elfin arch
#

are you using a custom widget?

#

i gotta log off; but if so;

  1. find the DIV container in the HTML; main in this example:
unknown.png
#

then add transform: rotate(45deg); or whatever you want in the CSS;

unknown.png
fervent rock
#

Can we access twitch channel point redemption event with streamelements api?

elfin arch
viral eagle
dark river
#

Hey ! Just a dumb question, cause I'm curious : what does API stand for ?

pulsar willow
#

@dark river API = "Application Programming Interface"
https://en.wikipedia.org/wiki/API

API

In computing, an application programming interface (API) is an interface that defines interactions between multiple software applications or mixed hardware-software intermediaries. It defines the kinds of calls or requests that can be made, how to make them, the data formats that should be used, the conventions to follow, etc. It can also provi...

fallen wind
#

Why does my store keeping crashing when attempting to purchase something

dark river
pulsar willow
#

guys i have a question, i have triying this use an Overlay source with an overlay.. but what i want is depending the alert switch to another overlay
for example
image 1,2,3
event: follow = 1 , sub = 2, bit =3
ive been trying using this js line but what i only can do is show random number after evento and i cant pick follow, sub or bit it just trigger by anything
window.addEventListener('onEventReceived', function (obj) {
});

sharp vault
#

Hi guys! Wondering if this already exists (or if not, how difficult it would be).. but i'm looking for a command that can pull from a "custom wiki" of sorts. Our community has a lot of in-jokes/community memes and I was wondering if it would be possible to make a command that pulls from a glossary of terms (updateable) and give back a response explaining the term? a bit like a dictionary bot, but for a custom dictionary maelstromThinking

#

or if a bot exists that does this already

lament terrace
#

I'm trying to change this line for the bits so instead of it being the latest bits, it would be the person who has given the most bits for the session and how many. Anyone know what I'd change the line too?

unknown.png
queen barn
elfin arch
elfin arch
elfin arch
lament terrace
#

Thanks!

sharp vault
sharp vault
#

that worked perfectly, thanks pjonp 👍

sharp vault
#

I do have a question, now i'm playing around with it some more.. is there any way to add spaces to tags and have it pick up on them? maelstromThinking in pastebin if you put a tag with ":[term1, term2]" and a user enters "!command term1 term2" this will parse fine (i'm guessing because it only reads the first term entered in the chat command anyway).. but if you put a tag with ":[two words]" (no comma) and then try "!command two words" it doesn't find any matches. I guess it boils down to.. is it possible to have a chat command that accepts spaces?

elfin arch
sharp vault
#

ah.. so putting %20 in the chat command does work, but I guess that might be a stretch to expect a user to realize to do that 😂

#

it's not the end of the world, it just slightly narrows down the amount of unique terms I can have I guess 🙂

#

appreciate the help again pjonp 👍

elfin arch
#

what is your current command? the %20 would go in the pastebin filter

sharp vault
#

oh, well my command is !votwiki (vot is our community name)

elfin arch
#

... the customapi part .... should be something like ?filter=${1:}

#

try with ${1:}

#

right now your command is only reading the first word. the 1: means start at first at read all

sharp vault
#

😮 oh, that totally works

#

syntax errors will always be the death of me maelst2Dying thanks!

elfin arch
#

no problem.

pulsar willow
#

i made a progress!
i have a question is there a way to call local files on streamelements?
what im trying to do is call a video depending the event

window.addEventListener('onEventReceived', function (obj) {
const data = obj.detail.event;
if (listener === 'follower-latest') {

} else if (listener === 'subscriber-latest') {

} else if (listener === 'host-latest') {

} else if (listener === 'raid-latest') {

} else if (listener === 'cheer-latest') {

} else if (listener === 'tip-latest') {

}

});

elfin arch
# pulsar willow i made a progress! i have a question is there a way to call local files on stre...

the best way to do it with a custom widget is to add the video/image upload option in the FIELDS or json tab so you can upload it and call it from there. I would also like to give a heads up about the 'sub listener' as that will go off on all sub variations. So if there is a gift sub of 10; there are 11 immediate alerts. (sender, then 10 subs); I break that one into a sub routine ```js
if (data.amount === 'gift') ... //single gift
else if (data.bulkGifted) ... //bulk gift sender
else if (data.isCommunityGift) ... //user recieved a bulk gift
else ... //normal sub

pulsar willow
paper sierra
#

Hello, I transferred a donation bar made in css, html, js etc. I don't know how to make it work on Streamelement, could someone help me here or by private message (please ping me)

tribal zenith
tribal zenith
pulsar willow
#

Hey, I am a little confused on where to put the KeyXYZ. I am configuring the Exploding Heart Widget and I cannot for the life of me figure out where to put the KeyXYZ Value

#

Nevermind, I got it

lament terrace
pulsar willow
broken coyote
#

i know that widget

median pelican
#

Hey! I've been using lx's Office Agents alerts for a couple of months now and they suddenly stopped working, I tried re-adding it and still no dice, is that something that might have gone wrong somewhere? thank you!

#

also i may be in the wrong place..

broken coyote
median pelican
#

I'll give it a shot thanks!!

broken coyote
#

no problem!

median pelican
#

Working in the editor now thank you :D!!

broken coyote
rain dove
#

hi im idk where to ask this but can some one help me find the social media widget from @abstract basalt

pulsar willow
rain dove
#

YESSSS oma thanks you the best !

dusty galleon
#

I'm receiving an error 413 (Request Entity Too Large) when trying to save my Custom CSS on one of my overlays. It only happens on my subscription variations and nowhere else (even though the CSS stays the same between elements). Anyone have any idea why that may be the case?

hardy walrus
#

@dusty galleon there's a "limit" to how far you can go with the customizations and you're probably a bit too far with the "uploading" you're doing.

solemn zephyr
#

Hi I'm needing help with my alert message for my subscriptions.
What I'm wanting is to change the alert message template from one message than fade out and show a different message. like a thank you for example the first message states: (name) received a gifted sub! than fades out and shows message: Thank you (gifter) for the gifted sub!
Can someone help guide me with this?

spring tide
#

Custom widgets can support script imports from a CDN like unpkg, right? Or did I imagine that in a fever dream? I'm just thinking about all this custom widget logic and I want to make an intermediate layer that vends what data I want to access a bit cleaner.

elfin arch
viral patrol
median pelican
dusty galleon
elfin arch
#

it is a total limit for the whole overlay. so you may need to trim some variations add the new one

broken coyote
#

It's not a variation amount limit. It's a amount of code limit

dusty galleon
#

Alright I see now, so it's global.

#

Is there any way to enter CSS that applies to the whole alertbox?

#

I am unable to do this in OBS for some reason, any CSS that I apply doesn't affect the box

broken coyote
#

You have your html/css/js in the css editor

dusty galleon
#

The per element CSS editor?

broken coyote
#

yee

dusty galleon
#

Yes I know that, I was just wondering if there's a global one that affects all of them.

#

I should be able to enter the CSS on the "Custom CSS" box on OBS and it would work though. Am I doing something wrong?

tropic wagon
#

Hi guys ! Is there a way to show picture of the item bought in store instead of just the name in Merch Alert ? It seems like {items} is just for the name.

novel root
#

Im setting up a custom star alert when a certain amount is sent, i am using a custom CSS in SE. How would i control the video sound of the alert?

drowsy crown
#

Hiya, is there a way to show the people who gifted subs in the Credit Roll widget? :)

lethal chasm
#

Hi guys. Does anyone have an curl exempla to post a message using the bot?

waxen jetty
#

Hello there, on overlay editor, do we have a documentation with the variables? I'm trying to get those numbers, is there a way?

unknown.png
wooden plover
#

for the all in one rotator, is there a way i can delete the twitter and instagram rotates?

#

@broken coyote

broken coyote
#

Line 12 in js

wooden plover
#

OK i will try that

#

It worked! Tysm

#

What font is the pixel font in the text

serene turtle
#

With StreamElements modded, a POST to the say endpoint with the message: "/followers" can activate followers mode along with other chat commands.
However, a POST to the say endpoint with the message: "/delete {uuid}" does not delete the message. It posts as a string.
Is there anything I can do about this? Is this something on StreamElements end that can be ramified?

unknown.png
dusk badge
#

@broken coyote how do i delete one of these from youre rotator

unknown.png
gloomy kestrel
dusk badge
#

yes

gloomy kestrel
dusk badge
#

i dont understand

gloomy kestrel
#

Click on open editor, then click on JS and line 12

Screenshot_49.png
dusk badge
#

ok

gloomy kestrel
#

and delete social1, 2

dusk badge
#

thx

modern pawn
#

Would anyone be willing to code a little widget for me? Basically I need a subgoal in the x/y format where x is the number of subs during the current stream and y is a specified subgoal minus the current total number of subs

nova vault
#

Welcome!!!
I have a question for you.
Together with my friend, we are creating a discord bot and we wanted to use the streamelements API to let people check their points on the discord, or to send statistics on the discord after the stream is finished, such as how many subscriptions, follow, average viewers, etc. The problem is, that we cannot generate the oauth2 code in any way.
Can you please support this topic?

calm sentinel
#

Can someone help me with twitch API?

bold patrol
#

Hello everyone. I have a simple question that likely has a simple answer - any help will be greatly appreciated:
I have images being referenced on a custom widget within the HTML tab. How do I provide the image reference for the Custom Widget?

rugged rapids
#

In the fields use
"someImage": {
"type": "image-input",
"label": "Some Image"
},

in html use:
{{someImage}} - replaced with image attached to alert URL. For example <img src="{{someImage}}"/>

calm sentinel
#

Hello, I need help making a button that displays if twitch is live

#

anyone have a github repo that does that

sleek karma
#

Anyone ever got this issue, the redirect URL coming back from the StreamElements OAuth page does not have a code.

bold patrol
#

Thank you @rugged rapids . I think I understand that. I'll give it a go. 👍

halcyon ridge
#

Does exist a way i can emit an alertbox like overlays' alertbox?

bold patrol
#

@rugged rapids - thank you for your suggestion. That has helped me understand how to add images and how the software knows where to pull them from.

Sadly, it hasn't worked for how I needed it.

I'm using the images as logos on an animated background.

I've added a screenshot of my background and the missing image icon. I'll post another image below as it should look (running natively in a web browser)

unknown.png
#

running natively in web browser

unknown.png
rugged rapids
#

I recommend to take a look at the widgets in #widget-share as some of them are using the image options.

ripe mortar
#

Can someone make me a automatically updating follower goal thing

#

For twitch

drowsy ferry
#

Hey everyone, I'm trying to interact with SE's API to allow a python3 program to get information on the tips that are given to a channel, but I'm getting really confused about the authentication and authorizations.
So far, I've succeeded in interacting with the API to get info like 'points/channel/watchtime' on the channel using the JWT token in the header. But when I try to make a request like 'tips/channel', I get an error.
My hypothesis is that it's likely an authorization error. Either I identify improperly (there's this whole thing with OAuth2 where I couldn't see the relation with JWT), or the channel owner has to do something on his side.
Can someone help me see clearer what I'm doing wrong/what I'm supposed to do ?

drowsy ferry
#

As for the option of using OAuth, I guess the ID would be the user ID, but to get the secret, I'd need to apply for credentials, but the form to get them seems to be closed and the documentation is no help.

ripe mortar
#

Can someone make me a automatically updating follower goal thing

#

For twitch

meager phoenix
#

I'm having issue importing points using csv
I put it like this username1,0,5,0,0 import is successful but doesn't appear on the loyalty leaderboard

placid flax
#

My campaign for Raid Shadow Legends is about to end and I need support, but no one from the stream elements team is responding, what can I do

shell tree
#

Ideally asking in a proper channel, or waiting for a response.

shell tree
shell tree
ripe mortar
ripe mortar
#

@shell tree

#

An auto updating follower goal

elfin arch
ripe mortar
#

Yes

bold patrol
jovial rose
#

No; Its to use in stream

elfin arch
jovial rose
elfin arch
#

^^ Twitch info to start

vocal pewter
#

Hey is there a opportunity to change the display time of the combo from the emote counter? Cant fight it in the overlay settings. 🙂

ripe mortar
#

Can someone make me a automatically updating follower goal thing

hardy walrus
#

@vocal pewter That would be something for @mild cipher (context for you bruv) #dev-chat message

vocal pewter
drowsy ferry
#

so, does someone know what I need to do to be able to access tips history for a channel from the API ?

jovial rose
#

Im trying to get the channel id lol

#

(Link is too far up)

drowsy ferry
#

Ok, I don't get it. What's wrong with this piece of python code ?

`import requests
import json

token = 'JWT Token'
ChannelName = 'Channel Name'

api = 'https://api.streamelements.com/kappa/v2/'
session = requests.session()

command = 'channels/{:s}'.format(ChannelName)
url = api+command
headers = {'Authorization': "Bearer '{:s}'".format(token),
'Accept': 'application/json'}
response = requests.request('GET', url, headers=headers)
ChannelInfo = json.loads(response.text)

command = 'bot/{:s}/join'.format(ChannelInfo['_id'])
url = api+command
headers = {'Authorization': "Bearer '{:s}'".format(token),
'Accept': 'application/json'}

response = requests.request('GET', url, headers=headers)
responseDict = json.loads(response.text)
print(responseDict)`

If I run this, I get the channel ID but for the actual command I get the answer :

{'statusCode': 404, 'error': 'Not Found', 'message': 'Not found'}

If however I change the command to command = 'points/{:s}/watchtime'.format(ChannelInfo['_id']) I get an answer.
Ideally I'd like to run commands like command = 'tips/{:s}'.format(ChannelInfo['_id']). But if I do that, I get

{'statusCode': 401, 'error': 'Unauthorized', 'message': 'invalid token'}

I get that running these on another channel would require a moderation status or something, but even running it on my own channel I get just errors. What's going on here ? This is driving me crazy !

bold patrol
heady cove
#

Anyone use the widget "one bar to rule them all stats (by BananeenFR). I cannot for the life of me find the place to actually type text or set a goal. @ocean wadi maybe you can point me in the right direction?

ocean wadi
#

Let me get to my PC

ocean wadi
#

it's in the "Step" part there are text inputs for reward of each step

#

@heady cove

heady cove
#

Okay, so is there a way to label the entire bar? Like "Chair Goal" or something? Also, can I get the text on the bar instead of above/below/etc.? @ocean wadi .

ocean wadi
#

you want the bar for only 1 goal? Just set the step number to 1 or have step 2 to 5 the same amount of points as the first one. You can't have the text in the bar ATM but I have to send a V2 for review that will include that, among other things like progress to goal (% or absolute) I had to drop the bar direction settings tho so it will only be left to right starting from V2

#

V2 will also include a version for YT and FBGG streaming

#

You could also set all the steps text as Chair goal and use the step 1 to 4 as milestones for anything. Multiple way to achieve the same goal in a creative way. HF

heady cove
#

ah, thanks so much I get it now @ocean wadi V2 sounds amazing

drowsy ferry
#

I have finally been able to get access to the API endpoint 'tips/{:s}'.format(ChannelInfo['_id']) for my channel. Now, question, how do you authorize another account to access this endpoint to your channel ?

#

even if I give the app account a full access manager status, it doesn't seem to do the trick

bold patrol
#

Does anyone know how to remove the margin from this?
Adding overrides into the CSS tab doesn't seem to do anything.

I'm wanting the background (orange/black gradient) to fill the screen - no white border.

unknown.png
tribal zenith
bold patrol
#

Yeah, that's what I tried 😦

low shard
#

Good day everyone. I'm exploring changing the system I use for collecting tips/donations. I do not wish to be tied to paypal for the funds I receive, but would still like for viewers to be able to use their paypal to contribute. I found another service out there that would compete with streamelements pay (ko-fi) and they do provide a webhook to trigger an external call when a donation is received. Does the SE API allow for anything to happen here to trigger a stream elements alert?

tribal zenith
bold patrol
#

So, I have learned that you cannot comment out css.

But it's working.

Thank you @tribal zenith

unknown.png
tribal zenith
#

CSS comments are like JS block comments /* overflow: hidden; */

tribal zenith
low shard
tribal zenith
low shard
tribal zenith
spring tide
#

I'm working on generating a bundled piece of code that executes either via iife or umd module, and I wanted to test it by shoving it into the js section of a custom widget.

However, I'm not able to access the member properties I throw onto the window when I look at my widget page with dev tools open, whereas pulling in something like jQuery is accessible at all times.

Is this some XSS preventative measure? If I published my code to npm and imported it via unpkg would my globals actually take then?

tribal zenith
#

Like:

<script type="module">
  import { Test } from 'https://unpkg.com/test/test.module.js';
  window.Test = Test;
</script>

Then you can use Test in your JS tab

spring tide
#

Is there any way I could rapidly test by splatting my bundled code into a script tag in the html tab nd access it through the js tab?

#

like I guess is that viable or am I going to run into similar problems with splatting an IIFE into the js tab

tribal zenith
#

script-tags have a defer attribute, which only executes the imported JS code after the page finished loading. So you could just add your code as "normal" JavaScript src and use that

spring tide
#

Makes sense. I’ll give it a crack, thanks!

tribal zenith
#

np. I'm currently working on a similar concept so I tested a few things 😄

spring tide
#

yeah hm.

#

Looks like it just ignores all global property assignments inside my iife.

#

like I assign it, and then log it, and then trying to access it via console? no dice.

#

bear in mind though I'm not importing it through the network, my bundled code is just like 200loc.

#

but

#

hm.

#

just makes testing hard lmao.

tribal zenith
#

are you trying to log that in the overlay editor?

spring tide
#

I'm not. mostly because I want to play with it in real time, so I visit the actualy overlay page and open devtools and see if it's available on the window there.

#

the interesting thing is that stuff like jQuery defines itself on the window in much the same way that my bundled code would

#

but jQuery shows up in the dev tools, and my library doesn't.

#

actually it hadn't occured to me that maybe all overlays bake in jQuery anyways.

#

so access via devtools on the raw widget page would always show something anyhow.

tribal zenith
#

the widgets get sandboxed, so you can't access specific window values. However a console.log of those inside your code should still work

spring tide
#

But then theoretically

#

imported code via script tags can still assign themselves to the window, yeah?

#

I think the answer is I'll have to stub out some stuff locally that takes the shape of various SE events

#

which is fine

tribal zenith
#

only on the current widget, yes

spring tide
#

but then the actual integ test will have to import from a published npm module and just

#

do the ol' front-end familiar "refresh and pray"

#

awesome.

#

thanks for letting me rubber duck with you!

#

😄

tribal zenith
#

what exactly are you trying to test?

spring tide
#

So essentially the thing I want to accomplish is making a package of essentially single-purpose emitters that'll derive off of eachother.

So the idea is I have one listener that'll aggregate all events into an array, and update that array, and then each more-specific listener that's looking for follows, or subs, or whatever will subscribe to that first listener and filter the stuff it cares about.

Essentially I want to test the behavior of these by simulating SE events

#

I thought the best way to test it would be to assign something to the window, instantiate it with dev tools, and then use the "emulate" event feature on a widget

#

but, the issue I run into is the sandboxed code that uhhhh doesn't want me doing that. So either I find a way to stub and fire SE-like events locally so I can test

#

or I publish package after package and import via unpkg

#

and test integration there.

#

So essentially a crux of my testing is through sending events to this series of data stores that are getting populated on window events onWidgetLoad and onEventReceived

tribal zenith
spring tide
#

I remember coming across this

#

but I'll bookmark it

#

ty!

slow gale
#

This seems like a better place to ask. Is there a platform independent community for people who know more about the technical aspects of OBS broadcast graphics (be it coding or knowing what an alpha channel is)?

floral maple
#

hey guys still having issues when im trying to install overlays from stream labs, it wont let me click on the like to transfer it over as it is greyed out

slow gale
#

I am so tired of buzzing around google trying to find inspiration for cool things to build and getting nothing but websites that say the word influencers then tries to link me to nerdordie or fiver or one of the other cookie cutter sites

wide fox
#

Hey guys! I'm pretty noob when it comes to css and whatnot, but I just wanted to see if there is a way to eliminate the username wiggling animation in the css editor in the alert widget?

shell tree
#

@wide fox can you send just that image that you want the text to be angled udner?

wide fox
#

hey 🙂 yes - so I figured out how to get the wobble animation to go away but now, I want it to be all the same caps size - I'll take a screen shot

shell tree
#

Youll have to enable custom CSS, go into the CSS editor, and you <should> have two classes under CSS

#

one will be something like .awsome-text-container and the other .text-container (default names in SE) that have font-size: in them, change the font size there to be the same

wide fox
#

Can I post what I have here?

shell tree
#

Please use before and after the code ```

#

Or post it to a site like codebin/pastebin

wide fox
#

hope thats ok - I've never used pastebin before lol

shell tree
#

Are you wanting it to be all small caps? all caps?

wide fox
#

all small caps I suppose? or just that WELCOME and USERNAME are the same

shell tree
#

On uhh line.. 28? i think that is, counting is hard and I dont have N++ right onw

#

Add font-weight: bold; font-variant-caps: small-caps; below it

#

So that it looks like this

unknown.png
wide fox
#

didn't seem to change it?

#

ok heres another thought, I changed in the html to just welcome instead of WELCOME and what I have now is

#

so then I just don't want the first letter of the username to be capitalized

#

lvluptDerp thank you for helping me lol I haven't done anything since customizing my myspace

#

I got it!!

#

I changed them to all-small-caps instead of small-caps

#

thank you for getting me pointed in the right direction @shell tree lvluptHug

shell tree
#

obssweat Just now seeing this ope, glad you got it figured out!

wide fox
#

😄

slow gale
#

@wide fox bravo for bothering to learn and experiment. Most never get that far.

wide fox
#

ha - thanks @slow gale - final thing I'm trying to figure out is how to delay the text from showing for a sec because the webm takes a sec to fully show up

#

I dk why I am this way 🤦‍♀️

#

haha

wide fox
#

I figured it out!

# 
    opacity: 0;
    animation: fadeIn 0s;
    animation-delay: 1s;
    animation-fill-mode: forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}```
hollow lotus
#

hi

wide fox
#

I have another css question if anyones around 😄

#

How to add the other variables like so and so subscribed for 20 months - how do we get the months in there?

pulsar willow
#

@wide fox as far as I know, CSS only handles the styling of stuff ... 🙂
JavaScript is used to listen for events and modifies the HTML when they occur.

viral patrol
#

@wide fox As mentioned above, if you want CSS to handle styling of different duration of sub, you have to first tell your styling about that. For example you want to have different colors of text. First - add a class/dataset to HTML of alertbox like:

<div class="text-container">
    <div class="image-container">
        <img src="https://cdn.streamelements.com/static/alertbox/default.gif">
    </div>
    <div>
        <div class="awsome-text-container">
            <span id="username-container" class="months{amount}"></span> <!-- I added class here -->
            just subscribed
        </div>
        <p>
            {{message}}
        </p>
    </div>
</div>

Then with CSS remove color from animated-letter class and add multiple classes like:

.months1{
  color: #f00;
}
.months2{
  color: #ff0
}

And so on. CSS doesn't have conditional formatting, so it would require you to write every of them. With JS you can compare it and do something like:

const userNameContainer = document.querySelector('#username-container');

// change the inner html to animate it 🤪
if (parseInt("{amount}")>24) {
  userNameContainer.classList.add("above24");
} else if (parseInt("{amount}")>12) {
  userNameContainer.classList.add("above12");
} else if (parseInt("{amount}")>6) {
  userNameContainer.classList.add("above6");
} else if (parseInt("{amount}")>1) {
  userNameContainer.classList.add("above1");
} else {
  userNameContainer.classList.add("default");
}

userNameContainer.innerHTML = stringToAnimatedHTML(name, animation);

With that you can have CSS describing above24, above12, above6, above1, default classes

#

Of course - the easier way to go is to create variations of alert.

pulsar willow
#

Is there any way to access pastebin raw data from within a custom widget? 😅

    let url = "https://pastebin.com/raw/XYZ";
    
    $.get(url, {}, function(results){
        console.log(results);
    });
});```
__Results in:__ *Access to fetch at 'https://pastebin.com/raw/XYZ from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.*

The reason I would like to have the entire pastebin post and not just single lines via thefyrewire API, is that I would like to implement a test mode in which the user can iterate over all provided image URLs to check for inappropriate ones. 🤔
viral patrol
pulsar willow
#

k, thank you @viral patrol 👍

slow gale
#

Yeah CORS settings are incredibly strict

tropic finch
#

is there any league ELO lookup working?

high void
#

hello, I'm creating a similar command, can you tell me if there is a possibility to send a message in the chat after the silence?
by: Google translator.

wide fox
#

@pulsar willow & @viral patrol thank you!

viral patrol
#

@high void Unfortunately SE bot can perform one action only triggered by command. It cannot send a message along with timeout action.

wide fox
#

The part above that says "somebody so and so" - Here I used {{sender}}

I am wondering if the somebody is something that is going to show up in a real gifting situation?

unknown.png
flat wren
#

Is it possible to make this work for multiple users at once? (Sorry for the @, was the quickest way for me to show what I'm talking about)

distant field
#

Is there somewhere that explains commands better then the dashboard? It doesn't explain what things do. I'm wanting to make some custom commands.

whole storm
#

Hello devs! I'm working on a custom widget and I cannot find a way on how to access the redeemed events. I basically want a counter that sums the amount of channel points used every time that someone redeems a challenge.

For what I already saw, there is no event for redeems. So I was kinda hoping to be able to catch the phrase on the image, since it has the points there.

Any suggestion is appreciated! 🙂

unknown.png
chrome nexus
#

Is it possible to slow down the scrolling speed of The Minimal Chat by @broken coyote

viral patrol
#

@flat wren For custom command you can use currentChatters as :user to distribute points to everybody on chatters list.

naive sorrel
#

Hi,
Is there any way to get a TTS playback programmatically, be it through widget API, remote API, browser simulation or anything?
Or is it now only limited to built-in widgets and that "test how it sounds" website?

ember jay
#

I'm having trouble figuring out what to type to get each name to show on a separate line, like a list. Any ideas?

unknown.png
ember jay
#

Nevermind I got it

lunar prawn
#

How do I change the background image of a Div based on an inputted image? The input appears fine to be in the Widget Settings menu

//JS
console.log({social1image});
//document.getElementById("topBg").style.backgroundImage = {social1image};

//Fields

"social1image": {
"type": "image-input",
"label": "Background Image",
"group": "Twitter"
},

EDIT: The error I'm getting when to print the social1image information to console.log is: "Uncaught SyntaxError: missing ) after argument list"

lunar prawn
#

I FIGURED IT OUT NEVERMIND. console.log('{social1image}'); prints out the link! And the following worked (after I was patient) to change the image:

    document.getElementById("topBg").style.backgroundImage = "url('{social1image}')";
muted moat
#

I don't know if it's the right channel, but how could I take the value of a $(count) and subtract a value from it and save the result in another $(count)?

viral eagle
#

Hello. I wonder if there's a way to mix the features from the widgets "Custom Text by @rugged rapids " (https://strms.net/custom-text_by_benno) and "Ultimate Text Widget by @viral patrol (https://streamable.com/nw90i)".

Specifically, I want to have a label which's text is set with a command (from Benno's widget) and have a Dynamic font size, meaning the text will fit the size of the container.
I have been checking the code from both widgets but I'm at a complete loss 😅

summer geyser
#

Does anyone have any ideas why my custom widget is working in the browser, but when I import it to a browser source in OBS, it doesn't do anything? To be specific, it doesn't appear like my JS is running in OBS. The initial markup and styles load, but then none of the dynamic markup updates (done in JS) happen.

#

I've tried launching obs.exe with the remote debugging arg, but the console in the browser isn't showing any of my console log statements

spring tide
#

Is it pulling libraries in dynamically? or are they all <script> tags in the html body?

#

like honestly the only guess I have is like

#

there's some html-server-related functionality not happening. but honestly I don't know what your local html / js bundle setup looks like.

summer geyser
#

There's a single <script> tag to load FontAwesome

#

and <link> for Google Fonts

#

For more context, it's a TypeScript project being bundled with Webpack. These are the relevant compiler options in tsconfig

    "compilerOptions": {
        "target": "ES2020",
        "outDir": "./dist/",
        "module": "ESNext",
        ...
    }
}
#

Is there a way to open the console in the overlay editor that OBS opens?

#

Oh... I may have found the reason.

#

I think using the '??' operator may be breaking it

#

Yep! That was it! PES_LMAO

viral patrol
#

@summer geyser Yup. I found nullish coalescing not working too. Then I started to compile ts to ES5, just to be sure. And to enable console you can add --remote-debugging-port=9222 parameter to OBS executable shortcut and start it. Then you will be able to navigate in your browser to chrome://inspect or localhost:9222

pulsar willow
# muted moat I don't know if it's the right channel, but how could I take the value of a $(co...

This test worked for me:
first counter = ${count test_count1} , second counter = ${count test_count2 $(customapi.http://api.mathjs.org/v4/?expr=${getcount test_count1}-1)}

explanation for ${count test_count2 $(customapi.http://api.mathjs.org/v4/?expr=${getcount test_count1}-1)}:

  • $count test_count2 VALUE = sets the value of counter 'test_count2'

  • $(customapi.http://api.mathjs.org/v4/?expr=X-1) = Uses the https://api.mathjs.org/ API to solve a given mathematical expression

  • ${getcount test_count1} = gets the value of counter 'test_count1'

pulsar willow
#

A user in the german support channel asked for something that triggers an alert when a chat message is posted (in case he forgets to read the chat) ... so I modified the "Video & Sound on Command" widget to trigger an video / audio alert when a chat message is posted after a certain period of silence.

Is it worth sharing? 🤔

viral patrol
#

There is a "doorbell" in widget-share based on that one

broken coyote
#

I use the icq sound lol

ocean fractal
#

does anyone know if you can nest fields on custom widgets? I'd love to make certain sets of fields available if the user flips a switch

pulsar willow
#

good to know 👍 thanks @viral patrol

remote herald
#

Does anyone know how to access the Twitch Helix Api with js/ts?

#

pls ping me if you answer me ;D

elfin arch
#

@remote herald what info are you trying to get? ... make sure you a) send a auth token, b) send client ID, c) have the scopes with the token

remote herald
#

where do i get that token from? i dont understand that part of the documentation

elfin arch
#

what are you trying to do?

remote herald
#

i am trying to do for example a custom channel point event

#

so my lights and all that can change with channelpoints

elfin arch
#

Oh. Nice; unfortunately S.E. doesn't currently support channel points. so I can't give much help here for that.

remote herald
#

ah ok :D And you also dont know how to use twitch helix api?

viral patrol
elfin arch
remote herald
#

kk thanks :D

floral badger
#

Soo a little explication. I build a custum RPG loot system using deebot. With deepbot i also can send api and stuff

I stream directly from console and using webbase programma i can use streamlabs overlay. Soo what ever i do in overlay of stream elements wil be visible on my stream without obs.

Soo back to my idea. For short ppl get item's and with these items thy have attack points. On stream i call a endboss and then thy can fight. This all is now visible in chat. (Dutch tho) but i would like to bring that towards a widget to make it visible on the stream.

So o need to make a widget with a custum healtbar and able to filter its imputed from chat that inlcuding dmg. Or even spawning and despawn.

I want to learn for it. I just need to know where to start.

Soo lets start with a healtbar. ;)

hushed vine
#

Hi i need some help with my account

#

on streamelements

blissful stirrup
#

hello

#

i need some help

#

how can i make an alert

#

as rotating feed

#

the rotating feed's icons and name there

#

so the alert one will cover the actual one

hushed vine
#

no one replying dude 😦

elfin arch
elfin arch
viral patrol
blissful stirrup
#

ye

#

but

#

i tried it

#

doesnt look how i want

viral patrol
#

@blissful stirrup The other way to go would be having any rotator and an alert with solid background which covers your alertbox.

blissful stirrup
#

what u mean

tropic lark
#

Hello, does streamelements have event based api?

#

For example I sub for event if someone redeem store item

lunar prawn
tropic lark
lunar prawn
#

I have not used this personally, but it's on my list of things to work into.

tropic lark
#

I made such system for twitch bits, but they have event system, so I just sub for events and wait for it and trigger my command on server

lunar prawn
#

Makes sense. This is an area of development I'm looking to work on soon, I just haven't gotten there.

#

Sorry I couldn't help more!

tropic lark
#

I have workaround like, sub for IRC and listen for chat messages, and if there is a redeem message I send get request to redeem list and check

viral patrol
#

@tropic lark I think this is served over websockets

muted moat
tropic lark
elfin arch
#

....ooo and ya; for redemptions; ```js
window.addEventListener('onEventReceived', obj => {
if (typeof obj.detail.event.itemId !== "undefined") obj.detail.listener = "redemption-latest";
...

tropic lark
#

@elfin arch thanks, will try

elfin arch
#

^ you'll want to mix that together; socket is event ; example is from overlay onEventReceived

ocean fractal
tribal zenith
ocean fractal
#

that'll do what I need!

#

thanks

untold cypress
#

is there an easy way to add a !show and !hide command for all widgets?

#

like in the javascript

fading oxide
#

Is there anyway to change a fielddata attribute from JavaScript, so that it persists when the widget is reloaded?
E.g. I have a weather widget and use a settings field to set the location, but can change it with a command "!setlocation LOCATION". When the widget is reloaded it reverts back to the location set in the widget settings.

pulsar willow
#

Can a custom widget trigger a SE-bot command via the https://jebaited.net botmsg API? 🤔

(Yes, I try to implement an automatical !shoutout-command, that is triggered when someone raids .. 🙃 )

MySmallProject | Login

Login page

viral patrol
#

@pulsar willow You cannot trigger a command, but you can make bot send the same response

#

Like you can send any text via botmsg from jebaited (but it has to be raw text, no variables, not a command).

mild cipher
#

You could always either just use the widget to send what the response would be when the raid event listener is triggered, or the easier option is just to put the shoutout response as the chat alert for raids

#

@viral patrol also, would it be possible to delete that replay customapi URL above? Would prefer to not have it sitting out in the open without context :D

hardy walrus
#

@mild cipher done

random sluice
#

sorry to bug but uh

#

what was the event listener on js for a new follower again?

#

i forgot what it was and couldn't seem to locate the old code

#

nvm just needed to change it from -total to -session

#

for what I wanted to do

weak pendant
#

Hi. I'm kinda new to this and I'm trying to do something I'd consider simple. From the terminal, I'm just trying to curl a list of redemptions.
I went to SE and got the JWT token from my SE account.
Then I constructed the command as per the reference page. I also turned off my VPN, cause that was a problem.

Command: curl --request GET --url https://api.streamelements.com/kappa/v2/store/<channel_name>/redemptions/search --header 'Accept: application/json' -H 'Authorization: Bearer <token_value>'

I currently get: 440 - No channel authorization found
Through a python script I get 401 - Invalid token

What could I be doing wrong here?

weak pendant
#

Got it. Was using channel name instead of id. Also, that url has some sort of issue. Other ones work just fine.

#

Like the bot or session.

#

Oh... hold on... the only redemptions I find are from 11-2020. What a mess... XD

#

Used the limit parameter, but it would seem the last 3 are from 11-2020. I don't know what's wrong, since in SE I can see the updated list.

#

"to" and "from" parameters don't seem to work. probably using the wrong format, but already tried a few. "YYYY-MM-DD" should work, right?

#

Anyway, regardless of the parameters, the data is lacking

#

Idk. I'll wait for confirmation that the problem is in fact on my end. Until then I'll assume there's a bug or a limitation and that only redemptions from 4 months ago can be retrieved. Either way, there's not enough information in the documentation to figure it out on my own.

naive sorrel
kind timber
mild cipher
naive sorrel
#

Alright, thank you very much for replying. 🙂

pulsar willow
#

Hi, I've been setting up chat commands that trigger sound effects in stream and I got it, however, i have seen on streams that viewers string sound effects in one single comment, for instance the type "!sfx hello * goodbye" and in stream it plays the sound effect for hello and then the one for goodbye which are completely separate, does anyone know how to set that up? thanks

round holly
serene turtle
wise galleon
#

Any way to tilt a stream label? I was able to rotate the label's div, but it get's cut off by the container in the window itself.

icy sluice
#

Hey all, I want to know if there is a function that can play an alert on stream when someone reaches a certain amount of loyalty points (eg. 10,000 points) on the leaderboard automatically?

#

I have some very keen gamblers on my stream who love the roulette function, and I would love if there was a celebration alert for people that crack certain point totals

wide fox
#

Anyone know how I can make OBS silence my bg music when my alert is playing from SE automatically?

shell tree
#

You would duck the audio of whatever you want by using the compression filter and select the alert audio source as the trigger

wide fox
#

thanks! I may have to put all my music on my actual pc rather than a browser source

#

Heres a separate Q

#

I'm using {{sender}} as the qualifier and I'm not sure why its showing amanda twice?

# 
    <div class="image-container">
        <video class-"video" autoplay src="https://cdn.streamelements.com/uploads/66a68fe0-9451-4c63-beb2-4ee086cfa966.webm"
               type-"video/webm">
    </div>
    <div>
        <div class="awsome-text-container">
          {{sender}}
            <span id="username-container"></span>
            <br>
        </div>
    </div>
        <div class="awsome-text-container2">
            <span id="months"></span>
          {{amount}} community subs!
            <br>
        </div>
</div>```
shell tree
glad escarp
#

how do i embed the loyalty points leaderboard into an iframe so i can autorefresh the page every 30 seconds. Ive got the refreshing part taken care of, its the embedding that i cant get correct... "streamelements.com refused to connect."

blissful stirrup
#

hello

#

boxed chat by cocah doesnt outline the header

#

look at my name

#

and in the left

#

it hasnt outlined it fully

#

also i want an outline for the message

glad escarp
#

just wondering if a widget of a constantly updated leaderboard of loyalty points (from twitch) is possible. ive tried messing with iframe, but i dont know how to embed the streamelements leaderboard link correctly

viral patrol
pulsar willow
# wise galleon Any way to tilt a stream label? I was able to rotate the label's div, but it get...

I think the easiest solution would be to also

  • set the div's width to a value smaller than the dimensions of the widget and
  • increase the widgets height.

So basically you create enough space in the container to show the whole widget while rotating.

CSS:

  width:100%;
  height:100%;
  
  /* elements are centered*/
  display: grid;
  place-items: center;
}

img {
  max-width: 80%;            /* img's width < widget width */
  
  animation: spin 5s infinite linear;
}

/* animation stuff */
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}```

would result in something like:
wise galleon
pulsar willow
#

@wise galleon the other option I can think of, is to rotate the browser source itself in OBS 🤔

serene turtle
hardy walrus
#

Don't think you're doing something possible.

#

And that endpoint is for literal message sending only.

wise galleon
serene turtle
willow shore
#

Is there an option to get more then one JWT-Token for an Twitch-Channel?

viral patrol
#

But do not share it anywhere, use it only in environment you manage.

#

That includes: do not use it within your widgets.

willow shore
#

Thx

elfin arch
glad escarp
#

Any way to create an autorefreshing loyalty points leaderboard widget?

serene turtle
#

It uses the same scope as /subscribers and that is able to activate with the say endpoint. So I don't think it's a scope issue.

elfin arch
#

hmmm... i knew it was in the IRC stuff but didn't know you could do it manually in the chat

serene turtle
#

yeah, it just doesn't show up in the autofill. Probably because you can't get the message uuid easily from chat.

elfin arch
#

it's odd that the other slash commands work but not that one. i'll have to play with it some more

small saddle
#

Hello guys, Sorry for my horrible English, I'm using the translator.

I have a doubt. I would like to automatically update a twitch subs goal for a specific month.

Using the API https://twitch.center/customapi/math?expr=${channel.subs} this variable reduces the number of the sub if not renewed. Example: In this month I need 250 subs but currently I have 290. In the month that started yesterday I have 19 subs. I'm using this to show this number $ {customapi.https: //twitch.center/customapi/math? Expr = $ {channel.subs} -271}

Has some way of not reducing the number of subs when a person doesn't resub ?

lilac sparrow
viral patrol
#

@small saddle Twitch doesn't fire expired sub event, so this data is updated periodically

#

And about OAuth2 - Credentials are not handled to private users, business inquires are analyzed case-by-case, and there is no guarantee that your company will obtain one.

north flare
#

Is there a way to use StreamElements API with insomnia? I've trying and I cannot get any information. It says Internal Server Error 500, where do I insert the Authentication Bearer as a Header or in the Auth part setting Bearer Token?

wide fox
#

Ah I see @viral patrol - thank you! So do I remove the {{sender}} or the username-container?

glad escarp
#

Any way to create an autorefreshing loyalty points leaderboard widget?

pulsar willow
#

I am reading the Kappa documentation in particular the "bot" section, but I am looking for examples and tutorials for me to create my own bot, I need to receive commands locally and process them for live interaction with my own equipment, it seems to me with Twitch this is feasible, but I would like to centralize everything in StreamElements.

pulsar willow
# pulsar willow I am reading the Kappa documentation in particular the "bot" section, but I am l...

I believe I found what I was looking for here: https://docs.streamelements.com/docs/node-js-connection-to-api

StreamElements
Node JS Connection to API

In order to connect and authenticate with Node JS towards our API you will need to have Axios, a .json file with config parameters in it and the JWT token inside the .jsonExample Code uses both TMI ( https://dev.twitch.tv/docs/irc/ ) and our API to fetch a username from chat and then adds points for...

viral patrol
willow shore
# 
# curl --request PUT --url https://api.streamelements.com/kappa/v2/points/5eb0b963d2faae839bae6ba5/echtkpvl/1 --header 'Accept: application/json' --header "Authorization: Bearer My.Token"
{"statusCode":403,"error":"Forbidden","message":"No channel authorization found"}```

I've got all permissions for this channel, why can't I use the API? On streamelements.com I'm able to add/reduce points
/edit My permission level ist "Editor"
elfin arch
#

what's this /echtkpvl/ ? 🙂

willow shore
#

The User

elfin arch
#

the target to add points to?

willow shore
# 
# curl --request GET --url https://api.streamelements.com/kappa/v2/points/5eb0b963d2faae839bae6ba5/echtkpvl --header 'Accept: application/json' --header "Authorization: Bearer My.Token"
{"channel":"5eb0b963d2faae839bae6ba5","username":"echtkpvl","points":5165,"pointsAlltime":5710,"watchtime":3940,"rank":3}
willow shore
# elfin arch the target to add points to?

correct. With my own channel it looks like this:

# curl --request PUT --url https://api.streamelements.com/kappa/v2/points/5ee965f8ad80cc04f4b8348c/echtkpvl/1 --header 'Accept: application/json' --header "Authorization: Bearer My.Token"
{"channel":"5ee965f8ad80cc04f4b8348c","username":"echtkpvl","amount":1,"newAmount":100,"message":"Added 1 points to user echtkpvl"}
elfin arch
#

i'm not familiar with the curl requests.... but ya; want you have looks right

#

are you thinking it is a scope issue? using your token to PUT to anothers account?

willow shore
#

Yes I think it's a scope / permission issue (as the response said). I think there sould be an option for streamers to permit others (in this case me, the "manager" of his community) to use their JWT-Token for development so he doesn't have to give his own to me

elfin arch
#

have you tried using your own JWT with their ID ?

willow shore
#

I don't have his JWT-Token, so yes I've tried

elfin arch
#

oh... or is that what you are saying 🤣

willow shore
#

yup ^^

elfin arch
#

🤔 in my head. that should work; your JWT should give you perms (as a manager to the endpoints)

willow shore
#

So let's wait for a dev to awake 😄

elfin arch
#

it's a holiday Sunday 😉

willow shore
#

And I'm from germany, here it's 1pm ^^

elfin arch
#

it's still sunday... and still a holiday 🤣

#

... i like your posts though; thank you for posting code and knowing the issue.

willow shore
#

Thanks. I work in an IT-company and know the issue with missing details in tickets ^^

#

Thank you alot ❤️

austere blaze
#

Is anyone aware of a method of where i can add have stream element points a step in a giveaway in like gleam.io or givelab? Something that having loyalty points will give entry tickets along with joining my discord for example?

#

I bet that will solve a lot of giveaway problems for streamers where people just register and snatch a prize from the hands of loyal viewers

elfin arch
#

it depends on your location and the laws in that area. both country and state

austere blaze
#

I got you yeah i heard abt some legal aspects of it but if u can link the loyalty points to something that would be helpeful as well

glad escarp
whole mural
#

is there a way to wrap an entire css to move everything together?
I have the below, which I've changed the image it sits on, and want to move everything as one, as I've only noticed the issue with the image clashing with another after setting all the positions of what I have for the below and the other alerts on a different overlay
html

code removed

pulsar willow
whole mural
#

will what you have written achieve that?

#

definitely seems to

whole mural
atomic pumice
#

Howdy! I've got an overlay which has a number of names [text widgets] on it which change from week to week (think something like a twitch race channel where the racers are different from week to week). I was looking at the API [https://docs.streamelements.com/reference/overlays] and noticed that there aren't any obvious ways in the overlay section to update widgets, though there is a way to get a list of widgets.

Question: Is it possible to update widgets in an overlay via the API?

(I did a quick search on here and didn't find anything obvious, but I may be asking the question incorrectly.)

EDIT: If this is the incorrect place to ask this, let me know and I'll delete it.

hardy walrus
#

@atomic pumice right place. Slightly wrong docs.

#

"Updated" link is inn channel topic.

#

And yes you can to my understanding.

atomic pumice
#

Ahh, my mistake. For this new one, it still only seems to allow GETs for the /overlay/{channel}/{overlayId} --- I might be looking in the wrong place on here, so I'll check out some of the other endpoints real quick.

EDIT: I don't see much here for that documented, though I might be overlooking something. There are a few structures in OTHER that look like Widget structures, but no POST / PUT commands to update them. :'[

viral patrol
#

@atomic pumice The easier way is to do this all the way around - like widget fetching data from external sources. This will allow you updating data inside widgets without dispatching requests that may be heavy.

atomic pumice
#

Ah, you mean like, use a custom widget that's pulling data from somewhere else (some kind of place I have my data in) and have that function like a Text Widget / Image Widget?

gritty oar
#

Hello guys, I need some help here please!
English is not my native language but I'll try my best to be clear and express what I mean!

I don't even know if this is the right chat support, if I'm in the wrong one, please redirect me!!
Yesterday I spend some time trying to use a custom font in my overlay, installed the font in my pc and got to use it! It was working fine, so I configured all my overlays with this font. Ended up looking just like I wanted!
Today I woke up, opened up my OBS and to my surprise it was not like I left it yesterday. The custom font I was using was not being recognised anymore and I couldn't get it to work again.
(Today I switch my Internet provider so I could get a faster connection, but I don't know if it has anything to do with it_

rapid pecan
#

I could be totally wrong, but I thought at one point in time I saw a setting for user's getting set to regular status. Is this no longer a thing?
Course I could be 100% confused as well.

viral patrol
#

@atomic pumice More like custom widget which is able to perform XHR calls.

#

@gritty oar More possible issue is that OBS cache that tricked you. ISP shouldn't affect code ;-). You may want to clear this directory: %appdata%\obs-studio\plugin_config\obs-browser\Cache

atomic pumice
#

I did spend some time looking at custom widgets and messing around with them (they're pretty cool, I didn't know all of what they could do before that) but I think because my use case requires users (who won't necessarily know html) to be able to go into the overlay editor and change the text manually if necessary, I won't be able to use the custom widgets at this point.

For the use case I needed, though, I think custom widgets may be overkill. The process I needed would be: get list of widgets with properties etc, edit that payload to change the text in a few widgets, and PUT / POST that back to the API. It would be a straight-forward get-and-set.

But I think after looking around, the "PUT/POST" part for Streamelements doesn't exist yet, which is okay. It was a little thing I was seeing if I could make less manual, no biggie.

vivid niche
#

Hey guys, I am having an issue getting live events from the StreamElements websocket API. All test events work when using event:test, however I cannot get live events working when swapping over to just listen to event.

vivid niche
#

After looking into it more... it seems the test events are coming in a completely different format than that of live events. Is this expected and documented anywhere?

UPDATE:
I did find a schema that seems to only take into account live events, but again there is a mismatch between test and live events and their formats. Additionally, it seems the live event format does not provide a way to determine gifted subs. Am I missing something?

mortal wagon
#

Can someone please help me convert this from being a Nightbot command to work with SE... Cannot figure it out 😦

$(eval let r=$(urlfetch json https://a.roguetrader.com/graphql?query=%7BdashboardSummary(type:%22nukecodes%22)%7Bid%20results%7D%7D).data.dashboardSummary.results;let s=new Date(r.range[0]);let e=new Date(r.range[1]);"Codes for "+(s.getMonth()+1)+"/"+s.getDate()+"-"+(e.getMonth()+1)+"/"+e.getDate()+" Alpha: "+ r.codes[0].alpha +" Bravo: "+ r.codes[1].bravo +" Charlie: " + r.codes[2].charlie+"")

I get these when i replace the (eval let r=$( with just $(urlfetch and end the thing with }
https://thecynicalkitty.com/s/20210699266.png

Then if i try remove the json part of the URL i get this
https://thecynicalkitty.com/s/20210622295.png

#

@ me if ya reply please.

swift ibex
#

So I know nothing about coding custom widgets, just trying to get a gauge on how hard it would be for a donation goal to trigger an animation or display a gif once the goal had been met?

#

Wondered if anyone had advice, and this seemed like the best place to ask. 🙂

pulsar willow
#

@swift ibex I think those two custom widgets do something similar to what you described.
(You can find both in #widget-share)

Goal Widget (posted 2019-06-11)
#widget-share message

Presentation: https://streamable.com/hhzxgn

Circle Goal (posted 2020-12-07)
#widget-share message

Presentation: https://www.youtube.com/watch?v=0iouzVF7csg&t=175s

Maybe they can serve as a basis for what you would like to build?

While editing the widget, you can examine/change the code under Settings -> Open Editor.

HTML - defines the structure,
CSS - defines how it looks,
JavaScript - defines the logic (evaluates events like donations, etc.),
Fields - defines the Widget UI,
Data - keeps track of the values set in the UI.

Streamable
2020-11-24 16-30-18
▶ Play video
YouTube
MrBoost
StreamElements Active Viewer and Follower Widget Setup

Install Link: https://strms.net/goal_widget-by-mrboost

▶ Play video
viral patrol
mortal wagon
#

😦 awww oka

mortal wagon
willow pawn
#

Hello devs ! I just learned that alert box has a memory limit, but I was wondering if the memory is shared between all kind of alerts or if each types of alert has it's own memory limits ?

#

Ok I think I figured out that it's shared

hardy walrus
#

@mild cipher Assuming my literacy skills are on point this would basically return the contents of the pastebin with each line as separate messages? $(customapi.https://api.thefyrewire.com/twitch/pastebin/88PmMG0B?return=all)

timid zenith
#

why my obs show failed to find locale/en-us.ini ??

cinder pike
#

not 100% sure where to put this but I accidentally blocked one of the people who donate to me when trying to clear it out. How do I get them unblocked?

spring ingot
#

heyy how do i setup a dayily sub cound

#

count

keen storm
#

I have an issue with my alert box widget overlays. It doesnt allow me to switch the picture for the cheer widget and never emulates the right picture, just the template. I did the same for the follower and the subscribe and they both work. I tried to switch the video/picture for the tips and it only emulates the template. Why wont it ever switch for the cheer widget? HELP!

ocean fractal
#

Howdy y'all! I'm having trouble with my custom widget. I can't seem to get padding to work right. I've got the the width and height of an element to be set to 100% of the container, yet when I try to apply padding, my child elements seem to be pushing off the page

#

there's some missing content on the right

#

(also, sorry, css is messy 😅 )

elfin arch
ocean fractal
#

shouldn't the 100% be calculated after padding is applied?

#

that was my assumption, at least

elfin arch
#

It does both... i hate CSS 🤣

ocean fractal
#

hekk

elfin arch
#

try to add box-sizing: border-box;

#

that'll include the padding in there

ocean fractal
#

woah that worked!

#

thank you!

#

I guess I could have done like a calc(100% - 20px) for the width and maybe that would have worked as well, but that's too smart for me lmao

elfin arch
#

no problem. ya the calc would work as well 😉

sharp vault
#

Apologies if this is the wrong place to ask this, but i'm looking to make an overlay for an event I have coming up that will have chat split into 2 separate boxes. One chat box will have "regular" chat, that filters out any text/commands that starts with an exclamation mark.. and one chat box shows only chat that starts with commands/exclamation marks. Does anyone know if this functionality exists already tucked away somewhere, or if it would be easy to make? maelstromThinking

tribal zenith
mild cipher
hardy walrus
#

Yeah. I actually looked at it a bit more and I'm thinking index might be closer.

#

But as far as my intended result it would basically treat each new line within the paste as a new message and go through until finished.

#

Basically the closest to a line break response without the ugliness of what it actually shows.

mild cipher
#

Ah, yeah, index will return a specific line, but will automatically loop back to the start once you reach the end. e.g. if you have three lines and the index is 4, the first line is returned

hardy walrus
#

Fak

#

Is there nothing close enough that does that but only 1 sequence?

#

Or is that what index does? Start at line 1 if chosen and cycle to end or does it repeat?

mild cipher
#

It repeats

#

I think it would probably be possible with filters, but you would need to structure the paste like so:

:[1] kajsdkla
:[2] alsjkdlkasd
:[3] lkajsdkkajds

then ?filter=1 would return the first line, and ?filter=4 won't return anything (i.e. no response from the bot)

#

(instead of the number it would be your $(count) counter - ?filter=$(count countername))

fast snow
tiny rose
#

Hello guys, i'm having a trouble here and idk how to solve... i've created a command with ${redeem storeitemname}, the store item has TTS on and it's redeemable by chat, store, extension etc. But, when someone redeem it by chat, it only reads the first word. Example:
!commandname testing my store item TTS. It'll only read "testing", but when i redeem by store, it works perfectly. (look the image)

unknown.png
solemn viper
#

does anybody have a command for random messages that pop up and i what points taken away if they got a bad roll
and add if they get a good roll

foggy cargo
#

I am having a issue with the S2 Shoutout Widget by @leaden bay. There are some users that when shouted out, it either repeats the last user that was shouted out OR If I refresh the pages cache, it just says "UserName" Any help there?

pulsar willow
#

Hi, I want to create a command with random responses. I tried Fyre API & Pastebin, but I didn't succeed to get it done.
What's the :id ? Where and how can I specify it?

Basically I want a virtual bar in my stream where viewers can type: !bar and get a drink from the list in response.
This is what I put in the command bar of Streamelements: ${user} $(customapi.https://pastebin.com/edit/XHeCQJhd)
But I get some code in response ...

viral patrol
#

@pulsar willow Basically the :id parameter is XHeCQJhd from your URL you pasted above

#

@solemn viper There is no direct way to alter points from chat beside bot modules (section on webpage) and custom games using 3rd party proxy (check widget-share channel)

hardy walrus
#

$(customapi.https://api.thefyrewire.com/twitch/pastebin/idcodehere?........)

#

You'd use it like that replacing the code along with the "variables" at the end.

pulsar willow
#

Thank you!

surreal stone
#

Hi everyone, does anybody know how to get music to my overlay countdown? (Stream starting, Stream ending)

severe shell
# tiny rose Hello guys, i'm having a trouble here and idk how to solve... i've created a com...

If you want the entire sentence to be read out loud, you have to change your command to:
${redeem storeitemname ${1:}}

That means it will read the 1st word until the last one. In case you want to read only the 10 first words (just to give an example and you understand what I'm talking about):
${redeem storeitemname ${1:10}}

(Aproveitei e deixei o follow lá. Vi que faz redes, então temos algo em comum 😉 )

fast snow
viral patrol
#

@fast snow Hi. At this moment OAuth2 requests are on hold.

#

For personal project (used by yourself) I recommend using JWT for authenticating calls. If you represent a company that serves streamers, the only way is OAuth2 credentials, and for that I could ask dev team, if we can do anything.

fast snow
#

@viral patrol well i was talking with you before you made the new api more then a year ago, because some of the 500+ danish streamers i have using my system atm on streamlabs wants to be able to use elements instead. I would like to accomodate them and add support for it aswell, as your api now supports what i need. I cannot create oauth credentials tho. So you'll have to help me there.

viral patrol
#

@fast snow Let me ask around about that. It is weekend, so response can be delayed.

fast snow
surreal stone
west jetty
#

Hi, I’m developing a custom widget, and I don’t get why anytime I make a HTTP call it is made several times… be it SE_API or a request to a 3rd party service. It’ll give me something like the screen capture below, where wizebot event received is logged just before the HTTP call, indicating that the function is indeed only called once, but that the calls are duplicated.

So what happens is I log my event, I make that HTTP call, and the browser makes four subsequent requests, blowing up my rate limit. What could be a cause for this?

Thanks in advance.

Here is my code, in case I’d be missing something really obvious https://pastebin.com/pHEgei5Z

unknown.png
blazing patio
#

@viral patrol Hi Lx! I am having trouble setting up the GoFundMe alerts. Is there anyway you could help me?

elfin arch
blazing patio
elfin arch
#

The test alerts appear just to be to check the visuals and aren't actually linked to the campaign.

blazing patio
elfin arch
#

on the gofundme link use the https://www.gofundme.com/f/xxxxxxxxxxxxxxxxxxxxxxxxx xxxxx part in the widget

blazing patio
blazing patio
gleaming dove
#

hi got anyone a api for "host" command? thanks

elfin arch
elfin arch
blazing patio
elfin arch
#

it is the short name of the campaign

gleaming dove
#

i got one but no more work idk why

blazing patio
elfin arch
#

say this is the campaign https://www.gofundme.com/f/this-is-the-short-name?qid=d5bdaf839a8d60 ; you would put in this-is-the-short-name

#

with the dashes

blazing patio
#

okay cool so I did it right

#

and with the console I can check if it is working?

gleaming dove
hardy walrus
elfin arch
blazing patio
elfin arch
#

that looks like it connected!

blazing patio
elfin arch
#

no problem. good luck!

gleaming dove
hardy walrus
#

Yes

gleaming dove
#

crunch

#

bro

#

/ sis*

#

u got some of / from decapi?

hardy walrus
#

Does it look like this?

Screenshot_20210409-215834_Chrome.jpg
gleaming dove
#

1moment

#

removed

bug.jpg
#

or iam to stupid maybe haha

hardy walrus
#

I mean the link you used.

gleaming dove
#

now this what u send

#

befor crunch api

hardy walrus
#

Yeah. This is no longer possible to use.

#

Twitch killed it.

gleaming dove
hardy walrus
#

Both use the same thing and no longer work.

gleaming dove
#

okay fug ^^ haha much chat no fix .. will see

#

thanks by this way / for time

calm birch
#

Sorry if this isn't the right place to ask this. I'm using the 'Minimal Chat' widget by MrBoost and I'd like to use a custom font. Is there a way to enable the 'Text Settings' for this, especially the custom font feature?

west jetty
west jetty
pulsar willow
#

Hii, how do I get this style (from Streamlabs, called Slick) with the eventlist from StreamElements?

unknown.png
surreal stone
#

Hi everyone, does anybody know how to get music to my overlay countdown? (Stream starting, Stream ending)

calm birch
west jetty
# calm birch Sorry about that! Here you go, a link to the post in <#457957557470887947>: htt...

There are already text settings, but they are indeed limited to Google Fonts. The easiest way to do what you want is to open the editor for that widget, go to the Fields tab, locate the fontName field and replace the "googleFont" type by "text", this way you’ll be able to set any font family you wish to use (provided that it is installed on your computer).

Don’t forget after that to go in the CSS tab and comment out the 2nd line, which tries to load the font you set from Google Fonts, which likely won’t work if you choose a non-Google one.

calm birch
next remnant
#

I haven't checked yet, but is there a, on alert start and on alert end kindof thing? I think there were key values to print certain values?
That are available unrelated from the API

pulsar willow
#

Would the code below make it more likely that an external image has been loaded when it is needed in the widget? 😅

    let preImg = document.createElement('link');
    preImg.href = url;
    preImg.rel = 'preload';
    preImg.as = 'image';
    preImg.id = 'preloadedImage';
    
    document.head.appendChild(preImg);
}```
for example:
```let url = "https://some.website/abc.png";
preloadImage(url);
...
let imgTag = document.createElement("img");
imgTag.setAttribute("src", url);
document.getElementById('imgContainer').appendChild(imgTag);```
https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content
Preloading content with rel="preload" - HTML: HyperText Markup Lang...

The preload value of the element's rel attribute lets you declare fetch requests in the HTML's , specifying resources that your page will need very soon, which you want to start loading early in the page lifecycle, before browsers' main rendering machinery kicks in. This ensures they are available earlier and are less likely to block the page's...

next remnant
#

What's that Data tab, and why does it look broken?

unknown.png
next remnant
#

Is it related to the data injection thing, like described in javascript tab by default?

west jetty
next remnant
#

Well, each time I open data tab I see this in the console TypeError: Cannot read property 'first' of undefined 🤷

#

Is there something like {{message}} that does not turn into HTML?

west jetty
#

That is beyond my knowledge, data should just present you with a json editor representing the saved state of your settings, I have no idea why you’re having an error when opening that tab…

next remnant
#

🤷 idk either I'm on Chrome, does this happen to you there aswell?

#

Wait, why does my console.log not log anything? Huh?

#

What's happening to it?

next remnant
#

is there a streamelements made function for console logs?

#

or idk, maybe it gets executed to early somehow? somewhere? if that's even possible

west jetty
#

If a console.log is ran in your widget, it will show up on your developer tools. If it doesn’t show up it means it didn’t run, either because of an error beforehand or just because of your code.

next remnant
#

Wouldn't the error then be in the console aswell?

#

Because there was none

#

I even tried <script></script> in HTML

tribal zenith
#

you may have an error in your JSON syntax in your fields

gleaming dove
#

hi me again, got any one a api by the way for host command? !host -> text: Thanks to host: Name, Name, Name, ... ?

#

thanks btw

next remnant
rose crown
#

Hi! Where can i find the available datatypes for fields in StreamElements custom widgets? Is there an array/list datatype?

unknown.png
hardy walrus
#

@rose crown 3rd link in channel topic might help.

pulsar willow
#

@gleaming dove Since the API on which those 'hosts'-commands were based on is no longer available, the only workaround I can think of is a custom widget that gets triggered by the specified command.

I modified lx's "Cinematic ending" and "Bank Heist chat game" widgets to create a prototype:
https://jsfiddle.net/u7msxen4/
https://pastebin.com/xaQ9La24

To test it you would need to create a custom widget -> settings -> open editor -> copy the code in the individual tabs (pastebin goes in 'fields').

It uses the https://jebaited.net middleware to post messages to the chat.
In lx's description of the 'Bank Heist chat game' (#widget-share) is a short tutorial video on how to get the needed token (https://streamable.com/o3amrn).
In this case, you would only need a token with 'botmsg'-permission.

Please note, that I did not test it extensively. It's just a prototype.

I will post this also to the german support channel, since the user asked it there, too.

'hosts' Workaround Widget - JSFiddle - Code Playground

Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.

Pastebin
Fields for 'hosts' Workaround-Widget - Pastebin.com

Pastebin.com is the number one paste tool since 2002. Pastebin is a website where you can store text online for a set period of time.

MySmallProject | Login

Login page

tribal zenith
pulsar willow
surreal stone
#

Hi everyone, does anybody know how to get music to my overlay countdown? (Stream starting, Stream ending)

viral patrol
#

@pulsar willow You can use negative number there to remove points. There is no "set" mode available, but you can make a call to get points and then to subtract all of them.

#

@surreal stone You can play audio objects via JS with a widget and put them to proper overlays.

surreal stone
#

Okay thank you very much! 🙂

viral patrol
tribal zenith
#

or just use Desktop audio...

west jetty
#

@surreal stone Is there something specific you’re trying to achieve by playing music in your web overlay? What’s stopping you from playing music on your computer when you show the countdown scene?

surreal stone
#

Cause there are multible things which are shown in the overlay like sponsors or newest subs and stuff like that. If I record it, it would show nothing in these boxes evertime. And yes, I got a musictrack that i wanted to put into my overlaycountdown. But I don't know where to put the music file or data...

#

Does anybody know where to put the music data?

west jetty
#

It’d be infinitely more simple and offer more control

pulsar willow
# viral patrol <@456226577798135808> You can use negative number there to remove points. There ...

thanks for the answer! @viral patrol 👍

$(customapi.https://api.jebaited.net/addPoints/TOKEN/${1}/$(customapi.http://api.mathjs.org/v4/?expr=round(random(-50,100))))"

  1. $(customapi.https://api.jebaited.net/addPoints/TOKEN/USER/AMOUNT)
  2. $(customapi.http://api.mathjs.org/v4/?expr=round(random(-50,100)))

If !somecommand has the above definition, would !somecommand user1 ...

  • add up to 100 points to 'user1', or
  • reduce the points of 'user1' for up to 50 points?
surreal stone
#

I know and thank you for the idea. But i'm a little bit lazy and I don't want to do it in every stream... Isn't there any way to get the music into the scene?

west jetty
#

@surreal stone drop the music file in your OBS or XSplit scene? It works exactly the same and is easier. If you’re dead set on putting the music file in your overlay, I have no idea how you could do that. You might find a pre-made spotify or YT widget to play the music/video from the overlay, but I don’t know any.

surreal stone
#

Ok thanks for your help! I appreciate it. 🙂

fervent plank
#

hey guys, I found no bug report channel, but the streamelements site is always redirecting me to home page, even logged, from any page I go

mortal knotBOT
gloomy kestrel
#

^

fervent plank
#

damn it worked

#

thanks

gloomy kestrel
#

You're welcome

next remnant
tribal zenith
next remnant
tribal zenith
pulsar willow
#

is it inside of an if-clause that isn't evaluated, because the condition is false?

or is it inside of the function "window.addEventListener('onEventReceived' ..."? (Which isn't called until an event occurs.) 🤔

next remnant
pulsar willow
#

is the right tab selected in your chrome console? 🤔

tribal zenith
#

it's linked in the channel description

#

can you put your html, css & js in a jsfiddle? Sounds like a major error somewhere

next remnant
pulsar willow
#

when you do ctrl + shift + j, the chrome console should show up.
does it say "console" on the very top?

if not, there should be a ">>", where you can select that.

next remnant
#

it's actually ">" and yes its the console

#

I thought you ment a tab within the console tab

pulsar willow
#

and there is no "console.clear();" in your code? (would clear any messages in the console)

very strange. 🤔

next remnant
#

fields is { } but probably doesn't make any difference

tribal zenith
#

okay, you were talking about an AlertBox not custom widget

#

Yes, they behave differently

next remnant
#

right

#

so how do I do this with an AlertBox?

tribal zenith
#

you can't log there, since it is it's own element

next remnant
#

Hm

#

Then, what is making the logs in the console

#

thaat somehow takes stuff from that element? Maybe its not, but

tribal zenith
#

do you know the concept of react elements?

#

it's basically an isolated, reusable element with its own logic

next remnant
#

hm, no but I heard of ReactJS before

#

so is this reactjs, server sided or client sided

#

or client sided but isolated? like what makes it not access things

tribal zenith
#

both, it has an events-cycle and each step does something different. So the main logic is server-sided, but events happen on the client.
So the logs you see come from a context you don't have access to

next remnant
#

so does it have its own console log as in

#

for event

#

like an event log?

tribal zenith
#

an event-queue yes

next remnant
#

uhh

tribal zenith
#

AlertBoxes are more meant for custom styling and appearance. For more in-depth logic you should consider using custom widgets instead

next remnant
#

wait does the server side code, ready the client events with time or whatever, on when they should happen?

tribal zenith
#

you mean the events? yes, they should only occur after each other

next remnant
#

but the server told the client when to send them before, right?

tribal zenith
#

The server just holds the queue and the client says "hey, I'm done you can continue" when it finished

next remnant
#

uhh okay and where does the continue stuff go

#

server tells client data?

tribal zenith
next remnant
#

hm

#

event message?

solemn viper
next remnant
#

is that what makes these?

unknown.png
next remnant
#

or is there no way I can tell the AlertBox, to end the alert earlier or send my own messages to the console?

tribal zenith
#

AlertBoxes have a set duration. Custom widgets can call SE_API.resumeQueue(); to continue early

solemn viper
#

Is there a way to merge YouTube and twitch alert box

next remnant
tribal zenith
#

why would you want that?

next remnant
#

customize alertbox

tribal zenith
#

sure, you can customize it visually. You just can't alter the queue

next remnant
#

D: ?

tribal zenith
#

Again, that's what custom widgets are for

next remnant
#

yes but custom widgets can't bring the UI the AlertBox has, with variations and stuff right?

tribal zenith
#

you could recreate them with fields, but you would have to handle the events yourself, yes

next remnant
#

fields? could bring a tab back?

pulsar willow
#

but there are a lot of custom-widgets in #widget-share which you could modify 👍

next remnant
#

it can bring this back?

unknown.png
#

can it or can it not?

tribal zenith
#

not with a clickable icon, but as groups

next remnant
#

so it can't 😐

#

but nooo D:

tribal zenith
#

this are groups

Unbenannt.JPG
next remnant
#

oh