diff --git a/src/lib/components/ActivityGlobe.svelte b/src/lib/components/ActivityGlobe.svelte new file mode 100644 index 00000000..ec8c2427 --- /dev/null +++ b/src/lib/components/ActivityGlobe.svelte @@ -0,0 +1,836 @@ + + +
+ + + + + + + + + + + + + + + + + + + + + {#each land as d} + + {/each} + + + {#each graticule as d} + + {/each} + + {#each layers as d, i} + {#if d} + + {/if} + {/each} + + + + + {#if mark} + + + + + + {/if} + + + + + +
+ + diff --git a/src/lib/components/DrivingDemo.svelte b/src/lib/components/DrivingDemo.svelte new file mode 100644 index 00000000..e4a9099c --- /dev/null +++ b/src/lib/components/DrivingDemo.svelte @@ -0,0 +1,356 @@ + + +
+
+ lane centering + adaptive cruise +

+ openpilot holds the center through the curve, stays there where the lane lines have + worn away, and slows down for the light. stock assist needs the lines, and holds its + speed — you brake. +

+
+ + +
+ + diff --git a/src/lib/components/HomeHero.svelte b/src/lib/components/HomeHero.svelte new file mode 100644 index 00000000..d54f3252 --- /dev/null +++ b/src/lib/components/HomeHero.svelte @@ -0,0 +1,1004 @@ + + + + +
+ + +
+

+ hands free driving for
+ for the car you already own +

+ +
+
+ 30,000+ + cars on the road with a comma +
+
+ + {#each milesChars as char, i (i)} + {#if char === ","} + , + {:else} + + {/if} + {/each} + {@html PREPAINT_MILES} + + + miles driven + +
+
+ #2 + after Tesla in hands-free miles +
+
+ + +
+ {#if !picked} +
+ + (listboxOpen = true)} + on:input={() => (listboxOpen = true)} + on:keydown={onKeydown} + type="text" + autocomplete="off" + spellcheck="false" + placeholder="" + aria-label="Search supported cars" + aria-expanded={listboxOpen && results.length > 0} + aria-controls="car-results" + role="combobox" + /> + {#if !query} + + {/if} + +
+ + {#if listboxOpen && results.length} +
    + {#each results as car, index (car.name)} +
  • + +
  • + {/each} +
+ {:else if trimmed.length >= 2} +

+ no match for “{query.trim()}” — browse all {vehicleCountText} models +

+ {/if} + + {:else} +
+

+ + + your {picked.make} {picked.model} {picked.years} works + +

+

{@html picked.detail}

+ + {#if pickedVideo} +
+ {#if videoPlaying} + + {:else} + + + {/if} +
+ {/if} + + + + +
+ {/if} +
+ +
+

works with {vehicleCountText} models across 27 brands

+ +
+
+
+ + diff --git a/src/lib/components/HomeHeroOverlay.svelte b/src/lib/components/HomeHeroOverlay.svelte index 99edc07a..f3c40445 100644 --- a/src/lib/components/HomeHeroOverlay.svelte +++ b/src/lib/components/HomeHeroOverlay.svelte @@ -65,6 +65,14 @@ let milesDriven = estimateMilesDriven(); + // The page is prerendered, so the value above is baked at build time and is already + // stale on arrival — it would visibly jump when hydration corrects it a second later. + // This runs during HTML parsing instead, so the first painted value is the right one. + const PREPAINT_MILES = `