Mirror/AI-on-the-edge-device
1
0
Fork 0
mirror of https://github.com/jomjol/AI-on-the-edge-device.git synced 2025-12-10 21:46:55 +03:00
Code Issues Packages Projects Releases Wiki Activity

Improve file server (#1785)

Browse Source 
* .

* .

* .

* .

* .

* .

* .

Co-authored-by: CaCO3 <caco@ruinelli.ch>
This commit is contained in:
CaCO3
2023-01-08 12:36:13 +01:00
committed by GitHub
parent 758238a82e
commit ee4832323d
5 changed files with 88 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
code/components/jomjol_fileserver_ota/server_file.cpp
View File

@@ -219,7 +219,7 @@ static esp_err_t http_resp_dir_html(httpd_req_t *req, const char *dirpath, const
///////////////////////////////////////////////// /////////////////////////////////////////////////
if (!readonly) { if (!readonly) {
FILE *fd = fopen("/sdcard/html/upload_script.html", "r"); FILE *fd = fopen("/sdcard/html/file_server.html", "r");
char *chunk = ((struct file_server_data *)req->user_ctx)->scratch; char *chunk = ((struct file_server_data *)req->user_ctx)->scratch;
size_t chunksize; size_t chunksize;
do { do {
@@ -245,11 +245,11 @@ static esp_err_t http_resp_dir_html(httpd_req_t *req, const char *dirpath, const
/* Send file-list table definition and column labels */ /* Send file-list table definition and column labels */
httpd_resp_sendstr_chunk(req, httpd_resp_sendstr_chunk(req,
"<table class=\"fixed\" border=\"1\">" "<table id=\"files_table\">"
"<col width=\"800px\" /><col width=\"300px\" /><col width=\"300px\" /><col width=\"100px\" />" "<col width=\"800px\" /><col width=\"300px\" /><col width=\"300px\" /><col width=\"100px\" />"
"<thead><tr><th>Name</th><th>Type</th><th>Size (Bytes)</th>"); "<thead><tr><th>Name</th><th>Type</th><th>Size</th>");
if (!readonly) { if (!readonly) {
httpd_resp_sendstr_chunk(req, "<th>Delete<br>" httpd_resp_sendstr_chunk(req, "<th>"
"<form method=\"post\" action=\""); "<form method=\"post\" action=\"");
httpd_resp_sendstr_chunk(req, _zw.c_str()); httpd_resp_sendstr_chunk(req, _zw.c_str());
httpd_resp_sendstr_chunk(req, httpd_resp_sendstr_chunk(req,
@@ -270,7 +270,19 @@ static esp_err_t http_resp_dir_html(httpd_req_t *req, const char *dirpath, const
ESP_LOGE(TAG, "Failed to stat %s: %s", entrytype, entry->d_name); ESP_LOGE(TAG, "Failed to stat %s: %s", entrytype, entry->d_name);
continue; continue;
} }
sprintf(entrysize, "%ld", entry_stat.st_size);
if (entry->d_type == DT_DIR) {
strcpy(entrysize, "-\0");
}
else {
if (entry_stat.st_size >= 1024) {
sprintf(entrysize, "%ld KiB", entry_stat.st_size / 1024); // kBytes
}
else {
sprintf(entrysize, "%ld B", entry_stat.st_size); // Bytes
}
}
ESP_LOGI(TAG, "Found %s: %s (%s bytes)", entrytype, entry->d_name, entrysize); ESP_LOGI(TAG, "Found %s: %s (%s bytes)", entrytype, entry->d_name, entrysize);
/* Send chunk of HTML file containing table entries with file name and size */ /* Send chunk of HTML file containing table entries with file name and size */

74
sd-card/html/upload_script.html → sd-card/html/file_server.html
View File

@@ -1,18 +1,43 @@
<html> <html>
<head> <head>
<link href="firework.css" rel="stylesheet"> <link href="/fileserver/html/firework.css" rel="stylesheet">
<script type="text/javascript" src="jquery-3.6.0.min.js"></script> <script type="text/javascript" src="/fileserver/html/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="firework.js"></script> <script type="text/javascript" src="/fileserver/html/firework.js"></script>
<style>
#files_table {
font-family: Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#files_table td, #files_table th {
border: 1px solid #ddd;
padding: 8px;
}
#files_table tr:nth-child(even){
background-color: #f2f2f2;
}
#files_table tr:hover {
background-color: #ddd;
}
#files_table th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #0011ff;
color: white;
}
</style>
</head> </head>
</body> </body>
<table class="fixed" border="0" style="font-family: arial"> <table class="fixed" border="0" width=100% style="font-family: arial">
<col width="300px" /><col width="200px" />
<tr><td> <tr><td>
<h2>ESP32 File Server</h2> <h2>Content on SD-Card</h2>
</td><td>
<button id="dirup" type="button" onclick="dirup()">Directory up</button>
</td> </td>
<td> <td rowspan="2" width="500px">
<table border="0"> <table border="0">
<tr> <tr>
<td> <td>
@@ -35,6 +60,11 @@
</tr> </tr>
</table> </table>
</td></tr> </td></tr>
<tr>
<td>
<span id="currentpath"></span> &nbsp;&nbsp;&nbsp;&nbsp;<button id="dirup" type="button" onclick="dirup()" disabled>&#129041; Directory up</button>
</td>
</tr>
</table> </table>
<script type="text/javascript" src="/fileserver/html/common.js"> <script type="text/javascript" src="/fileserver/html/common.js">
@@ -59,6 +89,7 @@ function dirup() {
found = zw; found = zw;
} }
var res = str.substring(0, found+1); var res = str.substring(0, found+1);
window.location.href = res; window.location.href = res;
} }
@@ -111,6 +142,31 @@ function upload() {
xhttp.send(file); xhttp.send(file);
} }
} }
function checkAtRootLevel(res) {
if (getPath() == "/fileserver/") { // Already at root level
document.getElementById("dirup").disabled = true;
console.log("Already on sd-card root level!");
return true;
}
document.getElementById("dirup").disabled = false;
return false;
}
function getPath() {
return window.location.pathname.replace(/\/+$/, '') + "/"
}
checkAtRootLevel();
console.log("Current path: " + getPath().replace("/fileserver", ""));
document.getElementById("currentpath").innerHTML = "Current path: <b>" + getPath().replace("/fileserver", "") + "</b>";
document.cookie = "page=" + getPath() + "; path=/";
</script> </script>
</body> </body>

