Display when an input errors on load.

Autobake when all inputs have loaded.
Improve load experience.

src/web/InputWaiter.mjs

@@ -361,7 +361,13 @@ class InputWaiter {
         fileName.textContent = inputData.name;
         fileSize.textContent = inputData.size + " bytes";
         fileType.textContent = inputData.type;
-        fileLoaded.textContent = inputData.progress + "%";
+        if (inputData.status === "error") {
+            fileLoaded.textContent = "Error";
+            fileLoaded.style.color = "#FF0000";
+        } else {
+            fileLoaded.style.color = "";
+            fileLoaded.textContent = inputData.progress + "%";
+        }
 
         this.displayFilePreview(inputData);
     }
@@ -420,7 +426,13 @@ class InputWaiter {
         if (inputNum !== activeTab) return;
 
         const fileLoaded = document.getElementById("input-file-loaded");
-        fileLoaded.textContent = progress + "%";
+        if (progress === "error") {
+            fileLoaded.textContent = "Error";
+            fileLoaded.style.color = "#FF0000";
+        } else {
+            fileLoaded.textContent = progress + "%";
+            fileLoaded.style.color = "";
+        }
 
         if (progress === 100) {
             this.inputWorker.postMessage({
@@ -789,6 +801,10 @@ class InputWaiter {
                 });
             }.bind(this), 100);
         }
+
+        if (loaded === total) {
+            this.app.autoBake();
+        }
     }
     // displayTabInfo
         // simple getInput for each tab
@@ -1096,6 +1112,7 @@ class InputWaiter {
         if (!this.getTabItem(inputNum) && numTabs < this.maxTabs) {
             const newTab = this.createTabElement(inputNum, false);
 
+
             tabsWrapper.appendChild(newTab);
 
             if (numTabs > 0) {
@@ -1111,6 +1128,11 @@ class InputWaiter {
                 document.getElementById("input-highlighter").style.height = "calc(100% - var(--title-height))";
                 document.getElementById("input-file").style.height = "calc(100% - var(--title-height))";
             }
+
+            this.inputWorker.postMessage({
+                action: "updateTabHeader",
+                data: inputNum
+            });
         }
 
         if (changeTab) {

src/web/InputWorker.mjs

@@ -94,6 +94,9 @@ self.addEventListener("message", function(e) {
         case "inputSwitch":
             self.inputSwitch(r.data);
             break;
+        case "updateTabHeader":
+            self.updateTabHeader(r.data);
+            break;
         default:
             log.error(`Unknown action '${r.action}'.`);
     }
@@ -184,6 +187,9 @@ self.getInputValue = function(inputNum) {
 self.getInputProgress = function(inputNum) {
     const inputObj = self.getInputObj(inputNum);
     if (inputObj === undefined || inputObj === null) return;
+    if (inputObj.status === "error") {
+        return "error";
+    }
     return inputObj.progress;
 };
 
@@ -326,6 +332,7 @@ self.setInput = function(inputData) {
         inputObj.size = inputVal.size;
         inputObj.type = inputVal.type;
         inputObj.progress = input.progress;
+        inputObj.status = input.status;
         inputVal = inputVal.fileBuffer;
         const fileSlice = inputVal.slice(0, 512001);
         inputObj.input = fileSlice;
@@ -346,7 +353,7 @@ self.setInput = function(inputData) {
             }
         });
     }
-    self.getInputProgress(inputNum);
+    self.updateTabHeader(inputNum);
 };
 
 self.refreshTabs = function(inputNum, direction) {
@@ -362,16 +369,11 @@ self.refreshTabs = function(inputNum, direction) {
     for (let i = 0; i < nums.length; i++) {
         self.updateTabHeader(nums[i]);
     }
-
-    // self.setInput(inputNum);
 };
 
 self.updateInputStatus = function(inputNum, status) {
-    for (let i = 0; i < self.inputs.length; i++) {
-        if (self.inputs[i].inputNum === inputNum) {
-            self.inputs[i].status = status;
-            return;
-        }
+    if (self.inputs[inputNum] !== undefined) {
+        self.inputs[inputNum].status = status;
     }
 };
 
@@ -448,8 +450,8 @@ self.handleLoaderMessage = function(r) {
     }
 
     if (r.hasOwnProperty("error")) {
-        self.updateInputStatus(r.inputNum, "error");
         self.updateInputProgress(r.inputNum, 0);
+        self.updateInputStatus(r.inputNum, "error");
 
         log.error(r.error);
         self.loadingInputs--;
@@ -457,6 +459,7 @@ self.handleLoaderMessage = function(r) {
         self.terminateLoaderWorker(r.id);
         self.activateLoaderWorker();
 
+        self.setInput({inputNum: inputNum, silent: true});
         return;
     }
 
@@ -468,7 +471,7 @@ self.handleLoaderMessage = function(r) {
             value: r.fileBuffer
         });
 
-        self.setInput({inputNum: inputNum, silent: false});
+        // self.setInput({inputNum: inputNum, silent: false});
 
         const idx = self.getLoaderWorkerIdx(r.id);
         self.loadNextFile(idx);
@@ -564,6 +567,7 @@ self.loadFiles = function(filesData) {
     }
 
     self.getLoadProgress();
+    self.setInput({inputNum: activeTab, silent: false});
 };
 
 /**
@@ -612,7 +616,6 @@ self.addInput = function(changeTab=false, type, fileData={name: "unknown", size:
             changeTab: changeTab,
             inputNum: inputNum
         }
-
     });
 
     return inputNum;

src/web/LoaderWorker.js

@@ -70,7 +70,7 @@ self.loadFile = function(file, inputNum) {
     };
 
     reader.onerror = function(e) {
-        self.postMessage({"error": reader.error.message, "inputNum": inputNum});
+        self.postMessage({"error": reader.error.message, "inputNum": inputNum, "id": self.id});
     };
 
     seek();