Png poster maker

Reviewed-on: Decentrala/website#19

.gitignore

@@ -5,5 +5,7 @@ site/atom_blog.xml
 site/atom_events.xml
 poster.html
 poster.pdf
+poster_light.png
+poster_dark.png
 http.access.log
 http.error.log

dogadjaji.csv

@@ -61,3 +61,11 @@ datum, vreme, lokacija, tema
 22-08-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Autentifikacija na internetu
 28-08-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Podešavanje Mail servera
 29-08-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Prevođenje wiki-a
+04-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Hakaton
+05-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Cybersecurity - phishing
+11-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Radionica kreativnog pisanja
+12-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Tehno veče
+18-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Stop reklamama - diskusija
+19-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Cybersecurity - kako početi?
+25-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Email server E02
+26-09-2023, 19:00, DC Krov https://www.openstreetmap.org/node/10594728522, Lambda racun E02

image_poster.py

@@ -0,0 +1,89 @@
+#! /usr/bin/env python
+
+import freetype
+import io
+from PIL import Image, ImageDraw, ImageFont
+import csv
+import datetime as dt
+from dateutil import relativedelta
+
+CURRENT_TIME = dt.date.today()
+NEXT_MONTH = CURRENT_TIME
+DAYS_OF_WEEK_SR = ("PON", "UTO", "SRE", "ČET", "PET", "SUB", "NED")
+MONTHS_SR = ("Januar", "Februar", "Mart", "April", "Maj", "Jun", "Jul", "Avgust",\
+            "Septembar", "Oktobar", "Novembar", "Decembar")
+
+
+def load_events(csv_path:str) -> list[dict]:
+    events = []
+    with open(csv_path) as csv_file:
+        csv_reader = csv.reader(csv_file)
+        next(csv_reader, None)
+        for event in csv_reader:
+            event_date = event[0]
+            event_date_parsed = dt.datetime.strptime(event_date, "%d-%m-%Y").date()
+            event_time = event[1]
+            event_title = event[3]
+            current_event = {"date":event_date_parsed,
+                             "time":event_time,
+                             "title":event_title.strip()}
+            if event_date_parsed >= NEXT_MONTH:
+                events.append(current_event)
+        return events
+
+def drawPoster(events, bg, fg):
+    fontFacade = ImageFont.truetype('./site/font/Facade-Sud.woff', size=110)
+    fontIosevka = ImageFont.truetype('./site/font/iosevka-regular.woff', size=60)
+    fontIosevkaSmall = ImageFont.truetype('./site/font/iosevka-regular.woff', size=45)
+
+    W = 1200
+    H = 1500 
+    img = Image.new('RGB', (W, H), bg)
+    draw = ImageDraw.Draw(img)
+
+    header = "DECENTRALA"
+    _, _, w, _ = draw.textbbox((0, 0), header, font=fontFacade)
+    draw.text(((W-w)/2, 120), header, font=fontFacade, fill=fg)
+
+    subheader = f"Plan za {MONTHS_SR[NEXT_MONTH.month - 1]}"
+    _, _, w, _ = draw.textbbox((0, 0), subheader, font=fontIosevka)
+    draw.text(((W-w)/2, 240), subheader, font=fontIosevka, fill=fg)
+
+    height = 410
+
+    for event in events:
+        date = DAYS_OF_WEEK_SR[event["date"].weekday()]
+        day = event["date"].day
+        title = event["title"]
+        pad = " " if event["date"].day < 10 else ""
+        eventText = f"{date} {day}. {pad} {title}"
+        draw.text((120, height), eventText, font=fontIosevkaSmall, fill=fg)
+        height += 70
+
+    def drawCircle(x, y):
+        r = 10
+        draw.ellipse((x - r, y - r, x + r, y+r), fill=fg, outline=(0, 0, 0), width=0)
+
+    LCX = 950 # logo center x
+    LCY = 1200 # logo center y
+    d = 50 # delta
+    drawCircle(LCX - d, LCY)
+    drawCircle(LCX, LCY)
+    drawCircle(LCX, LCY - d)
+    drawCircle(LCX, LCY + d)
+    drawCircle(LCX + d, LCY)
+
+    draw.line([(LCX - d, LCY), (LCX + d, LCY)], fill=fg, width=5, joint=None)
+    draw.line([(LCX, LCY), (LCX, LCY + d), (LCX + d, LCY), (LCX, LCY - d)], fill=fg, width=5, joint=None)
+    draw.text((LCX - 1.7*d, LCY + 1.5*d), "dmz.rs", font=fontIosevka, fill=fg)
+
+    return img
+
+
+events = load_events("dogadjaji.csv")
+
+img = drawPoster(events, (0, 0, 0), (20, 250, 50))
+img.save('poster_dark.png')
+
+img = drawPoster(events, (255, 255, 255), (0, 0, 0))
+img.save('poster_light.png')

pages/en/events.html

@@ -1,2 +1,2 @@
 <h1>Events</h1>
-<p>Following list contains all forthcoming events. Held events are listed in <a href="/en/events_archive">archive</a></p>
+<p>Following list contains all forthcoming events. Held events are listed in <a href="/en/events_archive">archive</a></p><br>

pages/sr/events.html

@@ -1,2 +1,2 @@
 <h1>Događaji</h1>
-<p>Naredna lista sadrži sve predstojeće događaje. Za listu održanih događaja pogledajte <a href="/events_archive">arhivu</a></p>
+<p>Naredna lista sadrži sve predstojeće događaje. Za listu održanih događaja pogledajte <a href="/events_archive">arhivu</a></p><br>

site/styles/events.css

@@ -12,7 +12,8 @@
 }
 
 .event>div {
-  padding: 0.5rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
   white-space: nowrap;
 }
 
@@ -26,6 +27,8 @@
 .title {
   border-left: 2px solid var(--border);
   font-weight: bold;
+  padding-left: 1rem;
+  padding-right: 0.5em;
 }
 
 .place {
@@ -36,7 +39,7 @@
   .event {
     flex-direction: column;
     margin-bottom: 1rem;
-    border-left: 2px solid var(--border);
+    border-left: 3px solid var(--border);
   }
 
   .event > div {
@@ -52,6 +55,10 @@
     padding-bottom: 0;
   }
 
+  .date {
+    width: 100%;
+  }
+
   .title {
     border-left: none;
   }

template/page-en.html

@@ -13,7 +13,7 @@
 </head>
 <body>
   <header>
-    <a id="logo" href="/en/"><img src="/img/logo-light.svg" alt="Logo"> Decentrala</a>
+    <a id="logo" href="/en/index"><img src="/img/logo-light.svg" alt="Logo"> Decentrala</a>
     <button id="theme-switcher"></button>
     <a class="lang" hreflang="sr" href="/PAGE_NAME">SR</a>
   </header>