Front-end for the Teslonda Super Car Dash
- Used in conjection with Teslonda Server
- RPI setup
This project contains the front-end software to run the Teslonda Dashboard. This was used in conjunction with the Teslonda NodeJS server.
- Why HTML5? Why Angular? Why everything?? This was a rapid developed, prototype software to get something fun and rad up and running as soon as possible. By no means expect proper style guide technique or any tests what so ever. (I'm not a good role model) I chose Angular 5 with Typescript because I needed to get up to speed with those two technologies and I wanted to get as much bang for my buck when diving into a new project, also, I'm a glutton for punishment. Hey, this was done in my free time when I was trying to be a good husband AND being a Dark Souls fanatic.
The first screen started out as a 7" display at 800x480. It was mostly designed to run using the HTML5 canvas. Later on, the second screen was a 10" display, at 1080x720. The routes used for this was mostly just css3 widgets.
Binary Websockets are the main connection to the NodeJS server for the data.
See here
Feel free to contact me at cloroxman at gmail dot com. Or find me on Instagram
The stack is Angular 5; (on top of a NodeJS server with express). Default root route is the main dash screen; the /main
will load the add-on screen.
For the main/default route:
- When there is no active websocket connection, the dash will go into an "idle" mode where it will display a demo title screen, high score screen and a 'demo' dash screen.
- When disconnected from an active websocket screen, a "continue" screen will appear.
Then Run ng serve
or yarn start
npm start
for a dev server. Navigate to http://localhost:4200/
. The app will automatically reload if you change any of the source files.
This project was generated with Angular CLI version 1.6.3.
Run ng generate component component-name
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module
.
- Install NodeJS 10 or larger
- make sure you have the latest version of NodeJS (and Yarn or NPM)
Run ng build
(or through your package manager like yarn build
or npm build
) to build the project. The build artifacts will be stored in the dist/
directory. Use the -prod
flag for a production build.
ng build --prod --build-optimizer --aot
cp -r ./dist ../can-server/public
scp -r ../can-server/public pi@yourPi.local:/home/pi/can-server/
canplayer vcan0=can0 -l i -I ~/can-server/dump/test-hsr-can-dump.log
To get more help on the Angular CLI use ng help
or go check out the Angular CLI README.