Skip to content

HTML5 templates and control application for CasparCG for association football

License

Notifications You must be signed in to change notification settings

herzogmedia/football-graphics

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

87 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

XTV Football Graphics

Prerequisites

  • Node.js (tested with 8 LTS)
  • CasparCG Server (tested with 2.0.7 and 2.1 NRK)
  • CasparCG Client to load the templates (tested with 2.0.7 and 2.0.8)

Install Control

  • Inside the graphics-control folder:
  • npm install
  • bower install

Run Control

  • gulp

Set Up Caspar Templates

  • Copy the html-templates folder into your CasparCG Server templates directory
  • Load all the templates in Caspar using the CasparCG client on separate video layers on the correct channel and 'play' them.

Use Control

http://localhost:3000 (or the IP of the machine you have the controls running on)

Operation

Control

Team Settings

Screenshot

Set Name, Colour, Short name and players. Settings are applied immediately to the template.

The 'Picture URI' is currently not being used by any of the templates. Future development could see it integrated into the lower thirds, or additional templates for a teamsheet with photos or similar.git p

Player Control

Screenshot

All relevant match controls to show relevant lower thirds. 'Goal' also updates the Score.

Substitution Modal

Screenshot

Select an inactive player to substitute with.

Manual and Time Control

Screenshot

Set clock, stoppage time and adjust the score.

Look

Main Clock and Score

Screenshot

Score and clock, including over time and stoppage time, on display.

Yellow Card

Screenshot

Yellow Card lower third. By default all lower thids are displayed for 5 seconds, and are animated with animoJS animations.

About

HTML5 templates and control application for CasparCG for association football

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 53.9%
  • HTML 40.2%
  • CSS 5.9%