Tally counter web page to show items in broken/out fixed

Our venue has had a significant upgrade and there are now large screens which might as well do something useful, so I created a little page where we can display a tally count of broken items in and fixed items out. The default page is here http://creditonrepaircafe.org.uk/counter.html

I’m interested if this might be useful to anyone else, and to help that you can either save it to your PC to edit, also you can change the greeting (first line) or the event (second line).

  1. If you save the page to your PC you can display it locally, it’s all in one file and doesn’t depend on an internet connection.

  2. You can adapt it for your own event to display your own name by adding some parameters to the URL, for example adding ?event=The%20Repair%20Shop (%20 replaces space) to get http://creditonrepaircafe.org.uk/counter.html?event=The%20Repair%20Shop the page then displays that event name. Or if you want to change the greeting, add ?greeting=Hello%20from like
    http://creditonrepaircafe.org.uk/counter.html?greeting=Hello%20from. Or to do both put a ? before the first one and then an & then the second one like http://creditonrepaircafe.org.uk/counter.html?event=The%20Repair%20Shop&greeting=Hello%20from - these work just the same if you have save to file too e.g. file:///C:/Users/IANBarnard/Desktop/counter.html?greeting=Hello%20from

I could probably make some more things configurable in the URL if this looks useful.

Need to do some tuning to the CSS as the counters wrap around the page when viewed on my ipad. Teething problems, probably :wink: I’d make the up/down buttons more sophisticatedly positioned if I knew how to do it - any html/css experts want to contribute?


What a great idea Ian, thanks for sharing!

If this idea proves popular, it could be a nice addition to our discussion about using the Fixometer for live data entry:


In the meantime, I had a bit of time over the weekend to play around with the CSS. The code’s a little messy, but this should resize a little more elegantly:

1 Like

Brilliant, James - thank you!

Now, as per our message discussion, can We (I mean you, but I’m trying to be supportive/encouraging) create a per-event version of this which refreshes automatically and shows live counts from the fixometer (so no need for the +/- buttons)?

I added some info to the topic about live data entry https://talk.restarters.net/t/live-data-entry-at-events/1006

Try this one? counter.html (4.2 KB)
Its based on Bulma style framework which to some extent lets you do a lot of stuff without too much knowledge of CSS. Main advantage is that it tends to be pretty mobile-friendly out-of-the-box. I hate doing hand-crafted CSS so this is my go-to stylesheet.