Merge pull request #6611 from FoamyGuy/webflow_edit_page
Webflow edit page
This commit is contained in:
commit
462eb71570
@ -9,7 +9,7 @@
|
|||||||
<body>
|
<body>
|
||||||
<h1><a href="/"><img src="/favicon.ico"/></a> <span id="path"></span></h1>
|
<h1><a href="/"><img src="/favicon.ico"/></a> <span id="path"></span></h1>
|
||||||
<div id="usbwarning" style="display: none;">🛈 USB is using the storage. Only allowing reads. See <a href="https://learn.adafruit.com/circuitpython-essentials/circuitpython-storage">the CircuitPython Essentials: Storage guide</a> for details.</div>
|
<div id="usbwarning" style="display: none;">🛈 USB is using the storage. Only allowing reads. See <a href="https://learn.adafruit.com/circuitpython-essentials/circuitpython-storage">the CircuitPython Essentials: Storage guide</a> for details.</div>
|
||||||
<template id="row"><tr><td></td><td></td><td><a></a></td><td></td><td><button class="delete">🗑️</button></td></tr></template>
|
<template id="row"><tr><td></td><td></td><td><a></a></td><td></td><td><button class="delete">🗑️</button></td><td><a class="edit_link" href="">Edit</a></td></tr></template>
|
||||||
<table>
|
<table>
|
||||||
<thead><tr><th>Type</th><th>Size</th><th>Path</th><th>Modified</th><th></th></tr></thead>
|
<thead><tr><th>Type</th><th>Size</th><th>Path</th><th>Modified</th><th></th></tr></thead>
|
||||||
<tbody></tbody>
|
<tbody></tbody>
|
||||||
|
@ -91,6 +91,9 @@ async function refresh_list() {
|
|||||||
delete_button.disabled = !editable;
|
delete_button.disabled = !editable;
|
||||||
delete_button.onclick = del;
|
delete_button.onclick = del;
|
||||||
|
|
||||||
|
let edit_url = new URL("/edit/#" + f.name, url_base);
|
||||||
|
let edit_link = clone.querySelector(".edit_link");
|
||||||
|
edit_link.href = edit_url
|
||||||
|
|
||||||
new_children.push(clone);
|
new_children.push(clone);
|
||||||
}
|
}
|
||||||
|
26
supervisor/shared/web_workflow/static/edit.html
Normal file
26
supervisor/shared/web_workflow/static/edit.html
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Code Edit</title>
|
||||||
|
<style>
|
||||||
|
#code_textarea {
|
||||||
|
width: 90%;
|
||||||
|
height: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#output_text {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 0.7em;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<button id="save_btn">Save</button>
|
||||||
|
<p id="output_text">Loading</p>
|
||||||
|
<textarea id="code_textarea"></textarea>
|
||||||
|
|
||||||
|
<script src="/edit.js" defer=true></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
47
supervisor/shared/web_workflow/static/edit.js
Normal file
47
supervisor/shared/web_workflow/static/edit.js
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
let $editor = document.querySelector("#code_textarea");
|
||||||
|
let filename = location.hash.substring(1);
|
||||||
|
let $output_text = document.querySelector("#output_text");
|
||||||
|
|
||||||
|
fetch(`/fs/${filename}`)
|
||||||
|
.then(function (response) {
|
||||||
|
$output_text.innerText = `Loading Status: ${response.status}`;
|
||||||
|
return response.status === 200 ? response.text() : "";
|
||||||
|
})
|
||||||
|
.then(function (data) {
|
||||||
|
$editor.value = data;
|
||||||
|
});
|
||||||
|
|
||||||
|
function save() {
|
||||||
|
$output_text.innerText = "Saving..."
|
||||||
|
const requestOptions = {
|
||||||
|
method: 'PUT',
|
||||||
|
body: $editor.value
|
||||||
|
};
|
||||||
|
fetch(`/fs/${filename}`, requestOptions)
|
||||||
|
.then(function (response) {
|
||||||
|
$output_text.innerText = `Saving Status: ${response.status}`;
|
||||||
|
return response.text();
|
||||||
|
})
|
||||||
|
.then(function (data) {
|
||||||
|
console.log("after fetch: " + data);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
document.querySelector("#save_btn").onclick = function () {
|
||||||
|
console.log("Click Save!");
|
||||||
|
save();
|
||||||
|
}
|
||||||
|
|
||||||
|
let isCtrl = false;
|
||||||
|
document.onkeyup=function(e){
|
||||||
|
if(e.keyCode === 17) isCtrl=false;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.onkeydown=function(e){
|
||||||
|
if(e.keyCode === 17) isCtrl=true;
|
||||||
|
if(e.keyCode === 83 && isCtrl === true) {
|
||||||
|
//ctrl-s pressed
|
||||||
|
save();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
@ -916,6 +916,8 @@ STATIC_FILE(directory_html);
|
|||||||
STATIC_FILE(directory_js);
|
STATIC_FILE(directory_js);
|
||||||
STATIC_FILE(welcome_html);
|
STATIC_FILE(welcome_html);
|
||||||
STATIC_FILE(welcome_js);
|
STATIC_FILE(welcome_js);
|
||||||
|
STATIC_FILE(edit_html);
|
||||||
|
STATIC_FILE(edit_js);
|
||||||
STATIC_FILE(style_css);
|
STATIC_FILE(style_css);
|
||||||
STATIC_FILE(serial_html);
|
STATIC_FILE(serial_html);
|
||||||
STATIC_FILE(serial_js);
|
STATIC_FILE(serial_js);
|
||||||
@ -1087,6 +1089,16 @@ static bool _reply(socketpool_socket_obj_t *socket, _request *request) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
} else if (strcmp(request->path, "/edit/") == 0) {
|
||||||
|
if (!request->authenticated) {
|
||||||
|
if (_api_password[0] != '\0') {
|
||||||
|
_reply_unauthorized(socket, request);
|
||||||
|
} else {
|
||||||
|
_reply_forbidden(socket, request);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
_REPLY_STATIC(socket, request, edit_html);
|
||||||
|
}
|
||||||
} else if (strncmp(request->path, "/cp/", 4) == 0) {
|
} else if (strncmp(request->path, "/cp/", 4) == 0) {
|
||||||
const char *path = request->path + 3;
|
const char *path = request->path + 3;
|
||||||
if (strcasecmp(request->method, "OPTIONS") == 0) {
|
if (strcasecmp(request->method, "OPTIONS") == 0) {
|
||||||
@ -1126,6 +1138,8 @@ static bool _reply(socketpool_socket_obj_t *socket, _request *request) {
|
|||||||
_REPLY_STATIC(socket, request, welcome_js);
|
_REPLY_STATIC(socket, request, welcome_js);
|
||||||
} else if (strcmp(request->path, "/serial.js") == 0) {
|
} else if (strcmp(request->path, "/serial.js") == 0) {
|
||||||
_REPLY_STATIC(socket, request, serial_js);
|
_REPLY_STATIC(socket, request, serial_js);
|
||||||
|
} else if (strcmp(request->path, "/edit.js") == 0) {
|
||||||
|
_REPLY_STATIC(socket, request, edit_js);
|
||||||
} else if (strcmp(request->path, "/style.css") == 0) {
|
} else if (strcmp(request->path, "/style.css") == 0) {
|
||||||
_REPLY_STATIC(socket, request, style_css);
|
_REPLY_STATIC(socket, request, style_css);
|
||||||
} else if (strcmp(request->path, "/favicon.ico") == 0) {
|
} else if (strcmp(request->path, "/favicon.ico") == 0) {
|
||||||
|
@ -29,7 +29,9 @@ for f in args.files:
|
|||||||
if f.name.endswith(".html"):
|
if f.name.endswith(".html"):
|
||||||
uncompressed = minify_html.minify(uncompressed.decode("utf-8")).encode("utf-8")
|
uncompressed = minify_html.minify(uncompressed.decode("utf-8")).encode("utf-8")
|
||||||
elif f.name.endswith(".js"):
|
elif f.name.endswith(".js"):
|
||||||
uncompressed = jsmin.jsmin(uncompressed.decode("utf-8")).encode("utf-8")
|
uncompressed = jsmin.jsmin(uncompressed.decode("utf-8"), quote_chars="'\"`").encode(
|
||||||
|
"utf-8"
|
||||||
|
)
|
||||||
compressed = gzip.compress(uncompressed)
|
compressed = gzip.compress(uncompressed)
|
||||||
clen = len(compressed)
|
clen = len(compressed)
|
||||||
compressed = ", ".join([hex(x) for x in compressed])
|
compressed = ", ".join([hex(x) for x in compressed])
|
||||||
|
Loading…
Reference in New Issue
Block a user