3 files changed, 29 insertions, 7 deletions

diff --git a/web/share/js/kvm/msd.js b/web/share/js/kvm/msd.js
index 144e5c70..739016c2 100644
--- a/web/share/js/kvm/msd.js
+++ b/web/share/js/kvm/msd.js
@@ -42,7 +42,7 @@ export function Msd() {
 		$("msd-image-selector").onchange = __selectImage;
 		tools.setOnClick($("msd-remove-image"), __clickRemoveImageButton);
 
-		tools.setOnClick($("msd-emulate-cdrom-checkbox"), __clickCdromSwitch);
+		tools.setOnClickRadio("msd-mode-radio", __clickModeRadio);
 
 		$("msd-select-new-image-file").onchange = __selectNewImageFile;
 		tools.setOnClick($("msd-select-new-image-button"), () => $("msd-select-new-image-file").click());
@@ -84,8 +84,8 @@ export function Msd() {
 		});
 	};
 
-	var __clickCdromSwitch = function() {
-		__sendParam("cdrom", ($("msd-emulate-cdrom-checkbox").checked ? "1" : "0"));
+	var __clickModeRadio = function() {
+		__sendParam("cdrom", tools.getRadioValue("msd-mode-radio"));
 	};
 
 	var __sendParam = function(name, value) {
@@ -224,8 +224,8 @@ export function Msd() {
 			}
 			wm.switchEnabled($("msd-remove-image"), (__state.online && __state.features.multi && __state.drive.image && !__state.drive.connected && !__state.busy));
 
-			wm.switchEnabled($("msd-emulate-cdrom-checkbox"), (__state.online && __state.features.cdrom && !__state.drive.connected && !__state.busy));
-			$("msd-emulate-cdrom-checkbox").checked = (__state.online && __state.features.cdrom && __state.drive.cdrom);
+			wm.switchRadioEnabled("msd-mode-radio", (__state.online && __state.features.cdrom && !__state.drive.connected && !__state.busy));
+			tools.setRadioValue("msd-mode-radio", `${Number(__state.online && __state.features.cdrom && __state.drive.cdrom)}`);
 
 			wm.switchEnabled($("msd-connect-button"), (__state.online && (!__state.features.multi || __state.drive.image) && !__state.drive.connected && !__state.busy));
 			wm.switchEnabled($("msd-disconnect-button"), (__state.online && __state.drive.connected && !__state.busy));
@@ -261,8 +261,8 @@ export function Msd() {
 			$("msd-image-selector").options.length = 1;
 			wm.switchEnabled($("msd-remove-image"), false);
 
-			wm.switchEnabled($("msd-emulate-cdrom-checkbox"), false);
-			$("msd-emulate-cdrom-checkbox").checked = false;
+			wm.switchRadioEnabled("msd-mode-radio", false);
+			tools.setRadioValue("msd-mode-radio", "0");
 
 			wm.switchEnabled($("msd-connect-button"), false);
 			wm.switchEnabled($("msd-disconnect-button"), false);
diff --git a/web/share/js/tools.js b/web/share/js/tools.js
index 5bd41548..92a701d2 100644
--- a/web/share/js/tools.js
+++ b/web/share/js/tools.js
@@ -135,6 +135,22 @@ export var tools = new function() {
 		};
 	};
 
+	this.setOnClickRadio = function(name, callback) {
+		for (let el of $$$(`input[type="radio"][name="${name}"]`)) {
+			this.setOnClick(el, callback)
+		}
+	};
+
+	this.getRadioValue = function(name, value) {
+		return document.querySelector(`input[type="radio"][name="${name}"]:checked`).value;
+	};
+
+	this.setRadioValue = function(name, value) {
+		for (let el of $$$(`input[type="radio"][name="${name}"]`)) {
+			el.checked = (el.value === value);
+		}
+	};
+
 	this.setProgressPercent = function(el, title, percent) {
 		el.setAttribute("data-label", title);
 		$(`${el.id}-value`).style.width = `${percent}%`;
diff --git a/web/share/js/wm.js b/web/share/js/wm.js
index 0ccffea5..18ae5957 100644
--- a/web/share/js/wm.js
+++ b/web/share/js/wm.js
@@ -170,6 +170,12 @@ function __WindowManager() {
 		el.disabled = !enabled;
 	};
 
+	self.switchRadioEnabled = function(name, enabled) {
+		for (let el of $$$(`input[type="radio"][name="${name}"]`)) {
+			self.switchEnabled(el, enabled);
+		}
+	};
+
 	self.showWindow = function(el_window, activate=true, center=false) {
 		if (el_window.style.visibility === "hidden") {
 			center = true;