audiocontrol

Web frontend for:

HiFiBerry BeoCreate DSP (on BeoCreate Pi) — volume, parameters, profiles
Mopidy (local) — playback, queue, playlists
Snapcast (local) — clients, groups, volume

All APIs are proxied through Nginx — no CORS, no exposed ports.

Prerequisites (Audio Server / Pi 5)

sudo apt install nginx nodejs npm

Node 18+ recommended. Check with node --version. If too old:

curl -fsSL https://deb.nodesource.com/setup_20.x | sudo bash -
sudo apt install nodejs

Build

cd audiocontrol
npm install
npm run build          # outputs to dist/

Deploy

# Copy build output
sudo mkdir -p /var/www/audiocontrol
sudo cp -r dist/* /var/www/audiocontrol/

# Install Nginx config
sudo cp nginx/audiocontrol.conf /etc/nginx/sites-available/audiocontrol
sudo ln -s /etc/nginx/sites-available/audiocontrol /etc/nginx/sites-enabled/
sudo nginx -t && sudo systemctl reload nginx

Configuration

BeoCreate hostname

Edit nginx/audiocontrol.conf and update the upstream:

upstream beocreate { server beocreate.local:5005; }

Replace beocreate.local with the actual hostname or IP of your BeoCreate Pi.

Mopidy — enable HTTP extension

Add to /etc/mopidy/mopidy.conf on the Audio Server:

[http]
enabled = true
hostname = 127.0.0.1
port = 6680

Restart Mopidy: sudo systemctl restart mopidy

HiFiBerry DSP REST API — enable CORS (optional)

If you ever need direct browser access, the hifiberrydsp REST server may need CORS headers. Through Nginx you don't need this — the proxy handles it.

Snapcast

Ensure Snapserver is running and Snapcast's JSON-RPC WebSocket is on port 1705 (default).

Development

npm run dev

The Vite dev server proxies all APIs (edit vite.config.js to match your BeoCreate hostname). Dev server runs on http://localhost:5173

API assumptions

The HiFiBerry DSP REST API endpoints used:

Method	Path	Notes
GET	/api/volume	`{ volume: 0-100 }`
POST	/api/volume	body `{ volume: N }`
GET	/api/parameters	array of parameter name strings
GET	/api/parameter/:name	`{ name, value, min?, max? }`
POST	/api/parameter/:name	body `{ value: N }`
GET	/api/profiles	array of profile name strings
GET	/api/profile	`{ profile: 'name' }`
POST	/api/profile/:name	activate profile
GET	/api/metadata	`{ key: value, ... }`

Adjust src/api/hifiberry.js if your firmware uses different paths or response shapes.

2.5 KiB Raw Blame History