{% extends '2022/base_real.html' %}

{% load static %}
{% load choose_cites from social_tags %}
{% load catalogue_tags %}
{% load likes_book from social_tags %}


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


    <main class="l-main">
      <section class="l-section">
        {% with first_text=book.get_first_text %}
          <aside class="l-aside">
            <figure>
              {% if 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 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>Epoka:</span> {% for tag in book.epochs %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
              <li><span>Rodzaj:</span> {% for tag in book.kinds %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
              <li><span>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 %}
                  <p class="l-header__translators">
                    tłum.
                    {% for translator in book.translators %}
                      {{ translator }}{% if not forloop.last %}, {% endif %}
                    {% endfor %}
                  </p>
                {% endif %}
              </div>
              <div class="l-header__actions">
                {% likes_book book as likes %}
                {% 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="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="Dodaj do ulubionych">
                    </button>
                  </form>
                {% endif %}
              </div>
            </header>
            <article class="l-article">
              <div class="c-media">
                <div class="c-media__actions">
                  <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> 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> 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> czytaj online</a>
                    {% endif %}
                  </div>
                </div>



                {% if book.has_mp3_file %}
                  {% include 'catalogue/snippets/2022_jplayer.html' %}
                {% else %}
                  {% with ch=book.get_child_audiobook %}
                    {% if ch %}
                      {% include 'catalogue/snippets/2022_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>Pobieranie e-booka</h2>
                      <p>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>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>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>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>Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format (np. ..., ..., ...).</p>
                          </div>
                          <div>
                            <a href="#" 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>inne formaty</h3>
                            <ul>
                              <li><a href="{% url 'custom_pdf_form' book.slug %}">Stwórz własny PDF</a></li>
                              {% if book.txt_file %}<li><a href="{{ book.txt_url }}">plik tekstowy (.txt)</a></li>{% endif %}
                              {% if book.fb2_file %}<li><a href="{{ book.fb2_url }}">FictionBook</a></li>{% endif %}
                            </ul>
                          </div>
                        </div>
                      {% endif %}
                    </div>
                    <button class="c-media__popup__close">
                      <img src="{% static '2022/images/close.svg' %}" alt="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>Pobieranie audiobooka</h2>
                        <p>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>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>Otwarty format plików audio, oferujący nagranie w najwyższej jakości dźwiękowej.</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>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_synchro_file %}
                          <div class="c-media__popup__box__item">
                            <div>
                              <h3>synchrobook</h3>
                              <p>Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format.</p>
                            </div>
                            <div>
                              <a href="#" class="l-button l-button--media l-button--media--full">synchrobook</a>
                            </div>
                          </div>
                        {% endif %}
                      </div>
                      <button class="c-media__popup__close">
                        <img src="{% static '2022/images/close.svg' %}" alt="Zamknij">
                      </button>
                    </div>
                  </div>
                {% endif %}
              </div>

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

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

      {% for author in book.authors %}
        <section class="l-section">
          <div class="l-author">
            <div class="row">
              <h2>O autorze</h2>
              <div>
                {% if author.photo %}
                  <figure class="l-author__photo">
                    <img src="{{ author.photo.url }}" alt="{{ author.name }}" style="width: 238px;">
                    <figcaption>
                      {{ author.photo_attribution|safe }}
                    </figcaption>
                  </figure>
                {% endif %}
                <article class="l-author__info">
                  <h3><a href="{{ author.get_absolute_url }}">{{ author.name }}</a></h3>
                  <div class="l-article__overlay" data-max-height="327">
                    {{ author.description|safe }}
                  </div>
                  <button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Czytaj więcej</button>
                </article>
              </div>
            </div>

            {% choose_cites book 3 as cites %}
            {% if cites %}
              <div class="row">
                <div class="l-author__quotes">
                  <div class="l-author__quotes__slider">
                    {% for fragment in cites %}
                      <a class="l-author__quotes__slider__item" href="{{ fragment.get_absolute_url }}">

                        <em>
                          {{ fragment.short_text|safe }}
                        </em>
                        <p>{{ fragment.book.pretty_title }}</p>
                      </a>
                    {% endfor %}
                  </div>
                </div>
              </div>
            {% endif %}
          </div>
        </section>
      {% endfor %}

      <section class="l-section">
        <div class="l-themes__wrapper">
          {% with book.related_themes as themes %}
            {% if themes %}
              <h2>Motywy występujące w tym utworze <a href="/katalog/motyw/"><span>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="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Zobacz więcej</button>

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





    <section class="l-section">
      <div class="l-books__wrapper">
        <div class="l-container">
          <h2>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/">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 %}