A futuristic but realistic automotive dashboard built with vanilla HTML, CSS, and JavaScript. Features a modern, vehicle-control interface with simulated (demo) sensor data — clearly labelled as prototype data.
⚙ Settings & Themes — gear button opens a settings panel to switch between Red, Blue, Green, Dark, and White themes. The active theme is saved to localStorage and restored after refresh.
🕐 Live Clock — real-time digital clock in the header.
📍 Location — shows current location, GPS status, and lat/long when a GPS fix is available. When no real GPS data exists it clearly shows "Location unavailable" rather than fake coordinates.
🏁 Speed Dashboard — animated circular speed gauge (SVG) with current speed, speed limit, average, and maximum. Uses clearly-labelled simulated speed data.
🚗 Vehicle Status — cards for fuel level, battery, engine temperature, engine RPM, oil status, tire pressure, and connection status, each with a visual indicator.
🌿 Ultra Fuel Save Mode — retained toggle that switches to ACTIVE state with a visual indicator and an estimated fuel-savings percentage (demo values).
🧭 Trip Information — distance travelled, trip duration, average speed, and estimated fuel consumed (simulated).
⚡ Quick Actions — responsive buttons for Vehicle Status, Trip, Fuel Economy, and Settings.
🔔 Alerts — demo warnings such as low fuel and elevated engine temperature.
🏷 Branding — clean footer: "DriveIQ" with a subtle "Made by Vandra".
Notes
All vehicle metrics (speed, fuel, battery, temperature, RPM, trip, fuel savings) are simulated demo data and are labelled as such in the UI. They do not read from a real vehicle.
GPS uses the browser's Geolocation API only when the user grants permission; otherwise the interface reports "Location unavailable".
Files
File
Purpose
main.ts
HTTP handler that serves the static assets
index.html
Page markup
styles.css
Styling, themes, and animations
script.js
Client-side interactivity
Tech
Vanilla HTML / CSS / JS (no frameworks or build step)
Served from a Val Town HTTP endpoint via serveFile