Flask application repository for Banner Repeater's DAAP (Digital Archive of Artists Publishing). SPARQL queries by Lozana Rossenova, CSS and JS by Joana Chicau, python and Jinja by Julie Boschat-Thorez. See https://daap.network
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

127 lines
3.9 KiB

{% extends "layout.html" %}
{% block content %}
<!-- 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 -->
<p class="heading_A">The Digital Archive of Artists Publishing is an interactive, user-driven, searchable database of Artist's Books and publications</p>
<div id="wrapper-bt-vid">
<div id="wrapper-bt">
<div id="wrapper-top-buttons" class="primary-button"><a href="{{ url_for('zinesindex') }}"><span>SEE EXAMPLE SEARCH FOR ZINES</span></a></div>
<div id="wrapper-top-buttons" class="secondary-button"><a href="{{ url_for('casestudy') }}"><span>LEARN MORE ABOUT ADVANCED SEARCH TOOLS</span></a></div>
</div>
<div id="wrapper-vid">
<video preload="meta" autoplay="" loop="">
<source src="vid/archive-links-video-temp.mp4" type="video/mp4">
</video>
</div>
</div>
</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 %}
<a href='/artwork?id={{ x["work"]["value"] | replace("http://daap.bannerrepeater.org/entity/", "") }}'>
<img class="home-recent-imgs" src='{{ x["image"]["value"] | replace("wiki/File:","wiki/Special:Redirect/file/") }}'>
</a> <br>
{% else %}
<a href='/artwork?id={{ x["work"]["value"] | replace("http://daap.bannerrepeater.org/entity/", "") }}'>
<img class="home-recent-imgs" src="{{ url_for('static', filename='/imgs/Icons/placeholder_no-image2.png') }}"><br>
</a>
{% endif %}
</div>
<div class="home-recent-items-bottom">
<a class="title" href='/artwork?id={{ x["work"]["value"] | replace("http://daap.bannerrepeater.org/entity/", "") }}'>
{{ x["workLabel"]["value"]}}
</a> <br>
<span class="date">
{% if "date" in x %}
{{ x["date"]["value"] | replace("T00:00:00Z", "") }}
</span>
{% endif %}
</div>
</div>
{% endfor %}
<!-- END LOOP -->
</div>
<div class="home-show-wrapper primary-button"><span class="home-show">SHOW MORE</span></div>
</div>
<!--
post_wrap =
home-recent-grid
pst =
home-recent-items
-->
<script type="text/javascript">
$ShowHideMore = $('#home-recent-grid');
$ShowHideMore.each(function() {
var $times = $(this).children('.home-recent-items');
if ($times.length > 9) {
$ShowHideMore.children(':nth-of-type(n+9)').addClass('moreShown').hide();
$(this).find('span.home-show').addClass('more-times').html('SHOW MORE');
}
});
$(document).on('click', '#home-recent-grid > span', function() {
var that = $(this);
var thisParent = that.closest('#home-recent-grid');
if (that.hasClass('more-times')) {
thisParent.find('.moreShown').show();
that.toggleClass('more-times', 'less-times').html('SHOW LESS');
} else {
thisParent.find('.moreShown').hide();
that.toggleClass('more-times', 'less-times').html('SHOW MORE');
}
});
</script>
{% endblock content %}