Pdac Frontend

PDAC Frontend

Introduction

This is the development repository of a hybrid SSR (server-side) and frontend HTML webapp that acts as the visible user interface of the PDAC, displayed on the 3.2" touchscreen.

Once built, the exported and minified webapp is copied to pdac app folder¹ and launched at startup into Chromium browser with flags such as kiosk mode.

Threads

After launching the webapp creates a thread running the Python backend² API as well as it's own API for triggering utility scripts in pdac system folder³ like rclone to cloud.

Terminology

• pdac-backend - local API for triggering camera and miband data recordings
• directus - remote instance of Directus for defining training instructions
• exercises - directions for performers, ie. perform X for N seconds
• sessions - sequences of exercises

Modes

Sessions and exercises have two modes: RECORD and STAGE

• in RECORD the timing and start / stop events are used to trigger recordings
• in STAGE mode the timing and start / stop events are sent externally to websockets port 8765
• a third RECEIVER mode is accessed from the menu, and will visually display any text and instructions received from port 8765⁴

Modes and the location of the API must always be set as an environment variable (see package.json).

Training

In either mode Sessions and Exercises can be dynamically updated via a remote instance of Directus - the backend interface allows the director to create, edit and update training exercises. Perfomers are anonymised with a colour (also used as background colour of the GUI) and assigned a miband mac address. A copy of the last version of the database used is available as JSON in directus static backup⁵.

For demonstations and open source, the default setting is to use static copy of the Director API rather than a live API⁶.

Notes

¹ install app build dependencies with npm install --production
² see pdac-backend
³ created with spawn in server.js
⁴ sockets are client-side only in layout.svelte
⁵ for use with Directus v8.8.1 (>=9 not supported)
⁶ to switch from a static example to live API, edit config.js

• pdac contains essential information about USB formatting and rsync configuration
• pdac-backend contains information about API endpoints
• regieki-controller provides an application for remote debugging multiple PDACs

Status

Many of the API functions used here have gone on to become:

• ezapi - autoconfiguring API toolkit
• ezlib - utility endpoints for ezapi
• piapi - Raspberry Pi remote user interface

Instructions

cd /home/pi
git clone pdac-frontend --recursive
cd pdac-frontend 
pnpm i

Development

pnpm run dev

Build

pnpm run build

NB: pdac-frontend should be located side-by-side in it's directory see formatting notes

License

MIT