diff --git a/src/graphviewer/templates/form.html b/src/graphviewer/templates/form.html index b5824f1..e02a99a 100644 --- a/src/graphviewer/templates/form.html +++ b/src/graphviewer/templates/form.html @@ -93,6 +93,25 @@ return new FormData(form); } + function setFormData(form, data) { + if (!form) form = document.getElementById('subgraph-form'); + if (!data) data = document.location.search; + const entries = (new URLSearchParams(data)).entries(); + console.log(form, data, entries); + form.reset(); + for (const [key, val] of entries) { + const input = form.elements[key]; + if (input) { + if (input.type === 'checkbox') + input.checked = !!val; + else + input.value = val; + } + console.log(form, key, val) + } + + } + async function getDotStr(formdata) { const response = await fetch('subgraph/dot', {method: "POST", body: formdata}); if (response.status === 200) @@ -133,13 +152,42 @@ main.classList.remove('vertical'); } } + + const fixNodesField = function fixNodesField(element) { + const origValue = element.value, + query = new URLSearchParams([['nodes', origValue]]).toString(); + fetch('subgraph/check-nodes?' + query) + .then(response => response.json()) + .then(checkedNodes => { + if (element.value === origValue) { // no change from user in the meantime + element.value = checkedNodes.normalized; + if (checkedNodes.not_found) { + message(checkedNodes.error_msg, 'error'); + element.valid = false; + element.title = checkedNodes.error_msg; + } else { + element.valid = true; + element.title = checkedNodes.error_msg; + } + } + }) + } + + d3.selectAll('#subgraph-form input[type=checkbox], #subgraph-form input[type=radio]').on("click", updateGraph); d3.selectAll('#subgraph-form select').on("input", updateGraph); - d3.selectAll('#subgraph-form input[type=text]').on("blur", updateGraph) + d3.selectAll('#subgraph-form input[type=text]').on("blur", function() { + updateGraph(); + fixNodesField(this); + }); document.addEventListener("keypress", function (event) { - if (event.key === "Enter") + if (event.key === "Enter") { updateGraph(); + fixNodesField(this); + } }); + + setFormData(); updateGraph(); function contentRequired(formSelector, nonEmptyFieldName) { @@ -168,16 +216,16 @@
Zentrale Knoten - + -

+

unmittelbare Aussagen über Kernknoten

{% if models|length > 1 %}

- {% for model_name in models %} {% endfor %} @@ -187,24 +235,26 @@

Zusätzliche Pfade -

+


-
- +
+

+

+

Kantenauswahl -

-

-

-

+

+

+

+

Graphlayout -

-

-

+

+

+

Richtung: