Disable/enable buttons

supervisor/shared/web_workflow/web_workflow.c

@@ -500,7 +500,7 @@ static void _reply_directory_html(socketpool_socket_obj_t *socket, FF_DIR *dir,
     }
     _send_chunk(socket, "</pre><hr><input type=\"file\" id=\"files\" multiple><button type=\"submit\" id=\"upload\">Upload</button>");
 
-    _send_chunk(socket, "<hr>+🗀<input type=\"text\" id=\"name\"><button type=\"submit\" id=\"mkdir\">Create Directory</button>");
+    _send_chunk(socket, "<hr>+🗀 <input type=\"text\" id=\"name\"><button type=\"submit\" id=\"mkdir\">Create Directory</button>");
     _send_chunk(socket, "</body></html>");
     _send_chunk(socket, "");
 }

tools/circuitpython.js

@@ -1,5 +1,9 @@
 console.log("Hello world");
 
+let new_directory_name = document.getElementById("name");
+let files = document.getElementById("files");
+
+
 function mkdir(e) {
     console.log("mkdir");
     console.log(e);
@@ -7,19 +11,34 @@ function mkdir(e) {
 
 function upload(e) {
     console.log("upload");
-    console.log(e);
+    console.log(files.files);
 }
 
 function del(e) {
     console.log("delete");
     console.log(e);
-    if (confirm("Delete" + e.target.value + "?")) {
+    if (confirm("Delete " + e.target.value + " and all of its contents?")) {
         console.log("do it");
     }
 }
 
-document.getElementById("mkdir").onclick = mkdir;
-document.getElementById("upload").onclick = upload;
+let mkdir_button = document.getElementById("mkdir");
+mkdir_button.onclick = mkdir;
+
+let upload_button = document.getElementById("upload");
+upload_button.onclick = upload;
+
+upload_button.disabled = files.files.length == 0;
+
+files.onchange = () => {
+    upload_button.disabled = files.files.length == 0;
+}
+
+mkdir_button.disabled = new_directory_name.value.length == 0;
+
+new_directory_name.oninput = () => {
+    mkdir_button.disabled = new_directory_name.value.length == 0;
+}
 
 const collection = document.getElementsByClassName("delete");
 for (let i = 0; i < collection.length; i++) {