{% extends 'base.html' %}
{% load i18n %}
{% load chunks %}
{% load static %}
{% load choose_cites from social_tags %}
{% load catalogue_tags %}
{% load likes_book from social_tags %}


{% block global-content %}
    <div class="l-container">
      <div class="l-breadcrumb">
        <a href="/"><span>{% trans "Strona główna" %}</span></a>
        <a href="/katalog/lektury/"><span>{% trans "Literatura" %}</span></a>
        {% for ancestor in book.ancestors %}
          <a href="{{ ancestor.get_absolute_url }}">{{ ancestor.title }}</a>
        {% endfor %}
      </div>
    </div>


    <main class="l-main page-book">
      <section class="l-section lay-s-col-rev">
        {% with first_text=book.get_first_text %}
          <aside class="l-aside">
            <figure class="only-l">
              {% if accessible and first_text %}
                <a href="{% url 'book_text' first_text.slug %}">
              {% endif %}
              <img src="{% if book.cover_clean %}{{ book.cover_clean.url }}{% endif %}" alt="{{ book.pretty_title }}" width="240">
              {% if accessible and first_text %}
                </a>
              {% endif %}
            </figure>

            {% if book.parent or book.get_children %}
              <ul class="l-aside__zbiory">
                {% if book.parent %}
                  {% for b in book.ancestors %}
                    <li>
                      <a href="{{ b.get_absolute_url }}">{{ b.title }}</a>
                      <ul>
                  {% endfor %}
                  {% for b in book.get_siblings %}
                    <li>
                      {% if b == book %}
                        <strong>{{ b.title }}</strong>
                        <ul>
                          {% for c in book.get_children %}
                            <li>
                              <a href="{{ c.get_absolute_url }}">{{ c.title }}</a>
                            </li>
                          {% endfor %}
                        </ul>
                      {% else %}
                        <a href="{{ b.get_absolute_url }}">{{ b.title }}</a>
                      {% endif %}
                    </li>
                  {% endfor %}

                  {% for b in book.ancestor.all %}
                      </ul>
                    </li>
                  {% endfor %}
                {% else %}
                  <li>
                    <strong>{{ book.title }}</strong>
                    <ul>
                      {% for c in book.get_children %}
                        <li>
                          <a href="{{ c.get_absolute_url }}">{{ c.title }}</a>
                        </li>
                      {% endfor %}
                    </ul>
                  </li>
                {% endif %}
              </ul>
            {% endif  %}

            <ul class="l-aside__info">
              <li><span>{% trans "Epoka" %}:</span> {% for tag in book.epochs %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
              <li><span>{% trans "Rodzaj" %}:</span> {% for tag in book.kinds %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
              <li><span>{% trans "Gatunek" %}:</span> {% for tag in book.genres %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>

            </ul>
          </aside>
          <div class="l-content">
            <header class="l-header">
              <div class="l-header__content">
                <p>{% for author in book.authors %}<a href="{{ author.get_absolute_url }}">{{ author.name }}</a>{% if not forloop.last %}, {% endif %}{% endfor %}
                </p>
                <h1><a href="{{ book.get_absolute_url }}">{{ book.title }}</a></h1>
                {% if book.translators.exists %}
                  <p class="l-header__translators">
                    {% for translator in book.translators.all %}
                      {% if forloop.first and translator.name != 'tłumacz nieznany' %}
                        {% trans "tłum." %}
                      {% endif %}
                      <a href="{{ translator.get_absolute_url }}">
                        {{ translator }}</a>{% if not forloop.last %}, {% endif %}
                    {% endfor %}
                  </p>
                {% endif %}
              </div>



              {% likes_book book as likes %}
              <div class="l-header__actions only-l">
                {% if likes %}
                  <form method='post' action='{% url 'social_unlike_book' book.slug %}'>
                    {% csrf_token %}
                    <button class="l-button l-button--fav">
                      <img src="{% static '2022/images/faved.svg' %}" alt="{% trans 'Usuń z ulubionych' %}">
                    </button>
                  </form>
                {% else %}
                  <form method='post' action='{% url 'social_like_book' book.slug %}'>
                    {% csrf_token %}
                    <button class="l-button l-button--fav">
                      <img src="{% static '2022/images/fav.svg' %}" alt="{% trans 'Dodaj do ulubionych' %}">
                    </button>
                  </form>
                {% endif %}
              </div>
            </header>
            <article class="l-article">





              {% if accessible %}
                <div class="c-media">
                  <div class="lay-row lay-l-block lay-spread">
                    <figure class="only-s book-cover-small">
                      {% if accessible and first_text %}
                        <a href="{% url 'book_text' first_text.slug %}">
                      {% endif %}
                      <img src="{% if book.cover_clean %}{{ book.cover_clean.url }}{% endif %}" alt="{{ book.pretty_title }}">
                      {% if accessible and first_text %}
                        </a>
                      {% endif %}
                    </figure>
                    <div class="lay-col lay-spread lay-grow">
                      <div class="l-header__actions only-s">
                        {% if likes %}
                          <form method='post' action='{% url 'social_unlike_book' book.slug %}'>
                            {% csrf_token %}
                            <button class="l-button l-button--fav">
                              <img src="{% static '2022/images/faved.svg' %}" alt="{% trans 'Usuń z ulubionych' %}">
                            </button>
                          </form>
                        {% else %}
                          <form method='post' action='{% url 'social_like_book' book.slug %}'>
                            {% csrf_token %}
                            <button class="l-button l-button--fav">
                              <img src="{% static '2022/images/fav.svg' %}" alt="{% trans 'Dodaj do ulubionych' %}">
                            </button>
                          </form>
                        {% endif %}
                      </div>
                      <div class="c-media__actions lay-col lay-l-row">
                        <div class="c-media__btn">
                          {% if book.has_mp3_file %}
                            <button class="l-button l-button--media" id="audiobook"><i class="icon icon-audio"></i> {% trans "pobierz audiobook" %}</button>
                          {% endif %}
                        </div>
                        <div class="c-media__btn">
                          <button class="l-button l-button--media" id="ebook"><i class="icon icon-book"></i> {% trans "pobierz książkę" %}</button>
                        </div>
                        <div class="c-media__btn">
                          {% if first_text %}
                            <a href="{% url 'book_text' first_text.slug %}" class="l-button l-button--media l-button--media--full"><i class="icon icon-eye"></i> {% trans "czytaj online" %}</a>
                          {% endif %}
                        </div>
                      </div>
                    </div>
                  </div>



                  {% if book.has_mp3_file %}
                    {% include 'catalogue/snippets/jplayer.html' %}
                  {% else %}
                    {% with ch=book.get_child_audiobook %}
                      {% if ch %}
                        {% include 'catalogue/snippets/jplayer_link.html' with book=ch %}
                      {% endif %}
                    {% endwith %}

                  {% endif %}




                  <div class="c-media__popup" data-popup="ebook">
                    <div class="c-media__popup__box">
                      <div class="c-media__popup__box__lead">
                        <h2>{% trans "Pobieranie e-booka" %}</h2>
                        <p>{% trans "Wybierz wersję dla siebie" %}:</p>
                      </div>
                      <div class="c-media__popup__box__items">
                        {% if book.pdf_file %}
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>.pdf</h3>
                              <p>{% trans "Jeśli planujesz wydruk albo lekturę na urządzeniu mobilnym bez dodatkowych aplikacji." %}</p>
                            </div>
                            <div>
                              <a href="{{ book.pdf_url }}" class="l-button l-button--media l-button--media--full">.pdf</a>
                            </div>
                          </div>
                        {% endif %}
                        {% if book.epub_file %}
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>.epub</h3>
                              <p>{% trans "Uniwersalny format e-booków, obsługiwany przez większość czytników sprzętowych i aplikacji na urządzenia mobilne." %}</p>
                            </div>
                            <div>
                              <a href="{{ book.epub_url }}" class="l-button l-button--media l-button--media--full">.epub</a>
                            </div>
                          </div>
                        {% endif %}
                        {% if book.mobi_file %}
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>.mobi</h3>
                              <p>{% trans "Natywny format dla czytnika Amazon Kindle." %}</p>
                            </div>
                            <div>
                              <a href="{{ book.mobi_url }}" class="l-button l-button--media l-button--media--full">.mobi</a>
                            </div>
                          </div>
                        {% endif %}
                        {% if book.synchro_file %}
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>synchrobook (epub3)</h3>
                              <p>{% trans "Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format." %}</p>
                            </div>
                            <div>
                              <a href="{{ book.synchro_file }}" class="l-button l-button--media l-button--media--full">synchrobook</a>
                            </div>
                          </div>
                        {% endif %}
                        {% if book.txt_file or book.fb2_file %}
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>{% trans "inne formaty" %}</h3>
                              <ul>
                                <li><a href="{% url 'custom_pdf_form' book.slug %}">{% trans "Stwórz własny PDF" %}</a></li>
                                {% if book.txt_file %}<li><a href="{{ book.txt_url }}">{% trans "plik tekstowy" %} (.txt)</a></li>{% endif %}
                                {% if book.fb2_file %}<li><a href="{{ book.fb2_url }}">{% trans "FictionBook" %}</a></li>{% endif %}
                              </ul>
                            </div>
                          </div>
                        {% endif %}
                      </div>
                      <button class="c-media__popup__close">
                        <img src="{% static '2022/images/close.svg' %}" alt="{% trans 'Zamknij' %}">
                      </button>
                    </div>
                  </div>
                  {% if book.has_mp3_file %}
                    <div class="c-media__popup" data-popup="audiobook">
                      <div class="c-media__popup__box">
                        <div class="c-media__popup__box__lead">
                          <h2>{% trans "Pobieranie audiobooka" %}</h2>
                          <p>{% trans "Wybierz wersję dla siebie" %}:</p>
                        </div>
                        <div class="c-media__popup__box__items">
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>.mp3</h3>
                              <p>{% trans "Uniwersalny format, obsługiwany przez wszystkie urządzenia." %}</p>
                            </div>
                            <div>
                              <a href="{% url 'download_zip_mp3' book.slug %}" class="l-button l-button--media l-button--media--full">.mp3</a>
                            </div>
                          </div>
                          {% if book.has_ogg_file %}
                            <div class="c-media__popup__box__item">
                              <div>
                                <h3>OggVorbis</h3>
                                <p>{% trans "Otwarty format plików audio, oferujący wysokiej jakości nagranie." %}</p>
                              </div>
                              <div>
                                <a href="{% url 'download_zip_ogg' book.slug %}" class="l-button l-button--media l-button--media--full">.ogg</a>
                              </div>
                            </div>
                          {% endif %}
                          {% if book.has_daisy_file %}
                            <div class="c-media__popup__box__item">
                              <div>
                                <h3>DAISY</h3>
                                <p>{% translate "Format dla osób z dysfunkcjami czytania." %}</p>
                              </div>
                              <div>
                                {% for dsy in book.media_daisy %}
                                  <a href="{{ dsy.file.url }}" class="l-button l-button--media l-button--media--full">DAISY</a>
                                {% endfor %}
                              </div>
                            </div>
                          {% endif %}
                          {% if book.has_audio_epub_file %}
                            <div class="c-media__popup__box__item">
                              <div>
                                <h3>EPUB + audiobook</h3>
                                <p>{% trans "Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format." %}</p>
                              </div>
                              <div>
                                {% for epub in book.media_audio_epub %}
                                  <a href="{{ epub.file.url }}" class="l-button l-button--media l-button--media--full">EPUB+audio</a>
                                {% endfor %}
                              </div>
                            </div>
                          {% endif %}
                        </div>
                        <button class="c-media__popup__close">
                          <img src="{% static '2022/images/close.svg' %}" alt="{% trans 'Zamknij' %}">
                        </button>
                      </div>
                    </div>
                  {% endif %}
                </div>
              {% else %}
                <div style="margin-bottom: 1.5rem; font-size: 15px; like-height: 150%; color: #808080;">
                  {% chunk 'book-preview-warn' %}
                </div>

                <div class="l-checkout__box">
                  {% include 'club/donation_step1_form.html' with form=donation_form %}
                </div>
              {% endif %}

              <div class="l-article__overlay" data-max-height="327">
                {% content_warning book %}
                {{ book.abstract|safe }}

                {% if book.toc %}
                  <div class="toc">
                    <h4>{% trans "Spis treści" %}:</h4>
                    {{ book.toc|safe }}
                  </div>
                {% endif %}
              </div>
              <button class="l-article__read-more" aria-label="{% trans 'Kliknij aby rozwinąć' %}" data-label="{% trans 'Czytaj więcej' %}" data-action="{% trans 'Zwiń tekst' %}">{% trans 'Czytaj więcej' %}</button>
            </article>
            {% if accessible %}
            <div class="c-support">
              <div>
                <h2>
                  {% blocktrans trimmed %}
                    Ta książka jest dostępna dla tysięcy dzieciaków dzięki
                    <span>darowiznom</span> od osób takich jak <span>Ty</span>!
                  {% endblocktrans %}
                </h2>
                <a href="{% url 'club_join' %}?pk_campaign=layout">{% trans "Dorzuć się!" %}</a>
              </div>
              <div class="bg">
                <!-- img src="{% static '2022/images/dziecko.jpeg' %}" alt="Dorzuć się!" -->
              </div>
            </div>
            {% endif %}
          </div>
        {% endwith %}
      </section>

      {% for tag in book.authors %}
        <section class="l-section">
          <div class="l-author">
            {% include 'catalogue/author_box.html' %}

            {% if forloop.first %}
              {% choose_cites 3 book=book as cites %}
              {% if cites %}
                <div class="row">
                  <div class="l-author__quotes">
                    <div class="l-author__quotes__slider">
                      {% for fragment in cites %}
                        {% include "catalogue/fragment_slider_box.html" %}
                      {% endfor %}
                    </div>
                  </div>
                </div>
              {% endif %}
            {% endif %}
          </div>
        </section>
      {% endfor %}

      <section class="l-section">
        <div class="l-themes__wrapper">
          {% with book.related_themes as themes %}
            {% if themes %}
              <h2>
                {% trans "Motywy występujące w tym utworze" %}
                <a href="/katalog/motyw/"><span>{% trans "Wszystkie motywy" %}</span> <i class="icon icon-arrow-right"></i></a></h2>
              <div class="l-themes l-article__overlay" data-max-height="80">
                <ul>
                  {% for item in themes %}
                    <li><a href="{% url 'book_fragments' book.slug item.slug %}">{{ item }}&nbsp;({{ item.count}})</a></li>
                  {% endfor %}
                </ul>
              </div>
              <button class="l-article__read-more" aria-label="{% trans 'Kliknij aby rozwinąć' %}" data-label="{% trans 'Zobacz więcej' %}" data-action="{% trans 'Zwiń tekst' %}">{% trans 'Zobacz więcej' %}</button>

            {% endif %}
          {% endwith %}
          <ul class="links">
            {% if book.wiki_link %}
              <li><a href="{{ book.wiki_link }}">{% trans "strona utworu w Wikipedii" %}</a></li>
            {% endif %}
	    {% if accessible %}
            <li>
              <a href="{{ book.xml_url }}">{% trans "źródłowy plik XML" %}</a>
            </li>
            <li>
              <a target="_blank" href="{% url 'poem_from_book' book.slug %}">{% trans "miksuj treść utworu" %}</a>
            </li>
            <li>
              <a target="_blank" href="{{ book.get_extra_info_json.about }}">{% trans "utwór na Platformie Redakcyjnej" %}</a>
            </li>
	    {% endif %}
          </ul>
        </div>
      </section>
    </main>





    <section class="l-section">
      <div class="l-books__wrapper">
        <div class="l-container">
          <h2>{% trans "Czytaj także" %}</h2>
          <div class="l-books">
            {% if book.other_versions %}
              {% for rel in book.other_versions %}
                <article class="l-books__item">
                  <figure class="l-books__item__img">
                    <a href="{{ rel.get_absolute_url }}">
                      <img src="{% if rel.cover_clean %}{{ rel.cover_clean.url }}{% endif %}" alt="{{ rel.pretty_title }}">
                    </a>
                  </figure>
                  <h3>
                    {% for author in rel.authors %}
                      <a href="{{ author.get_absolute_url }}">{{ author }}</a>
                    {% endfor %}
                  </h3>
                  <h2><a href="{{ rel.get_absolute_url }}">{{ rel.title }}</a></h2>
                </article>
              {% endfor %}
            {% endif %}


            {% related_books_2022 book taken=book.other_versions|length as related_books %}
            {% for rel in related_books %}
              <article class="l-books__item">
                <figure class="l-books__item__img">
                  <a href="{{ rel.get_absolute_url }}">
                    <img src="{% if rel.cover_clean %}{{ rel.cover_clean.url }}{% endif %}" alt="{{ rel.pretty_title }}">
                  </a>
                </figure>
                <h3>
                  {% for author in rel.authors %}
                    <a href="{{ author.get_absolute_url }}">{{ author|upper }}</a>
                  {% endfor %}
                </h3>
                <h2><a href="{{ rel.get_absolute_url }}">{{ rel.title }}</a></h2>
              </article>
            {% endfor %}

            <article class="l-books__item l-books__item--link">
              <a href="/katalog/kolekcje/">{% trans "i wiele innych książek, wierszy, obrazów, audiobooków…" %}</a>
              <a href="/katalog/kolekcje/" class="icon-link"><i class="icon icon-all"></i></a>
            </article>

          </div>
        </div>
      </div>
    </section>


{% endblock %}