Add log element as sibling next to button

This commit is contained in:
Paulus Schoutsen 2021-06-04 01:13:20 -07:00
parent 560df172dc
commit 3d4745a949
3 changed files with 6 additions and 11 deletions

View File

@ -14,9 +14,8 @@
margin: 0 auto; margin: 0 auto;
padding: 12px; padding: 12px;
} }
esp-web-flash-button { esp-web-flash-log {
display: inline-block; margin-top: 8px;
margin-bottom: 8px;
} }
a { a {
color: #03a9f4; color: #03a9f4;
@ -39,7 +38,7 @@
browser. browser.
</p> </p>
<p> <p>
To flash the ESPHome firmware, connect an ESP to your computer and hit To install the ESPHome firmware, connect an ESP to your computer and hit
the button: the button:
</p> </p>
<esp-web-install-button <esp-web-install-button

View File

@ -31,14 +31,10 @@ class InstallButton extends HTMLElement {
} }
const mod = await import("./start-flash"); const mod = await import("./start-flash");
const progress = document.createElement("div");
document.body.append(progress);
await mod.startFlash( await mod.startFlash(
console, console,
manifest, manifest,
progress, (logEl) => this.parentElement!.insertBefore(logEl, this.nextSibling),
this.eraseFirst !== undefined this.eraseFirst !== undefined
? this.eraseFirst ? this.eraseFirst
: this.hasAttribute("erase-first") : this.hasAttribute("erase-first")

View File

@ -7,7 +7,7 @@ import { getChipFamilyName, sleep } from "./util";
export const startFlash = async ( export const startFlash = async (
logger: Logger, logger: Logger,
manifestPath: string, manifestPath: string,
logParent: HTMLElement, addLogElement: (el: HTMLElement) => void,
eraseFirst: boolean eraseFirst: boolean
) => { ) => {
const manifestURL = new URL(manifestPath, location.toString()).toString(); const manifestURL = new URL(manifestPath, location.toString()).toString();
@ -30,7 +30,7 @@ export const startFlash = async (
const logEl = document.createElement("esp-web-flash-log"); const logEl = document.createElement("esp-web-flash-log");
// logEl.esploader = esploader; // logEl.esploader = esploader;
logEl.addRow({ id: "initializing", content: "Initializing..." }); logEl.addRow({ id: "initializing", content: "Initializing..." });
logParent.append(logEl); addLogElement(logEl);
try { try {
await esploader.initialize(); await esploader.initialize();