Server-based countdown clocks with multiple client viewers using Node.js and a Raspberry Pi

A few months back, I shared about the client-side countdown clock script that I created for our team to use. It worked pretty well for its purposes, using Dropbox as the platform to share and update data between the computer creating the clocks and the computer viewing the clocks. The initial goal was to create something that required no backend server and would be easy to run on any computer.

It served us well but we quickly outgrew it with the desire to be able to publish clocks in realtime, not simply relying on the viewer client to refresh itself every 15 seconds to look for new data. So, I created a server based solution using Node.js.

I decided I wanted to run this project on a Raspberry Pi 3 B+, so I picked up this kit on Amazon. I wanted an easy way to spin up a web server that wasn’t tied to any production machine, and this does a great job.

img_7113
Here is the Raspberry Pi 3 B+, neatly installed in one of the video racks. I’m using the HDMI output and converting it to SDI to go into our video system.

Dubbed TimeKeeper, this project runs an Express web server within Node and has a REST API, which allows the user to poll for existing data as well as create new entries. As new entries are added, they are sent out to all connected clients in real time using the socket.io library.

Screen Shot 2018-11-29 at 2.08.23 PM
Here is a screenshot of a web browser client. This is actually running on the same Raspberry Pi that is hosting the Node.js server, with Chromium in kiosk mode.

Rooms:
Rooms allow you to control and specify which timers appear. This is helpful if you are running clocks in multiple venues or instances, and only want certain timers to appear on certain viewer screens.

Timers:
Timers are the objects that TimeKeeper will count down to, based on the viewer’s current local system time.

Messages:
Messages can be sent and displayed on viewer clients.

After implementing the API, I created a Dashboard custom panel to interact with the server. This serves as the primary interface for our volunteers. Because the panel fetches new data from the server on a recurring schedule, multiple computers can have the panel open and all stay in sync about what timer and message objects are currently being displayed.

Screen Shot 2018-11-29 at 2.09.55 PM
Screenshot of the custom panel in Dashboard.

We’ve been using this software for a few months now and it’s working great! I intended to write about it sooner, but with a busy work and family life, finding time to write for this blog can be a challenge!

The next version will support trigger actions when clocks hit a specified time or run out. I also plan to integrate with other clock systems to show time left on video playbacks, Planning Center Online, etc., when I have the time!

If this is useful or helpful to you, I’ve made it available on my Github repository.

3 thoughts on “Server-based countdown clocks with multiple client viewers using Node.js and a Raspberry Pi

  1. Hi I am interested in trying out TimeKeeper but ran into a noob problem having cloned the the git repository and successfully run npm install when I try to run “node main” the server crashes with
    —–
    chuck@Vogon:~/Git/TimeKeeper$ node main
    fs.js:115
    throw err;
    ^

    Error: ENOENT: no such file or directory, open ‘timekeeper-data.json’

    —-
    Noting that no such file was cloned from the repository I created a blank file with that name but got the following error when I tried to start the server again.

    ——-
    chuck@Vogon:~/Git/TimeKeeper$ node main
    undefined:1

    SyntaxError: Unexpected end of JSON input
    at JSON.parse ()
    ….
    ——–
    Some pointers on how to get this going would be helpful.
    Thanks
    Chuck

    Like

    1. Sorry about that, Chuck! You’re on the right path, but I need to provide you a template file. I’ll add that to the repository in the morning and let you know when it’s up. You fixed the first error but the second error is because the file doesn’t have the correct structure.

      Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s