thestudentlife/Manhattan-Project

{% extends 'base.html' %}
{% load static from staticfiles %}

{% block title_block %}
    <title>{{ person }}</title>
{% endblock %}

{% block body_block %}
    <ol class="breadcrumb breadcrumbAdjust">
        <li>Photographs by {{ person }}</li>
    </ol>
    <div class="tsl-container">
        <div class="photo-previews">
            {% for photo in images %}
                <div class="article-preview">
                    <div class="thumbnail">
                        <img src="{{ photo.thumbnail.url }}" alt="{{ photo.caption }}" />
                        {% if photo.caption %}
                        <div class="caption text-center">
                            <p>{{ photo.caption }}</p>
                        </div>
                        {% endif %}
                    </div>
                </div>
            {% endfor %}
        </div>
        {% include 'side_menu.html' %}
    </div>
{% endblock %}


{% block script_block %}
    <script type="text/javascript" src="{% static 'imagesloaded.pkgd.min.js' %}"></script>
    <script type="text/javascript" src="{% static 'masonry.pkgd.min.js' %}"></script>
    <script type="text/javascript">
        $(window).load(function () {
            var container = (document.querySelector('.photo-previews'));
            var msnry = new Masonry(container, {
                itemSelector: '.article-preview'
            });
        });
    </script>
{% endblock %}