feature: add html question render based on jinja

templates/html/question.html

@@ -0,0 +1,25 @@
+<div class="question layout-{{ layout }}" id="{{ number }}">
+    <div class="question-text">{{ number }}: {{ question }}</div>
+    {% if picture_question %}
+      <div class="question-picture"><img src="img/picture_{{ picture_question }}.svg"></div>
+    {% endif %}
+    <div class="answers">
+      {% for i in range(4) %}
+        <button onclick="answer(this, {{ 'true' if i == 0 else 'false' }} );">
+          {% if answers[i] %}
+            {{ answers[i] }}
+          {% endif %}
+          {% if answer_pictures[i] %}
+            <div class="question-picture"><img src="img/picture_{{ answer_pictures[i] }}.svg"></div>
+          {% endif %}
+          {% if i == 0 %}
+            <div class="result material-icons">check</div>
+          {% else %}
+            <div class="result material-icons">clear</div>
+          {% endif %}
+        </button>
+      {% endfor %}
+    </div>
+  </div>
+  
+  

test/test_html.py

@@ -1,14 +1,74 @@
 import json
 
+from jinja2 import Environment, FileSystemLoader
 from mistletoe import Document
 
 from renderer.fifty_ohm_html_renderer import FiftyOhmHtmlRenderer
 
 
+def parse_katalog():
+    with open('data/fragenkatalog3b.json') as fragenkatalog_file:
+        fragenkatalog = json.load(fragenkatalog_file)
+
+        questions = {}
+
+        for exampart in fragenkatalog["sections"] : 
+            for chapter in exampart["sections"] :
+                if "questions" in chapter :
+                    for question in chapter["questions"] :
+                        questions[question["number"]] = question
+                if "sections" in chapter :
+                    for section in chapter["sections"] :
+                        for question in section["questions"] :
+                            questions[question["number"]] = question
+        
+        return questions
+
+env = Environment(loader=FileSystemLoader('templates/html'))
+question_template = env.get_template('question.html')
+questions = parse_katalog()
+
 def question_stub(input):
-    with open('data/metadata.json') as file:
-        metadata = json.load(file)
-    return metadata[f"{input}"].get("number")
+    """ Combines the original question dataset from BNetzA with our internal metadata """
+    with open('data/metadata.json') as metadata_file :
+        metadata = json.load(metadata_file)
+        number = metadata[f"{input}"]["number"] # Fragennummer z.B. AB123
+
+        question = questions[number]
+        metadata = metadata[f"{input}"]
+
+        data = {}
+
+        if "answer_a" in question :
+            data["answers"] = [
+                    question["answer_a"],
+                    question["answer_b"],
+                    question["answer_c"],
+                    question["answer_d"]
+                ]
+        else :
+            data["answers"] = []
+
+        if metadata["picture_a"] != "" :
+            data["answer_pictures"] = [
+                    metadata["picture_a"],
+                    metadata["picture_b"],
+                    metadata["picture_c"],
+                    metadata["picture_d"]
+                ]
+        else :
+            data["answer_pictures"] = []
+
+        if "picture_question" in question :
+            data["picture_question"] = metadata["picture_question"]
+
+        data["question"] = question["question"]
+        data["number"] = number
+
+        return question_template.render(data) #fragenkatalog[metadata[f"{input}"]["number"]]
+
+
+    #metadata[f"{input}"].get("number")
 
 
 def test_html(capsys):