{"id":1711,"date":"2022-03-12T20:05:52","date_gmt":"2022-03-12T19:05:52","guid":{"rendered":"https:\/\/hannes.enjoys.it\/blog\/?p=1711"},"modified":"2022-07-22T17:41:14","modified_gmt":"2022-07-22T15:41:14","slug":"fossgis-jeopardy-the-buzzer","status":"publish","type":"post","link":"https:\/\/hannes.enjoys.it\/blog\/2022\/03\/fossgis-jeopardy-the-buzzer\/","title":{"rendered":"FOSSGIS-Jeopardy: The buzzer"},"content":{"rendered":"\n

First in a series of very terse posts explaining and documenting the technical setup behind our remote video conferencing FOSSGIS-Jeopardy<\/a> game setup. Mostly meant as public backup and because sharing is caring. Maybe it can inspire someone else to build silly stupid stuff for fun.<\/p>\n\n\n\n

Here we are with the buzzer for the candidates to hit if they want to solve a task (aka ask the question to the presented thing<\/em>). I wrote this for a funny digital xmas party with the lovely colleagues at Civity<\/a> in 2020 and re-used it for FOSSGIS-Jeopardy 2021 and 2022.<\/p>\n\n\n\n

It’s using WAMP (basically PubSub via websockets) between webbrowser pages via the awesome Crossbar<\/a> + AutobahnJS<\/a> combo which I first used for the crazy https:\/\/findingplaces.hamburg\/<\/a> project.<\/p>\n\n\n\n

Yes, there is a random partyparrot<\/a> on each run.<\/figcaption><\/figure>\n\n\n\n

A admin page can be used to unlock a buzzer “button” (well, a parrot GIF in our case because we need more silly fun in life) on participants’ buzzer pages. Participants can then touch\/click their screen to “buzz”. The incoming buzzes are displayed visible for everyone with the delay since the buzzer was unlocked.<\/p>\n\n\n\n

This is obviously highly dependent on the participants’ latency, both on their device (touch\/click to network message) as well as from their device to the message router. A tab on a desktop browser in LAN will win against a mobile device in 2G if they’d hit it in the same moment. \u00af\\_(\u30c4)_\/\u00af<\/p>\n\n\n\n

There are two\/three components: The message router, the webpages and optionally a webserver (I used crossbar<\/code> as router which can also host static webpages)<\/p>\n\n\n\n

Ask me anything if you want to set this up following the amazing<\/em> instructions and fail.<\/p>\n\n\n\n

Install and setup crossbar<\/code><\/h2>\n\n\n\n
pip install crossbar<\/code><\/pre>\n\n\n\n
https:\/\/crossbar.io\/docs\/TLS-Certificates\/#using-lets-encrypt-with-crossbar-io<\/a> & https:\/\/certbot.eff.org\/instructions?ws=other&os=ubuntufocal<\/a><\/p>\n\n\n\n
Set up a realm and static web directory in a config.json<\/code>, e. g. something like this:<\/p>\n\n\n\n
{\n\t\"version\": 2,\n\t\"controller\": {},\n\t\"workers\": [{\n\n\t\t\"type\": \"router\",\n\t\t\"realms\": [{\n\t\t\t\"name\": \"YOURREALMHERE\",\n\t\t\t\"roles\": [{\n\t\t\t\t\"name\": \"public\",\n\t\t\t\t\"permissions\": [{\n\t\t\t\t\t\"uri\": \"com.example.your(sub)domainhere.*\",\n\t\t\t\t\t\"allow\": {\n\t\t\t\t\t\t\"call\": false,\n\t\t\t\t\t\t\"register\": false,\n\t\t\t\t\t\t\"publish\": true,\n\t\t\t\t\t\t\"subscribe\": true\n\t\t\t\t\t}\n\t\t\t\t}]\n\t\t\t}]\n\t\t}],\n\t\t\"transports\": [{\n\t\t\t\"type\": \"web\",\n\t\t\t\"endpoint\": {\n\t\t\t\t\"type\": \"tcp\",\n\t\t\t\t\"port\": 443,\n\t\t\t\t\"tls\": {\n\t\t\t\t\tYOURTLSSETUPHERE\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"paths\": {\n\t\t\t\t\"\/\": {\n\t\t\t\t\t\"type\": \"static\",\n\t\t\t\t\t\"directory\": \"web\"\n\t\t\t\t},\n\t\t\t\t\"ws\": {\n\t\t\t\t\t\"type\": \"websocket\",\n\t\t\t\t\t\"auth\": {\n\t\t\t\t\t\t\"anonymous\": {\n\t\t\t\t\t\t\t\"type\": \"static\",\n\t\t\t\t\t\t\t\"role\": \"public\"\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t\t\"options\": {\n\t\t\t\t\t        \"max_frame_size\": 20480,\n\t\t\t\t\t        \"max_message_size\": 20480,\n\t\t\t\t\t        \"fail_by_drop\": true\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}]\n\t}]\n}\n<\/code><\/pre>\n\n\n\n
I don’t remember anything about the options<\/code> part. It might not be necessary. I probably tried to stuff something more complex into the messages at some point.<\/p>\n\n\n\n
Then just run crossbar<\/code> as root because you used a single-purpose 2\u20ac VPS for this and you will delete it after the event anyways. Yolo! You should definitely secure your system, crossbar config and certificate and everything else properly otherwise. Seriously!<\/p>\n\n\n\n
crossbar start --config \/root\/config.json<\/code><\/pre>\n\n\n\n
Webpages for control and playing<\/h2>\n\n\n\n
Here you go: <\/p>\n\n\n\n
fossgis-jeopardy-buzzer-web<\/a>Download<\/a><\/div>\n\n\n\n
<\/p>\n\n\n\n
This is really really horrible and messy code, with lots of left-over bits, bugs and random snippets. But it works so who cares! I could not care less about its bEAuTy. Sometimes a banana is the right hammer.<\/p>\n\n\n\n