What is this
This project uses Svelte (JavaScript/HTML Framwork) to make a touch panel UI for Crestron touch panels.
Demo - https://trey.app/tp/
Setup
install Node.js from https://nodejs.org/ (16.16.0)
open a terminal to the root folder of this project
Install dependancies
install all the dependancies with the following command
npm install
Run
start project locally
npm run dev
or host it so anyone can get to it at your IP
npm run dev-host
Control+C to stop running the project
Build and Archive
run this to build the svelte project and make the .ch5z file
npm run archive
To change the config files
- Look in ./public/configs for example config files
- Load the config by pointing to it in the URL
- If you want to use the config file ./public/configs/examples/small.json and your processors IP is 192.168.1.1
- Your URL would be http://192.168.1.1/html/index.html?config=examples/small.json
- The file ./public/configs/config.json is the default config and will be used if no config file is specified
Icons
- Icons are Material Symbols (Rounded + Filled)
- https://fonts.google.com/icons?icon.style=Rounded&icon.set=Material+Symbols
- Find the Icon you want and copy the name
- If there is a space in the name remove it and put an underscore in its place
- Example: "Mic Off" becomes "mic_off"
To add a custom page
- Make a page file in ./src/pages
- Add page to "pageFiles" array in ./App.svelte
- Add page to pages in config.json
- Add to activity page or quick access top bar
VC-4 needs the websocket port (default 10000) though the firewall
https://linuxconfig.org/how-to-disable-enable-firewall-on-almalinux#:~:text=How%20to%20permanently%20enable%20or,above%2C%20will%20permanently%20disable%20firewalld.
https://linuxconfig.org/how-to-allow-port-through-firewall-on-almalinux
sudo systemctl stop firewalld
sudo systemctl start firewalld
sudo systemctl disable firewalld
sudo systemctl enable firewalld
VC-4 Text Console
journalctl -u virtualcontrol -f --all
Command to send for Control Subnet processors
STARTPROGRAMAFTERROUTER
Install Cockpit on AlmaLinux
sudo yum install cockpit
Enable Cockpit server management
sudo systemctl enable cockpit.socket
Start its Service
sudo systemctl start cockpit
Check the Cockpit Service status
sudo systemctl status cockpit
Home page
/var/www/html/
/etc/httpd/conf.d/welcome.conf
openssl req -newkey rsa:4096 -x509 -sha512 -days 365 -nodes -out certificate.pem -keyout privatekey.pem
openssl pkcs12 -export -out wss-cert.pfx -inkey privatekey.pem -in certificate.pem
"/opt/crestron/virtualcontrol/data/ssl/certs/server.crt"
openssl pkcs12 -export -out wss-cert.pfx -inkey server.key -in server.csr -in server.crt
Edge Cases / Things to consider
- Config file fetched doesn't exist
- Browser History for a SPA
- Screen Black out after X mins
- Since touch panels don't have a browser refresh provide a reload from any page
- Visual for WebSocket not connected
- Visual for WebSocket subscription not ready