src/picture/templates/picture/picture_viewer.html

   1 {% extends "catalogue/viewer_base.html" %}
   2 {% load i18n %}
   3 {% load static from staticfiles %}
   4 {% load catalogue_tags %}
   5 {% load thumbnail %}
   6 {% load ssi_include from ssify %}
   7
   8
   9 {% block title %}{{ picture.pretty_title }}{% endblock %}
  10
  11
  12 {% block body-id %}picture-viewer{% endblock %}
  13
  14
  15 {% block js-dependencies %}
  16   <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
  17 {% endblock %}
  18
  19
  20 {% block no-menu-extra %}
  21   <li><a class="square button plus inactive" href="#">+<!--&#x2795;--><!-- heavy plus sign --></a></li>
  22   <li><a class="square button minus inactive" href="#">-<!-- &#x2796;--><!-- heavy minus sign --></a></li>
  23 {% endblock %}
  24
  25
  26 {% block menu %}
  27   <li>
  28     <a style="width: 50%;display: inline-block;" class="square button plus inactive" href="#">+<!--&#x2795;--><!-- heavy plus sign --></a>
  29     <a style="width: 50%;display: inline-block;" class="square button minus inactive" href="#">-<!-- &#x2796;--><!-- heavy minus sign --></a>
  30   </li>
  31
  32   {% spaceless %}
  33     <li>
  34       {% with picture.get_previous as prev %}
  35         <a style="width: 50%;display: inline-block;" {% if prev %}href="{% url 'picture_viewer' prev.slug %}"{% endif %}>{% if prev %}&lt;{%endif %}</a>
  36       {% endwith %}
  37       {% with picture.get_next as next %}
  38         <a style="width: 50%;display: inline-block;" {% if next %}href="{% url 'picture_viewer' next.slug %}"{% endif %}>{% if next %}&gt;{% endif %}</a>
  39       {% endwith %}
  40     </li>
  41   {% endspaceless %}
  42
  43   <li>
  44     <a href="{{ picture.get_absolute_url }}" id="menu-book" data-box="book-short">
  45       <img src="{% thumbnail picture.image_file '120x300' as thumb %}{{ thumb.url }}{% empty %}{{ picture.image_file.url }}{% endthumbnail %}"
  46            width="120"
  47            alt="{{ picture.pretty_title }}"
  48            title="{{ picture.pretty_title }}">
  49     </a>
  50   </li>
  51
  52   <li><a href="#picture-objects" class="dropdown"><span class="label">{% trans "Objects" %}</span></a></li>
  53   <li><a href="#picture-themes" class="dropdown"><span class="label">{% trans "Themes" %}</span></a></li>
  54
  55   <li id="menu-info">
  56     <a href="#info" data-box="info">
  57       <span class="label">{% trans "Infobox" %}</span>
  58     </a>
  59   </li>
  60
  61   <li id="sponsors">
  62     {% for sponsor in sponsors %}
  63       {% thumbnail sponsor.logo "120x300" as logo %}
  64         <a href="{{ sponsor.url }}" target="_blank"><img src="{{ logo.url }}" alt="{{ sponsor.name }}" /></a>
  65       {% endthumbnail %}
  66     {% endfor %}
  67   </li>
  68 {% endblock %}
  69
  70 {% block main %}
  71   <div id="picture-view">
  72     {% thumbnail picture.image_file "700x500" as pic %}
  73       <div class="picture-wrap {% if picture.image_file|is_portrait %}portrait{% endif %}"
  74            data-original-width="{{picture.width}}" data-original-height="{{picture.height}}"
  75            data-original-url="{{ picture.image_file.url }}"
  76            data-width="{{pic.width}}" data-height="{{pic.height}}" style="background-image: url('{{pic.url}}');  width: {{pic.width}}px; height: {{pic.height}}px;">
  77       </div>
  78     {% endthumbnail %}
  79   </div>
  80 {% endblock %}
  81
  82
  83 {% block footer %}
  84   {{ picture.html_file.read|safe }}
  85
  86   <div id="info" class="box">
  87     <div class="sponsors">
  88       <a href="/">
  89         <img src="{% static "img/logo-220.png" %}" alt="Wolne Lektury"/>
  90       </a>
  91       {% for sponsor in sponsors %}
  92         {% thumbnail sponsor.logo "220x220" as logo %}
  93           <a href="{{ sponsor.url }}" target="_blank"><img src="{{ logo.url }}" alt="{{ sponsor.name }}"/></a>
  94         {% endthumbnail %}
  95       {% endfor %}
  96     </div>
  97
  98     {% book_info picture %}
  99   </div>
 100
 101   <div class="box Picture-item" id="book-short">
 102     {% ssi_include 'picture_short' pk=picture.pk %}
 103   </div>
 104 {% endblock %}