src/wolnelektury/static/2021/scripts/main.js

   1 // JS Menu
   2 (function () {
   3   let button = $('.js-menu');
   4   let menu = $('.l-navigation');
   5   let menuLinks = menu.find('a');
   6
   7   button.on('click', function() {
   8     if(!$(this).hasClass('is-active')) {
   9       $(this).addClass('is-active');
  10       menu.addClass('is-open');
  11       $('body').addClass('is-open');
  12       button.find('.bar').addClass('animate');
  13       menuLinks.attr('tabindex', 0);
  14     } else {
  15       $(this).removeClass('is-active');
  16       menu.removeClass('is-open');
  17       $('body').removeClass('is-open');
  18       button.find('.bar').removeClass('animate');
  19       menuLinks.attr('tabindex', -1);
  20     }
  21   });
  22
  23   $(document).keyup(function(e) {
  24     if (e.keyCode === 27) {
  25       button.removeClass('is-active');
  26       menu.removeClass('is-open');
  27       $('body').removeClass('is-open');
  28       button.find('.bar').removeClass('animate');
  29       menuLinks.attr('tabindex', -1);
  30     }
  31   });
  32 })();
  33
  34 // User menu.
  35 (function() {
  36     let button = $('.l-navigation__actions .user');
  37     let menu = $('#user-menu');
  38     let menuLinks = menu.find('a');
  39
  40     button.on('click', function() {
  41         if (!menu.hasClass('is-open')) {
  42             menu.addClass('is-open');
  43             menuLinks.attr('tabindex', 0);
  44         } else {
  45             menu.removeClass('is-open');
  46             menuLinks.attr('tabindex', -1)
  47         }
  48         return false;
  49     });
  50
  51     $(document).keyup(function(e) {
  52         if (e.keyCode === 27) {
  53             menu.removeClass('is-open');
  54             menuLinks.attr('tabindex', -1);
  55         }
  56     });
  57
  58     $(document).click(function() {
  59       menu.removeClass('is-open');
  60       menuLinks.attr('tabindex', -1);
  61     });
  62
  63 })();
  64
  65 // Ebook/Audiobook Btns
  66 (function() {
  67   let button = $('.c-media__btn button:not(.l-button--media--full)');
  68   let popupLayer = $('.c-media__popup');
  69   let closeButton = $('.c-media__popup__close');
  70   let playButton = $('.c-player__btn--md');
  71   let chaptersButton = $('.c-player__chapters span');
  72   let select = $('.c-select');
  73   let selectItem = $('.c-select li');
  74   let volumeButton = $('.icon-volume');
  75
  76   button.on('click', function () {
  77     let target = $(this).attr('id');
  78     $('[data-popup=' + target).addClass('is-open');
  79     $('body').addClass('popup-open');
  80   });
  81
  82   closeButton.on('click', function() {
  83     $(this).closest('.c-media__popup').removeClass('is-open');
  84     $('body').removeClass('popup-open');
  85   });
  86
  87   popupLayer.on('click', function(e) {
  88     let _this = $(this);
  89     if($(e.target).is(popupLayer)) {
  90       _this.removeClass('is-open');
  91       $('body').removeClass('popup-open');
  92     }
  93   });
  94
  95   chaptersButton.on('click', function() {
  96     $(this).parent().toggleClass('is-active');
  97   });
  98
  99   select.on('click', function() {
 100     $(this).toggleClass('is-active');
 101   });
 102
 103   selectItem.on('click', function() {
 104     selectItem.removeClass('is-active');
 105     $(this).addClass('is-active');
 106   });
 107
 108   $(document).keyup(function(e) {
 109     if (e.keyCode === 27) {
 110       $('.c-media__popup').removeClass('is-open');
 111     }
 112   });
 113 })();
 114
 115 // Homepage books sliders
 116 (function () {
 117   let shelfSlider = $('.l-your-books__shelf .l-books');
 118   let shelfNextSlide = $('.l-your-books__shelf .js-next-slide');
 119   let shelfPrevSlide = $('.l-your-books__shelf .js-prev-slide');
 120   let shelfCollapse = $('.l-your-books__shelf .js-collapse');
 121
 122   shelfSlider.slick({
 123     slidesToScroll: 1,
 124     slidesToShow: 4,
 125     infinite: false,
 126     dots: false,
 127     arrows: false,
 128     autoplay: false,
 129     responsive: [
 130       {
 131         breakpoint: 768,
 132         settings: {
 133           centerMode: false,
 134           slidesToShow: 1
 135         }
 136       }
 137     ]
 138   });
 139
 140   shelfNextSlide.on('click', function (event) {
 141     event.preventDefault();
 142     shelfSlider.slick('slickNext');
 143   });
 144
 145   shelfPrevSlide.on('click', function (event) {
 146     event.preventDefault();
 147     shelfSlider.slick('slickPrev');
 148   });
 149
 150   shelfCollapse.on('click', function (event) {
 151     event.preventDefault();
 152     shelfSlider.slick('slickPrev');
 153   });
 154
 155   let collectionsSlider = $('.js-collections .l-books');
 156   let collectionsNextSlide = $('.js-collections .js-next-slide');
 157   let collectionsPrevSlide = $('.js-collections .js-prev-slide');
 158
 159   collectionsSlider.slick({
 160     slidesToScroll: 1,
 161     slidesToShow: 5,
 162     infinite: false,
 163     dots: false,
 164     arrows: false,
 165     autoplay: false,
 166     responsive: [
 167       {
 168         breakpoint: 768,
 169         settings: {
 170           centerMode: false,
 171           slidesToShow: 2
 172         }
 173       }
 174     ]
 175   });
 176
 177   collectionsNextSlide.on('click', function (event) {
 178     event.preventDefault();
 179     collectionsSlider.slick('slickNext');
 180   });
 181
 182   collectionsPrevSlide.on('click', function (event) {
 183     event.preventDefault();
 184     collectionsSlider.slick('slickPrev');
 185   });
 186
 187   let newBooksSlider = $('.js-new-books-slider .l-books');
 188   let newBooksNextSlide = $('.js-new-books-slider .js-next-slide');
 189   let newBooksPrevSlide = $('.js-new-books-slider .js-prev-slide');
 190
 191   newBooksSlider.slick({
 192     slidesToScroll: 1,
 193     slidesToShow: 5,
 194     infinite: false,
 195     dots: false,
 196     arrows: false,
 197     autoplay: false,
 198     responsive: [
 199       {
 200         breakpoint: 768,
 201         settings: {
 202           centerMode: false,
 203           slidesToShow: 2
 204         }
 205       }
 206     ]
 207   });
 208
 209   newBooksNextSlide.on('click', function (event) {
 210     event.preventDefault();
 211     newBooksSlider.slick('slickNext');
 212   });
 213
 214   newBooksPrevSlide.on('click', function (event) {
 215     event.preventDefault();
 216     newBooksSlider.slick('slickPrev');
 217   });
 218 })();
 219
 220 // Quotes slider
 221 (function () {
 222   let slider = $('.l-author__quotes__slider');
 223
 224   slider.slick({
 225     slidesToScroll: 1,
 226     slidesToShow: 1,
 227     infinite: true,
 228     dots: true,
 229     arrows: false,
 230     autoplay: true,
 231     autoplaySpeed: 2500
 232   });
 233
 234
 235   let sliderHomepage = $('.l-quotes');
 236   sliderHomepage.slick({
 237     slidesToShow: 1,
 238     centerMode: true,
 239     centerPadding: '250px',
 240     infinite: true,
 241     dots: true,
 242     arrows: false,
 243     autoplay: true,
 244     autoplaySpeed: 2500,
 245     responsive: [
 246       {
 247         breakpoint: 768,
 248         settings: {
 249           centerMode: false,
 250           slidesToShow: 1
 251         }
 252       }
 253     ]
 254   });
 255
 256 })();
 257
 258 // Text overlay toggler
 259 (function () {
 260   let overlays = $('.l-article__overlay');
 261   let button = $('.l-article__read-more');
 262
 263   overlays.each(function () {
 264     let maxHeight = $(this).attr('data-max-height');
 265     if($(this).outerHeight() > maxHeight) {
 266       $(this).css({'maxHeight': maxHeight+'px'}).addClass('is-active');
 267     } else {
 268       $(this).next('.l-article__read-more').hide();
 269     }
 270   });
 271
 272   button.on('click', function() {
 273     let dataLabel = $(this).attr('data-label');
 274     let dataAction = $(this).attr('data-action');
 275     $(this).parent().find('.l-article__overlay').toggleClass('is-clicked');
 276     if($(this).text() === dataLabel) {
 277       $(this).text(dataAction);
 278     } else {
 279       $(this).text(dataLabel);
 280     }
 281   });
 282 })();
 283
 284 //Zmieniamy się popup
 285 (function() {
 286   let $change = $('.l-change-pop');
 287   function change() {
 288     if(localStorage.getItem('change') === null) {
 289       $change.addClass('show');
 290     } else {
 291       $change.remove();
 292       return false;
 293     }
 294
 295     $change.on('click', '.l-change-pop__close', function () {
 296       $change.slideUp();
 297       localStorage.setItem('change', 'showed');
 298     });
 299   }
 300
 301   if($change.length) { change(); }
 302
 303
 304     function quit_experiment() {
 305         document.cookie = 'EXPERIMENT_layout=off; path=/; max-age=31536000';
 306         window.location.reload(true);
 307     }
 308     $(".quit-experiment").click(quit_experiment);
 309
 310 })();
 311
 312 (function() {
 313     $('.l-checkout__payments__box button').on('click', function() {
 314         let container = $(this).closest('.l-checkout__payments');
 315         $('input', container).val($(this).val());
 316         $('.is-active', container).removeClass('is-active');
 317         $(this).closest('.l-checkout__payments__box').addClass('is-active');
 318         $('#kwota').val('');
 319         return false;
 320     });
 321
 322 })();
 323
 324
 325 //Copy function
 326 (function() {
 327   let $copy = $('.js-copy');
 328
 329   $copy.on('click', function() {
 330     let $copyText = $(this).closest('.l-checkout__info__item').find('input');
 331     $copyText.select();
 332     document.execCommand('copy');
 333   });
 334 })();