4
sd-card/html/index.html
View File

@@ -18,7 +18,7 @@
<script> <script>
async function loadPage(page) { async function loadPage(page) {
console.log("loadPage(" + page + ")"); console.log("loadPage(" + page + ")");
document.cookie = "page="+page; document.cookie = "page="+page + "; path=/";
document.getElementById('maincontent').src = page; document.getElementById('maincontent').src = page;
[].forEach.call(document.querySelectorAll('.submenu'), function (el) { [].forEach.call(document.querySelectorAll('.submenu'), function (el) {
@@ -108,7 +108,7 @@
LoadWebUiVersion(); LoadWebUiVersion();
if (getCookie("page") == "" || getCookie("page") == "reboot_page.html") { if (getCookie("page") == "" || getCookie("page") == "reboot_page.html") {
document.cookie = "page=overview.html"; document.cookie = "page=overview.html" + "; path=/";
} }
console.log("Loading page: " + getCookie("page")); console.log("Loading page: " + getCookie("page"));
document.getElementById('maincontent').src = getCookie("page"); document.getElementById('maincontent').src = getCookie("page");

6
sd-card/html/ota_page.html
View File

@@ -38,8 +38,8 @@
Then pick the <i><span style="font-family:monospace">AI-on-the-edge-device__update__*.zip</span></i> file!</p> Then pick the <i><span style="font-family:monospace">AI-on-the-edge-device__update__*.zip</span></i> file!</p>
<p>Alternatively you can use a file in the following format:</p> <p>Alternatively you can use a file in the following format:</p>
<ul> <ul>
<li><span style="font-family:monospace">AI-on-the-edge-device__update__*.zip</span></li> <li><span style="font-family:monospace">*.zip</span></li>
<li><span style="font-family:monospace">AI-on-the-edge-device__firmware__*.bin</span></li> <li><span style="font-family:monospace">*.bin</span></li>
<li><span style="font-family:monospace">*.tfl/tflite</span></li> <li><span style="font-family:monospace">*.tfl/tflite</span></li>
</ul> </ul>
<p>Make sure the file extention is lower case.</p> <p>Make sure the file extention is lower case.</p>
@@ -183,7 +183,7 @@
xhttp.onreadystatechange = function() { xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4) { if (xhttp.readyState == 4) {
if (xhttp.status == 200) { if (xhttp.status == 200) {
document.cookie = "page=overview.html"; // Make sure after the reboot we go to the overview page document.cookie = "page=overview.html" + "; path=/"; // Make sure after the reboot we go to the overview page
if (xhttp.responseText.startsWith("reboot")) { // Reboot required if (xhttp.responseText.startsWith("reboot")) { // Reboot required
console.log("Upload completed, the device will now restart and install the update!"); console.log("Upload completed, the device will now restart and install the update!");

2
sd-card/html/wlan_config.html
View File

@@ -59,7 +59,7 @@ if (!file.name.includes("remote-setup")){
document.getElementById("status").innerText = "Status: Update completed!"; document.getElementById("status").innerText = "Status: Update completed!";
document.getElementById("doUpdate").disabled = true; document.getElementById("doUpdate").disabled = true;
document.getElementById("newfile").disabled = false; document.getElementById("newfile").disabled = false;
document.cookie = "page=overview.html"; // Make sure after the reboot we go to the overview page document.cookie = "page=overview.html" + "; path=/"; // Make sure after the reboot we go to the overview page
if (xhttp.responseText.startsWith("reboot")) if (xhttp.responseText.startsWith("reboot"))
{ {