Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove React #51

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 5 additions & 28 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -1,48 +1,25 @@
{
"root": true,
"parser": "@typescript-eslint/parser",
"env": {
"browser": true,
"es2020": true,
"node": true
},
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:react/jsx-runtime",
"plugin:react-hooks/recommended"
],
"ignorePatterns": [
"node_modules",
"dist",
".eslintrc.cjs"
],
"extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
"ignorePatterns": ["node_modules", "dist", ".eslintrc.cjs"],
"plugins": ["@typescript-eslint"],
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
},
"settings": {
"react": {
"version": "detect"
}
},
"plugins": [
"react-refresh"
],
"rules": {
"no-constant-condition": [
"error",
{
"checkLoops": false
}
],
"no-inner-declarations": "off",
"react/jsx-no-target-blank": "off",
"react/prop-types": "off",
"react-refresh/only-export-components": [
"warn",
{
"allowConstantExport": true
}
]
"no-inner-declarations": "off"
}
}
18 changes: 16 additions & 2 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,11 @@
.idea
*.iml
.vscode
!.vscode/extensions.json


# dependencies
/node_modules
node_modules
/.pnp
.pnp.js
/.pnpm-store
Expand All @@ -20,16 +22,28 @@
/out/

# production
/build
build
dist
dist-ssr

# misc
.DS_Store
*.pem
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?


# debug
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
logs
*.log

# local env files
.env*.local
Expand Down
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
Binary file modified bun.lockb
Binary file not shown.
265 changes: 246 additions & 19 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,22 +1,249 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/src/app/icon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="Update your comma device to the latest software"
/>
<title>flash.comma.ai</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
<script
defer
data-domain="flash.comma.ai"
src="https://plausible.io/js/script.outbound-links.js"
></script>
</body>
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/icon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>flash.comma.ai</title>
<link href="src/index.css" rel="stylesheet" />
</head>
<body>
<div id="root" class="flex flex-col lg:flex-row flex-wrap">
<main
class="p-12 md:p-16 lg:p-20 xl:p-24 w-screen max-w-none lg:max-w-prose lg:w-auto h-auto lg:h-screen lg:overflow-y-auto prose dark:prose-invert prose-green bg-white dark:bg-gray-900"
>
<section>
<img
src="assets/comma.svg"
alt="comma"
height="128"
width="128"
class="dark:invert"
/>
<h1>flash.comma.ai</h1>
<p>
This tool allows you to flash AGNOS onto your comma
device.
</p>
<p>
AGNOS is the Ubuntu-based operating system for your
<a
href="https://comma.ai/shop/comma-3x"
target="_blank"
>
comma 3/3X
</a>
.
</p>
</section>
<hr />
<section>
<h2>Requirements</h2>
<ul>
<li>
A web browser which supports WebUSB (such as Google
Chrome, Microsoft Edge, Opera), running on Windows,
macOS, Linux, or Android.
</li>
<li>
A USB-C cable to power your device outside the car.
</li>
<li>
Another USB-C cable to connect the device to your
computer.
</li>
</ul>
<h3>USB Driver</h3>
<p>
You need additional driver software for Windows before
you connect your device.
</p>
<ol>
<li>
Download and install
<a href="https://zadig.akeo.ie/">Zadig</a>.
</li>
<li>
Under <code>Device</code> in the menu bar, select
<code>Create New Device</code>.
<img
src="assets/zadig_create_new_device.png"
alt="Zadig Create New Device"
width="575"
height="254"
/>
</li>
<li>
Fill in three fields. The first field is just a
description and you can fill in anything. The next
two fields are very important. Fill them in with
<code>18D1</code> and <code>D00D</code>
respectively. Press &quot;Install Driver&quot; and
give it a few minutes to install.
<img
src="assets/zadig_form.png"
alt="Zadig Form"
width="{575}"
height="{254}"
/>
</li>
</ol>
<p>
No additional software is required for macOS or Linux.
</p>
</section>
<hr />

