From 0bede91333e01493f33295787415edae5371938f Mon Sep 17 00:00:00 2001
From: Andreas Valder <andreasv@fsmpi.rwth-aachen.de>
Date: Tue, 9 Aug 2016 22:47:26 +0200
Subject: [PATCH] made preview a macro ladning page now using panels
---
server.py | 2 +-
static/style.css | 1 +
templates/header.html | 2 -
templates/index.html | 100 +++++++++++++++---------------------------
templates/macros.html | 19 ++++++++
5 files changed, 56 insertions(+), 68 deletions(-)
create mode 100644 templates/macros.html
diff --git a/server.py b/server.py
index 85eadcc..25cd235 100755
--- a/server.py
+++ b/server.py
@@ -4,7 +4,7 @@ app = Flask(__name__)
@app.route('/')
def index():
- return render_template('index.html', site_title="Video AG")
+ return render_template('index.html', latestvideos=[{'talk':{'title':'talktitle','thumbnail':'https://videoag.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-Geophysical_models_IV.jpg','id':123,'comment':'comment','date':'date'},'event':{'title':'eventtitle'}},{'talk':{'title':'talktitle','thumbnail':'https://videoag.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-Geophysical_models_IV.jpg','id':123,'comment':'comment','date':'date'},'event':{'title':'eventtitle'}},{'talk':{'title':'talktitle','thumbnail':'https://videoag.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-Geophysical_models_IV.jpg','id':123,'comment':'comment','date':'date'},'event':{'title':'eventtitle'}},{'talk':{'title':'talktitle','thumbnail':'https://videoag.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-Geophysical_models_IV.jpg','id':123,'comment':'comment','date':'date'},'event':{'title':'eventtitle'}}])
if __name__ == '__main__':
app.debug = True
diff --git a/static/style.css b/static/style.css
index e69de29..6883d67 100644
--- a/static/style.css
+++ b/static/style.css
@@ -0,0 +1 @@
+.videopreview li:nth-child(odd) { background: #f5f5f5; }
diff --git a/templates/header.html b/templates/header.html
index 39764bb..bc2d3dd 100644
--- a/templates/header.html
+++ b/templates/header.html
@@ -7,7 +7,6 @@
<div class="col-md-11">
<div class="row" style="">
<ul class="list-inline col-xs-12">
- <!---
<li>
<a href="#">Vampir</a>
</li>
@@ -23,7 +22,6 @@
<li>
<a href="#">Twitter</a>
</li>
- !--->
</ul>
</div>
<div class="row">
diff --git a/templates/index.html b/templates/index.html
index 9b98230..3b2ec05 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,76 +1,46 @@
+{% from 'macros.html' import preview %}
{% extends "base.html" %}
{% block content %}
<div class="container-fluid">
<div class="row">
- <div class="col-md-6">
- <div>
- <h1>Video AG</h1>
- <p>Wir machen Vorlesungsvideos, damit du dir deine Vorlesungen angucken kannst, wann, wo und so oft <strong>du</strong> willst ;)</p>
- <p><strong>Probleme?</strong><a href="http://google.de"> Hier gehts zur FAQ</a></p>
- <p>Wenn du die Videos nützlich fandest, schreib doch bitte den Dozenten eine kurze E-Mail. Waren die Videos grauenhaft? Kritik an uns.</p>
- <p>Wenn du mitmachen willst, Fragen oder Anregungen hast, oder nur mal schauen möchtest, komm zu unserem AG-Treffen oder schreib uns eine E-Mail.
- Insbesondere freuen wir uns über Studis der Mathematik und Physik, die ihre Vorlesungen filmen wollen.
- Die nächste Sitzung der AG findet am 10.08.2016 ab 18:00 Uhr in den Räumlichkeiten der Fachschaft im Augustinerbach 2a, 1. Obergeschoss statt.
- </p>
+ <div class="col-md-6 panel-group">
+ <div class="panel panel-default">
+ <div class="panel-heading">
+ <h1>Video AG</h1>
+ </div>
+ <div class="panel-body">
+ <p>Wir machen Vorlesungsvideos, damit du dir deine Vorlesungen angucken kannst, wann, wo und so oft <strong>du</strong> willst ;)</p>
+ <p><strong>Probleme?</strong><a href="http://google.de"> Hier gehts zur FAQ</a></p>
+ <p>Wenn du die Videos nützlich fandest, schreib doch bitte den Dozenten eine kurze E-Mail. Waren die Videos grauenhaft? Kritik an uns.</p>
+ <p>Wenn du mitmachen willst, Fragen oder Anregungen hast, oder nur mal schauen möchtest, komm zu unserem AG-Treffen oder schreib uns eine E-Mail.
+ Insbesondere freuen wir uns über Studis der Mathematik und Physik, die ihre Vorlesungen filmen wollen.</p>
+ <p>Die nächste Sitzung der AG findet am <strong>10.08.2016 ab 18:00 Uhr in den Räumlichkeiten der Fachschaft im Augustinerbach 2a, 1. Obergeschoss</strong> statt.
+ </p>
+ </div>
</div>
- <div>
- <h1>Featured</h1>
- <h3>Collegium Musicum</h3>
- <img style="width:100%" src="http://www.cm.rwth-aachen.de/typo3/typo3temp/pics/c1d685f56a.jpg">
+ <div class="panel panel-default">
+ <div class="panel-heading">
+ <h1>Featured</h1>
+ </div>
+ <div class="panel-body">
+ <h3>Collegium Musicum</h3>
+ <img style="width:100%" src="http://www.cm.rwth-aachen.de/typo3/typo3temp/pics/c1d685f56a.jpg">
+ </div>
</div>
</div>
<div class="col-md-6">
- <h1>Neueste Videos</h1>
- <ul class="list-group">
- <li class="list-group-item">
- <div class="row">
- <a href="?view=player&lectureid=7359#content" title="HYP2016">
- <img class="col-xs-4" src="https://video.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-720p.jpg" alt="Vorschaubild">
- <div class="col-xs-4">
- <span title="HYP2016">HYP2016</span>
- <span title="02.08.16 18:00">02.08.16</span>
- <p>The classical limit of quantum observables in conservation laws of fluid dynamics</p>
- </div>
- <div class="col-xs-4">
- <div class="comment">Quantum mechanics II</div>
- <div class="comment">Gehalten von Anders Szepessy</div>
- </div>
- </a>
- </div>
- </li>
- <li class="list-group-item">
- <div class="row">
- <a href="?view=player&lectureid=7359#content" title="HYP2016">
- <img class="col-xs-4" src="https://video.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-720p.jpg" alt="Vorschaubild">
- <div class="col-xs-4">
- <span title="HYP2016">HYP2016</span>
- <span title="02.08.16 18:00">02.08.16</span>
- <p>The classical limit of quantum observables in conservation laws of fluid dynamics</p>
- </div>
- <div class="col-xs-4">
- <div class="comment">Quantum mechanics II</div>
- <div class="comment">Gehalten von Anders Szepessy</div>
- </div>
- </a>
- </div>
- </li>
- <li class="list-group-item">
- <div class="row">
- <a href="?view=player&lectureid=7359#content" title="HYP2016">
- <img class="col-xs-4" src="https://video.fsmpi.rwth-aachen.de/pub/thumbnails/16ss-hyp-160802-720p.jpg" alt="Vorschaubild">
- <div class="col-xs-4">
- <span title="HYP2016">HYP2016</span>
- <span title="02.08.16 18:00">02.08.16</span>
- <p>The classical limit of quantum observables in conservation laws of fluid dynamics</p>
- </div>
- <div class="col-xs-4">
- <div class="comment">Quantum mechanics II</div>
- <div class="comment">Gehalten von Anders Szepessy</div>
- </div>
- </a>
- </div>
- </li>
- </ul>
+ <div class="panel panel-default">
+ <div class="panel-heading">
+ <h1>Neueste Videos</h1>
+ </div>
+ <div class="panel-body">
+ <ul class="list-group videopreview">
+ {% for i in latestvideos %}
+ {{ preview(i['talk'],i['event']) }}
+ {% endfor %}
+ </ul>
+ </div>
+ </div>
</div>
</div>
</div>
diff --git a/templates/macros.html b/templates/macros.html
new file mode 100644
index 0000000..c625fa0
--- /dev/null
+++ b/templates/macros.html
@@ -0,0 +1,19 @@
+{% macro preview(talk,event) %}
+<li class="list-group-item">
+ <div class="row">
+ <a href="?view=player&lectureid={{ talk['id'] }}#content" title="{{ event['title'] }}">
+ <img class="col-xs-4" src="{{ talk['thumbnail'] }}" alt="Vorschaubild">
+ <div class="col-xs-4">
+ <span>{{ event['title'] }}</span>
+ <span>{{ talk['date'] }}</span>
+ <p>{{ talk['title'] }}</p>
+ </div>
+ <div class="col-xs-4">
+ <div class="comment">{{ talk['comment'] }}</div>
+ <div class="comment">Gehalten von {{ talk['speaker']|default('unbekannt') }} </div>
+ </div>
+ </a>
+ </div>
+</li>
+
+{% endmacro %}:
--
GitLab