sorry in advance for my lack of technical language!
So, what I want to do is a subscriptions counter for twitch that would be used in OBS (Open Broadcaster Software), I made the part that actually counts the subs in node.js (I actually have them to save the number of how many subscriptions happened in a text file). What I'm missing is the part that would show on OBS, the actual graphical counter which I made with html and CSS. I made so that when I run the node.js file it makes a local web server (localhost:etc) using the http.createServer().listen(port)
function with the html in it.
The thing is that I need to call a function (setValue()
) which is inside the java script script in the HTML file which changes the counter status (percentage and the bar filling) ... is there any way to do that?
the html script code:
<script type="text/javascript">
let reader = new FileReader();
class ProgressBar {
constructor(element, initialValue = 0) {
this.valueElem = element.querySelector('.progress-bar-value');
this.fillElem = element.querySelector('.progress-bar-fill');
this.setValue(initialValue);
}
setValue(newValue) {
if(newValue < 0){
newValue = 0;
}
if(newValue > 100){
newValue = 100;
}
this.value = newValue
this.update();
}
update() {
const percentage = this.value + '%';
this.fillElem.style.width = percentage;
this.valueElem.textContent = percentage;
}
}
var pb1 = new ProgressBar(document.querySelector('.progress-bar'),50);
</script>
You could use WebSockets
WebSockets are an alternative to HTTP communication in Web Applications.
They offer a long lived, bidirectional communication channel between client and server.