minimaws: add buttons for restoring default BIOS/slot card, clean up and comment the JavaScript a bit more

scripts/minimaws/lib/assets/common.js

@@ -19,8 +19,7 @@ function sort_table(tbl, col, dir, numeric)
 function make_table_sortable(tbl)
 {
 	var headers = tbl.tHead.rows[0].cells;
-	var i;
+	for (var i = 0; i < headers.length; i++)
-	for (i = 0; i < headers.length; i++)
 	{
 		(function (col)
 		{
@@ -32,9 +31,9 @@ function make_table_sortable(tbl)
 			headers[col].appendChild(sorticon);
 			headers[col].addEventListener(
 					'click',
-					function ()
+					function (event)
 					{
-						imgsrc = sorticon.getAttribute('src');
+						var imgsrc = sorticon.getAttribute('src');
 						imgsrc = imgsrc.substr(imgsrc.lastIndexOf('/') + 1);
 						if (imgsrc != 'sortind.png')
 							dir = -dir;
@@ -42,8 +41,7 @@ function make_table_sortable(tbl)
 							sorticon.setAttribute('src', assetsurl + '/sortdesc.png');
 						else
 							sorticon.setAttribute('src', assetsurl + '/sortasc.png');
-						var i;
+						for (var i = 0; i < headers.length; i++)
-						for (i = 0; i < headers.length; i++)
 						{
 							if (i != col)
 								headers[i].lastChild.setAttribute('src', assetsurl + '/sortind.png');
@@ -53,3 +51,28 @@ function make_table_sortable(tbl)
 		}(i));
 	}
 }
+
+
+function make_restore_default_handler(popup, index)
+{
+	return function (event)
+	{
+		if (popup.selectedIndex != index)
+		{
+			popup.selectedIndex = index;
+			popup.dispatchEvent(new Event('change'));
+		}
+	}
+}
+
+
+function make_restore_default_button(title, id, popup, index)
+{
+	var btn = document.createElement('button');
+	btn.setAttribute('id', id);
+	btn.setAttribute('type', 'button');
+	btn.disabled = popup.selectedIndex == index;
+	btn.textContent = title;
+	btn.onclick = make_restore_default_handler(popup, index);
+	return btn;
+}

scripts/minimaws/lib/assets/machine.js

@@ -6,21 +6,28 @@ var bios_sets = Object.create(null);
 var machine_flags = Object.create(null);
 
 
+function make_slot_popup_id(name) { return ('select-slot-choice-' + name).replace(/:/g, '-'); }
+function get_slot_popup(name) { return document.getElementById(make_slot_popup_id(name)); }
+
+
 function update_cmd_preview()
 {
 	var result = '';
 	var first = true;
-
+	function add_option(str)
-	var sysbios = document.getElementById('select-system-bios');
-	if (sysbios && (sysbios.selectedOptions[0].getAttribute('data-isdefault') != 'yes'))
 	{
 		if (first)
 			first = false;
 		else
 			result += ' ';
-		result += '-bios ' + sysbios.value;
+		result += str;
 	}
 
+	// add system BIOS if applicable
+	var sysbios = document.getElementById('select-system-bios');
+	if (sysbios && (sysbios.selectedOptions[0].getAttribute('data-isdefault') != 'yes'))
+		add_option('-bios ' + sysbios.value);
+
 	var slotslist = document.getElementById('list-slot-options');
 	if (slotslist)
 	{
@@ -28,22 +35,18 @@ function update_cmd_preview()
 		{
 			if (item.nodeName == 'DT')
 			{
-				var selection = item.lastChild.selectedOptions[0];
+				// need to set the slot option if it has non-default card and/or non-default card BIOS
-				var biospopup = document.getElementById(('select-slot-bios-' + item.getAttribute('data-slotname')).replace(/:/g, '-'));
+				var slotname = item.getAttribute('data-slotname');
+				var selection = get_slot_popup(slotname).selectedOptions[0];
+				var biospopup = document.getElementById(('select-slot-bios-' + slotname).replace(/:/g, '-'));
 				var defcard = selection.getAttribute('data-isdefault') == 'yes';
 				var defbios = !biospopup || (biospopup.selectedOptions[0].getAttribute('data-isdefault') == 'yes');
 				if (!defcard || !defbios)
 				{
-					if (first)
-						first = false;
-					else
-						result += ' ';
 					var card = selection.value;
 					if (card == '')
 						card = '""';
-					result += '-' + item.getAttribute('data-slotname') + ' ' + card;
+					add_option('-' + slotname + ' ' + card + (defbios ? '' : (',bios=' + biospopup.value)));
-					if (!defbios)
-						result += ',bios=' + biospopup.value;
 				}
 			}
 		}
@@ -54,13 +57,19 @@ function update_cmd_preview()
 
 function set_default_system_bios()
 {
+	// search for an explicit default option
 	var sysbios = document.getElementById('select-system-bios');
 	var len = sysbios.options.length;
 	for (var i = 0; i < len; i++)
 	{
 		if (sysbios.options[i].getAttribute('data-isdefault') == 'yes')
 		{
+			// select it and add a button for restoring it
 			sysbios.selectedIndex = i;
+			var dflt = make_restore_default_button('default', 'btn-def-system-bios', sysbios, i);
+			sysbios.onchange = make_slot_bios_change_handler(dflt);
+			sysbios.parentNode.appendChild(document.createTextNode(' '));
+			sysbios.parentNode.appendChild(dflt);
 			break;
 		}
 	}
@@ -140,43 +149,32 @@ var fetch_machine_flags = (function ()
 
 function add_flag_rows(table, device)
 {
-	var len, i, row, cell;
-
 	var sorted_features = Object.keys(machine_flags[device].features).sort();
 	var imperfect = [], unemulated = [];
-	len = sorted_features.length;
+	var len = sorted_features.length;
-	for (i = 0; i < len; i++)
+	for (var i = 0; i < len; i++)
 		((machine_flags[device].features[sorted_features[i]].overall == 'unemulated') ? unemulated : imperfect).push(sorted_features[i]);
 
-	len = unemulated.length;
+	function add_one(flags, title)
-	if (len > 0)
 	{
-		row = document.createElement('tr');
+		var len = flags.length;
-		row.appendChild(document.createElement('th')).textContent = 'Unemulated features:';
+		if (len > 0)
-		cell = row.appendChild(document.createElement('td'));
+		{
-		cell.textContent = unemulated[0];
+			var row = document.createElement('tr');
-		for (i = 1; i < len; i++)
+			row.appendChild(document.createElement('th')).textContent = title;
-			cell.textContent += ', ' + unemulated[i];
+			var cell = row.appendChild(document.createElement('td'));
-		if (tbl.lastChild.getAttribute('class') == 'devbios')
+			cell.textContent = flags[0];
-			tbl.insertBefore(row, tbl.lastChild);
+			for (i = 1; i < len; i++)
-		else
+				cell.textContent += ', ' + flags[i];
-			tbl.appendChild(row)
+			if (table.lastChild.getAttribute('class') == 'devbios')
+				table.insertBefore(row, table.lastChild);
+			else
+				table.appendChild(row);
+		}
 	}
 
-	len = imperfect.length;
+	add_one(unemulated, 'Unemulated features:');
-	if (len > 0)
+	add_one(imperfect, 'Imperfect features:');
-	{
-		row = document.createElement('tr');
-		row.appendChild(document.createElement('th')).textContent = 'Imperfect features:';
-		cell = row.appendChild(document.createElement('td'));
-		cell.textContent = imperfect[0];
-		for (i = 1; i < len; i++)
-			cell.textContent += ', ' + unemulated[i];
-		if (tbl.lastChild.getAttribute('class') == 'devbios')
-			tbl.insertBefore(row, tbl.lastChild);
-		else
-			tbl.appendChild(row)
-	}
 }
 
 
@@ -186,12 +184,15 @@ function add_bios_row(slot, table, device)
 	var len = sorted_sets.length;
 	if (len > 0)
 	{
+		// create table row, add heading
 		var row = document.createElement('tr');
 		row.setAttribute('class', 'devbios');
 		row.appendChild(document.createElement('th')).textContent = 'BIOS:';
+		var cell = document.createElement('td');
+
+		// make the BIOS popul itself
 		var popup = document.createElement('select');
 		popup.setAttribute('id', ('select-slot-bios-' + slot).replace(/:/g, '-'));
-		popup.onchange = slot_bios_change_handler;
 		for (var i = 0; i < len; i++)
 		{
 			var set = sorted_sets[i];
@@ -204,7 +205,20 @@ function add_bios_row(slot, table, device)
 			if (detail.isdefault)
 				popup.selectedIndex = i;
 		}
-		row.appendChild(document.createElement('td')).appendChild(popup);
+		cell.appendChild(popup);
+
+		// make a button to restore the default
+		var dflt;
+		if (popup.selectedOptions[0].getAttribute('data-isdefault') == 'yes')
+		{
+			dflt = make_restore_default_button('default', ('btn-def-slot-bios-' + slot).replace(/:/g, '-'), popup, popup.selectedIndex);
+			cell.appendChild(document.createTextNode(' '))
+			cell.appendChild(dflt);
+		}
+
+		// drop the controls into a cell, add it to the table, keep the command line preview up-to-date
+		popup.onchange = make_slot_bios_change_handler(dflt);
+		row.appendChild(cell);
 		table.appendChild(row);
 		update_cmd_preview();
 	}
@@ -215,6 +229,7 @@ function make_slot_term(name, slot, defaults)
 {
 	var len, i;
 
+	// see if we can find a default, outer layers take precedence
 	var defcard = '';
 	len = defaults.length;
 	for (i = 0; (i < len) && (defcard == ''); i++)
@@ -223,19 +238,25 @@ function make_slot_term(name, slot, defaults)
 			defcard = defaults[i][name];
 	}
 
+	// create a container with the slot name and popup
 	var term = document.createElement('dt');
 	term.setAttribute('id', ('item-slot-choice-' + name).replace(/:/g, '-'));
 	term.setAttribute('data-slotname', name);
 	term.setAttribute('data-slotcard', '');
 	term.textContent = name + ': ';
 	var popup = document.createElement('select');
-	popup.setAttribute('id', ('select-slot-choice-' + name).replace(/:/g, '-'));
+	popup.setAttribute('id', make_slot_popup_id(name));
 	term.appendChild(popup);
+
+	// add the empty slot option
 	var option = document.createElement('option');
 	option.setAttribute('value', '');
 	option.setAttribute('data-isdefault', ('' == defcard) ? 'yes' : 'no');
 	option.textContent = '-';
 	popup.appendChild(option);
+	popup.selectedIndex = 0;
+
+	// add options for the cards
 	var sorted_choices = Object.keys(slot).sort();
 	len = sorted_choices.length;
 	for (i = 0; i < len; i++)
@@ -247,15 +268,22 @@ function make_slot_term(name, slot, defaults)
 		option.setAttribute('data-isdefault', (choice == defcard) ? 'yes' : 'no');
 		option.textContent = choice + ' - ' + card.description;
 		popup.appendChild(option);
+		if (choice == defcard)
+			popup.selectedIndex = i + 1;
 	}
-	popup.selectedIndex = 0;
+
-	popup.onchange = make_slot_change_handler(name, slot, defaults);
+	// make a button for restoring the default and hook up events
+	var dflt = make_restore_default_button('default', ('btn-def-slot-choice-' + name).replace(/:/g, '-'), popup, popup.selectedIndex);
+	term.appendChild(document.createTextNode(' '));
+	term.appendChild(dflt);
+	popup.onchange = make_slot_change_handler(name, slot, defaults, dflt);
 	return term;
 }
 
 
 function add_slot_items(root, device, defaults, slotslist, pos)
 {
+	// add another layer of defaults for this device
 	var defvals = Object.create(null);
 	for (var key in slot_info[device].defaults)
 		defvals[root + key] = slot_info[device].defaults[key];
@@ -263,6 +291,7 @@ function add_slot_items(root, device, defaults, slotslist, pos)
 	defaults.push(defvals);
 	var defcnt = defaults.length;
 
+	// add controls for each subslot
 	var slots = slot_info[device].slots;
 	var sorted_slots = Object.keys(slots).sort();
 	var len = sorted_slots.length;
@@ -285,37 +314,15 @@ function add_slot_items(root, device, defaults, slotslist, pos)
 			slotslist.appendChild(def);
 		}
 
-		for (var j = 0; j < defcnt; j++)
+		// force a change event to populate subslot controls if the default isn't empty
-		{
+		get_slot_popup(slotabs).dispatchEvent(new Event('change'));
-			if (Object.prototype.hasOwnProperty.call(defaults[j], slotabs))
-			{
-				var card = defaults[j][slotabs];
-				var sel = term.lastChild;
-				var found = false;
-				var choice;
-				for (choice in sel.options)
-				{
-					if (sel.options[choice].value == card)
-					{
-						found = true;
-						break;
-					}
-				}
-				if (found)
-				{
-					sel.selectedIndex = choice;
-					sel.dispatchEvent(new Event('change'));
-					break;
-				}
-			}
-		}
 	}
 
 	update_cmd_preview();
 }
 
 
-function make_slot_change_handler(name, slot, defaults)
+function make_slot_change_handler(name, slot, defaults, dfltbtn)
 {
 	var selection = null;
 	return function (event)
@@ -325,7 +332,9 @@ function make_slot_change_handler(name, slot, defaults)
 		var def = event.target.parentNode.nextSibling;
 		var slotname = event.target.parentNode.getAttribute('data-slotname');
 		selection = (choice == '') ? null : slot[choice];
+		dfltbtn.disabled = event.target.selectedOptions[0].getAttribute('data-isdefault') == 'yes';
 
+		// clear out any subslots from previous selection
 		var prefix = slotname + ':';
 		for (var candidate = def.nextSibling; candidate && candidate.getAttribute('data-slotname').startsWith(prefix); )
 		{
@@ -337,37 +346,44 @@ function make_slot_change_handler(name, slot, defaults)
 
 		if (selection === null)
 		{
+			// no selection, remove the slot card details table
 			event.target.parentNode.setAttribute('data-slotcard', '');
 			if (def.firstChild)
 				def.removeChild(def.firstChild);
 		}
 		else
 		{
+			// stash the selected device where it's easy to find
 			event.target.parentNode.setAttribute('data-slotcard', selection.device);
+
+			// create details table and add a link to the device's page
 			var tbl = document.createElement('table');
 			tbl.setAttribute('class', 'sysinfo');
-
 			var row = tbl.appendChild(document.createElement('tr'));
 			row.appendChild(document.createElement('th')).textContent = 'Short name:';
 			var link = row.appendChild(document.createElement('td')).appendChild(document.createElement('a'));
 			link.textContent = selection.device;
 			link.setAttribute('href', appurl + 'machine/' + selection.device);
 
+			// if we have emulation flags, populate now, otherwise fetch asynchronously
 			if (!Object.prototype.hasOwnProperty.call(machine_flags, selection.device))
 				fetch_machine_flags(selection.device);
 			else
 				add_flag_rows(tbl, selection.device);
 
+			// if we have BIOS details, populate now, otherwise fetch asynchronously
 			if (!Object.prototype.hasOwnProperty.call(bios_sets, selection.device))
 				fetch_bios_sets(selection.device);
 			else
 				add_bios_row(slotname, tbl, selection.device);
 
+			// drop the details table into the list
 			if (def.firstChild)
 				def.replaceChild(tbl, def.firstChild);
 			else
 				def.appendChild(tbl);
 
+			// create controls for subslots
 			add_slot_items(slotname + ':' + choice, selection.device, defaults, slotslist, def.nextSibling);
 		}
 		update_cmd_preview();
@@ -375,9 +391,14 @@ function make_slot_change_handler(name, slot, defaults)
 }
 
 
-function slot_bios_change_handler(event)
+function make_slot_bios_change_handler(dflt)
 {
-	update_cmd_preview();
+	return function (event)
+	{
+		if (dflt)
+			dflt.disabled = event.target.selectedOptions[0].getAttribute('data-isdefault') == 'yes';
+		update_cmd_preview();
+	}
 }
 
 

scripts/minimaws/lib/htmltmpl.py

@@ -54,7 +54,7 @@ MACHINE_OPTIONS_HEADING = string.Template(
 
 MACHINE_BIOS_PROLOGUE = string.Template(
         '<h3>System BIOS</h3>' \
-        '<select id="select-system-bios" onchange="update_cmd_preview()">')
+        '<div><select id="select-system-bios" onchange="update_cmd_preview()"></div>')
 
 MACHINE_BIOS_OPTION = string.Template(
         '    <option value="${name}" data-isdefault="${isdefault}">${name} - ${description}</option>\n')