diff --git a/app.py b/app.py index 7697768..990c307 100755 --- a/app.py +++ b/app.py @@ -1,12 +1,20 @@ #!/usr/bin/env python3 # vim: set sw=4 ts=4 ex -from flask import Flask, render_template, url_for +from flask import Flask, render_template, render_template_string, url_for from flask_flatpages import FlatPages +from flask_flatpages.utils import pygmented_markdown from flask_fontawesome import FontAwesome from datetime import datetime +# directly support jinja within markdown blogposts +# https://flask-flatpages.readthedocs.io/en/v0.7.1/ +def markdown_with_jinja_renderer(text): + prerendered_body = render_template_string(text) + return pygmented_markdown(prerendered_body) + app = Flask(__name__) app.config['FLATPAGES_EXTENSION'] = '.md' +app.config['FLATPAGES_HTML_RENDERER'] = markdown_with_jinja_renderer app.config['FONTAWESOME_STYLES'] = ['solid', 'brands'] pages = FlatPages(app) @@ -43,5 +51,30 @@ def index(): return render_template('index.html', pages=sorted_pages) +def fotogrid(image_urls): + result = '
' + cols = 4 + images = divmod(len(image_urls), cols) + images_per_col = images[0] + if images[1] > 0: + images_per_col += 1 + nbr = 0 + for img in image_urls: + if (nbr % images_per_col) == 0: + if nbr > 0: + result += '
' # closing fotocolumn + result += '
' + result += '' + nbr += 1 + + result += "
" # closing fotocolum, fotorow + return result + + +app.jinja_env.globals.update(fotogrid=fotogrid) + +#template = Template('Fotogrid') +#template.globals['fotogrid'] = fotogrid + if __name__ == '__main__': app.run(host='0.0.0.0') diff --git a/pages/wacken2019.md b/pages/wacken2019.md index 167ff28..3538c50 100644 --- a/pages/wacken2019.md +++ b/pages/wacken2019.md @@ -103,4 +103,7 @@ Eine weiteres Spektakel steht uns noch mit der _30th Anniversary Show_ bevor, di **Parkway Drive** ziehen mit einem Fackelzug direkt durch die Menge auf die Bühne, eröffnen mit _Wishing Wells_ und _Prey_ und kündigen danach an, dass der Gig beinahe ausfallen musste, da sich der Bassist ein Knie gebrochen hatte. Sänger _Winston McCall_ kündigt daraufhin an: „Please welcome our new and improved bass player on a wheel chair!“ und Bassist _Jia O’Connor_ wird von seiner Mutter (!) im Rollstuhl auf die Bühne geschoben. Diese wiederum nutzt die Gelegenheit und startet zu _Carrion_ in die Menge, um zum ersten Mal in ihrem Leben zu crowdsurfen. Wie die Menge sie feiert! ## So 04.08.2019, Trennungsschmerz -Tja, am Sonntag ist dann wieder alles vorbei. Schade. Es löst sich auf, man verabschiedet sich und fährt wieder heim. Bei der Abfahrt vom Platz begegnen uns nochmal zufällig die Wabers und wir winken uns von Auto zu Auto zu, bevor wir uns in die Abreiseschlange einsortieren, diese aber bald wieder verlassen, da wir noch ein paar Tage an der Ostsee daranhängen werden. Schön war’s! \ No newline at end of file +Tja, am Sonntag ist dann wieder alles vorbei. Schade. Es löst sich auf, man verabschiedet sich und fährt wieder heim. Bei der Abfahrt vom Platz begegnen uns nochmal zufällig die Wabers und wir winken uns von Auto zu Auto zu, bevor wir uns in die Abreiseschlange einsortieren, diese aber bald wieder verlassen, da wir noch ein paar Tage an der Ostsee daranhängen werden. Schön war’s! + +
+{{ fotogrid(["static/img/woa2019_01.jpg", "static/img/woa2019_02.jpg", "static/img/woa2019_03.jpg", "static/img/woa2019_04.jpg", "static/img/woa2019_05.jpg", "static/img/woa2019_06.jpg", "static/img/woa2019_07.jpg", "static/img/woa2019_08.jpg", "static/img/woa2019_09.jpg", "static/img/woa2019_10.jpg", "static/img/woa2019_11.jpg", "static/img/woa2019_12.jpg", "static/img/woa2019_13.jpg", "static/img/woa2019_14.jpg"])|safe }} \ No newline at end of file diff --git a/static/fotogrid.css b/static/fotogrid.css new file mode 100644 index 0000000..227411d --- /dev/null +++ b/static/fotogrid.css @@ -0,0 +1,35 @@ + + +.fotorow { + display: flex; + flex-wrap: wrap; + padding: 0 4px; +} + +/* Create four equal columns that sits next to each other */ +.fotocolumn { + flex: 25%; + max-width: 25%; + padding: 0 4px; +} + +.fotocolumn img { + margin-top: 8px; + vertical-align: middle; +} + +/* Responsive layout - makes a two column-layout instead of four columns */ +@media (max-width: 1000px) { + .fotocolumn { + flex: 50%; + max-width: 50%; + } +} + +/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */ +@media (max-width: 800px) { + .fotocolumn { + flex: 100%; + max-width: 100%; + } +} \ No newline at end of file diff --git a/templates/template.html b/templates/template.html index 0333291..e6518aa 100644 --- a/templates/template.html +++ b/templates/template.html @@ -4,6 +4,7 @@ {{ fontawesome_html() }} +