Rolling 20220921

README.md

@@ -69,6 +69,13 @@ In other cases you can contact the developer via email: <img src="https://raw.gi
 
 ------
 
+##### Rolling (2022-09-21)
+
+- New update mechanism: 
+  - handling of all files (zip, tfl, tflite, bin) within in one updload
+  - status (upload, processing, ...) displayed
+  - auto suggestion for reboot (or not in case of web ui update only)
+
 ##### Rolling (2022-09-19)
 
 - Integrated version info better into the html (main page, logfile)

code/components/jomjol_fileserver_ota/server_file.cpp

@@ -52,6 +52,7 @@ extern "C" {
 #define MAX_FILE_SIZE   (2000*1024) // 200 KB
 #define MAX_FILE_SIZE_STR "2000KB"
 
+
 /* Scratch buffer size */
 #define SCRATCH_BUFSIZE  8192 
 
@@ -72,6 +73,9 @@ static const char *TAG_FILESERVER = "file_server";
 
 using namespace std;
 
+string SUFFIX_ZW = "_0xge";
+
+
 esp_err_t get_tflite_file_handler(httpd_req_t *req)
 {
 //    DIR *verzeichnis;
@@ -780,12 +784,20 @@ std::string unzip_new(std::string _in_zip_file, std::string _target_zip, std::st
 
             }
 
-            printf("Filename to extract: %s", zw.c_str());
-            DeleteFile(zw);
-            FILE* fpTargetFile = OpenFileAndWait(zw.c_str(), "wb");
+            string filename_zw = zw + SUFFIX_ZW;
+
+            printf("Filename to extract: %s, Zwischenfilename: %s", zw.c_str(), filename_zw.c_str());
+
+            // extrahieren in zwischendatei
+            DeleteFile(filename_zw);
+            FILE* fpTargetFile = OpenFileAndWait(filename_zw.c_str(), "wb");
             fwrite(p, 1, (uint)uncomp_size, fpTargetFile);
             fclose(fpTargetFile);
 
+            DeleteFile(zw);
+            RenameFile(filename_zw, zw);
+            DeleteFile(filename_zw);
+
             printf("Successfully extracted file \"%s\", size %u\n", archive_filename, (uint)uncomp_size);
             //            printf("File data: \"%s\"\n", (const char*)p);
 

code/components/jomjol_fileserver_ota/server_ota.cpp

@@ -358,24 +358,19 @@ esp_err_t handler_ota_update(httpd_req_t *req)
         {
             std::string in, out, outbin, zw, retfirmware;
 
-//            in = "/sdcard/firmware/html.zip";
             out = "/sdcard/html";
             outbin = "/sdcard/firmware";
 
-//            delete_all_in_directory(out);
-
             retfirmware = unzip_new(fn, out+"/", outbin+"/");
 
             if (retfirmware.length() > 0)
             {
                 filetype = "BIN";
                 fn = retfirmware;
-                zw = "HTML Update Successfull!<br><br>Additioal firmware found in ZIP file.\n";
-                httpd_resp_sendstr_chunk(req, zw.c_str());
             }
             else
             {
-                zw = "HTML Update Successfull!<br><br>No reboot necessary.\n";
+                zw = "HTML Update Successfull! No reboot necessary.\n";
                 httpd_resp_sendstr_chunk(req, zw.c_str());
                 httpd_resp_sendstr_chunk(req, NULL);  
                 return ESP_OK;        
@@ -385,21 +380,20 @@ esp_err_t handler_ota_update(httpd_req_t *req)
 
         if (filetype == "BIN")
         {
-            const char* resp_str;    
+            const char* resp_str; 
+
             KillTFliteTasks();
             gpio_handler_deinit();
             if (ota_update_task(fn))
             {
-//                resp_str = "rebooting - Firmware Update Successfull!<br><br>You can restart now.";
-//                httpd_resp_send(req, resp_str, strlen(resp_str));  
-//                httpd_resp_sendstr_chunk(req, NULL);  
-                return handler_reboot(req);                
-            }
-            else
-            {
-                resp_str = "Error during Firmware Update!!!<br><br>Please check output of console.";
+                std::string zw = "reboot\n";
+                httpd_resp_sendstr_chunk(req, zw.c_str());
+                httpd_resp_sendstr_chunk(req, NULL);  
+                printf("Send reboot\n");
+                return ESP_OK;                
             }
 
+            resp_str = "Error during Firmware Update!!!\nPlease check output of console.";
             httpd_resp_send(req, resp_str, strlen(resp_str));  
 
             #ifdef DEBUG_DETAIL_ON 
@@ -428,7 +422,7 @@ esp_err_t handler_ota_update(httpd_req_t *req)
         delete_all_in_directory(out);
 
         unzip(in, out+"/");
-        zw = "HTML Update Successfull!<br><br>No reboot necessary";
+        zw = "HTML Update Successfull!\nNo reboot necessary";
         httpd_resp_send(req, zw.c_str(), strlen(zw.c_str()));
         httpd_resp_sendstr_chunk(req, NULL);  
         return ESP_OK;        

code/components/jomjol_helper/Helper.cpp

@@ -209,6 +209,23 @@ size_t findDelimiterPos(string input, string delimiter)
 	return pos;
 }
 
+
+void RenameFile(string from, string to)
+{
+//	ESP_LOGI(logTag, "Deleting file : %s", fn.c_str());
+	/* Delete file */
+	FILE* fpSourceFile = OpenFileAndWait(from.c_str(), "rb");
+	if (!fpSourceFile)	// Sourcefile existiert nicht sonst gibt es einen Fehler beim Kopierversuch!
+	{
+		printf("DeleteFile: File %s existiert nicht!\n", from.c_str());
+		return;
+	}
+	fclose(fpSourceFile);
+
+	rename(from.c_str(), to.c_str());
+}
+
+
 void DeleteFile(string fn)
 {
 //	ESP_LOGI(logTag, "Deleting file : %s", fn.c_str());

code/components/jomjol_helper/Helper.h

@@ -11,6 +11,8 @@ void FindReplace(std::string& line, std::string& oldString, std::string& newStri
 
 void CopyFile(string input, string output);
 void DeleteFile(string fn);
+void RenameFile(string from, string to);
+
 
 FILE* OpenFileAndWait(const char* nm, const char* _mode, int _waitsec = 1);
 

code/main/main.cpp

@@ -87,7 +87,7 @@ bool Init_NVS_SDCard()
     // formatted in case when mounting fails.
     esp_vfs_fat_sdmmc_mount_config_t mount_config = {
         .format_if_mount_failed = false,
-        .max_files = 5,
+        .max_files = 7,                         // anstatt 5 (2022-09-21)
         .allocation_unit_size = 16 * 1024
     };
 

code/main/version.cpp

@@ -1,4 +1,4 @@
-const char* GIT_REV="45c9914";
+const char* GIT_REV="562cc43";
 const char* GIT_TAG="";
 const char* GIT_BRANCH="rolling";
-const char* BUILD_TIME="2022-09-19 20:06";
+const char* BUILD_TIME="2022-09-21 20:25";

code/sd-card/html/version.txt

@@ -1 +1 @@
-rolling, 45c9914, 
+rolling, 562cc43, 

code/version.cpp

@@ -1,4 +1,4 @@
-const char* GIT_REV="45c9914";
+const char* GIT_REV="562cc43";
 const char* GIT_TAG="";
 const char* GIT_BRANCH="rolling";
-const char* BUILD_TIME="2022-09-19 20:06";
+const char* BUILD_TIME="2022-09-21 20:25";

sd-card/html/ota_page.html

@@ -30,116 +30,49 @@ input[type=number] {
 
 <body style="font-family: arial; padding: 0px 10px;">
 Check at <a href="https://github.com/jomjol/AI-on-the-edge-device/releases" target=_blank>https://github.com/jomjol/AI-on-the-edge-device/releases</a> to see if there is an update available.
-<h3>It is strongly recommended to update firmware and web interface (stored separately in the html directory on SD-card) at the same time!</h3>
+<h3>If not use the overall update (update.zip), it is strongly recommended to update firmware and web interface at the same time!</h3>
 <hr>
-<h2>1. Firmware Update</h2>
+<h2>Update</h2>
 <table class="fixed" border="0">
     <tr>
-        <td>
-            <table border="0">
-                <tr>
-                    <td style="width: 230px">
-                        <label for="newfile">Select the firmware file (firmware.bin):</label>
-                    </td>
-                    <td colspan="2">
-                        <input id="newfile" type="file" onchange="setpath()" style="width:100%;">
-                    </td>
-                    <td rowspan="2" style="padding-left:50px">
-                        <button class="button" id="doUpdate" type="button" onclick="doUpdate()">Flash the firmware<br>(Takes about 60s)</button>
-                    </td>
-                </tr>
-                <tr>
-                    <td>
-                        <label for="filepath">Set path on server:</label>
-                    </td>
-                    <td>
-                        <input id="filepath" type="text" style="width:100%; border: 0" readonly>
-                    </td>
-                    <td>
-                        <button id="upload" type="button" onclick="upload()">Upload</button>
-                    </td>
-                </tr>
-            </table>
-        </td>
+        <p>
+            <label for="newfile">Select the update file (update.zip, firmware.bin, html.zip, *.tfl/tflite):</label>
+        </p>
+        
     </tr>
-</table>
-<h2>2. Web Interface Update</h2>
-<table class="fixed" border="0">
     <tr>
-        <td>
-            <table border="0">
-                <tr>
-                    <td style="width: 230px">
-                        <label for="newfilehtml">Select the Web Interface file (html.zip):</label>
-                    </td>
-                    <td colspan="2">
-                        <input id="newfilehtml" type="file" onchange="setpathhtml()" style="width:100%;">
-                    </td>
-                    <td rowspan="2" style="padding-left:50px">
-			<button class="button" id="doUpdatehtml" type="button" onclick="doUpdatehtml()">Update Web Interface</button>
-                    </td>
-                </tr>
-                <tr>
-                    <td>
-                        <label for="filepathhtml">Set path on server:</label>
-                    </td>
-                    <td>
-                        <input id="filepathhtml" type="text" style="width:100%; border: 0" readonly>
-                    </td>
-                    <td>
-                        <button id="uploadhtml" type="button" onclick="uploadhtml()">Upload</button>
-                    </td>
-                </tr>
-            </table>
-        </td>
+        <p>
+            <input id="newfile" type="file" onchange="setpath()" style="width:100%;">
+        </p>
+    </tr>
+    <tr>
+        <p>
+            <button class="button" id="doUpdate" type="button" onclick="upload()">Do upload and update<br>(incl. reboot - if needed)</button>
+        </p>
     </tr>
-</table>
-<h2>3. Reboot</h2>
-			<button class="button" id="reboot" type="button" onclick="doReboot()">Reboot to activate updates</button>
-<hr>
-<h2>Upload Neural Network Definition (tfl/tflite file)</h2>
-<b>The file must be set active afterwards on the <a href="index_configure.html" target="_parent">Config</a> page</b>!
-<table class="fixed" border="0">
     <tr>
-        <td>
-            <table border="0">
-                <tr>
-                    <td>
-                        <label for="newfiletfl">Select the tfl/tflite file</label>
-                    </td>
-                    <td colspan="2">
-                        <input id="newfiletfl" type="file" onchange="setpathtfl()" style="width:100%;">
-                    </td>
-                </tr>
-                <tr>
-                    <td>
-                        <label for="filepathtfl">Set path on server</label>
-                    </td>
-                    <td>
-                        <input id="filepathtfl" type="text" style="width:100%; border: 0" readonly>
-                    </td>
-                    <td>
-                        <button id="uploadtfl" type="button" onclick="uploadtfl()" disabled>Upload</button>
-                    </td>
-                </tr>
-            </table>
-        </td>
+        <p>
+            <h3><div id="status">Status: idle</div></h3>
+        </p>
     </tr>
 </table>
-
+<h2>Reboot</h2>
+			<button class="button" id="reboot" type="button" onclick="doReboot()">Manual reboot</button>
+<hr>
 
 <script type="text/javascript" src="./gethost.js"></script> 
 
 
 <script language="JavaScript">
 
+var basepath = "http://192.168.178.26";
+
+
 function init(){
-    document.getElementById("reboot").disabled = true;
-    document.getElementById("upload").disabled = true;
-    document.getElementById("uploadhtml").disabled = true;    
+    basepath = getbasepath();
+
+//    document.getElementById("reboot").disabled = true;
     document.getElementById("doUpdate").disabled = true;
-    document.getElementById("doUpdatehtml").disabled = true;
-    document.getElementById("uploadtfl").disabled = true;
 }
 
 function doUpdate() {
@@ -169,33 +102,6 @@ function doUpdate() {
 	}
 }
 
-function doUpdatehtml() {
-	if (confirm("Are you sure to update the /html content?")) {
-		var stringota = "/ota?task=unziphtml";
-        document.getElementById("doUpdatehtml").disabled = true;
-
-        
-        var xhttp = new XMLHttpRequest();
-	
-        xhttp.onreadystatechange = function() {
-            if (xhttp.readyState == 4) {
-                if (xhttp.status == 200) {
-                    document.getElementById("reboot").disabled = false;
-                    alert("Update /html successful!");
-                    /* keine Reaktion, damit sich das Dokument nicht ändert */
-                } else if (xhttp.status == 0) {
-                    alert("Server closed the connection abruptly!");
-                    UpdatePage();
-                } else {
-                    alert(xhttp.status + " Error!\n" + xhttp.responseText);
-                    UpdatePage();
-                }
-            }
-        };
-        xhttp.open("GET", stringota, true);
-        xhttp.send();
-	}
-}
 
 function doReboot() {
 	if (confirm("Are you sure you want to reboot the ESP32?")) {
@@ -208,32 +114,24 @@ function doReboot() {
 }
 
 function setpath() {
-    var fileserverpraefix = "/firmware/firmware.bin";
-    document.getElementById("filepath").value = fileserverpraefix;
-    document.getElementById("upload").disabled = false;
-}
-
-function setpathhtml() {
-    var fileserverpraefix = "/firmware/html.zip";
-    document.getElementById("filepathhtml").value = fileserverpraefix;
-    document.getElementById("uploadhtml").disabled = false;
-}
-
-
-function setpathtfl() {
-    var nameneu = document.getElementById("newfiletfl").value;
+    var nameneu = document.getElementById("newfile").value;
     nameneu = nameneu.split(/[\\\/]/).pop();
-    var fileserverpraefix = "/config/" + nameneu;
-    document.getElementById("filepathtfl").value = fileserverpraefix;
-    document.getElementById("uploadtfl").disabled = false;
+    document.getElementById("doUpdate").disabled = false;
+    document.getElementById("status").innerText = "Status: file selected";
 }
 
 
-
-
 function upload() {
+    document.getElementById("reboot").disabled = true;
+    document.getElementById("doUpdate").disabled = true;
+
 	var xhttp = new XMLHttpRequest();
-	
+
+    var nameneu = document.getElementById("newfile").value;
+    filePath = nameneu.split(/[\\\/]/).pop();
+    var upload_path = "/upload/firmware/" + filePath;
+    var fileInput = document.getElementById("newfile").files;
+
 	/* first delete the old firmware */	
 	xhttp.onreadystatechange = function() {
 		if (xhttp.readyState == 4) {
@@ -248,18 +146,16 @@ function upload() {
 			}
 		}
 	};
-	xhttp.open("GET", "/ota?delete=firmware.bin", false);
+    var _toDo = basepath + "/ota?delete=" + filePath;
+	xhttp.open("GET", _toDo, false);
 	xhttp.send();
 	/* ----------------------------- */
 	
-    var filePath = document.getElementById("filepath").value;
-    var upload_path = "/upload/" + filePath;
-    var fileInput = document.getElementById("newfile").files;
 
     /* Max size of an individual file. Make sure this
      * value is same as that set in file_server.c */
-    var MAX_FILE_SIZE = 2000*1024;
-    var MAX_FILE_SIZE_STR = "2000KB";
+    var MAX_FILE_SIZE = 8000*1024;
+    var MAX_FILE_SIZE_STR = "8MB";
 
     if (fileInput.length == 0) {
         alert("No file selected!");
@@ -269,17 +165,15 @@ function upload() {
         alert("File path on server cannot have spaces!");
     } else if (filePath[filePath.length-1] == '/') {
         alert("File name not specified after path!");
-    } else if (fileInput[0].size > 2000*1024) {
-        alert("File size must be less than 2000KB!");
+    } else if (fileInput[0].size > MAX_FILE_SIZE) {
+        alert("File size must be less than " + MAX_FILE_SIZE_STR + "!");
     } else {
         document.getElementById("newfile").disabled = true;
-        document.getElementById("filepath").disabled = true;
-        document.getElementById("upload").disabled = true;
 		
         xhttp.onreadystatechange = function() {
             if (xhttp.readyState == 4) {
                 if (xhttp.status == 200) {
-					alert("Upload successfull!")
+//					alert("Upload successfull!")
 //                    document.reload();
                     document.getElementById("reboot").disabled = false;
                     document.getElementById("doUpdate").disabled = false;
@@ -295,19 +189,26 @@ function upload() {
 		
 
         var file = fileInput[0];
-        xhttp.open("POST", upload_path, true);
+        xhttp.open("POST", upload_path, false);
+        document.getElementById("status").innerText = "Status: uploading";
         xhttp.send(file);
     }
-}
 
-function uploadhtml() {
+    document.getElementById("status").innerText = "Status: processing on ESP32";
+
 	var xhttp = new XMLHttpRequest();
-	
 	/* first delete the old firmware */	
 	xhttp.onreadystatechange = function() {
 		if (xhttp.readyState == 4) {
 			if (xhttp.status == 200) {
-				/* keine Reaktion, damit sich das Dokument nicht ändert */
+                if (xhttp.responseText.startsWith("reboot"))
+                {
+                    doReboot();
+                }
+                else
+                {
+                    alert("Processing done!\n\n" + xhttp.responseText);
+                }
 			} else if (xhttp.status == 0) {
 				alert("Server closed the connection abruptly!");
 				UpdatePage();
@@ -317,127 +218,19 @@ function uploadhtml() {
 			}
 		}
 	};
-	xhttp.open("GET", "/ota?delete=html.zip", false);
+    var _toDo = basepath + "/ota?task=update&file=" + filePath;
+	xhttp.open("GET", _toDo, false);
 	xhttp.send();
 	/* ----------------------------- */
-	
-    var filePath = document.getElementById("filepathhtml").value;
-    var upload_path = "/upload/" + filePath;
-    var fileInput = document.getElementById("newfilehtml").files;
 
-    /* Max size of an individual file. Make sure this
-     * value is same as that set in file_server.c */
-    var MAX_FILE_SIZE = 2000*1024;
-    var MAX_FILE_SIZE_STR = "2000KB";
-
-    if (fileInput.length == 0) {
-        alert("No file selected!");
-    } else if (filePath.length == 0) {
-        alert("File path on server is not set!");
-    } else if (filePath.indexOf(' ') >= 0) {
-        alert("File path on server cannot have spaces!");
-    } else if (filePath[filePath.length-1] == '/') {
-        alert("File name not specified after path!");
-    } else if (fileInput[0].size > 2000*1024) {
-        alert("File size must be less than 2000KB!");
-    } else {
-        document.getElementById("newfilehtml").disabled = true;
-        document.getElementById("filepathhtml").disabled = true;
-        document.getElementById("uploadhtml").disabled = true;
-		
-        xhttp.onreadystatechange = function() {
-            if (xhttp.readyState == 4) {
-                if (xhttp.status == 200) {
-					alert("Upload successfull!")
-//                    document.reload();
-                    document.getElementById("reboot").disabled = false;
-                    document.getElementById("doUpdatehtml").disabled = false;
-                } else if (xhttp.status == 0) {
-                    alert("Server closed the connection abruptly!");
-                    UpdatePage();
-                } else {
-                    alert(xhttp.status + " Error!\n" + xhttp.responseText);
-                    UpdatePage();
-                }
-            }
-        };
-		
-
-        var file = fileInput[0];
-        xhttp.open("POST", upload_path, true);
-        xhttp.send(file);
-    }
-}
-
-
-function uploadtfl() {
-	var xhttp = new XMLHttpRequest();
-	
-	/* first delete the old firmware */	
-	xhttp.onreadystatechange = function() {
-		if (xhttp.readyState == 4) {
-			if (xhttp.status == 200) {
-				/* keine Reaktion, damit sich das Dokument nicht ändert */
-			} else if (xhttp.status == 0) {
-				alert("Server closed the connection abruptly!");
-				UpdatePage();
-			} else {
-				alert(xhttp.status + " Error!\n" + xhttp.responseText);
-				UpdatePage();
-			}
-		}
-	};
-	/* ----------------------------- */
-	
-    var filePath = document.getElementById("filepathtfl").value;
-    var upload_path = "/upload/" + filePath;
-    var fileInput = document.getElementById("newfiletfl").files;
+    document.getElementById("reboot").disabled = false;
+    document.getElementById("doUpdate").disabled = true;
+    document.getElementById("newfile").disabled = false;
 
-    /* Max size of an individual file. Make sure this
-     * value is same as that set in file_server.c */
-    var MAX_FILE_SIZE = 2000*1024;
-    var MAX_FILE_SIZE_STR = "2000KB";
 
-    if (fileInput.length == 0) {
-        alert("No file selected!");
-    } else if (filePath.length == 0) {
-        alert("File path on server is not set!");
-    } else if (filePath.indexOf(' ') >= 0) {
-        alert("File path on server cannot have spaces!");
-    } else if (filePath[filePath.length-1] == '/') {
-        alert("File name not specified after path!");
-    } else if (fileInput[0].size > 2000*1024) {
-        alert("File size must be less than 2000KB!");
-    } else {
-        document.getElementById("newfiletfl").disabled = true;
-        document.getElementById("filepathtfl").disabled = true;
-        document.getElementById("uploadtfl").disabled = true;
-		
-        xhttp.onreadystatechange = function() {
-            if (xhttp.readyState == 4) {
-                if (xhttp.status == 200) {
-					alert("Upload successfull!")
-                    document.getElementById("newfiletfl").disabled = false;
-                    document.getElementById("filepathtfl").disabled = false;
-                } else if (xhttp.status == 0) {
-                    alert("Server closed the connection abruptly!");
-                    UpdatePage();
-                } else {
-                    alert(xhttp.status + " Error!\n" + xhttp.responseText);
-                    UpdatePage();
-                }
-            }
-        };
-		
 
-        var file = fileInput[0];
-        xhttp.open("POST", upload_path, true);
-        xhttp.send(file);
-    }
 }
 
-
-
 init();
 
 </script>

sd-card/html/ota_page_new.html

@@ -1,238 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-<link rel="icon" href="favicon.ico" type="image/x-icon">
-<title>OTA Update</title>
-<meta charset="utf-8">
-
-<style>
-h1 {font-size: 2em;}
-h2 {font-size: 1.5em;}
-h3 {font-size: 1.2em;} 
-p {font-size: 1em;}
-
-input[type=number] {
-	width: 138px;
-	padding: 10px 5px;
-	display: inline-block;
-	border: 1px solid #ccc;
-	font-size: 16px; 
-}
-
-.button {
-	padding: 10px 20px;
-    width: 211px;
-	font-size: 16px;
-}
-</style>
-
-</head>
-
-<body style="font-family: arial; padding: 0px 10px;">
-Check at <a href="https://github.com/jomjol/AI-on-the-edge-device/releases" target=_blank>https://github.com/jomjol/AI-on-the-edge-device/releases</a> to see if there is an update available.
-<h3>It is strongly recommended to update firmware and web interface (stored separately in the html directory on SD-card) at the same time!</h3>
-<hr>
-<h2>Update</h2>
-<table class="fixed" border="0">
-    <tr>
-        <p>
-            <label for="newfile">Select the update file (update.zip, firmware.bin, html.zip, *.tfl/tflite):</label>
-        </p>
-        
-    </tr>
-    <tr>
-        <p>
-            <input id="newfile" type="file" onchange="setpath()" style="width:100%;">
-        </p>
-    </tr>
-    <tr>
-        <p>
-            <button class="button" id="doUpdate" type="button" onclick="upload()">Do upload and update<br>(incl. reboot - if needed)</button>
-        </p>
-    </tr>
-    <tr>
-        <p>
-            <h3><div id="status">Status: idle</div></h3>
-        </p>
-    </tr>
-</table>
-<h2>Reboot</h2>
-			<button class="button" id="reboot" type="button" onclick="doReboot()">Manual reboot</button>
-<hr>
-
-<script type="text/javascript" src="./gethost.js"></script> 
-
-
-<script language="JavaScript">
-
-var basepath = "http://192.168.178.26";
-
-
-function init(){
-    basepath = getbasepath();
-
-    document.getElementById("reboot").disabled = true;
-    document.getElementById("doUpdate").disabled = true;
-}
-
-function doUpdate() {
-	if (confirm("Are you sure to update the firmware?")) {
-		var stringota = "/ota?file=firmware.bin";
-        document.getElementById("doUpdate").disabled = true;
-        
-        var xhttp = new XMLHttpRequest();
-	
-        xhttp.onreadystatechange = function() {
-            if (xhttp.readyState == 4) {
-                if (xhttp.status == 200) {
-                    document.getElementById("reboot").disabled = false;
-                    alert("Flash successfull - Reboot necessary to make changes active.");
-                    /* keine Reaktion, damit sich das Dokument nicht ändert */
-                } else if (xhttp.status == 0) {
-                    alert("Server closed the connection abruptly!");
-                    UpdatePage();
-                } else {
-                    alert(xhttp.status + " Error!\n" + xhttp.responseText);
-                    UpdatePage();
-                }
-            }
-        };
-        xhttp.open("GET", stringota, true);
-        xhttp.send();        
-	}
-}
-
-
-function doReboot() {
-	if (confirm("Are you sure you want to reboot the ESP32?")) {
-		var stringota = "/reboot";
-		window.location = stringota;
-		window.location.href = stringota;
-		window.location.assign(stringota);
-		window.location.replace(stringota);
-	}
-}
-
-function setpath() {
-    var nameneu = document.getElementById("newfile").value;
-    nameneu = nameneu.split(/[\\\/]/).pop();
-    document.getElementById("doUpdate").disabled = false;
-    document.getElementById("status").innerText = "Status: file selected";
-}
-
-
-function upload() {
-	var xhttp = new XMLHttpRequest();
-
-    var nameneu = document.getElementById("newfile").value;
-    filePath = nameneu.split(/[\\\/]/).pop();
-    var upload_path = "/upload/firmware/" + filePath;
-    var fileInput = document.getElementById("newfile").files;
-
-	/* first delete the old firmware */	
-	xhttp.onreadystatechange = function() {
-		if (xhttp.readyState == 4) {
-			if (xhttp.status == 200) {
-				/* keine Reaktion, damit sich das Dokument nicht ändert */
-			} else if (xhttp.status == 0) {
-				alert("Server closed the connection abruptly!");
-				UpdatePage();
-			} else {
-				alert(xhttp.status + " Error!\n" + xhttp.responseText);
-				UpdatePage();
-			}
-		}
-	};
-    var _toDo = basepath + "/ota?delete=" + filePath;
-	xhttp.open("GET", _toDo, false);
-	xhttp.send();
-	/* ----------------------------- */
-	
-
-    /* Max size of an individual file. Make sure this
-     * value is same as that set in file_server.c */
-    var MAX_FILE_SIZE = 8000*1024;
-    var MAX_FILE_SIZE_STR = "8MB";
-
-    if (fileInput.length == 0) {
-        alert("No file selected!");
-    } else if (filePath.length == 0) {
-        alert("File path on server is not set!");
-    } else if (filePath.indexOf(' ') >= 0) {
-        alert("File path on server cannot have spaces!");
-    } else if (filePath[filePath.length-1] == '/') {
-        alert("File name not specified after path!");
-    } else if (fileInput[0].size > MAX_FILE_SIZE) {
-        alert("File size must be less than " + MAX_FILE_SIZE_STR + "!");
-    } else {
-        document.getElementById("newfile").disabled = true;
-        document.getElementById("filepath").disabled = true;
-        document.getElementById("upload").disabled = true;
-		
-        xhttp.onreadystatechange = function() {
-            if (xhttp.readyState == 4) {
-                if (xhttp.status == 200) {
-//					alert("Upload successfull!")
-//                    document.reload();
-                    document.getElementById("reboot").disabled = false;
-                    document.getElementById("doUpdate").disabled = false;
-                } else if (xhttp.status == 0) {
-                    alert("Server closed the connection abruptly!");
-                    UpdatePage();
-                } else {
-                    alert(xhttp.status + " Error!\n" + xhttp.responseText);
-                    UpdatePage();
-                }
-            }
-        };
-		
-
-        var file = fileInput[0];
-        xhttp.open("POST", upload_path, false);
-        document.getElementById("status").innerText = "Status: uploading";
-        xhttp.send(file);
-    }
-
-    document.getElementById("status").innerText = "Status: processing on ESP32";
-
-	var xhttp = new XMLHttpRequest();
-	/* first delete the old firmware */	
-	xhttp.onreadystatechange = function() {
-		if (xhttp.readyState == 4) {
-			if (xhttp.status == 200) {
-                if (xhttp.responseText == "reboot")
-                {
-                    var stringota = "/reboot_action.html";
-            		window.location = stringota;
-		            window.location.href = stringota;
-		            window.location.assign(stringota);
-		            window.location.replace(stringota);
-                }
-                else
-                {
-                    alert("Processing done!\n\n" + xhttp.responseText);
-                }
-			} else if (xhttp.status == 0) {
-				alert("Server closed the connection abruptly!");
-				UpdatePage();
-			} else {
-				alert(xhttp.status + " Error!\n" + xhttp.responseText);
-				UpdatePage();
-			}
-		}
-	};
-    var _toDo = basepath + "/ota?task=update&file=" + filePath;
-	xhttp.open("GET", _toDo, false);
-	xhttp.send();
-	/* ----------------------------- */
-
-
-
-
-}
-
-init();
-
-</script>
-</body>
-</html>

sd-card/html/ota_page_v2.html → sd-card/html/ota_page_old.html

@@ -1,40 +1,59 @@
+<!DOCTYPE html>
 <html>
 <head>
-<link rel="icon" href="data:,">
-	<title>AI on the edge</title>
-	<meta charset="utf-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1">
-	<script type="text/javascript">
-		//<![CDATA[
-		//]]>
-
-	</script>
-</head>
+<link rel="icon" href="favicon.ico" type="image/x-icon">
+<title>OTA Update</title>
+<meta charset="utf-8">
+
+<style>
+h1 {font-size: 2em;}
+h2 {font-size: 1.5em;}
+h3 {font-size: 1.2em;} 
+p {font-size: 1em;}
+
+input[type=number] {
+	width: 138px;
+	padding: 10px 5px;
+	display: inline-block;
+	border: 1px solid #ccc;
+	font-size: 16px; 
+}
 
-<body>
+.button {
+	padding: 10px 20px;
+    width: 211px;
+	font-size: 16px;
+}
+</style>
 
-<button id="testupdownload" type="button" onclick="testupdownload()">UpDownload</button>
+</head>
 
-<h3>It is strongly recommended to update firmware and content of /html directory on SD-card at the same time!</h3>
+<body style="font-family: arial; padding: 0px 10px;">
+Check at <a href="https://github.com/jomjol/AI-on-the-edge-device/releases" target=_blank>https://github.com/jomjol/AI-on-the-edge-device/releases</a> to see if there is an update available.
+<h3>It is strongly recommended to update firmware and web interface (stored separately in the html directory on SD-card) at the same time!</h3>
+<hr>
 <h2>1. Firmware Update</h2>
 <table class="fixed" border="0">
     <tr>
         <td>
             <table border="0">
                 <tr>
-                    <td>
-                        <label for="newfile">Select the firmware file</label>
+                    <td style="width: 230px">
+                        <label for="newfile">Select the firmware file (firmware.bin):</label>
                     </td>
                     <td colspan="2">
                         <input id="newfile" type="file" onchange="setpath()" style="width:100%;">
                     </td>
+                    <td rowspan="2" style="padding-left:50px">
+                        <button class="button" id="doUpdate" type="button" onclick="doUpdate()">Flash the firmware<br>(Takes about 60s)</button>
+                    </td>
                 </tr>
                 <tr>
                     <td>
-                        <label for="filepath">Set path on server</label>
+                        <label for="filepath">Set path on server:</label>
                     </td>
                     <td>
-                        <input id="filepath" type="text" style="width:100%;" readonly>
+                        <input id="filepath" type="text" style="width:100%; border: 0" readonly>
                     </td>
                     <td>
                         <button id="upload" type="button" onclick="upload()">Upload</button>
@@ -43,32 +62,29 @@
             </table>
         </td>
     </tr>
-	<tr>
-		<td>
-			<button id="doUpdate" type="button" onclick="doUpdate()">Flash the firmware</button> (Takes about 60s)
-		</td>
-	</tr>
 </table>
-
-<h2>2. Update /html directory</h2>
+<h2>2. Web Interface Update</h2>
 <table class="fixed" border="0">
     <tr>
         <td>
             <table border="0">
                 <tr>
-                    <td>
-                        <label for="newfilehtml">Select the zipped /html content</label>
+                    <td style="width: 230px">
+                        <label for="newfilehtml">Select the Web Interface file (html.zip):</label>
                     </td>
                     <td colspan="2">
                         <input id="newfilehtml" type="file" onchange="setpathhtml()" style="width:100%;">
                     </td>
+                    <td rowspan="2" style="padding-left:50px">
+			<button class="button" id="doUpdatehtml" type="button" onclick="doUpdatehtml()">Update Web Interface</button>
+                    </td>
                 </tr>
                 <tr>
                     <td>
-                        <label for="filepathhtml">Set path on server</label>
+                        <label for="filepathhtml">Set path on server:</label>
                     </td>
                     <td>
-                        <input id="filepathhtml" type="text" style="width:100%;" readonly>
+                        <input id="filepathhtml" type="text" style="width:100%; border: 0" readonly>
                     </td>
                     <td>
                         <button id="uploadhtml" type="button" onclick="uploadhtml()">Upload</button>
@@ -77,21 +93,12 @@
             </table>
         </td>
     </tr>
-	<tr>
-		<td>
-			<button id="doUpdatehtml" type="button" onclick="doUpdatehtml()">Update "/html" directory</button>
-		</td>
-	</tr>
 </table>
 <h2>3. Reboot</h2>
-<table class="fixed" border="0">
-	<tr>
-		<td>
-			<button id="reboot" type="button" onclick="doReboot()">Reboot to activate updates</button>
-		</td>
-	</tr>
-</table>
-<h2>4. Upload neural network definition (tfl/tflite file)</h2>
+			<button class="button" id="reboot" type="button" onclick="doReboot()">Reboot to activate updates</button>
+<hr>
+<h2>Upload Neural Network Definition (tfl/tflite file)</h2>
+<b>The file must be set active afterwards on the <a href="index_configure.html" target="_parent">Config</a> page</b>!
 <table class="fixed" border="0">
     <tr>
         <td>
@@ -109,7 +116,7 @@
                         <label for="filepathtfl">Set path on server</label>
                     </td>
                     <td>
-                        <input id="filepathtfl" type="text" style="width:100%;" readonly>
+                        <input id="filepathtfl" type="text" style="width:100%; border: 0" readonly>
                     </td>
                     <td>
                         <button id="uploadtfl" type="button" onclick="uploadtfl()" disabled>Upload</button>
@@ -118,7 +125,6 @@
             </table>
         </td>
     </tr>
-    The file must be activated in the config.ini file.
 </table>
 
 
@@ -127,29 +133,19 @@
 
 <script language="JavaScript">
 
-function testupdownload(){
-    var xhr = new XMLHttpRequest();
-    xhr.open("get", "https://github.com/jomjol/AI-on-the-edge-device/raw/master/firmware/html.zip", true);
-    xhr.onload = function () {
-        xhr.close();
-        var xhr2 = new XMLHttpRequest();
-        xhr2.open("post", "/upload/firmware/html2.zip", true);
-        xhr2.send(xhr.response);
-        }
-    xhr.send();
-}
-
 function init(){
     document.getElementById("reboot").disabled = true;
     document.getElementById("upload").disabled = true;
     document.getElementById("uploadhtml").disabled = true;    
     document.getElementById("doUpdate").disabled = true;
     document.getElementById("doUpdatehtml").disabled = true;
+    document.getElementById("uploadtfl").disabled = true;
 }
 
 function doUpdate() {
 	if (confirm("Are you sure to update the firmware?")) {
 		var stringota = "/ota?file=firmware.bin";
+        document.getElementById("doUpdate").disabled = true;
         
         var xhttp = new XMLHttpRequest();
 	
@@ -176,6 +172,8 @@ function doUpdate() {
 function doUpdatehtml() {
 	if (confirm("Are you sure to update the /html content?")) {
 		var stringota = "/ota?task=unziphtml";
+        document.getElementById("doUpdatehtml").disabled = true;
+
         
         var xhttp = new XMLHttpRequest();
 	
@@ -213,8 +211,6 @@ function setpath() {
     var fileserverpraefix = "/firmware/firmware.bin";
     document.getElementById("filepath").value = fileserverpraefix;
     document.getElementById("upload").disabled = false;
-    document.getElementById("uploadtfl").disabled = true;
-
 }
 
 function setpathhtml() {
@@ -223,6 +219,7 @@ function setpathhtml() {
     document.getElementById("uploadhtml").disabled = false;
 }
 
+
 function setpathtfl() {
     var nameneu = document.getElementById("newfiletfl").value;
     nameneu = nameneu.split(/[\\\/]/).pop();
@@ -232,6 +229,8 @@ function setpathtfl() {
 }
 
 
+
+
 function upload() {
 	var xhttp = new XMLHttpRequest();
 	
@@ -370,6 +369,7 @@ function uploadhtml() {
     }
 }
 
+
 function uploadtfl() {
 	var xhttp = new XMLHttpRequest();
 	
@@ -417,6 +417,8 @@ function uploadtfl() {
             if (xhttp.readyState == 4) {
                 if (xhttp.status == 200) {
 					alert("Upload successfull!")
+                    document.getElementById("newfiletfl").disabled = false;
+                    document.getElementById("filepathtfl").disabled = false;
                 } else if (xhttp.status == 0) {
                     alert("Server closed the connection abruptly!");
                     UpdatePage();
@@ -435,9 +437,9 @@ function uploadtfl() {
 }
 
 
+
 init();
 
 </script>
-
-
-</body></html>
+</body>
+</html>

sd-card/html/reboot_action.html

@@ -1,11 +0,0 @@
-<body style='font-family: arial'> 
-    <h3 id=t></h3>
-    </body>
-    
-    <script>
-        var h='Rebooting!<br>The page will automatically reload after around 25s.<br>';
-        document.getElementById('t').innerHTML=h; 
-        setInterval(function (){h +='.'; 
-        document.getElementById('t').innerHTML=h; 
-        fetch(window.location.hostname,{mode: 'no-cors'}).then(r=>{parent.location.href=('/index.html');})}, 1000);
-    </script>

sd-card/html/version.txt

@@ -1 +1 @@
-rolling, 45c9914, 
+rolling, 562cc43,