Add burn % to progress indicator

index.html

@@ -52,7 +52,7 @@
  </section>
 
  <!-- Firmware details -->
-<section id="details" class="wrapper style1-alt spotlights" style="display: none;">
+<section id="details" class="wrapper style1-alt spotlights" style="display: none; height: 100vh;">
 <div class="inner">
     <h1>Firmware Notes</h1>
     
@@ -88,7 +88,7 @@
     <span class="icon major fa-pause" id="progressSpinner"></span>
     <p>
         <strong>Current Status:</strong>
-        <span id="statusText"></span>
+        <span id="statusText"></span><span id="burnPercent"></span>
     </p>
  </section>
  <section id="terminalSection" style="display: none;">

main.js

@@ -52,12 +52,16 @@ app.on('activate', () => {
 
 ipcMain.on('download', (e, args) => {
 	download(BrowserWindow.getFocusedWindow(), args.url)
-    .then(dl => e.sender.send( "download complete", dl.getSavePath() ) );
+    .then(dl => e.sender.send( "download complete", dl.getSavePath(), dl.getState() ) )
+    .catch(console.error);
 });
 
 ipcMain.on('uploadFW', (e, args) => {
   var platform;
 
+  var burnStarted = false;
+  var burnPercent = 0;
+
   if(process.platform == "win32") { platform = "avrdude-windows"; }
   else if(process.platform == "darwin") { platform = "avrdude-darwin-x86"; }
   else if(process.platform == "linux") { platform = "avrdude-linux_i686"; }
@@ -76,12 +80,28 @@ ipcMain.on('uploadFW', (e, args) => {
   const child = execFile(executableName, execArgs);
 
   child.stdout.on('data', (data) => {
-    console.log(`child stdout:\n${data}`);
+    console.log(`avrdude stdout:\n${data}`);
   });
 
   child.stderr.on('data', (data) => {
     console.log(`avrdude stderr: ${data}`);
     avrdudeErr = avrdudeErr + data;
+
+    //Check if avrdude has started the actual burn yet, and if so, track the '#' characters that it prints. Each '#' represents 1% of the total burn process (50 for write and 50 for read)
+    if (burnStarted == true)
+    {
+      if(data=="#") { burnPercent += 1; }
+      e.sender.send( "upload percent", burnPercent );
+    }
+    else
+    {
+      //This is a hack, but basically watch the output from avrdude for the term 'Writing | ', everything after that is the #s indicating 1% of burn. 
+      if(avrdudeErr.substr(avrdudeErr.length - 10) == "Writing | ")
+      {
+        burnStarted = true;
+      }
+    }
+    
   });
 
   child.on('error', (err) => {

renderer.js

@@ -178,11 +178,12 @@ function uploadFW()
     spinner.classList.add('fa-spinner');
 
     var statusText = document.getElementById('statusText');
+    var burnPercentText = document.getElementById('burnPercent');
     statusText.innerHTML = "Downloading INI file"
     downloadIni();
 
 
-    ipcRenderer.on("download complete", (event, file) => {
+    ipcRenderer.on("download complete", (event, file, state) => {
         console.log("Saved file: " + file); // Full file path
 
         var extension = file.substr(file.length - 3);
@@ -211,10 +212,15 @@ function uploadFW()
 
     ipcRenderer.on("upload completed", (event, code) => {
         statusText.innerHTML = "Upload to arduino completed successfully!";
+        burnPercentText.innerHTML = "";
         spinner.classList.remove('fa-spinner');
         spinner.classList.add('fa-check');
     });
 
+    ipcRenderer.on("upload percent", (event, percent) => {
+        burnPercentText.innerHTML = " (" + percent + "%)";
+    });
+
     ipcRenderer.on("upload error", (event, code) => {
         statusText.innerHTML = "Upload to arduino failed";
         //Mke the terminal/error section visible