refactor transport into interface to allow extending serial implementations.

.eslintrc

@@ -11,6 +11,7 @@
   ],
   "rules": {
     "no-console": 1, // Means warning
-    "prettier/prettier": 2 // Means error
+    "prettier/prettier": 2, // Means error
+    "@typescript-eslint/no-inferrable-types": "off"
   }
 }

examples/typescript/package.json

@@ -8,7 +8,8 @@
     "dev": "npm run clean && npm run genDocs && parcel src/index.html",
     "build": "npm run clean && npm run genDocs && parcel build src/index.html --no-optimize --public-url ./",
     "clean": "rimraf dist .parcel-cache",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "prepare": "npm run build"
   },
   "parcelIgnore": [
     "./docs/.+"

examples/typescript/src/index.html

@@ -27,8 +27,8 @@ <h4 align="center">A Serial Flasher utility for Espressif chips</h4>
             <hr/>
             <div id="program">
                 <h3> Program </h3>
-                <label for="baudrates" id="lblBaudrate">Baudrate:</label>
                 <label style="display:none" id="lblConnTo">Connected to device: </label>
+                <label for="baudrates" id="lblBaudrate">Baudrate:</label>
                 <select name="baudrates" id="baudrates">
                     <option value="921600">921600</option>
                     <option value="460800">460800</option>

examples/typescript/src/index.ts

@@ -22,8 +22,8 @@
 
 // This is a frontend example of Esptool-JS using local bundle file
 // To optimize use a CDN hosted version like
-// https://unpkg.com/esptool-js@0.2.0/bundle.js
-import { ESPLoader, FlashOptions, LoaderOptions, Transport } from "../../../lib";
+// https://unpkg.com/esptool-js/bundle.js
+import { ESPLoader, FlashOptions, LoaderOptions, WebSerialTransport, SerialOptions, ITrace } from "../../../lib";
 
 declare let Terminal; // Terminal is imported in HTML script
 declare let CryptoJS; // CryptoJS is imported in HTML script
@@ -32,7 +32,7 @@
 term.open(terminal);
 
 let device = null;
-let transport: Transport;
+let transport: WebSerialTransport;
 let chip: string = null;
 let esploader: ESPLoader;
 
@@ -79,30 +79,58 @@
   },
 };
 
+class TraceObject implements ITrace {
+  traceBuffer: string;
+  private lastTraceTime = Date.now();
+
+  trace(message: string) {
+    const delta = Date.now() - this.lastTraceTime;
+    const prefix = `TRACE ${delta.toFixed(3)}`;
+    const traceMessage = `${prefix} ${message}`;
+    console.log(traceMessage);
+    this.traceBuffer += traceMessage + "\n";
+  }
+
+  async returnTrace() {
+    try {
+      await navigator.clipboard.writeText(this.traceBuffer);
+      console.log("Text copied to clipboard!");
+    } catch (err) {
+      console.error("Failed to copy text:", err);
+    }
+    return this.traceBuffer;
+  }
+}
+
+const traceObj = new TraceObject();
+
 connectButton.onclick = async () => {
   if (device === null) {
     device = await navigator.serial.requestPort({});
-    transport = new Transport(device, true);
+    transport = new WebSerialTransport(device, traceObj);
   }
 
+  const serialOptions = { baudRate: parseInt(baudrates.value) } as SerialOptions;
+
   try {
-    const flashOptions = {
+    const loaderOptions = {
       transport,
-      baudrate: parseInt(baudrates.value),
+      serialOptions,
       terminal: espLoaderTerminal,
+      tracer: traceObj,
     } as LoaderOptions;
-    esploader = new ESPLoader(flashOptions);
+    esploader = new ESPLoader(loaderOptions);
 
     chip = await esploader.main();
 
     // Temporarily broken
     // await esploader.flashId();
   } catch (e) {
     console.error(e);
     term.writeln(`Error: ${e.message}`);
   }
 
   console.log("Settings done for :" + chip);
   lblBaudrate.style.display = "none";
   lblConnTo.innerHTML = "Connected to device: " + chip;
   lblConnTo.style.display = "block";
@@ -116,8 +144,8 @@
 };
 
 traceButton.onclick = async () => {
-  if (transport) {
-    transport.returnTrace();
+  if (traceObj) {
+    traceObj.returnTrace();
   }
 };
 
@@ -134,7 +162,7 @@
   try {
     await esploader.eraseFlash();
   } catch (e) {
     console.error(e);
     term.writeln(`Error: ${e.message}`);
   } finally {
     eraseButton.disabled = false;
@@ -231,7 +259,7 @@
 consoleStartButton.onclick = async () => {
   if (device === null) {
     device = await navigator.serial.requestPort({});
-    transport = new Transport(device, true);
+    transport = new WebSerialTransport(device, traceObj);
   }
   lblConsoleFor.style.display = "block";
   lblConsoleBaudrate.style.display = "none";
@@ -240,19 +268,20 @@
   consoleStopButton.style.display = "initial";
   resetButton.style.display = "initial";
   programDiv.style.display = "none";
+  const serialOptions = { baudRate: parseInt(consoleBaudrates.value) } as SerialOptions;
 
-  await transport.connect(parseInt(consoleBaudrates.value));
+  await transport.connect(serialOptions);
   isConsoleClosed = false;
 
   while (true && !isConsoleClosed) {
-    const val = await transport.rawRead();
+    const val = await transport.read();
     if (typeof val !== "undefined") {
       term.write(val);
     } else {
       break;
     }
   }
   console.log("quitting console");
 };
 
 consoleStopButton.onclick = async () => {
@@ -351,7 +380,7 @@
     } as FlashOptions;
     await esploader.writeFlash(flashOptions);
   } catch (e) {
     console.error(e);
     term.writeln(`Error: ${e.message}`);
   } finally {
     // Hide progress bars and show erase buttons