From a3cc82fc55ca142a588451f58764e90ecefb1efe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Moritz=20H=C3=B6lting?=
 <87192362+moritz-hoelting@users.noreply.github.com>
Date: Wed, 3 Jul 2024 14:55:08 +0200
Subject: [PATCH] add ca-certificates to docker image and add example

---
 Dockerfile                  |  4 ++++
 README.md                   | 13 ++++++------
 compose.yaml => compose.yml |  0
 examples/mensa-widget.html  | 40 +++++++++++++++++++++++++++++++++++++
 4 files changed, 51 insertions(+), 6 deletions(-)
 rename compose.yaml => compose.yml (100%)
 create mode 100644 examples/mensa-widget.html

diff --git a/Dockerfile b/Dockerfile
index 5ea2a59..1e805f6 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -38,6 +38,10 @@ EOF
 # stage.
 FROM debian:bullseye-slim AS final
 
+# Install ca certificates
+RUN apt-get update -y && \
+    apt-get install -y ca-certificates
+
 # Create a non-privileged user that the app will run under.
 # See https://docs.docker.com/develop/develop-images/dockerfile_best-practices/#user
 ARG UID=10001
diff --git a/README.md b/README.md
index e535e7e..a52550e 100644
--- a/README.md
+++ b/README.md
@@ -6,9 +6,10 @@ Web scraper for the canteen of the University of Paderborn.
 
 The following environment variables are available:
 
-| Variable                 | Description                                                      | Default     |
-| ------------------------ | ---------------------------------------------------------------- | ----------- |
-| `API_INTERFACE`          | The interface the API should listen on.                          | `127.0.0.1` |
-| `API_PORT`               | The port the API should listen on.                               | `8080`      |
-| `API_RATE_LIMIT_SECONDS` | The time in seconds after which the rate limit should replenish. | `5`         |
-| `API_RATE_LIMIT_BURST`   | The maximum number of requests that can be made in a burst.      | `5`         |
+| Variable                 | Description                                                      | Default            |
+| ------------------------ | ---------------------------------------------------------------- | ------------------ |
+| `API_INTERFACE`          | The interface the API should listen on.                          | `127.0.0.1`        |
+| `API_PORT`               | The port the API should listen on.                               | `8080`             |
+| `API_CORS_ALLOWED`       | The allowed origins for CORS requests.                           | None, set manually |
+| `API_RATE_LIMIT_SECONDS` | The time in seconds after which the rate limit should replenish. | `5`                |
+| `API_RATE_LIMIT_BURST`   | The maximum number of requests that can be made in a burst.      | `5`                |
diff --git a/compose.yaml b/compose.yml
similarity index 100%
rename from compose.yaml
rename to compose.yml
diff --git a/examples/mensa-widget.html b/examples/mensa-widget.html
new file mode 100644
index 0000000..793fbdd
--- /dev/null
+++ b/examples/mensa-widget.html
@@ -0,0 +1,40 @@
+<div id="mensa" style="width: 90%; margin-inline: auto">
+    <div id="main_dishes"></div>
+</div>
+<script type="text/javascript">
+    fetch("http://localhost:8080/menu/forum")
+        .then((d) => d.json())
+        .then((menu) => {
+            const main_dishes_container = /** @type {HTMLDivElement} */ (document.querySelector(
+                "#mensa #main_dishes"
+            ));
+            main_dishes_container.style.display = "grid";
+            main_dishes_container.style.gridTemplateColumns = "repeat(auto-fit, minmax(150px, 1fr))";
+            main_dishes_container.style.gridGap = "10px";
+            if (
+                main_dishes_container != null &&
+                menu != null &&
+                menu.main_dishes != null
+            ) {
+                for (let dish of menu.main_dishes) {
+                    let dish_el = document.createElement("div");
+                    dish_el.classList.add("dish");
+                    dish_el.style.display = "flex";
+                    dish_el.style.flexDirection = "column";
+                    dish_el.style.alignItems = "center";
+                    let img_el = document.createElement("img");
+                    img_el.src = dish.image_src;
+                    img_el.style.maxWidth = "80%";
+                    img_el.style.objectFit = "cover";
+                    
+                    dish_el.appendChild(img_el);
+                    let name_el = document.createElement("p");
+                    name_el.classList.add("dish-name");
+                    name_el.innerText = dish.name;
+                    name_el.align = "center";
+                    dish_el.appendChild(name_el);
+                    main_dishes_container.appendChild(dish_el);
+                }
+            }
+        });
+</script>