Web client for HTML templates

We created easy to use and minimalistic Web Client to play/edit/update your html templates on CasparCG server.

2 Likes

Web Client supports preview of HTML templates using browsers [iframe], so you can control templates behavior before going on Air.
You can create playlists to organize titles order, move items inside playlist or append items to playlist.
We using NodeJS web server to connect Web Client with CasparCG and manipulate file system.
Some rules and restrictions are used for HTML templates to make server and client work stable.

Sorry Dmitrii,

Where is the Web Client?

Cheers
Chumby

Sorry Chumby, I have a issue with project location . I’ll upload it on github soon.

1 Like

1 Like

Great… will download and have a look Dmitri.

Is there anything special needed to get this system working?

Cheers
Chumby

Do you have experience with Node.js? Any way, you have to instal Node.js. Run app.js. Type localhost:8080 in browser, and have a nice day.

Thankds Dimitri - no experience with Node.js Will do what you suggest here. Thanks for putting this all together.

Cheers,
Chumby

Hi Dimitri,

I have installed node.js. I changed the config file within your app so that it pointing to my caspercg install. I started the caspercg server and then I ran app.js. All looks fine. When I go to localhost:8080 however, the webpage loads, but it is stuck on the …Loading message. I cannot get any further than that.

Is there a step I am not doing correctly here?

Cheers,
Chumby

This issue possible when the web client does not receive templates. The cause of it is wrong path to the folder with templates in the config file. We will fix this moment. Sorry for that.

CasparCG server version has to be 2.1.0 to properly run web client. Caspar versoins older then 2.1.0, do not send templates tag “HTML”, so nodeJS server can’t recognize wich templates are HTML.

Yes thank Klepa. Have the 2.10 BETA CasperCG running.

Cheers,
Chumby

The updated client are available on Git.

I’m stuck at “Loading…” too.

It’s taken me a good long time to get the config file to work, as the original has folder names with lots of spaces, which was confusing.

My working config file, which allows me to get to the server page, is -

{
“caspar_ip”: “localhost”,
“caspar_port”: “5250”,
“caspar_dir”: “g:/caspar/2_1/template”,
“ws_port”: “8084”,
“playlistdir”: “./playlist/”,
“archivedir”: “./archive/”,
“titleChannels”: “1”
}

Where the CasparCG server template page is g:/caspar/2_1/template .

Caspar receives a TLS and “Sends more than 512 bytes to 127.0.0.1”, but nothing happens on the webpage. The console says -

G:\caspar\caspar_html\Client>node app.js
auto reconnect in 5s
Server running on 8080…
ok
removed all files web server templates folder
Caspar tamplates folder copied to web server
1
websocket server started
Hello
{“service”:“toserver”,“command”:“getTemplates”,“layer”:null,“titles”:null,“id”:null,“channel”:null}
getTemplates
{“service”:“toserver”,“command”:“getPlaylists”,“layer”:null,“titles”:null,“id”:null,“channel”:null}
{“service”:“toserver”,“command”:“getChannels”,“layer”:null,“titles”:null,“id”:null,“channel”:null}
{}

The log file lists the CasparCg commands and all the contents of the template folder

I’ve obviously failed to do something, but I’m out of ideas now. Any guidance available please Dmitrii ?

Bernie

OK. I’ve sorted the “LOADING…” problem. It was because i was using another version of the server to experiment with, and started the wrong one. All my fault, sorry

B

I also have an error “LOADING…”. In Google Chrome have error:
Uncaught TypeError: Cannot read property ‘includes’ of undefined
at createTemplateList (script.js?n=1:453)
at WebSocket.socketMassage (script.js?n=1:245)
DmitriiPolyakov сan you help?

did you solve the problem?

Hello DmitriiPolyakov, may I get an example playlist file, I guess client not opening with empty playlist folder.

Best