From f7fa411bcffece9aed4798b5f5d8797b77418aff Mon Sep 17 00:00:00 2001
From: zeroth <zeroth@free.fr>
Date: Fri, 13 Nov 2020 18:24:00 +0000
Subject: [PATCH] changes on homepage for the animated banner

---
 daapinterface.py    | 22 ++++------------------
 templates/home.html | 30 +++++++++++++++++++++++++++++-
 2 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/daapinterface.py b/daapinterface.py
index dce6be7..d9de650 100644
--- a/daapinterface.py
+++ b/daapinterface.py
@@ -35,23 +35,6 @@ sparql3 = SPARQLWrapper("https://query.daap.bannerrepeater.org/proxy/wdqs/bigdat
 # # # # # # # # # # # # # # # # # # # # # # # # 
 @app.route("/")
 def home():
-	#  this doesn't show any results yet because I just added the data and I guess the query builder needs to be reloaded again, but the query code should work correctly.
-    # sparql.setQuery('''
-    #     SELECT ?work ?workLabel ?image ?date ?dateadded 
-    #     WHERE {
-    #     SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }
-    #     ?work wdt:P1 wd:Q1;
-    #     wdt:P87 ?dateadded.
-    #     OPTIONAL { ?work wdt:P30 ?image. }
-    #     OPTIONAL { ?work wdt:P13 ?date. }
-    #     FILTER(?work != wd:Q57)
-    #     }
-    #     ORDER BY (?dateadded)
-    #     LIMIT 24
-    # ''')
-    # sparql.setReturnFormat(JSON)
-    # results = sparql.query().convert()
-    # return render_template('home.html', results=results)
     sparql.setQuery('''
         SELECT ?work ?workLabel ?image ?date WHERE {
   SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }
@@ -66,6 +49,7 @@ ORDER BY (?workLabel)
     ''')
     sparql.setReturnFormat(JSON)
     results = sparql.query().convert()
+    ImagesBanner = []
     # print(results)
     for publication in results["results"]["bindings"]:
         publication_title = publication["workLabel"]["value"]
@@ -75,7 +59,9 @@ ORDER BY (?workLabel)
             publication_date = publication["date"]["value"]
         if "image" in publication:
             publication_image = publication["image"]["value"]
-    return render_template('home.html', results=results)
+            ImagesBanner.append(publication_image) 
+    ImagesBanner = ImagesBanner[-3:] 
+    return render_template('home.html', results=results, ImagesBanner=ImagesBanner)
 
 
 @app.route("/browsethearchive")
diff --git a/templates/home.html b/templates/home.html
index 6572078..940ff15 100644
--- a/templates/home.html
+++ b/templates/home.html
@@ -1,14 +1,41 @@
 {% extends "layout.html" %}
 {% block content %}
 
-<div id="home-top-div"></div>
+<!-- BANNER -->
+
+<!-- 
+* It needs a place holder for video (I think Lozana will send it)
+* It needs the two buttons (see zines + other thing). You can put empty a hrefs and I will add the hyperlink after.
+* I have retrieved an array from the last images added (3 currently). 
+  - If you need more images tell me and I will modify the python script, this would be super easy 
+  - Feel free to add the classs/ids of your choice. 
+  - I was unsure also if you needed each image to have a different class but I have improvised something to do so. Once the app is serving you can see 3 different classes : banner-image-0, banner-image-1, banner-image-2
+ -->
+
+<div id="home-top-div">
+
+	<!-- LOOP TO GET THE IMAGES  -->
+	{% set count = namespace(value=0) %}
+	{% for img in ImagesBanner %}
+		<img class="banner-image-{{ count.value }}" src='{{ img | replace("wiki/File:","wiki/Special:Redirect/file/") }}'>
+		{% set count.value = count.value + 1 %}
+	{% endfor %}
+	<!-- END LOOPS IMAGES -->
+
+
+</div>
+
+
+<!--  PUBLICATIONS -->
 
 <div id="home-recently-added-works">
 	<div class="pagetitle" id="home-recent-title">RECENTLY ADDED WORKS</div>
 
 	<div id="home-recent-grid">
 
+<!-- LOOP TO GET LAST ADDED ITEMS -->
 	{% for x in results['results']['bindings']%}
+	<!-- FOR EACH ITEM EXTRACT IMG, URL AND TITLE + DATE -->
 	<div class="home-recent-items">	
 		<div class="home-recent-items-top">
 		{% if "image" in x %}
@@ -36,6 +63,7 @@
 
 	</div>
 	{% endfor %}
+<!-- END LOOP -->
 
 	</div>