0

UDP command to HTML5 through Javascript

Bronson O'Quinn

March 01, 2018 19:01

None

Follow

I just want to preface this by saying that it might be really obvious and I'm just missing something. But I have an HTML page that uses Javascript to make a countdown clock. I have functions that can pause, play, or reset the clock. I've used the "Send User Variables to HTML" plugin to send User Variables and complete those actions. (Plugin available here; https://github.com/brightsign/BrightAuthor-Plugins/tree/master/Send-User-Variables-To-HTML)

However, I've found that I need to send UDP commands, not user variables. So, how can I receive UDP commands through Javascript/HTML?

Thanks in advance!

• Facebook
• Twitter
• LinkedIn

4 comments

• 1
  
  Lyndon March 07, 2018 04:50

   

  You want to send a udp command from brightscript to javascript? or you just want to listen for udp commands on the javascript side?

• 1
  
  Bronson O'Quinn March 07, 2018 16:16

  @Lyndon: I wanted to send a UDP command to a Javascript app. 

  Fortunately, I've figured it out. I'll post my answer here for posterity.

  var bsSocketMessage = new BSDatagramSocket();
  bsSocketMessage.BindLocalPort(5000);
  bsSocketMessage.ondatagram = function(e){
      var ta = document.getElementById("textArea");
      var command = String.fromCharCode.apply(null, new Uint8Array(e.getBytes()));
      if(command.toUpperCase().trim() == "RESET") {
          countDownDate = new Date().getTime() + 3600000;
          paused = false;
          ta.innerHTML = "Reset";
      }
  
      if(command.toUpperCase().trim() == "PAUSE") {
          paused = true;
          ta.innerHTML = "Clock Paused";
      }
  
      if( (command.toUpperCase().trim() == "PLAY") && (paused === true) ) {
          paused = false;
          ta.innerHTML = "Clock Resumed";
      }
  };

  I couldn't find a useful bit of code anywhere, but eventually pieced it together from the BrightSign documentation on BSDatagramSocket and various forum posts.

  Using the "GetBytes()" function, this returned a Buffer Array, so I had to use "String.fromCharCode.apply(null, new Uint8Array(e.getBytes()))" in order to convert to a string.

  As I said before, this controls a simple JS countdown clock. You can find that code here.

• 0
  
  Lyndon March 07, 2018 16:40

   

  I did recently post an countdown example my colleague created. The date is controlled a variable value..

  https://brightsign.zendesk.com/hc/en-us/community/posts/360001260654-Brightsign-Widget-Countdown-Timer-HTML

   

   

• 0
  
  Anton January 20, 2022 09:13

  @Bronson O'Quinn Thank you very much for this code. It has helped us so much!