src/catalogue/templates/catalogue/2022/book_detail.html

   1 <!doctype html>
   2 {% load pipeline %}
   3 {% load static %}
   4 {% load choose_cites from social_tags %}
   5 {% load choose_fragment license_icon from catalogue_tags %}
   6 {% load catalogue_tags %}
   7 {% load likes_book from social_tags %}
   8 {% load piwik_tags %}
   9
  10
  11 <html class="no-js">
  12   <head>
  13     <meta charset="utf-8">
  14     <meta name="description" content="">
  15     <meta name="viewport" content="width=device-width,initial-scale=1">
  16     <title>WolneLektury.pl</title>
  17     <link rel="apple-touch-icon" href="apple-touch-icon.png">
  18
  19     {% stylesheet '2022' %}
  20       <script src="scripts/modernizr.js"></script>
  21
  22       <link rel="preconnect" href="https://fonts.googleapis.com">
  23       <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  24       <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400&display=swap" rel="stylesheet">
  25
  26       {% tracking_code %}
  27   </head>
  28   <body>
  29
  30     <nav class="l-navigation">
  31       <div class="l-change-pop">
  32         <h3>Zmieniamy się!</h3>
  33         <p>
  34           Jeżeli to czytasz jesteś jedną z osób, której prezentujemy nowy wygląd strony książki.
  35           Będziemy bardzo! wdzięczni za Twoją opinię – <a href='/formularz/ux-strona-ksiazki-T1/' target="_blank">możesz nam ją przesłać tutaj</a>.
  36           Jeżeli wolisz klasyczny wygląd - wystarczy, że <a class="quit-experiment" href="#">klikniesz tutaj</a>
  37         </p>
  38         <!-- button class="l-change-pop__close">
  39              <i class="icon icon-close"></i>
  40              </button -->
  41       </div>
  42       <div class="l-container">
  43         <a href="/" class="l-navigation__logo">
  44           <img src="{% static "2022/images/logo.png" %}" alt="WolneLektury.pl">
  45         </a>
  46         <div class="l-naviagion__search">
  47           <form action="/szukaj/">
  48             <input id="search" name="q" type="text" placeholder="szukaj tytułu, autora, motywów…" autocomplete="off" data-source="/szukaj/hint/?max=10">
  49           </form>
  50         </div>
  51         <div class="l-navigation__actions">
  52           <a href="/ludzie/polka/"><i class="icon icon-liked"></i></a>
  53           <!-- button class="l-navigation__button js-menu" aria-label="Menu">
  54                <span class="c-hamburger">
  55                <span class="bar"></span>
  56                </span>
  57                </button-->
  58         </div>
  59       </div>
  60     </nav>
  61
  62
  63     <div class="l-container">
  64       <div class="l-breadcrumb">
  65         <a href="/"><span>Strona główna</span></a>
  66         <a href="/katalog/lektury/"><span>Literatura</span></a>
  67         {% for ancestor in book.ancestors %}
  68           <a href="{{ ancestor.get_absolute_url }}">{{ ancestor.title }}</a>
  69         {% endfor %}
  70       </div>
  71     </div>
  72
  73
  74     <main class="l-main">
  75       <section class="l-section">
  76         {% with first_text=book.get_first_text %}
  77           <aside class="l-aside">
  78             <figure>
  79               {% if first_text %}
  80                 <a href="{% url 'book_text' first_text.slug %}">
  81               {% endif %}
  82               <img src="{% if book.cover_clean %}{{ book.cover_clean.url }}{% endif %}" alt="{{ book.pretty_title }}" width="240">
  83               {% if first_text %}
  84                 </a>
  85               {% endif %}
  86             </figure>
  87
  88             {% if book.parent or book.get_children %}
  89               <ul class="l-aside__zbiory">
  90                 {% if book.parent %}
  91                   {% for b in book.ancestors %}
  92                     <li>
  93                       <a href="{{ b.get_absolute_url }}">{{ b.title }}</a>
  94                       <ul>
  95                   {% endfor %}
  96                   {% for b in book.get_siblings %}
  97                     <li>
  98                       {% if b == book %}
  99                         <strong>{{ b.title }}</strong>
 100                         <ul>
 101                           {% for c in book.get_children %}
 102                             <li>
 103                               <a href="{{ c.get_absolute_url }}">{{ c.title }}</a>
 104                             </li>
 105                           {% endfor %}
 106                         </ul>
 107                       {% else %}
 108                         <a href="{{ b.get_absolute_url }}">{{ b.title }}</a>
 109                       {% endif %}
 110                     </li>
 111                   {% endfor %}
 112
 113                   {% for b in book.ancestor.all %}
 114                       </ul>
 115                     </li>
 116                   {% endfor %}
 117                 {% else %}
 118                   <li>
 119                     <strong>{{ book.title }}</strong>
 120                     <ul>
 121                       {% for c in book.get_children %}
 122                         <li>
 123                           <a href="{{ c.get_absolute_url }}">{{ c.title }}</a>
 124                         </li>
 125                       {% endfor %}
 126                     </ul>
 127                   </li>
 128                 {% endif %}
 129               </ul>
 130             {% endif  %}
 131
 132             <ul class="l-aside__info">
 133               <li><span>Epoka:</span> {% for tag in book.epochs %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
 134               <li><span>Rodzaj:</span> {% for tag in book.kinds %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
 135               <li><span>Gatunek:</span> {% for tag in book.genres %}<a href="{{ tag.get_absolute_url }}">{{ tag.name }}</a> {% endfor %}</li>
 136
 137             </ul>
 138           </aside>
 139           <div class="l-content">
 140             <header class="l-header">
 141               <div class="l-header__content">
 142                 <p>{% for author in book.authors %}<a href="{{ author.get_absolute_url }}">{{ author.name }}</a>{% if not forloop.last %}, {% endif %}{% endfor %}
 143                 </p>
 144                 <h1><a href="{{ book.get_absolute_url }}">{{ book.title }}</a></h1>
 145                 {% if book.translators %}
 146                   <p class="l-header__translators">
 147                     tłum.
 148                     {% for translator in book.translators %}
 149                       {{ translator }}{% if not forloop.last %}, {% endif %}
 150                     {% endfor %}
 151                   </p>
 152                 {% endif %}
 153               </div>
 154               <div class="l-header__actions">
 155                 {% likes_book book as likes %}
 156                 {% if likes %}
 157                   <form method='post' action='{% url 'social_unlike_book' book.slug %}'>
 158                     {% csrf_token %}
 159                     <button class="l-button l-button--fav">
 160                       <img src="{% static '2022/images/faved.svg' %}" alt="Usuń z ulubionych">
 161                     </button>
 162                   </form>
 163                 {% else %}
 164                   <form method='post' action='{% url 'social_like_book' book.slug %}'>
 165                     {% csrf_token %}
 166                     <button class="l-button l-button--fav">
 167                       <img src="{% static '2022/images/fav.svg' %}" alt="Dodaj do ulubionych">
 168                     </button>
 169                   </form>
 170                 {% endif %}
 171               </div>
 172             </header>
 173             <article class="l-article">
 174               <div class="c-media">
 175                 <div class="c-media__actions">
 176                   <div class="c-media__btn">
 177                     {% if book.has_mp3_file %}
 178                       <button class="l-button l-button--media" id="audiobook"><i class="icon icon-audio"></i> pobierz audiobook</button>
 179                     {% endif %}
 180                   </div>
 181                   <div class="c-media__btn">
 182                     <button class="l-button l-button--media" id="ebook"><i class="icon icon-book"></i> pobierz książkę</button>
 183                   </div>
 184                   <div class="c-media__btn">
 185                     {% if first_text %}
 186                       <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>
 187                     {% endif %}
 188                   </div>
 189                 </div>
 190
 191
 192
 193                 {% if book.has_mp3_file %}
 194                   {% include 'catalogue/snippets/2022_jplayer.html' %}
 195                 {% else %}
 196                   {% with ch=book.get_child_audiobook %}
 197                     {% if ch %}
 198                       {% include 'catalogue/snippets/2022_jplayer_link.html' with book=ch %}
 199                     {% endif %}
 200                   {% endwith %}
 201
 202                 {% endif %}
 203
 204
 205
 206
 207                 <div class="c-media__popup" data-popup="ebook">
 208                   <div class="c-media__popup__box">
 209                     <div class="c-media__popup__box__lead">
 210                       <h2>Pobieranie e-booka</h2>
 211                       <p>Wybierz wersję dla siebie:</p>
 212                     </div>
 213                     <div class="c-media__popup__box__items">
 214                       {% if book.pdf_file %}
 215                         <div class="c-media__popup__box__item">
 216                           <div>
 217                             <h3>.pdf</h3>
 218                             <p>Jeśli planujesz wydruk albo lekturę na urządzeniu mobilnym bez dodatkowych aplikacji.</p>
 219                           </div>
 220                           <div>
 221                             <a href="{{ book.pdf_url }}" class="l-button l-button--media l-button--media--full">.pdf</a>
 222                           </div>
 223                         </div>
 224                       {% endif %}
 225                       {% if book.epub_file %}
 226                         <div class="c-media__popup__box__item">
 227                           <div>
 228                             <h3>.epub</h3>
 229                             <p>Uniwersalny format e-booków, obsługiwany przez większość czytników sprzętowych i aplikacji na urządzenia mobilne.</p>
 230                           </div>
 231                           <div>
 232                             <a href="{{ book.epub_url }}" class="l-button l-button--media l-button--media--full">.epub</a>
 233                           </div>
 234                         </div>
 235                       {% endif %}
 236                       {% if book.mobi_file %}
 237                         <div class="c-media__popup__box__item">
 238                           <div>
 239                             <h3>.mobi</h3>
 240                             <p>Natywny format dla czytnika Amazon Kindle.</p>
 241                           </div>
 242                           <div>
 243                             <a href="{{ book.mobi_url }}" class="l-button l-button--media l-button--media--full">.mobi</a>
 244                           </div>
 245                         </div>
 246                       {% endif %}
 247                       {% if book.synchro_file %}
 248                         <div class="c-media__popup__box__item">
 249                           <div>
 250                             <h3>synchrobook (epub3)</h3>
 251                             <p>Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format (np. ..., ..., ...).</p>
 252                           </div>
 253                           <div>
 254                             <a href="#" class="l-button l-button--media l-button--media--full">synchrobook</a>
 255                           </div>
 256                         </div>
 257                       {% endif %}
 258                       {% if book.txt_file or book.fb2_file %}
 259                         <div class="c-media__popup__box__item">
 260                           <div>
 261                             <h3>inne formaty</h3>
 262                             <ul>
 263                               <li><a href="{% url 'custom_pdf_form' book.slug %}">Stwórz własny PDF</a></li>
 264                               {% if book.txt_file %}<li><a href="{{ book.txt_url }}">plik tekstowy (.txt)</a></li>{% endif %}
 265                               {% if book.fb2_file %}<li><a href="{{ book.fb2_url }}">FictionBook</a></li>{% endif %}
 266                             </ul>
 267                           </div>
 268                         </div>
 269                       {% endif %}
 270                     </div>
 271                     <button class="c-media__popup__close">
 272                       <img src="{% static '2022/images/close.svg' %}" alt="Zamknij">
 273                     </button>
 274                   </div>
 275                 </div>
 276                 {% if book.has_mp3_file %}
 277                   <div class="c-media__popup" data-popup="audiobook">
 278                     <div class="c-media__popup__box">
 279                       <div class="c-media__popup__box__lead">
 280                         <h2>Pobieranie audiobooka</h2>
 281                         <p>Wybierz wersję dla siebie:</p>
 282                       </div>
 283                       <div class="c-media__popup__box__items">
 284                         <div class="c-media__popup__box__item">
 285                           <div>
 286                             <h3>.mp3</h3>
 287                             <p>Uniwersalny format, obsługiwany przez wszystkie urządzenia.</p>
 288                           </div>
 289                           <div>
 290                             <a href="{% url 'download_zip_mp3' book.slug %}" class="l-button l-button--media l-button--media--full">.mp3</a>
 291                           </div>
 292                         </div>
 293                         {% if book.has_ogg_file %}
 294                           <div class="c-media__popup__box__item">
 295                             <div>
 296                               <h3>OggVorbis</h3>
 297                               <p>Otwarty format plików audio, oferujący nagranie w najwyższej jakości dźwiękowej.</p>
 298                             </div>
 299                             <div>
 300                               <a href="{% url 'download_zip_ogg' book.slug %}" class="l-button l-button--media l-button--media--full">.ogg</a>
 301                             </div>
 302                           </div>
 303                         {% endif %}
 304                         {% if book.has_daisy_file %}
 305                           <div class="c-media__popup__box__item">
 306                             <div>
 307                               <h3>DAISY</h3>
 308                               <p>Format dla osób z dysfunkcjami czytania.</p>
 309                             </div>
 310                             <div>
 311                               {% for dsy in book.media_daisy %}
 312                                 <a href="{{ dsy.file.url }}" class="l-button l-button--media l-button--media--full">DAISY</a>
 313                               {% endfor %}
 314                             </div>
 315                           </div>
 316                         {% endif %}
 317                         {% if book.has_synchro_file %}
 318                           <div class="c-media__popup__box__item">
 319                             <div>
 320                               <h3>synchrobook</h3>
 321                               <p>Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format.</p>
 322                             </div>
 323                             <div>
 324                               <a href="#" class="l-button l-button--media l-button--media--full">synchrobook</a>
 325                             </div>
 326                           </div>
 327                         {% endif %}
 328                       </div>
 329                       <button class="c-media__popup__close">
 330                         <img src="{% static '2022/images/close.svg' %}" alt="Zamknij">
 331                       </button>
 332                     </div>
 333                   </div>
 334                 {% endif %}
 335               </div>
 336
 337               <div class="l-article__overlay" data-max-height="327">
 338                 {{ book.abstract|safe }}
 339
 340                 {% if book.toc %}
 341                   <h4>Spis treści:</h4>
 342                   {{ book.toc|safe }}
 343                 {% endif %}
 344               </div>
 345               <button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Czytaj więcej</button>
 346             </article>
 347             <div class="c-support">
 348               <div>
 349                 <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>
 350                 <a href="{% url 'club_join' %}?pk_campaign=layout">Dorzuć się!</a>
 351               </div>
 352               <figure>
 353                 <img src="{% static '2022/images/dziecko.jpeg' %}" alt="Dorzuć się!">
 354               </figure>
 355             </div>
 356           </div>
 357         {% endwith %}
 358       </section>
 359
 360       {% for author in book.authors %}
 361         <section class="l-section">
 362           <div class="l-author">
 363             <div class="row">
 364               <h2>O autorze</h2>
 365               <div>
 366                 {% if author.photo %}
 367                   <figure class="l-author__photo">
 368                     <img src="{{ author.photo.url }}" alt="{{ author.name }}" style="width: 238px;">
 369                     <figcaption>
 370                       {{ author.photo_attribution|safe }}
 371                     </figcaption>
 372                   </figure>
 373                 {% endif %}
 374                 <article class="l-author__info">
 375                   <h3><a href="{{ author.get_absolute_url }}">{{ author.name }}</a></h3>
 376                   <div class="l-article__overlay" data-max-height="327">
 377                     {{ author.description|safe }}
 378                   </div>
 379                   <button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Czytaj więcej</button>
 380                 </article>
 381               </div>
 382             </div>
 383
 384             {% choose_cites book 3 as cites %}
 385             {% if cites %}
 386               <div class="row">
 387                 <div class="l-author__quotes">
 388                   <div class="l-author__quotes__slider">
 389                     {% for fragment in cites %}
 390                       <a class="l-author__quotes__slider__item" href="{{ fragment.get_absolute_url }}">
 391
 392                         <em>
 393                           {{ fragment.short_text|safe }}
 394                         </em>
 395                         <p>{{ fragment.book.pretty_title }}</p>
 396                       </a>
 397                     {% endfor %}
 398                   </div>
 399                 </div>
 400               </div>
 401             {% endif %}
 402           </div>
 403         </section>
 404       {% endfor %}
 405
 406       <section class="l-section">
 407         <div class="l-themes__wrapper">
 408           {% with book.related_themes as themes %}
 409             {% if themes %}
 410               <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>
 411               <div class="l-themes l-article__overlay" data-max-height="80">
 412                 <ul>
 413                   {% for item in themes %}
 414                     <li><a href="{% url 'book_fragments' book.slug item.slug %}">{{ item }}&nbsp;({{ item.count}})</a></li>
 415                   {% endfor %}
 416                 </ul>
 417               </div>
 418               <button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Zobacz więcej</button>
 419
 420             {% endif %}
 421           {% endwith %}
 422           <ul class="links">
 423             {% if book.wiki_link %}
 424               <li><a href="{{ book.wiki_link }}">strona utworu w Wikipedii</a></li>
 425             {% endif %}
 426             <li>
 427               <a href="{{ book.xml_url }}">źródłowy plik XML</a>
 428             </li>
 429             <li>
 430               <a target="_blank" href="{% url 'poem_from_book' book.slug %}">miksuj treść utworu</a>
 431             </li>
 432             <li>
 433               <a target="_blank" href="{{ book.get_extra_info_json.about }}">utwór na Platformie Redakcyjnej</a>
 434             </li>
 435           </ul>
 436         </div>
 437       </section>
 438     </main>
 439
 440
 441
 442
 443
 444     <section class="l-section">
 445       <div class="l-books__wrapper">
 446         <div class="l-container">
 447           <h2>Czytaj także</h2>
 448           <div class="l-books">
 449             {% if book.other_versions %}
 450               {% for rel in book.other_versions %}
 451                 <article class="l-books__item">
 452                   <figure class="l-books__item__img">
 453                     <a href="{{ rel.get_absolute_url }}">
 454                       <img src="{% if rel.cover_clean %}{{ rel.cover_clean.url }}{% endif %}" alt="{{ rel.pretty_title }}">
 455                     </a>
 456                   </figure>
 457                   <h3>
 458                     {% for author in rel.authors %}
 459                       <a href="{{ author.get_absolute_url }}">{{ author }}</a>
 460                     {% endfor %}
 461                   </h3>
 462                   <h2><a href="{{ rel.get_absolute_url }}">{{ rel.title }}</a></h2>
 463                 </article>
 464               {% endfor %}
 465             {% endif %}
 466
 467
 468             {% related_books_2022 book taken=book.other_versions|length as related_books %}
 469             {% for rel in related_books %}
 470               <article class="l-books__item">
 471                 <figure class="l-books__item__img">
 472                   <a href="{{ rel.get_absolute_url }}">
 473                     <img src="{% if rel.cover_clean %}{{ rel.cover_clean.url }}{% endif %}" alt="{{ rel.pretty_title }}">
 474                   </a>
 475                 </figure>
 476                 <h3>
 477                   {% for author in rel.authors %}
 478                     <a href="{{ author.get_absolute_url }}">{{ author|upper }}</a>
 479                   {% endfor %}
 480                 </h3>
 481                 <h2><a href="{{ rel.get_absolute_url }}">{{ rel.title }}</a></h2>
 482               </article>
 483             {% endfor %}
 484
 485             <article class="l-books__item l-books__item--link">
 486               <a href="/katalog/kolekcje/">i wiele innych książek, wierszy, obrazów, audiobooków…</a>
 487               <a href="/katalog/kolekcje/" class="icon-link"><i class="icon icon-all"></i></a>
 488             </article>
 489
 490           </div>
 491         </div>
 492       </div>
 493     </section>
 494
 495     <div class="l-footer">
 496       <div class="l-container">
 497         <div class="l-footer__row">
 498           <a href="#"><img src="{% static '2022/images/FNP-logo.png' %}" alt="FUNDACJA Nowoczesna Polska"></a>
 499           <ul>
 500             <li>ul. Marszałkowska 84/92 lok. 125</li>
 501             <li>00-514 Warszawa</li>
 502           </ul>
 503           <ul class="teal">
 504             <li>tel. <a href="#">(22) 621 30 17</a></li>
 505             <li>email <a href="#">fundacja@nowoczesnapolska.org.pl</a></li>
 506           </ul>
 507         </div>
 508         <div class="l-footer__row">
 509           <div>
 510             Wolne Lektury to projekt prowadzony przez fundację <a href="#">Nowoczesna Polska</a>. <br>
 511             Hosting: <a href="#">ICM</a>.
 512           </div>
 513           <div>
 514             <a href="#"><img src="{% static '2022/images/MKiDN.png' %}" alt="MKiDN"></a>
 515           </div>
 516           <div>
 517             Strona biblioteki Wolne Lektury powstała dzięki dofinansowaniu ze środków Ministra <a href="#">Kultury i Dziedzictwa Narodowego</a>
 518             pochodzących z <a href="#">Funduszu Promocji Kultury</a> – państwowego funduszu celowego.
 519           </div>
 520         </div>
 521       </div>
 522     </div>
 523
 524     <script src="{% static '2022/scripts/vendor.js' %}"></script>
 525     <script src="{% static '2021/scripts/main.js' %}"></script>
 526
 527     {% javascript '2022' %}
 528       {% javascript '2022_player' %}
 529         <!-- Hotjar Tracking Code for https://wolnelektury.pl/ -->
 530         <script>
 531          (function(h,o,t,j,a,r){
 532              h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
 533              h._hjSettings={hjid:2661024,hjsv:6};
 534              a=o.getElementsByTagName('head')[0];
 535              r=o.createElement('script');r.async=1;
 536              r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
 537              a.appendChild(r);
 538          })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
 539         </script>
 540   </body>
 541 </html>