Refactored radio buttons

faustedition · Aug 6, 2020 · e2c5aba · e2c5aba
1 parent b866a72
commit e2c5aba
Showing 1 changed file with 12 additions and 12 deletions.
diff --git a/src/graphviewer/templates/form.html b/src/graphviewer/templates/form.html
@@ -5,6 +5,14 @@
     <label for="{{ name }}">{{ label }}</label>
 {%- endmacro %}
 
+{% macro radiolist(name, items, checked=None) -%}
+    {% for value, label in items %}
+        <input type="radio" name="{{ name }}" id="{{ name }}_{{ value }}" value="{{ value }}" {% if (value == checked) %} checked {% endif %}>
+        <label for="{{ name }}_{{ value }}">{{ label }}</label>
+
+    {% endfor %}
+{%- endmacro %}
+
 {% block head %}
     <style>
         main {
@@ -224,22 +232,18 @@
     <form id="subgraph-form" method="get" class="flex-form pure-form">
     <fieldset>
     <legend>Zentrale Knoten
-    <small class="pull-right"><label><input type="checkbox" name="nohl" id="nohl" > nicht hervorheben</label></small>
+    <small class="pull-right">{{ checkbox('nohl', 'nicht hervorheben') }}</small>
     </legend>
     <p><input type="text" name="nodes" id="nodes" value="" style="width: 100%;" placeholder="2 V H.13">
     </p>
-    <p>Pfade dazwischen:
-        <input type="radio" name="central_paths" value="no" id="ce_no"> <label for="ce_no">keine</label>
-        <input type="radio" name="central_paths" value="dag" id="ce_dag"> <label for="ce_dag">nur positive</label>
-        <input type="radio" name="central_paths" value="all" id="ce_all" checked> <label for="ce_all">alle</label>
-    </p>
+    <p>Pfade dazwischen: {{ radiolist('central_paths', [('no', 'keine'), ('dag', 'nur positive'), ('all', 'alle')], 'all') }}</p>
     <p>{{ checkbox('context', 'Nachbarknoten') }}</p>
     <p>{{ checkbox('inscriptions', 'Inskriptionen ↔ Zeugen') }}</p>
     <p>{{ checkbox('syn', 'ungefähr gleichzeitige Knoten') }}</p>
     </fieldset>
     <fieldset>
     <legend>Zusätzliche Pfade</legend>
-    <p><input type="checkbox" name="abs_dates" id="abs_dates" > <label for="abs_dates">absolute Datierungen rechtfertigen</label></p>
+    <p>{{ checkbox('abs_dates', 'absolute Datierungen rechtfertigen') }}</p>
     <p><label for="extra">Pfade von/zu (falls verfügbar): </label><br/>
         <input type="text" name="extra" id="extra" value="" list="interesting-nodes" placeholder="A, 2 H" style="width: 100%"><br />
         {{ checkbox('paths_wo_timeline', 'ohne Zeitstrahl') }}
@@ -268,11 +272,7 @@
     <p>{{ checkbox('collapse', 'Parallelkanten zusammenfassen') }}</p>
     <p>{{ checkbox('order', 'Topologische Sortierung') }}</p>
     <p style="vertical-align: middle">
-        Richtung:
-        <input id="dir-lr" name="dir" type="radio" value="LR" checked> <label for="dir-lr">→</label> 
-        <input id="dir-tb" name="dir" type="radio" value="TB"> <label for="dir-tb">↓</label> 
-        <input id="dir-rl" name="dir" type="radio" value="RL"> <label for="dir-rl">←</label> 
-        <input id="dir-bt" name="dir" type="radio" value="BT"> <label for="dir-bt">↑</label>
+        Richtung: {{ radiolist('dir', [('LR', '→'), ('TB', '↓'), ('RL', '←'), ('BT', '↑')], 'LR') }}
     </p>
     </fieldset>
 </form>