msd parts selector

3 files changed, 47 insertions, 32 deletions

diff --git a/web/kvm/index.html b/web/kvm/index.html
index b4dbb70b..3b1880a5 100644
--- a/web/kvm/index.html
+++ b/web/kvm/index.html
@@ -533,10 +533,10 @@
                   <input type="text" id="msd-new-url" style="width: 100%">
                 </td>
               </tr>
-              <tr>
-                <td>Optional upload prefix:</td>
-                <td>
-                  <input type="text" id="msd-new-prefix" style="width: 100%" placeholder="... like /foo/bar">
+              <tr class="hidden" id="msd-new-part">
+                <td>Upload partition:</td>
+                <td width="100%">
+                  <select id="msd-new-part-selector"></select>
                 </td>
               </tr>
             </table>
@@ -550,10 +550,6 @@
                 <td></td>
                 <td>&bull; To speed up the upload, close the stream window.</td>
               </tr>
-              <tr>
-                <td></td>
-                <td>&bull; A non-empty upload prefix will be created when uploading.</td>
-              </tr>
             </table>
           </div>
           <div class="hidden" id="msd-uploading-sub">
diff --git a/web/kvm/navbar-msd.pug b/web/kvm/navbar-msd.pug
index 47ebcccb..298746e8 100644
--- a/web/kvm/navbar-msd.pug
+++ b/web/kvm/navbar-msd.pug
@@ -71,9 +71,9 @@ li(id="msd-dropdown" class="right feature-disabled")
 				tr
 					td #[b Or] paste a URL:
 					td #[input(type="text" id="msd-new-url" style="width: 100%")]
-				tr
-					td Optional upload prefix:
-					td #[input(type="text" id="msd-new-prefix" style="width: 100%" placeholder="... like /foo/bar")]
+				tr(id="msd-new-part" class="hidden")
+					td Upload partition:
+					td(width="100%") #[select(id="msd-new-part-selector")]
 			hr
 			table(class="kv")
 				tr
@@ -82,9 +82,6 @@ li(id="msd-dropdown" class="right feature-disabled")
 				tr
 					td
 					td &bull; To speed up the upload, close the stream window.
-				tr
-					td
-					td &bull; A non-empty upload prefix will be created when uploading.
 		div(id="msd-uploading-sub" class="hidden")
 			hr
 			table(class="kv")
diff --git a/web/share/js/kvm/msd.js b/web/share/js/kvm/msd.js
index 75fa6dfb..74b728b1 100644
--- a/web/share/js/kvm/msd.js
+++ b/web/share/js/kvm/msd.js
@@ -23,7 +23,7 @@
 "use strict";
 
 
-import {tools, $, $$$} from "../tools.js";
+import {tools, $} from "../tools.js";
 import {wm} from "../wm.js";
 
 
@@ -114,7 +114,7 @@ export function Msd() {
 	var __clickUploadNewButton = function() {
 		let file = tools.input.getFile($("msd-new-file"));
 		__http = new XMLHttpRequest();
-		let prefix = encodeURIComponent($("msd-new-prefix").value);
+		let prefix = encodeURIComponent($("msd-new-part-selector").value);
 		if (file) {
 			__http.open("POST", `/api/msd/write?prefix=${prefix}&image=${encodeURIComponent(file.name)}&remove_incomplete=1`, true);
 		} else {
@@ -270,6 +270,8 @@ export function Msd() {
 
 		tools.el.setEnabled($("msd-new-file"), (online && !s.drive.connected && !__http && !s.busy));
 		tools.el.setEnabled($("msd-new-url"), (online && !s.drive.connected && !__http && !s.busy));
+		tools.el.setEnabled($("msd-new-part"), (online && !s.drive.connected && !__http && !s.busy));
+		__applyStatePartSelector();
 
 		tools.hidden.setVisible($("msd-uploading-sub"), (online && s.storage.uploading));
 		$("msd-uploading-name").innerHTML = ((online && s.storage.uploading) ? s.storage.uploading.name : "");
@@ -291,12 +293,10 @@ export function Msd() {
 	var __applyStateFeatures = function() {
 		let s = __state;
 		let online = (s && s.online);
-
 		if (s) {
 			tools.feature.setEnabled($("msd-dropdown"), s.enabled);
 			tools.feature.setEnabled($("msd-reset-button"), s.enabled);
 		}
-
 		tools.hidden.setVisible($("msd-message-offline"), (s && !s.online));
 		tools.hidden.setVisible($("msd-message-image-broken"),
 			(online && s.drive.image && !s.drive.image.complete && !s.storage.uploading));
@@ -337,24 +337,12 @@ export function Msd() {
 	};
 
 	var __applyStateImageSelector = function() {
-		let s = __state;
-		let online = (s && s.online);
 		let el = $("msd-image-selector");
-
-		if (!online) {
-			el.options.length = 1; // Cleanup
-			return;
-		}
-		if (s.storage.uploading || s.storage.downloading) {
+		if (!__prepareSelector(el, "Not selected")) {
 			return;
 		}
 
-		if (el.options.length === 0) {
-			el.options[0] = new Option("\u2500 Not selected \u2500", "", false, false);
-		} else {
-			el.options.length = 1;
-		}
-
+		let s = __state;
 		let selected_index = 0;
 		let index = 1;
 
@@ -406,5 +394,39 @@ export function Msd() {
 		return el;
 	};
 
+	var __applyStatePartSelector = function() {
+		let el = $("msd-new-part-selector");
+		if (!__prepareSelector(el, "Internal")) {
+			return;
+		}
+		for (let name of Object.keys(__state.storage.parts).sort()) {
+			if (name != "" && __state.storage.parts[name].writable) {
+				el.add(new Option(name, name, false, false));
+			}
+		}
+		console.log(el.options);
+		tools.hidden.setVisible($("msd-new-part"), (el.options.length > 1));
+	};
+
+	var __prepareSelector = function(el, first) {
+		let s = __state;
+		let online = (s && s.online);
+
+		if (!online) {
+			el.options.length = 1; // Cleanup
+			return false;
+		}
+		if (s.storage.uploading || s.storage.downloading) {
+			return false;
+		}
+
+		if (el.options.length === 0) {
+			el.options[0] = new Option(`\u2500 ${first} \u2500`, "", false, false);
+		} else {
+			el.options.length = 1;
+		}
+		return true;
+	};
+
 	__init__();
 }