summaryrefslogtreecommitdiffstatshomepage
diff options
context:
space:
mode:
author Vas Crabb <vas@vastheman.com>2021-09-23 23:50:59 +1000
committer Vas Crabb <vas@vastheman.com>2021-09-23 23:59:19 +1000
commit7a6e383cb9e7e2ae682fbb2c0efe64f4902a5047 (patch)
tree5affd94a1b65fe4f4ac802dbbffbfadd93adb6f3
parentfbc858eee2588cbb6749bafab99fb1638e45ffed (diff)
minimaws: Added disclosure triangle controls to many sections.
-rw-r--r--scripts/minimaws/lib/assets/common.js51
-rw-r--r--scripts/minimaws/lib/assets/disclosedown.svg4
-rw-r--r--scripts/minimaws/lib/assets/discloseup.svg4
-rw-r--r--scripts/minimaws/lib/assets/romident.js6
-rw-r--r--scripts/minimaws/lib/assets/style.css2
-rw-r--r--scripts/minimaws/lib/htmltmpl.py48
-rw-r--r--scripts/minimaws/lib/wsgiserve.py23
7 files changed, 103 insertions, 35 deletions
diff --git a/scripts/minimaws/lib/assets/common.js b/scripts/minimaws/lib/assets/common.js
index b7b482d5405..baedcf3940d 100644
--- a/scripts/minimaws/lib/assets/common.js
+++ b/scripts/minimaws/lib/assets/common.js
@@ -1,6 +1,45 @@
// license:BSD-3-Clause
// copyright-holders:Vas Crabb
+function make_collapsible(heading, section)
+{
+ var hidden = false;
+ var display = section.style.display;
+ var icon = heading.insertBefore(document.createElement('img'), heading.firstChild);
+ icon.setAttribute('src', assetsurl + '/disclosedown.svg');
+ icon.setAttribute('class', 'disclosure');
+ icon.addEventListener(
+ 'click',
+ function (event)
+ {
+ hidden = !hidden;
+ if (hidden)
+ {
+ icon.setAttribute('src', assetsurl + '/discloseup.svg');
+ section.style.display = 'none';
+ }
+ else
+ {
+ icon.setAttribute('src', assetsurl + '/disclosedown.svg');
+ section.style.display = display;
+ var headingtop = 0;
+ for (var element = heading; element !== null; element = element.offsetParent)
+ headingtop += element.offsetTop;
+ var sectionbot = section.offsetHeight;
+ for (var element = section; element !== null; element = element.offsetParent)
+ sectionbot += element.offsetTop;
+ if ((window.pageYOffset + window.innerHeight) < sectionbot)
+ {
+ if ((sectionbot - headingtop) > window.innerHeight)
+ heading.scrollIntoView(true);
+ else
+ window.scroll(window.pageXOffset, sectionbot - window.innerHeight);
+ }
+ }
+ });
+}
+
+
function make_table_sortable(tbl)
{
var sorticons = new Array(tbl.tHead.rows[0].cells.length);
@@ -8,18 +47,16 @@ function make_table_sortable(tbl)
function TableSortHelper(i)
{
this.column = i;
- this.header = tbl.tHead.rows[0].cells[i]
+ this.header = tbl.tHead.rows[0].cells[i];
this.sorted = false;
this.direction = 1;
- this.icon = document.createElement('img');
+ var container = this.header.appendChild(document.createElement('div'));
+ container.setAttribute('class', 'sorticon');
+
+ this.icon = container.appendChild(document.createElement('img'));
this.icon.setAttribute('src', assetsurl + '/sortind.svg');
this.icon.addEventListener('click', this.icon_click.bind(this));
-
- var container = document.createElement('div');
- container.setAttribute('class', 'sorticon');
- container.appendChild(this.icon);
- this.header.appendChild(container);
}
TableSortHelper.prototype = (function ()
diff --git a/scripts/minimaws/lib/assets/disclosedown.svg b/scripts/minimaws/lib/assets/disclosedown.svg
new file mode 100644
index 00000000000..ddf75e25f0f
--- /dev/null
+++ b/scripts/minimaws/lib/assets/disclosedown.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="16" width="16">
+ <path d="m 0,0 h 16 l -8,16 z" />
+</svg>
diff --git a/scripts/minimaws/lib/assets/discloseup.svg b/scripts/minimaws/lib/assets/discloseup.svg
new file mode 100644
index 00000000000..51e2bea9863
--- /dev/null
+++ b/scripts/minimaws/lib/assets/discloseup.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="16" width="16">
+ <path d="m 0,0 v 16 l 16,-8 z" />
+</svg>
diff --git a/scripts/minimaws/lib/assets/romident.js b/scripts/minimaws/lib/assets/romident.js
index e42daf875cf..599b0674007 100644
--- a/scripts/minimaws/lib/assets/romident.js
+++ b/scripts/minimaws/lib/assets/romident.js
@@ -132,6 +132,7 @@ function add_unmatched(names, crc, sha1)
heading.textContent = 'Unmatched';
table = div.appendChild(document.createElement('table'));
table.setAttribute('id', 'table-unmatched');
+ make_collapsible(heading, table);
}
var content;
if (crc === null)
@@ -160,8 +161,10 @@ function add_issues(name)
var list;
if (!div.hasChildNodes())
{
- div.appendChild(document.createElement('h2')).textContent = 'Potential Issues';
+ var heading = div.appendChild(document.createElement('h2'));
+ heading.textContent = 'Potential Issues';
list = div.appendChild(document.createElement('dl'));
+ make_collapsible(heading, list);
}
else
{
@@ -229,6 +232,7 @@ function get_machine_table(shortname, description)
var table = div.appendChild(document.createElement('table'));
machine_info[shortname] = table;
add_matches(table, matched_names, null);
+ make_collapsible(heading, table);
return table;
}
}
diff --git a/scripts/minimaws/lib/assets/style.css b/scripts/minimaws/lib/assets/style.css
index 8cbce4aaf0e..9ba6631a783 100644
--- a/scripts/minimaws/lib/assets/style.css
+++ b/scripts/minimaws/lib/assets/style.css
@@ -5,6 +5,8 @@
th { text-align: left; background-color: #ddd; padding: 0.25em }
td { padding-left: 0.25em; padding-right: 0.25em }
+img[class=disclosure] { height: 0.7em; margin-right: 0.25em; vertical-align: baseline }
+
div[class=sorticon] { float: right; height: 100%; margin-left: 0.5em }
div[class=sorticon] img { height: 0.7em; vertical-align: baseline }
diff --git a/scripts/minimaws/lib/htmltmpl.py b/scripts/minimaws/lib/htmltmpl.py
index 7c9246865b1..a80b4099787 100644
--- a/scripts/minimaws/lib/htmltmpl.py
+++ b/scripts/minimaws/lib/htmltmpl.py
@@ -50,7 +50,7 @@ MACHINE_PROLOGUE = string.Template(
' <tr><th>Source file:</th><td><a href="${sourcehref}">${sourcefile}</a></td></tr>\n')
MACHINE_CLONES_PROLOGUE = string.Template(
- '<h2>Clones</h2>\n' \
+ '<h2 id="heading-clones">Clones</h2>\n' \
'<table id="tbl-clones">\n' \
' <thead>\n' \
' <tr>\n' \
@@ -104,6 +104,7 @@ MACHINE_SOFTWARELISTS_TABLE_EPILOGUE = string.Template(
'</table>\n' \
'<script>\n' \
' make_table_sortable(document.getElementById("tbl-softwarelists"));\n' \
+ ' make_collapsible(document.getElementById("heading-softwarelists"), document.getElementById("tbl-softwarelists"));\n' \
' if (!document.getElementById("tbl-softwarelists").tBodies[0].rows.length)\n' \
' {\n' \
' document.getElementById("heading-softwarelists").style.display = "none";\n' \
@@ -112,35 +113,40 @@ MACHINE_SOFTWARELISTS_TABLE_EPILOGUE = string.Template(
'</script>\n')
MACHINE_OPTIONS_HEADING = string.Template(
- '<h2>Options</h2>\n' \
- '<p>\n' \
- ' Format: <select id="select-options-format" onchange="update_cmd_preview()"><option value="cmd">Command line</option><option value="ini">INI file</option></select>\n' \
- ' <input type="checkbox" id="check-explicit-defaults" onchange="update_cmd_preview()"><label for="check-explicit-defaults">Explicit defaults</label>\n' \
- '</p>\n' \
- '<p id="para-cmd-preview"></p>\n')
+ '<h2 id="heading-options">Options</h2>\n' \
+ '<div id="div-options">\n' \
+ ' <p>\n' \
+ ' Format: <select id="select-options-format" onchange="update_cmd_preview()"><option value="cmd">Command line</option><option value="ini">INI file</option></select>\n' \
+ ' <input type="checkbox" id="check-explicit-defaults" onchange="update_cmd_preview()"><label for="check-explicit-defaults">Explicit defaults</label>\n' \
+ ' </p>\n' \
+ ' <p id="para-cmd-preview"></p>\n')
+
+MACHINE_OPTIONS_EPILOGUE = string.Template(
+ '</div>\n' \
+ '<script>make_collapsible(document.getElementById("heading-options"), document.getElementById("div-options"));</script>\n')
MACHINE_BIOS_PROLOGUE = string.Template(
- '<h3>System BIOS</h3>' \
- '<select id="select-system-bios" onchange="update_cmd_preview()">')
+ ' <h3>System BIOS</h3>' \
+ ' <select id="select-system-bios" onchange="update_cmd_preview()">')
MACHINE_BIOS_OPTION = string.Template(
- ' <option value="${name}" data-isdefault="${isdefault}">${name} - ${description}</option>\n')
+ ' <option value="${name}" data-isdefault="${isdefault}">${name} - ${description}</option>\n')
MACHINE_RAM_PROLOGUE = string.Template(
- '<h3>RAM Size</h3>' \
- '<select id="select-ram-option" onchange="update_cmd_preview()">')
+ ' <h3>RAM Size</h3>\n' \
+ ' <select id="select-ram-option" onchange="update_cmd_preview()">\n')
MACHINE_RAM_OPTION = string.Template(
- ' <option value="${name}" data-isdefault="${isdefault}">${name} (${size})</option>\n')
+ ' <option value="${name}" data-isdefault="${isdefault}">${name} (${size})</option>\n')
MACHINE_SLOTS_PLACEHOLDER_PROLOGUE = string.Template(
- '<h3>Slots</h3>\n' \
- '<p id="para-slots-placeholder">Loading slot information&hellip;<p>\n' \
- '<script>\n')
+ ' <h3>Slots</h3>\n' \
+ ' <p id="para-slots-placeholder">Loading slot information&hellip;<p>\n' \
+ ' <script>\n')
MACHINE_SLOTS_PLACEHOLDER_EPILOGUE = string.Template(
- ' populate_slots(${machine});\n'
- '</script>\n')
+ ' populate_slots(${machine});\n'
+ ' </script>\n')
MACHINE_ROW = string.Template(
' <tr>\n' \
@@ -253,7 +259,7 @@ SOFTWARE_PROLOGUE = string.Template(
' <tr><th>Publisher:</th><td>${publisher}</td></tr>\n');
SOFTWARE_CLONES_PROLOGUE = string.Template(
- '<h2>Clones</h2>\n' \
+ '<h2 id="heading-clones">Clones</h2>\n' \
'<table id="tbl-clones">\n' \
' <thead>\n' \
' <tr>\n' \
@@ -323,7 +329,7 @@ SOFTWARELIST_PROLOGUE = string.Template(
'</table>\n')
SOFTWARELIST_MACHINE_TABLE_HEADER = string.Template(
- '<h2>Machines</h2>\n' \
+ '<h2 id="heading-machines">Machines</h2>\n' \
'<table id="tbl-machines">\n' \
' <thead>\n' \
' <tr>\n' \
@@ -346,7 +352,7 @@ SOFTWARELIST_MACHINE_TABLE_ROW = string.Template(
' </tr>\n')
SOFTWARELIST_SOFTWARE_TABLE_HEADER = string.Template(
- '<h2>Software</h2>\n' \
+ '<h2 id="heading-software">Software</h2>\n' \
'<table id="tbl-software">\n' \
' <thead>\n' \
' <tr>\n' \
diff --git a/scripts/minimaws/lib/wsgiserve.py b/scripts/minimaws/lib/wsgiserve.py
index 26e7d523904..43d5dbc1253 100644
--- a/scripts/minimaws/lib/wsgiserve.py
+++ b/scripts/minimaws/lib/wsgiserve.py
@@ -314,6 +314,7 @@ class MachineHandler(QueryPageHandler):
manufacturer=htmlescape(clonemanufacturer or '')).encode('utf-8')
if not first:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-clones').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-clones"), document.getElementById("tbl-clones"));</script>\n'.encode('utf-8')
# make a table of software lists
yield htmltmpl.MACHINE_SOFTWARELISTS_TABLE_PROLOGUE.substitute().encode('utf-8')
@@ -359,7 +360,7 @@ class MachineHandler(QueryPageHandler):
size=htmlescape('{:,}'.format(size)),
isdefault=('yes' if isdef else 'no')).encode('utf-8')
if not first:
- yield '</select>\n<script>set_default_ram_option();</script>\n'.encode('utf-8')
+ yield ' </select>\n <script>set_default_ram_option();</script>\n'.encode('utf-8')
# placeholder for machine slots - populated by client-side JavaScript
if self.dbcurs.count_slots(id):
@@ -373,7 +374,7 @@ class MachineHandler(QueryPageHandler):
while pending:
requested = pending.pop()
slots = self.slot_data(self.dbcurs.get_machine_id(requested))
- yield (' slot_info[%s] = %s;\n' % (self.sanitised_json(requested), self.sanitised_json(slots))).encode('utf-8')
+ yield (' slot_info[%s] = %s;\n' % (self.sanitised_json(requested), self.sanitised_json(slots))).encode('utf-8')
for slotname, slot in slots['slots'].items():
for choice, card in slot.items():
carddev = card['device']
@@ -385,17 +386,21 @@ class MachineHandler(QueryPageHandler):
cardid = self.dbcurs.get_machine_id(carddev)
carddev = self.sanitised_json(carddev)
yield (
- ' bios_sets[%s] = %s;\n machine_flags[%s] = %s;\n softwarelist_info[%s] = %s;\n' %
+ ' bios_sets[%s] = %s;\n machine_flags[%s] = %s;\n softwarelist_info[%s] = %s;\n' %
(carddev, self.sanitised_json(self.bios_data(cardid)), carddev, self.sanitised_json(self.flags_data(cardid)), carddev, self.sanitised_json(self.softwarelist_data(cardid)))).encode('utf-8')
yield htmltmpl.MACHINE_SLOTS_PLACEHOLDER_EPILOGUE.substitute(
machine=self.sanitised_json(self.shortname)).encode('utf=8')
+ # add disclosure triangle for options if present
+ if haveoptions:
+ yield htmltmpl.MACHINE_OPTIONS_EPILOGUE.substitute().encode('utf=8')
+
# list devices referenced by this system/device
first = True
for name, desc, src in self.dbcurs.get_devices_referenced(id):
if first:
yield \
- '<h2>Devices Referenced</h2>\n' \
+ '<h2 id="heading-dev-refs">Devices Referenced</h2>\n' \
'<table id="tbl-dev-refs">\n' \
' <thead>\n' \
' <tr><th>Short name</th><th>Description</th><th>Source file</th></tr>\n' \
@@ -405,13 +410,14 @@ class MachineHandler(QueryPageHandler):
yield self.machine_row(name, desc, src)
if not first:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-dev-refs').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-dev-refs"), document.getElementById("tbl-dev-refs"));</script>\n'.encode('utf-8')
# list slots where this device is an option
first = True
for name, desc, slot, opt, src in self.dbcurs.get_compatible_slots(id):
if (first):
yield \
- '<h2>Compatible Slots</h2>\n' \
+ '<h2 id="heading-comp-slots">Compatible Slots</h2>\n' \
'<table id="tbl-comp-slots">\n' \
' <thead>\n' \
' <tr><th>Short name</th><th>Description</th><th>Slot</th><th>Choice</th><th>Source file</th></tr>\n' \
@@ -428,13 +434,14 @@ class MachineHandler(QueryPageHandler):
slotoption=htmlescape(opt)).encode('utf-8')
if not first:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-comp-slots').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-comp-slots"), document.getElementById("tbl-comp-slots"));</script>\n'.encode('utf-8')
# list systems/devices that reference this device
first = True
for name, desc, src in self.dbcurs.get_device_references(id):
if first:
yield \
- '<h2>Referenced By</h2>\n' \
+ '<h2 id="heading-ref-by">Referenced By</h2>\n' \
'<table id="tbl-ref-by">\n' \
' <thead>\n' \
' <tr><th>Short name</th><th>Description</th><th>Source file</th></tr>\n' \
@@ -444,6 +451,7 @@ class MachineHandler(QueryPageHandler):
yield self.machine_row(name, desc, src)
if not first:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-ref-by').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-ref-by"), document.getElementById("tbl-ref-by"));</script>\n'.encode('utf-8')
yield '</html>\n'.encode('utf-8')
@@ -667,6 +675,7 @@ class SoftwareListHandler(QueryPageHandler):
status=htmlescape(machine_info['status'])).encode('utf-8')
if not first:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-machines').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-machines"), document.getElementById("tbl-machines"));</script>\n'.encode('utf-8')
first = True
for software_info in self.dbcurs.get_softwarelist_software(softwarelist_info['id'], self.software or None):
@@ -678,6 +687,7 @@ class SoftwareListHandler(QueryPageHandler):
yield '<p>No software found.</p>\n'.encode('utf-8')
else:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-software').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-software"), document.getElementById("tbl-software"));</script>\n'.encode('utf-8')
yield '</body>\n</html>\n'.encode('utf-8')
@@ -707,6 +717,7 @@ class SoftwareListHandler(QueryPageHandler):
yield self.clone_row(clone_info)
if not first:
yield htmltmpl.SORTABLE_TABLE_EPILOGUE.substitute(id='tbl-clones').encode('utf-8')
+ yield '<script>make_collapsible(document.getElementById("heading-clones"), document.getElementById("tbl-clones"));</script>\n'.encode('utf-8')
parts = self.dbcurs.get_software_parts(software_info['id']).fetchall()
first = True