feature: add alt-text support for pictures

renderer/fifty_ohm_html_renderer.py

@@ -190,18 +190,22 @@ class FiftyOhmHtmlRenderer(HtmlRenderer):
         return base.join(filter(lambda x: x is not None, [self.render(child) for child in token.children]))
 
     @staticmethod
-    def render_picture_helper(id, ref, text, number):
+    def render_picture_helper(id, ref, text, number, alt_text):
         return f"""
                 <figure class="picture" id="ref_{ref}" name="{ref}">
-                    <img src="pictures/{id}.svg">
+                    <img src="pictures/{id}.svg" alt="{alt_text}">
                     <figcaption>Abbildung {number}: {text}</figcaption>
                 </figure>
             """
 
     def render_picture(self, token):
         if self.picture_handler is not None:
-            self.picture_handler(token.id)
-        return self.render_picture_helper(token.id, token.ref, token.text, token.number)
+            alt_text = self.picture_handler(token.id)
+
+            if alt_text is None:
+                alt_text = "Alt-Text noch nicht verfügbar"
+
+        return self.render_picture_helper(token.id, token.ref, token.text, token.number, alt_text)
 
     @staticmethod
     def render_photo_helper(id, ref, text, number):

src/build.py

@@ -80,10 +80,10 @@ class Build:
                 answers = []
 
             if metadata["picture_a"] != "":
-                self.__picture_handler(metadata["picture_a"])
-                self.__picture_handler(metadata["picture_b"])
-                self.__picture_handler(metadata["picture_c"])
-                self.__picture_handler(metadata["picture_d"])
+                alt_text_a = self.__picture_handler(metadata["picture_a"])
+                alt_text_b = self.__picture_handler(metadata["picture_b"])
+                alt_text_c = self.__picture_handler(metadata["picture_c"])
+                alt_text_d = self.__picture_handler(metadata["picture_d"])
 
                 answer_pictures = [
                     metadata["picture_a"],
@@ -91,14 +91,24 @@ class Build:
                     metadata["picture_c"],
                     metadata["picture_d"],
                 ]
+
+                alt_text_answers = [
+                    alt_text_a,
+                    alt_text_b,
+                    alt_text_c,
+                    alt_text_d,
+                ]
+
             else:
                 answer_pictures = []
+                alt_text_answers = []
 
             if "picture_question" in question and metadata["picture_question"] != "":
                 picture_question = metadata["picture_question"]
-                self.__picture_handler(picture_question)
+                alt_text_question = self.__picture_handler(picture_question)
             else:
                 picture_question = ""
+                alt_text_question = ""
 
             return question_template.render(
                 question=question["question"],
@@ -107,6 +117,8 @@ class Build:
                 picture_question=picture_question,
                 answers=answers,
                 answer_pictures=answer_pictures,
+                alt_text_answers=alt_text_answers,
+                alt_text_question=alt_text_question,
             )
 
     def __build_question_slide(self, input):
@@ -122,6 +134,8 @@ class Build:
         file = f"{id}.svg"
         try:
             shutil.copyfile(self.config.p_data_pictures / file, self.config.p_build_pictures / file)
+            if (self.config.p_data_pictures / f"{id}.txt").exists():
+                return (self.config.p_data_pictures / f"{id}.txt").read_text()
         except FileNotFoundError:
             tqdm.write(f"\033[31mPicture #{id} not found\033[0m")
 

src/download.py

@@ -107,9 +107,12 @@ class Download:
                 file.write(picture["latex"])
 
             # Save Alt-Text to file
-            if picture["alt_text_reviewed"] is not None:
+            prefix = ""
+            if picture["alt_text"] is not None:
+                if picture["alt_text_reviewed"] is None:
+                    prefix = "Der folgende Alt-Text wurde noch nicht geprüft: "
                 with (self.config.p_data_pictures / f"{picture['id']}.txt").open("w") as file:
-                    file.write(picture["alt_text"])
+                    file.write(prefix + picture["alt_text"])
 
             # Download SVG
             data = self.api.get_file(f"assets/{picture['picture']}")

templates/html/question.html

@@ -1,7 +1,7 @@
 <div class="question layout-{{ layout }}" id="{{ number }}">
     <div class="question-text">{{ number }}: {{ question }}</div>
     {% if picture_question %}
-      <div class="question-picture"><img src="pictures/{{ picture_question }}.svg"></div>
+      <div class="question-picture"><img src="pictures/{{ picture_question }}.svg" alt="{{ alt_text_question }}"></div>
     {% endif %}
     <div class="answers">
       {% for i in range(4) %}
@@ -10,7 +10,7 @@
             {{ answers[i] }}
           {% endif %}
           {% if answer_pictures[i] %}
-            <div class="question-picture"><img src="pictures/{{ answer_pictures[i] }}.svg"></div>
+            <div class="question-picture"><img src="pictures/{{ answer_pictures[i] }}.svg" alt="{{ alt_text_answers[i] }}"></div>
           {% endif %}
           {% if i == 0 %}
             <div class="result material-icons">check</div>