The Racing Trakbox has a real time speedometer phone display feature.
A speedometer can be displayed on a cell phone and show vehicle speed in real-time. Here is how it works:
The Racing TrakBox uses Arduino async web server to display the speed on the phone. When the Racing TrakBox is started the phone provides the wifi hotspot the unit uses to sync the onboard real time clock with a network time server on the internet. The Racing TrakBox then provides the cell phone a web page with the speedometer display. Use the browser on your cell phone to browse to the IP address displayed on the OLED display on the unit. The IP address is in raw numeric octlets such as: 10.42.0.148
Just type the IP address into the address bar on your phone in the browser.
Speedo Web page info
The web page the Racing TrakBox displays is located in the non-volatile memory on the micro-controller. It is installed there using the ESP8266 LittleFS Filesystem Uploader Plugin. More information and downloads can be found here:
If you are using the Arduino IDE to flash the firmware, in the same folder as the firmware file, create a folder named data
In the data folder place the web page file named index.htm
note: See ESP8266 LittleFS Data Upload below the green highlighted line in the photo above
Just click that line in the tools menu and you will see the output as the file uploads in the console window
pro tip:
close the serial monitor before uploading the file
Here are the current contents of the index.htm file
<!DOCTYPE html>
<html>
<head>
<title>TrakBox Dash</title>
<style>
html { font-family: sans-serif; display: inline-block; margin: 0px auto; text-align: center; background-color: black; color: green;}
.bigtxt { position: relative; left: 10px; font-size: 280px;}
.littletxt { position: relative; left: 10px; font-size: 80px;}
button { width: 160px; height: 40px; background-color: blue; color: white;}
</style>
<meta http-equiv="refresh" content="1">
</head>
<body>
<span class="bigtxt">
%gps_speed_mph%
</span>
<span class="littletxt">
MPH
</span>
<br>
<button>SPEEDO</button>
<button>MAP VIEW</button>
<button>SKID PAD</button>
<button>SET UP</button>
<button>SETTING</button>
</body>
</html>
The buttons are for future use
The percent signs are placeholders for the web page used for the dash display. It uses the template processor feature of the Arduino async web server to insert live data into the web page. More info here:
GitHub - me-no-dev/ESPAsyncWebServer: Async Web Server for ESP8266 and ESP32 · GitHub
The line
<meta http-equiv="refresh" content="1">
causes the page to refresh once per second