render decoding results as table

Author: devidw

app.py

@@ -9,7 +9,7 @@ def index():
     if request.method == 'POST':
         qr = request.form['qr']
         json = decode(qr)
-        return render_template('json.html', json=json)
+        return render_template('json.html', cert=json)
     else:
         return render_template('form.html')
 

decoder/decoder.py

@@ -13,5 +13,6 @@ def decode(cert):
     cbor_data = cbor2.loads(cbor_data)
     json_data = cbor2.loads(cbor_data.value[2])
     json_data = json.dumps(json_data, indent=2)
-    # object = json.loads(json_data)
-    return json_data
+    object = json.loads(json_data)
+    object = object['-260']['1']
+    return object

templates/form.html

@@ -1,8 +1,22 @@
 {% extends "base.html" %}
 
+{% block title %}
+Decode your EU Digital COVID Certificate
+{% endblock %}
+
 {% block content %}
 <form method="post">
-  <textarea name="qr" rows="6" placeholder="HC1: …" required class="form-control mb-3"></textarea>
+  <div class="form-group mb-3">
+    <label>QR-Code Text</label>
+
+    <textarea name="qr" rows="10" placeholder="HC1: …" autofocus required minlength="100" maxlength="1000"
+      class="form-control">HC1:6BF+70790T9WJWG.FKY*4GO0.O1CV2 O5 N2FBBRW1*70HS8WY04AC*WIFN0AHCD8KD97TK0F90KECTHGWJC0FDC:5AIA%G7X+AQB9746HS80:54IBQF60R6$A80X6S1BTYACG6M+9XG8KIAWNA91AY%67092L4WJCT3EHS8XJC$+DXJCCWENF6OF63W5NW6WF6%JC QE/IAYJC5LEW34U3ET7DXC9 QE-ED8%E.JCBECB1A-:8$96646AL60A60S6Q$D.UDRYA 96NF6L/5QW6307KQEPD09WEQDD+Q6TW6FA7C466KCN9E%961A6DL6FA7D46JPCT3E5JDLA7$Q6E464W5TG6..DX%DZJC6/DTZ9 QE5$CB$DA/D JC1/D3Z8WED1ECW.CCWE.Y92OAGY8MY9L+9MPCG/D5 C5IA5N9$PC5$CUZCY$5Y$527B+A4KZNQG5TKOWWD9FL%I8U$F7O2IBM85CWOC%LEZU4R/BXHDAHN 11$CA5MRI:AONFN7091K9FKIGIY%VWSSSU9%01FO2*FTPQ3C3F</textarea>
+
+    <small class="form-text text-muted">
+      Get your QR-Code plain contents by reading it via a reader like <a href="https://zxing.org/w/decode.jspx" target="_blank">zxing.org</a> and paste the text above
+    </small>
+  </div>
+
   <input type="submit" value="decode" class="btn btn-primary w-100">
 </form>
 {% endblock %}

templates/includes/nav.html

@@ -1,5 +1,7 @@
 <nav class="navbar navbar-dark bg-dark mb-5">
   <div class="container">
-    <a class="navbar-brand" href="/">EU Digital COVID Certificate Converter</a>
+    <a class="navbar-brand" href="/">
+      EU Digital COVID Certificate Converter
+    </a>
   </div>
 </nav>

templates/json.html

@@ -1,5 +1,69 @@
 {% extends "base.html" %}
 
+{% block title %}
+Your decoded EU Digital COVID Certificate
+{% endblock %}
+
 {% block content %}
-<pre><code>{{ json }}</code></pre>
+
+<!-- <pre>
+  <code>
+    {{ cert }}
+  </code>
+</pre> -->
+
+
+<table class="table">
+  <thead>
+    <tr>
+      <th>key</th>
+      <th>property</th>
+      <th>value</th>
+    </tr>
+  </thead>
+  <tbody>
+    <!-- level 1 -->
+    {% for key in cert %}
+    <tr>
+      <td><code>{{ key }}</code></td>
+      <td></td>
+      <td>
+        <!-- level 2 -->
+        {% if cert[key] is mapping or cert[key] is not string %}
+        <table class="table">
+          <tbody>
+            {% for key2 in cert[key] %}
+            <tr>
+              <td><code>{{ key2 }}</code></td>
+              <td></td>
+              <td>
+                <!-- level 3 -->
+                {% if cert[key][key2] is iterable and (cert[key][key2] is not string) %}
+                <table class="table">
+                  <tbody>
+                    {% for key3 in cert[key][key2] %}
+                    <tr>
+                      <td><code>{{ key3 }}</code></td>
+                      <td></td>
+                      <td>{{ cert[key][key2][key3] }}</td>
+                    </tr>
+                    {% endfor %}
+                  </tbody>
+                </table>
+                {% else %}
+                {{ cert[key][key2] }}
+                {% endif %}
+              </td>
+            </tr>
+            {% endfor %}
+          </tbody>
+        </table>
+        {% else %}
+        {{ cert[key] }}
+        {% endif %}
+      </td>
+    </tr>
+    {% endfor %}
+  </tbody>
+</table>
 {% endblock %}