<section>
<h2>Fastboot</h2>
<p>
Follow these steps to put your device into fastboot
mode:
</p>
<ol>
<li>
Power off the device and wait for the LEDs to switch
off.
</li>
<li>
Connect power to the OBD-C port
<strong>(port 1)</strong>.
</li>
<li>
Then,
<a
href="https://youtube.com/clip/Ugkx1pbkpkvFU9gGsUwvkrl7yxx-SfHOZejM?si=nsJ0WJHJwS-rnHXL"
>
quickly
</a>
connect the device to your computer using the USB-C
port
<strong>(port 2)</strong>.
</li>
<li>
After a few seconds, the device should indicate
it&apos;s in fastboot mode and show its serial
number.
</li>
</ol>
<img
src="assets/fastboot-ports.svg"
alt="image showing comma three and two ports. the upper port is labeled 1. the lower port is labeled 2."
width="450"
height="300"
/>
<p>
If your device shows the comma spinner with a loading
bar, then it&apos;s not in fastboot mode. Unplug all
cables, wait for the device to switch off, and try
again.
</p>
</section>
<hr />

<section>
<h2>Flashing</h2>
<p>
After your device is in fastboot mode, you can click the
button to start flashing. A prompt may appear to select
a device; choose the device labeled &quot;Android&quot;.
</p>
<p>
The process can take 15+ minutes depending on your
internet connection and system performance. Do not
unplug the device until all steps are complete.
</p>
</section>
<hr />

<section>
<h2>Troubleshooting</h2>
<h3>
Cannot enter fastboot or device says &quot;Press any key
to continue&quot;
</h3>
<p>
Try using a different USB cable or USB port. Sometimes
USB 2.0 ports work better than USB 3.0 (blue) ports. If
you&apos;re using a USB hub, try connecting the device
directly to your computer, or alternatively use a USB
hub between your computer and the device.
</p>
<h3>My device&apos;s screen is blank</h3>
<p>
The device can still be in fastboot mode and reflashed
normally if the screen isn&apos;t displaying anything. A
blank screen is usually caused by installing older
software that doesn&apos;t support newer displays. If a
reflash doesn&apos;t fix the blank screen, then the
device&apos;s display may be damaged.
</p>
<h3>
After flashing, device says unable to mount data
partition
</h3>
<p>
This is expected after the filesystem is erased. Press
confirm to finish resetting your device.
</p>
<h3>General Tips</h3>
<ul>
<li>Try another computer or OS</li>
<li>Try different USB ports on your computer</li>
<li>
Try different USB-C cables, including the OBD-C
cable that came with the device
</li>
</ul>
<h3>Other questions</h3>
<p>
If you need help, join our
<a href="https://discord.comma.ai" target="_blank">
Discord server
</a>
and go to the <strong>#hw-three-3x</strong> channel.
</p>
</section>

<div class="hidden lg:block">
<hr />
flash.comma.ai version: <code>dev</code>
</div>
</main>
<div
class="lg:flex-1 h-[700px] lg:h-screen bg-gray-100 dark:bg-gray-800"
>
<div
id="flash"
class="relative flex flex-col gap-8 justify-center items-center h-full"
>
<div id="icon-ctn">
<img alt="cable" width="128" height="128" />
</div>
<div
id="linear-progress-ctn"
class="w-full max-w-3xl px-8 transition-opacity duration-300"
>
<div
class="relative w-full h-2 bg-gray-200 rounded-full overflow-hidden"
>
<div
id="linear-progress"
class="absolute top-0 bottom-0 left-0 w-full transition-all"
></div>
</div>
</div>
<span
id="title"
class="text-3xl dark:text-white font-mono font-light"
></span>
<span
id="subtitle"
class="text-xl dark:text-white px-8 max-w-xl"
></span>
</div>
</div>
</div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>
Loading