<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
  <title>{{ album_name }}</title>
  <meta name="viewport" content="user-scalable=no,initial-scale = 1.0,maximum-scale = 1.0"/>
  <link rel="stylesheet" type="text/css" href="css/topcoat-desktop-dark.css"/>
  <link rel="stylesheet" type="text/css" href="css/main.css"/>
  <link rel="stylesheet" href="js/magnific-popup/magnific-popup.css"/>
  <!--[if lt IE 9]>
  <script src="js/html5shiv.js" type="text/javascript"></script><![endif]-->
</head>
<body{% if password %} data-use-crypto="true"{% endif %}>
<div id="content">
  {% for photo in photos %}
  <div class="thumbnail-container">
    <a class="lightbox{% if password %} encrypted{% endif %}"
       {% if password %} href="#" data-src-encrypted="{{ photo.file }}"
      {% else %}href="{{photo.file }}"{% endif %}>
      <img class="loading thumbnail-img screen-small {% if password %} encrypted{% endif %}"
      {% if password %}data-src-encrypted="{{ photo.thumbnail_file }}"
      {% else %}src="{{photo.thumbnail_file }}"{% endif %}
      width="{{ photo.thumbnail_width }}"
      height="{{ photo.thumbnail_height }}"/>
    </a>
  </div>
  {% endfor %}

  <div id="password-dialog" class="mfp-hide">
    <input id="js-password-input" type="password" class="topcoat-text-input" value="" placeholder="Password"/>
    <button id="js-password-submit" class="topcoat-button--cta">let me in!</button>
    <div id="js-fullscreen-hint" class="hide">Hint: Press 'f' to toggle Fullscreen mode</div>
  </div>
</div>

<script src="_assets_for_all_themes/vendor/js/jquery-2.0.3.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/jquery.ba-hashchange.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/jquery.event.move.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/jquery.event.swipe.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/fullscreen.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/gallery.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/magnific-popup/jquery.magnific-popup.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/jquery.isotope.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/screenfull.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/init.js?{{ timestamp }}" type="text/javascript"></script>

{% if password %}
<script src="_assets_for_all_themes/js/crypto.js?{{ timestamp }}" type="text/javascript"></script>
<script src="_assets_for_all_themes/vendor/js/sha1.js?{{ timestamp }}" type="text/javascript"></script>
<script src="_assets_for_all_themes/vendor/js/aes.js?{{ timestamp }}" type="text/javascript"></script>
<script src="_assets_for_all_themes/vendor/js/jquery.cookie.js?{{ timestamp }}" type="text/javascript"></script>
<script src="js/jquery.jrumble.1.3.js" type="text/javascript"></script>
{% endif %}

</body>
</html>