Scoreboard OCR for CasparCG [WIP]

html
template
development
server

#1

Hello everyone
I’m Diego from Argentina and after a while I decided to share one of the many projects/ideas that I’ve developed. I’m a professional software developer, and when I was learning NodeJS/SocketIO/etc, I came up with the idea to combine them to resolve this issue (getting info from the scoreboards). In my country almost every basketball event broadcast (tv/streaming) use a few cameras for showing the score and the timer on the scoreboard graphic also. I though that it should exist an affordable solution for CaspaCG too. I don’t know if this is going to be the right solution but I would like that you give it a try. Below there is a basic documentation and some videos. Thank you for giving us a great open source project like CasparCG!!

Scoreboard OCR

About

This is a prototype of web app (NO production ready) for getting info from electronic scoreboards using OCR detection (7 segment). It was created as a low cost option for working with CasparCG to have professional scoreboard graphics on sports event broadcasting.

Features

  • Detects/reads 7 segments scoreboards.
  • Send information directly to custom CasparCG html template (only html).
  • No more score or timer cam. You can use it even to read just the score and take out that task from the operator.
  • Master/slave node setup for reading info from different scoreboards (i.e. main scoreboard and shot timer).
  • Set the fields to read and then save them as a layout (for reusing them).
  • Control input/webcam settings (only on linux with uvcdynctrl).
  • Includes a javascript library for adding easily in any custom html template.
  • Log files listing and viewer for debugging use.

System requirements

  • CasparCG Server 2.0.7
  • CasparCG Client (optional)
  • Webcam or any input used as webcam (compatible with linux)
  • PC/Notebook or raspberry pi
  • Node.js v6.10.3 or superior
  • NPM v3.10.10 or superior
  • Windows command prompt console (windows) or similar application (Console). For linux you need a terminal.
  • A compatible browser (Chrome, Firefox, Chromium). All the development was tested using Chromium 58 x64.

Installation

For installing Node.js read the download section from the official site. This also installs npm (Node Package Manager).
Check the versions with the commands (console/terminal):

$ node -v
$ npm -v

Download the application file from here and extracted to a folder.
Go to the application folder and run this command (console/terminal):

$ npm install

And finally run this command (console/terminal):

$ node app.js

Now open a browser and go to this url:

http://localhost:3000

Now you’ll see the home page of Scoreboard OCR (only enabled from the same device because the input is the webcam). Allow access to the camera or use the demo mode, then start setting fields and sending info to the html template.
For testing use this html template as an example:
Download html template

How to use it

Go ahead and play with it


#2

Fantastic. Nodejs has been so instrumental in making broadcasts professional. Our local station uses a PIP for high school sports. So cheap looking when camera gets bumped.
Kudos for your work and sharing.


#3

Hi Diegot

Thank you very much for sharing this. i don’t have a use case for this on the moment,
but this is absolutly something to have in the toolbox. :slight_smile:

maybe you should have a look at this too
https://www.npmjs.com/package/casparcg-connection

it could probally make it even more universal

again thank you very much for sharing this !!
it will definatly help out some of us

LS
Maurice


#4

Cool work! Thanks for sharing.
Now i have to learn NodeJS …


#5

Thanks for the comments.

@rcourtney I agree with you about nodejs. I think that html templates open a new world of opportunities, brings all the universe of web technologies (nodejs, svg, css animation, etc) to make dynamic graphics. Take for example the work that was made for the archery streaming. When html templates can handle 3d animations in Caspar that will be another new level. I made this tool trying to solve that issue (clock cams), the ideal solution would it be that the scoreboard have had an read only data interface (websocket, osc, socket, etc) that you can subscribe to (you as a broadcaster, streamer, bet page, etc) and receive the score in real time. I hope this can be useful on you local station to improve the quality.

@Maurice78 thanks for you comment and suggestion. I already use casparcg-connection for other clients (one general client and another just for twitter) but in this case I made a software architecture’s decision. We know that Caspar can handle acmp commands and in some cases many times at once for example update calls for a clock template, but I think when you expect to have update/calls in a range of milliseconds the performance of the server can be affected. Also every time you add a layer of processing you’re adding a delay in the response, that in this case we’re trying to reduce/avoid to get real time precision (clock). For this tool I applied the separation of concerns, I use Caspar for controlling the presentation and some initial settings and leave the html template deal with the data updated in real time (send by the web app). Maybe you can have different Caspar servers to handle the load (I really have no idea on broadcasting workflow) but I don’t know if it’s possible on low budget. Finally about the solution to be more universal you’re right, it’s restricted to html templates, but I created a library/client (I have to rename it to avoid confusion) in javascript so you can easily add it on your own template and not worry on how to deal with SocketIO library

@peteraellig Thanks for you comment. No need to learn NodeJs If you going to use just the html template, I made a javascript library/client to add it to any custom template who handle the connection to the web app. If you plan to use casparcg-connection for creating a client you will need NodeJs.

Sorry for my long comment but I wanted to express my opinions and why I took some decisions on creating this tool. I think that CasparCg give the possibility to have the same quality as a professional broadcast/streaming but with a low budget.