aboutsummaryrefslogtreecommitdiff
path: root/qc_app/static
diff options
context:
space:
mode:
Diffstat (limited to 'qc_app/static')
-rw-r--r--qc_app/static/css/styles.css19
-rw-r--r--qc_app/static/js/dbinsert.js105
2 files changed, 124 insertions, 0 deletions
diff --git a/qc_app/static/css/styles.css b/qc_app/static/css/styles.css
index 9e5a4ec..4d0fa8c 100644
--- a/qc_app/static/css/styles.css
+++ b/qc_app/static/css/styles.css
@@ -101,3 +101,22 @@ table {
border: 2px solid;
border-radius: 1em;
}
+
+form {
+ width: 30%;
+}
+
+fieldset {
+ border-style: none;
+ display: grid;
+ grid-template-columns: 5em 1fr;
+ column-gap: 5px;
+}
+
+label {
+ grid-column: 1 / 2;
+}
+
+input,select,button {
+ grid-column: 2 / 3;
+}
diff --git a/qc_app/static/js/dbinsert.js b/qc_app/static/js/dbinsert.js
new file mode 100644
index 0000000..3c0be54
--- /dev/null
+++ b/qc_app/static/js/dbinsert.js
@@ -0,0 +1,105 @@
+function remove_children(element) {
+ Array.from(element.children).forEach(child => {
+ element.removeChild(child);
+ });
+}
+
+function trigger_change_event(element) {
+ evt = new Event("change");
+ element.dispatchEvent(evt);
+}
+
+function setup_groups(group_data) {
+ elt = document.getElementById("group");
+ remove_children(elt);
+ the_groups = group_data.reduce(
+ function(acc, row) {
+ grouping = row[2].slice(7).trim();
+ if(acc[grouping] === undefined) {
+ acc[grouping] = [];
+ }
+ acc[grouping].push([row[0], row[1]]);
+ return acc;
+ },
+ {});
+ for(grouping in the_groups) {
+ optgrp = document.createElement("optgroup");
+ optgrp.setAttribute("label", grouping);
+ the_groups[grouping].forEach(group => {
+ opt = document.createElement("option");
+ opt.setAttribute("value", group[0]);
+ opt.appendChild(document.createTextNode(group[1]));
+ optgrp.appendChild(opt);
+ });
+ elt.appendChild(optgrp);
+ }
+ trigger_change_event(elt);
+}
+
+function setup_types(type_data) {
+ elt = document.getElementById("type");
+ remove_children(elt);
+ the_types = type_data.reduce(function(acc, row) {
+ grp = row[2];
+ if(acc[grp] === undefined) {
+ acc[grp] = [];
+ }
+ acc[grp].push([row[0], row[1]]);
+ return acc;
+ }, {});
+ for(type_group in the_types) {
+ optgrp = document.createElement("optgroup");
+ optgrp.setAttribute("label", type_group);
+ the_types[type_group].forEach(type => {
+ opt = document.createElement("option");
+ opt.setAttribute("value", type[0]);
+ opt.appendChild(document.createTextNode(type[1]));
+ optgrp.appendChild(opt);
+ });
+ elt.appendChild(optgrp);
+ }
+ trigger_change_event(elt);
+}
+
+function setup_datasets(dataset_data) {
+ console.info("DATASET DATA:", dataset_data);
+ elt = document.getElementById("dataset");
+ remove_children(elt);
+ dataset_data.forEach(dataset => {
+ opt = document.createElement("option");
+ opt.setAttribute("value", dataset[0]);
+ opt.appendChild(document.createTextNode(
+ "[" + dataset[1] + "] " + dataset[2]));
+ elt.appendChild(opt);
+ });
+ trigger_change_event(elt);
+}
+
+function menu_contents() {
+ return JSON.parse(
+ document.getElementsByTagName("form")[0].getAttribute(
+ "data-menu-content"));
+}
+
+function update_menu(event) {
+ menu = menu_contents();
+
+ species_elt = document.getElementById("species");
+ group_elt = document.getElementById("group");
+ type_elt = document.getElementById("type");
+ dataset_elt = document.getElementById("dataset");
+
+ if(event.target == species_elt) {
+ setup_groups(menu["groups"][species_elt.value]);
+ }
+
+ if(event.target == group_elt) {
+ setup_types(menu["types"][species_elt.value][group_elt.value]);
+ }
+
+ if(event.target == type_elt) {
+ setup_datasets(
+ menu["datasets"][species_elt.value][group_elt.value][type_elt.value]
+ );
+ }
+}