From c24dd3552cb32fe839c9edd48ac4df5311b9b99f Mon Sep 17 00:00:00 2001 From: firestar5683 <168790843+firestar5683@users.noreply.github.com> Date: Wed, 4 Mar 2026 11:35:48 -0600 Subject: [PATCH] Galaxy Optimization --- .../the_pond/assets/components/home/home.css | 3 - .../the_pond/assets/components/home/home.js | 10 +- .../navigation/navigation_destination.js | 128 +++-- .../components/recordings/dashcam_routes.js | 44 -- .../recordings/screen_recordings.js | 41 -- .../the_pond/assets/components/router.js | 8 +- .../the_pond/assets/components/sidebar.js | 47 +- .../components/tools/device_settings.css | 55 +- .../components/tools/device_settings.js | 511 +++++++++++------- .../tools/device_settings_layout.json | 25 +- .../assets/components/tools/model_manager.js | 13 +- .../assets/components/tools/theme_maker.js | 25 +- .../components/tools/vehicle_features.js | 162 ++++++ .../system/the_pond/templates/index.html | 3 - frogpilot/system/the_pond/the_pond.py | 376 ++++++++++--- frogpilot/system/the_pond/utilities.py | 51 +- system/manager/process.py | 20 +- system/manager/process_config.py | 3 +- 18 files changed, 1006 insertions(+), 519 deletions(-) create mode 100644 frogpilot/system/the_pond/assets/components/tools/vehicle_features.js diff --git a/frogpilot/system/the_pond/assets/components/home/home.css b/frogpilot/system/the_pond/assets/components/home/home.css index cc80e874c..ca70e2bc0 100644 --- a/frogpilot/system/the_pond/assets/components/home/home.css +++ b/frogpilot/system/the_pond/assets/components/home/home.css @@ -15,7 +15,6 @@ .diskUsage, .drivingStats, -.firehoseStats, .softwareInfo { background-color: var(--secondary-bg); border-radius: var(--border-radius-md); @@ -31,7 +30,6 @@ } .diskUsage p, -.firehoseStats p, .softwareGrid p { font-size: var(--font-size-sm); margin: 0; @@ -65,7 +63,6 @@ .diskUsage:hover, .drivingStats:hover, -.firehoseStats:hover, .softwareInfo:hover { box-shadow: var(--shadow-md); transform: var(--hover-scale-sm); diff --git a/frogpilot/system/the_pond/assets/components/home/home.js b/frogpilot/system/the_pond/assets/components/home/home.js index b4247fc01..adc3c27c7 100644 --- a/frogpilot/system/the_pond/assets/components/home/home.js +++ b/frogpilot/system/the_pond/assets/components/home/home.js @@ -116,7 +116,7 @@ export function Home() { } if (state.data) { - const { driveStats, firehoseStats, softwareInfo } = state.data; + const { driveStats, softwareInfo } = state.data; return html`

Galaxy

@@ -131,14 +131,6 @@ export function Home() { ${renderDiskUsageSection(state.data)} -

Firehose Segments

-
-

- ${(firehoseStats?.segments ?? 0).toLocaleString("en-US")} - segments in training data. -

-
-

Software Info

${renderSoftwareInfo(softwareInfo)}
diff --git a/frogpilot/system/the_pond/assets/components/navigation/navigation_destination.js b/frogpilot/system/the_pond/assets/components/navigation/navigation_destination.js index a6f7ee6a9..6be8d6406 100644 --- a/frogpilot/system/the_pond/assets/components/navigation/navigation_destination.js +++ b/frogpilot/system/the_pond/assets/components/navigation/navigation_destination.js @@ -101,6 +101,25 @@ async function setSpecial(favorite, type, state, loadFavoritesAlphabetically) { } } +let mapboxLoadPromise = null; + +function loadMapboxGL() { + if (mapboxLoadPromise) return mapboxLoadPromise; + mapboxLoadPromise = new Promise((resolve, reject) => { + const link = document.createElement("link"); + link.href = "https://api.mapbox.com/mapbox-gl-js/v3.0.1/mapbox-gl.css"; + link.rel = "stylesheet"; + document.head.appendChild(link); + + const script = document.createElement("script"); + script.src = "https://api.mapbox.com/mapbox-gl-js/v3.0.1/mapbox-gl.js"; + script.onload = resolve; + script.onerror = () => reject(new Error("Failed to load Mapbox GL")); + document.head.appendChild(script); + }); + return mapboxLoadPromise; +} + export function NavDestination() { let map; let destinationMarker; @@ -262,13 +281,18 @@ export function NavDestination() { }; try { state.destination = JSON.parse(data.destination); - } catch {} + } catch { } try { const prev = JSON.parse(data.previousDestinations); state.previousDestinations = prev.map(d => ({ name: d.place_name })); state.suggestions = JSON.stringify(state.previousDestinations); - } catch {} - setupMap(); + } catch { } + try { + await setupMap(); + } catch { + showSnackbar("Failed to load map resources…"); + return; + } loadFavoritesAlphabetically(); } @@ -524,12 +548,18 @@ export function NavDestination() { } } - const setupMap = async () => { + const setupMap = async (retries = 0) => { if (!state.mapboxPublic || state.initialized) return; + + if (typeof mapboxgl === "undefined") { + await loadMapboxGL(); + } + const container = document.getElementById("map"); if (!container) { - requestAnimationFrame(setupMap); - return; + if (retries >= 50) return; + await new Promise(r => requestAnimationFrame(r)); + return setupMap(retries + 1); } state.initialized = true; mapboxgl.accessToken = state.mapboxPublic; @@ -585,9 +615,9 @@ export function NavDestination() { return html` ${() => (state.showRemoveFavoriteModal ? Modal({ title: "Remove Favorite", @@ -815,9 +845,9 @@ function NavigationDestination({
${() => - isConfirmed() - ? html`` - : html``} + isConfirmed() + ? html`` + : html``}
diff --git a/frogpilot/system/the_pond/assets/components/recordings/dashcam_routes.js b/frogpilot/system/the_pond/assets/components/recordings/dashcam_routes.js index 84ea0c608..23ca4e08b 100644 --- a/frogpilot/system/the_pond/assets/components/recordings/dashcam_routes.js +++ b/frogpilot/system/the_pond/assets/components/recordings/dashcam_routes.js @@ -370,45 +370,6 @@ export function RouteRecordings() { route => html`
{ - if (card.dataset.loadingGif === "true") { - gif.src = preloader.src; - png.style.display = "none"; - gif.style.display = "block"; - card.dataset.gifLoaded = true; - } - delete card.dataset.loadingGif; - }; - preloader.onerror = () => { - console.error("Failed to load preview GIF:", preloader.src); - delete card.dataset.loadingGif; - }; - - preloader.src = gif.dataset.src; - }}" - @mouseleave="${e => { - const card = e.currentTarget; - card.querySelector(".recording-preview-png").style.display = "block"; - card.querySelector(".recording-preview-gif").style.display = "none"; - if (card.dataset.loadingGif === "true") { - delete card.dataset.loadingGif; - } - }}" @click="${() => { state.selectedRoute = route; }}" @@ -423,11 +384,6 @@ export function RouteRecordings() { style="display:block;" loading="lazy" > -

${route.timestamp}

diff --git a/frogpilot/system/the_pond/assets/components/recordings/screen_recordings.js b/frogpilot/system/the_pond/assets/components/recordings/screen_recordings.js index a2015a546..9ed184988 100644 --- a/frogpilot/system/the_pond/assets/components/recordings/screen_recordings.js +++ b/frogpilot/system/the_pond/assets/components/recordings/screen_recordings.js @@ -127,7 +127,6 @@ async function renameFile(rec) { if (recordingToUpdate) { recordingToUpdate.filename = newFilename recordingToUpdate.is_custom_name = true - recordingToUpdate.gif = `/screen_recordings/${val}.gif` recordingToUpdate.png = `/screen_recordings/${val}.png` } @@ -257,50 +256,10 @@ export function ScreenRecordings() { return html`
{ - if (card.dataset.loadingGif === "true") { - gif.src = preloader.src; - png.style.display = "none"; - gif.style.display = "block"; - card.dataset.gifLoaded = true; - } - delete card.dataset.loadingGif; - }; - preloader.onerror = () => { - console.error("Failed to load preview GIF:", preloader.src); - delete card.dataset.loadingGif; - }; - - preloader.src = gif.dataset.src; - }}" - @mouseleave="${e => { - const card = e.currentTarget; - card.querySelector(".recording-preview-png").style.display = "block"; - card.querySelector(".recording-preview-gif").style.display = "none"; - if (card.dataset.loadingGif === "true") { - delete card.dataset.loadingGif; - } - }}" @click="${() => { state.selectedRecording = rec }}" >
-

${displayName}

diff --git a/frogpilot/system/the_pond/assets/components/router.js b/frogpilot/system/the_pond/assets/components/router.js index 2cec5de07..b2a9910f6 100644 --- a/frogpilot/system/the_pond/assets/components/router.js +++ b/frogpilot/system/the_pond/assets/components/router.js @@ -2,8 +2,8 @@ import { html, reactive } from "https://esm.sh/@arrow-js/core" import { createBrowserHistory, createRouter } from "https://esm.sh/@remix-run/router@1.3.1" import { hideSidebar } from "/assets/js/utils.js" import { DeviceSettings } from "/assets/components/tools/device_settings.js" -import { DoorControl } from "/assets/components/tools/doors.js" import { ErrorLogs } from "/assets/components/tools/error_logs.js" +import { VehicleFeatures } from "/assets/components/tools/vehicle_features.js" import { GalaxyPairing } from "/assets/components/tools/galaxy.js" import { Home } from "/assets/components/home/home.js" import { NavDestination } from "/assets/components/navigation/navigation_destination.js" @@ -17,7 +17,6 @@ import { ModelManager } from "/assets/components/tools/model_manager.js?v=202603 import { ThemeMaker } from "/assets/components/tools/theme_maker.js" import { TmuxLog } from "/assets/components/tools/tmux.js" import { ToggleControl } from "/assets/components/tools/toggles.js" -import { TSKManager } from "/assets/components/tools/tsk_manager.js" let router, routerState @@ -32,8 +31,7 @@ function createRoute(id, path, component) { function Root() { let routes = [ - createRoute("device_settings", "/device_settings", DeviceSettings), - createRoute("doors", "/lock_or_unlock_doors", DoorControl), + createRoute("device_settings", "/device_settings/:section?", DeviceSettings), createRoute("errorLogs", "/manage_error_logs", ErrorLogs), createRoute("galaxy", "/galaxy", GalaxyPairing), createRoute("navdestination", "/set_navigation_destination", NavDestination), @@ -47,7 +45,7 @@ function Root() { createRoute("thememaker", "/theme_maker", ThemeMaker), createRoute("tmux", "/manage_tmux", TmuxLog), createRoute("toggles", "/manage_toggles", ToggleControl), - createRoute("tsk_manager", "/tsk_manager", TSKManager), + createRoute("vehicle_features", "/vehicle_features", VehicleFeatures), ] router = createRouter({ diff --git a/frogpilot/system/the_pond/assets/components/sidebar.js b/frogpilot/system/the_pond/assets/components/sidebar.js index 008a83dd6..e07bf07b9 100644 --- a/frogpilot/system/the_pond/assets/components/sidebar.js +++ b/frogpilot/system/the_pond/assets/components/sidebar.js @@ -19,54 +19,27 @@ const MenuItems = { { name: "Download Speed Limits", link: "/download_speed_limits", icon: "bi-download" }, { name: "Error Logs", link: "/manage_error_logs", icon: "bi-exclamation-triangle" }, { name: "Galaxy", link: "/galaxy", icon: "bi-globe2" }, - { name: "Lock/Unlock Doors", link: "/lock_or_unlock_doors", icon: "bi-door-closed" }, { name: "Model Manager", link: "/manage_models", icon: "bi-cpu" }, { name: "Theme Maker", link: "/theme_maker", icon: "bi-palette-fill" }, { name: "Tmux Log", link: "/manage_tmux", icon: "bi-terminal" }, { name: "Toggles", link: "/manage_toggles", icon: "bi-toggle-on" }, - { name: "Toyota Security Keys", link: "/tsk_manager", icon: "bi-key-fill" }, + { name: "Vehicle Features", link: "/vehicle_features", icon: "bi-car-front" }, ], }; const state = reactive({ - doorsVisible: false, - isDoorsFetched: false, - isTSKFetched: false, - tskVisible: false, - activeRoute: "" }); export function Sidebar() { const currentPath = window.location.pathname; - const activeItem = Object.values(MenuItems).flat().find(item => item.link === currentPath); + const matchesPath = (link) => { + if (link === "/") return currentPath === "/"; + return currentPath === link || currentPath.startsWith(`${link}/`); + }; + const activeItem = Object.values(MenuItems).flat().find(item => matchesPath(item.link)); state.activeRoute = activeItem?.name ?? ""; - if (!state.isDoorsFetched) { - state.isDoorsFetched = true; - (async () => { - try { - const response = await fetch("/api/doors_available"); - const data = await response.json(); - state.doorsVisible = data.result; - } catch (e) { - console.error("Failed to fetch door availability:", e); - } - })(); - } - - if (!state.isTSKFetched) { - state.isTSKFetched = true; - (async () => { - try { - const response = await fetch("/api/tsk_available"); - const data = await response.json(); - state.tskVisible = data.result; - } catch (e) { - console.error("Failed to fetch TSK availability:", e); - } - })(); - } function navigate(link) { state.activeRoute = link.name; @@ -101,14 +74,6 @@ export function Sidebar() { ${upperFirst(section)}