jeans/esp-web-tools
jeans/esp-web-tools
1
0
Fork 0
mirror of https://github.com/esphome/esp-web-tools.git synced 2025-07-28 14:16:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Store state on button (#59)

Browse Source
This commit is contained in:
Paulus Schoutsen 2021-08-24 00:07:11 -07:00 committed by GitHub
parent 6a664ef67d
commit 52dc795cde
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 45 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
src/start-flash.ts
View File

@ -6,13 +6,25 @@ import type { FlashProgress } from "./flash-progress";
import type { InstallButton } from "./install-button";
import { State } from "./const";
let stateListenerAdded = false;
interface FlashData {
stateListenerAdded: boolean;
logEl: FlashLog | undefined;
progressEl: FlashProgress | undefined;
improvEl: HTMLElement | undefined;
}
let logEl: FlashLog | undefined;
const getData = (button: InstallButton): FlashData => {
if (!("_flashData" in button)) {
(button as any)._flashData = {
stateListenerAdded: false,
logEl: undefined,
progressEl: undefined,
improvEl: undefined,
} as FlashData;
}
let progressEl: FlashProgress | undefined;
let improvEl: HTMLElement | undefined;
return (button as any)._flashData as FlashData;
};
const addElement = <T extends HTMLElement>(
button: InstallButton,
@ -33,10 +45,12 @@ export const startFlash = async (button: InstallButton) => {
return;
}
const data = getData(button);
let hasImprov = false;
if (!stateListenerAdded) {
stateListenerAdded = true;
if (!data.stateListenerAdded) {
data.stateListenerAdded = true;
button.addEventListener("state-changed", (ev) => {
const state = (button.state = ev.detail);
if (state.state === State.INITIALIZING) {
@ -54,8 +68,8 @@ export const startFlash = async (button: InstallButton) => {
} else if (state.state === State.ERROR) {
button.toggleAttribute("active", false);
}
progressEl?.processState(ev.detail);
logEl?.processState(ev.detail);
data.progressEl?.processState(ev.detail);
data.logEl?.processState(ev.detail);
});
}
@ -66,29 +80,29 @@ export const startFlash = async (button: InstallButton) => {
button.hideProgress !== true &&
!button.hasAttribute("hide-progress");
if (showLog && !logEl) {
logEl = addElement<FlashLog>(
if (showLog && !data.logEl) {
data.logEl = addElement<FlashLog>(
button,
document.createElement("esp-web-flash-log")
);
} else if (!showLog && logEl) {
logEl.remove();
logEl = undefined;
} else if (!showLog && data.logEl) {
data.logEl.remove();
data.logEl = undefined;
}
if (showProgress && !progressEl) {
progressEl = addElement<FlashProgress>(
if (showProgress && !data.progressEl) {
data.progressEl = addElement<FlashProgress>(
button,
document.createElement("esp-web-flash-progress")
);
} else if (!showProgress && progressEl) {
progressEl.remove();
progressEl = undefined;
} else if (!showProgress && data.progressEl) {
data.progressEl.remove();
data.progressEl = undefined;
}
logEl?.clear();
progressEl?.clear();
improvEl?.classList.toggle("hidden", true);
data.logEl?.clear();
data.progressEl?.clear();
data.improvEl?.classList.toggle("hidden", true);
flash(
button,
@ -121,18 +135,20 @@ const startImprov = async (button: InstallButton) => {
return;
}
if (!improvEl) {
improvEl = document.createElement("improv-wifi-launch-button");
improvEl.addEventListener("state-changed", (ev: any) => {
const data = getData(button);
if (!data.improvEl) {
data.improvEl = document.createElement("improv-wifi-launch-button");
data.improvEl.addEventListener("state-changed", (ev: any) => {
if (ev.detail.state === "PROVISIONED") {
improvEl!.classList.toggle("hidden", true);
data.improvEl!.classList.toggle("hidden", true);
}
});
const improvButton = document.createElement("button");
improvButton.slot = "activate";
improvButton.textContent = "CLICK HERE TO FINISH SETTING UP YOUR DEVICE";
improvEl.appendChild(improvButton);
addElement(button, improvEl);
data.improvEl.appendChild(improvButton);
addElement(button, data.improvEl);
}
improvEl.classList.toggle("hidden", false);
data.improvEl.classList.toggle("hidden", false);
};