111 lines
2.7 KiB
HTML
111 lines
2.7 KiB
HTML
{% extends "layout.html" %}
|
|
{% block body %}
|
|
<script type="text/javascript">
|
|
//Change active button in navbar
|
|
|
|
$("document").ready( function(){
|
|
$("li").removeClass("active");
|
|
$("#home").addClass("active");
|
|
|
|
pages = [];
|
|
i=1;
|
|
$(".image").each( function() {
|
|
pages.push($(this).attr("rel"))
|
|
});
|
|
|
|
|
|
$(".image").click(function() {
|
|
var image = $(this).attr("rel");
|
|
$('#display').hide();
|
|
$('#display').fadeIn('slow');
|
|
$('#display').attr("src", image);
|
|
return false;
|
|
});
|
|
|
|
previous_page = "";
|
|
console.log(pages);
|
|
next_page = pages[1];
|
|
$(function() {
|
|
$("#newer").click(function() {
|
|
if(i < pages.length)
|
|
{
|
|
previous_page = pages[i-1];
|
|
$('#display').hide();
|
|
$('#display').fadeIn('slow');
|
|
$('#display').attr("src", next_page);
|
|
|
|
i++;
|
|
next_page = pages[i];
|
|
|
|
|
|
}
|
|
|
|
return false;
|
|
});
|
|
$("#older").click(function() {
|
|
if(i >= 2)
|
|
{
|
|
$('#display').hide();
|
|
$('#display').fadeIn('slow');
|
|
$('#display').attr("src", previous_page);
|
|
|
|
previous_page = pages[i-3];
|
|
next_page = pages[i-1]
|
|
i--;
|
|
|
|
|
|
}
|
|
return false;
|
|
});
|
|
});
|
|
});
|
|
|
|
</script>
|
|
|
|
<div class="container ">
|
|
<h2>{{thumbs_info.subject}}, {{thumbs_info.datestring}}</h2>
|
|
<ul class="thumbnails">
|
|
<li class="span10">
|
|
<a href="#" id="image">
|
|
<img id="display" src="{{ url_for('static', filename=main_page_src) }}" alt="">
|
|
</a>
|
|
<ul class="pager">
|
|
<li class="previous">
|
|
<a href="" id="older">← Older</a>
|
|
</li>
|
|
<li class="next">
|
|
<a href="" id="newer">Newer →</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="span2">
|
|
{% for thumb in thumbs %}
|
|
<a href="#" rel="{{ url_for('static', filename=thumb.href) }}" class="thumbnail image">
|
|
<img src="{{ url_for('static', filename='mini/' + thumb.src) }}" alt="">
|
|
</a>
|
|
{% endfor %}
|
|
<ul>
|
|
<h4>Other dates...</h4>
|
|
{% for date in thumbs_info.other_dates %}
|
|
<li><a href="/view/{{thumbs_info.subject}}/{{date }}">{{date }}</a> </li>
|
|
{% endfor %}
|
|
</ul>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
|
|
{% endblock %}
|
|
|
|
<script type="text/javascript">
|
|
$(function() {
|
|
$(".image").click(function() {
|
|
var image = $(this).attr("rel");
|
|
$('#display').hide();
|
|
$('#display').fadeIn('slow');
|
|
$('#display').attr("src", image);
|
|
return false;
|
|
});
|
|
});
|
|
</script> |