Problems With Exported Functions On Overlays

Hi All,

Im looking to get a bit of help with CasparCG 2.1.0. I’ve installed both client and server, then I grabbed a template file from github (https://github.com/CasparCG/html-graphics-boilerplate). I Built it as usual, but when I move the outputted template to a folder in the server/template directory and try to start it (via casparcg client) I get told in the server output that the exposed functions (play, update, stop) etc are not defined.

[2018-10-16 17:03:27.237] [13152] [info]    html[file://C:/CasparCG/CasparCG Server 
2.1.0/server/template/overlayTest1/INDEX.html] Destroyed.
[1016/170327:ERROR:renderer_main.cc(226)] Running without renderer sandbox
[1016/170327:INFO:CONSOLE(22)] "Uncaught SyntaxError: Use of const in strict mode.", source:     file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (22)
[1016/170327:INFO:CONSOLE(0)] "Uncaught ReferenceError: update is not defined", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (0)
[1016/170327:INFO:CONSOLE(0)] "Uncaught ReferenceError: play is not defined", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (0)

I tested it by dragging the index.html into a chrome browser. When I type “play()” into the console, it isrecognised as an exposed function so I’m convinced its something I’m doing wrong on the client/server but googling and documentation has not shed any light on what the problem could be. Can anyone help point me in the right direction?

For clarification I have attempted the above with my own custom overlay and had the same problem. Now that I am getting the exact same problem with a proven and working template thats what makes me think Its something I am doing wrong in the server or client config. Any help would be greatly appreciated. Thanks

Would be nice to see the config, when you think that something is wrong there :slight_smile:

Sure, I have not made any changes to the out of the box config:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <paths>
    <media-path>media/</media-path>
    <log-path>log/</log-path>
    <data-path>data/</data-path>
    <template-path>template/</template-path>
    <thumbnail-path>thumbnail/</thumbnail-path>
    <font-path>font/</font-path>
  </paths>
  <lock-clear-phrase>secret</lock-clear-phrase>
  <channels>
    <channel>
      <video-mode>PAL</video-mode>
      <channel-layout>stereo</channel-layout>
      <consumers>
        <screen>
          <device>1</device>
          <windowed>true</windowed>
        </screen>
        <system-audio></system-audio>
      </consumers>
    </channel>
  </channels>
  <controllers>
    <tcp>
      <port>5250</port>
      <protocol>AMCP</protocol>
    </tcp>
    <tcp>
      <port>3250</port>
      <protocol>LOG</protocol>
    </tcp>
  </controllers>
</configuration>

Sorry if this is not the config you were refering to, I’m happy to provide as much info as you need, just let me know.
Thanks so much for taking the time to help.

…that’s the right one. Can you also post the line from the log, where the command is shown, that plays the template?

Loading the template into the client and hitting F2 produces this output in the server console:

[2018-10-16 17:52:59.489] [20004] [info]    Received message from 127.0.0.1: CG 1-20 ADD 1 "overlayTest1/INDEX" 1 "}"\r\n
[2018-10-16 17:52:59.491] [7556]  [info]    Sent message to 127.0.0.1:202 CG OK\r\n
[2018-10-16 17:52:59.493] [13152] [info]    html[file://C:/CasparCG/CasparCG Server 2.1.0/server/template/overlayTest1/INDEX.html] Destroyed.
[1016/175303:ERROR:renderer_main.cc(226)] Running without renderer sandbox
[1016/175305:INFO:CONSOLE(22)] "Uncaught SyntaxError: Use of const in strict mode.", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (22)
[1016/175305:INFO:CONSOLE(0)] "Uncaught ReferenceError: update is not defined", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (0)
[1016/175305:INFO:CONSOLE(0)] "Uncaught ReferenceError: play is not defined", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (0)

I don’t know what happens. I see two strange things: first the “}” as argument to the ADD command. Can you try adding a data line in the lower right box in the client and see if there is a valid XML or JSON instead of the “}”. The second is the Syntax error concerning the const.

Ah, thats interesting, OK, this feels like progress:
After adding a key value pair (data:"") and trying the same again I get:

[2018-10-16 18:08:27.056] [20004] [info]    Received message from 127.0.0.1: CG 1-20 ADD 1 "overlayTest1/INDEX" 1 "{\"data\":\"""\"}"\r\n
[2018-10-16 18:08:27.057] [7556]  [info]    Sent message to 127.0.0.1:202 CG OK\r\n
[2018-10-16 18:08:27.059] [13152] [info]    html[file://C:/CasparCG/CasparCG Server 2.1.0/server/template/overlayTest1/INDEX.html] Destroyed.
[1016/180827:ERROR:renderer_main.cc(226)] Running without renderer sandbox
[1016/180827:INFO:CONSOLE(22)] "Uncaught SyntaxError: Use of const in strict mode.", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (22)
[1016/180827:INFO:CONSOLE(0)] "Uncaught ReferenceError: update is not defined", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (0)
[1016/180827:INFO:CONSOLE(0)] "Uncaught ReferenceError: play is not defined", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (0)

So the commands being issued by the client are having a curly bracket put in them? Any idea why that would be the case?

I think it was putting the closing bracket in there because I had “send as json” checked without a key/value pair, unchecking it results in this action being called by the server:

[2018-10-16 18:40:07.441] [20004] [info] Received message from 127.0.0.1: CG 1-20 ADD 1 "overlayTest1/INDEX" 1 "<templateData></templateData>"\r\n

Ultimately I will be sending data to the overlays and would prefer to do this with json but thats a concern for later. As a first step I just want to be able to get casparCG to recognise and trigger the exposed functions on the template I downloaded from CasparCG github repo. My best guess at this point, based on the information above, is that the problem probably revolves around the bundling of the js app. The biggest clue being the error message in the server output:

[1016/184050:INFO:CONSOLE(22)] "Uncaught SyntaxError: Use of const in strict mode.", source: file:///C:/CasparCG/CasparCG%20Server%202.1.0/server/template/overlayTest1/INDEX.html (22)

I think the exposed functions are failing because of strict mode. Is there a way to get CasparCG servers embedded chrome to allow const as a js declaration?