X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/fd1a9915dd65789cccf27041a1f01cd4077273fc..67c985af477f2a622a5c3ce81afd7cb424326871:/src/wolnelektury/static/2021/scripts/main.js diff --git a/src/wolnelektury/static/2021/scripts/main.js b/src/wolnelektury/static/2021/scripts/main.js index 1ffea17c8..696a5fb00 100644 --- a/src/wolnelektury/static/2021/scripts/main.js +++ b/src/wolnelektury/static/2021/scripts/main.js @@ -8,11 +8,13 @@ if(!$(this).hasClass('is-active')) { $(this).addClass('is-active'); menu.addClass('is-open'); + $('body').addClass('is-open'); button.find('.bar').addClass('animate'); menuLinks.attr('tabindex', 0); } else { $(this).removeClass('is-active'); menu.removeClass('is-open'); + $('body').removeClass('is-open'); button.find('.bar').removeClass('animate'); menuLinks.attr('tabindex', -1); } @@ -22,13 +24,45 @@ if (e.keyCode === 27) { button.removeClass('is-active'); menu.removeClass('is-open'); + $('body').removeClass('is-open'); button.find('.bar').removeClass('animate'); menuLinks.attr('tabindex', -1); } }); })(); -/// Ebook/Audiobook Btns +// User menu. +(function() { + let button = $('.l-navigation__actions .user'); + let menu = $('#user-menu'); + let menuLinks = menu.find('a'); + + button.on('click', function() { + if (!menu.hasClass('is-open')) { + menu.addClass('is-open'); + menuLinks.attr('tabindex', 0); + } else { + menu.removeClass('is-open'); + menuLinks.attr('tabindex', -1) + } + return false; + }); + + $(document).keyup(function(e) { + if (e.keyCode === 27) { + menu.removeClass('is-open'); + menuLinks.attr('tabindex', -1); + } + }); + + $(document).click(function() { + menu.removeClass('is-open'); + menuLinks.attr('tabindex', -1); + }); + +})(); + +// Ebook/Audiobook Btns (function() { let button = $('.c-media__btn button:not(.l-button--media--full)'); let popupLayer = $('.c-media__popup'); @@ -78,6 +112,148 @@ }); })(); +// Homepage books sliders +(function () { + let shelfSlider = $('.l-your-books__shelf .l-books'); + let shelfNextSlide = $('.l-your-books__shelf .js-next-slide'); + let shelfPrevSlide = $('.l-your-books__shelf .js-prev-slide'); + let shelfCollapse = $('.l-your-books__shelf .js-collapse'); + + shelfSlider.slick({ + slidesToScroll: 1, + slidesToShow: 4, + infinite: false, + dots: false, + arrows: false, + autoplay: false, + responsive: [ + { + breakpoint: 768, + settings: { + centerMode: false, + slidesToShow: 1 + } + } + ] + }); + + shelfNextSlide.on('click', function (event) { + event.preventDefault(); + shelfSlider.slick('slickNext'); + }); + + shelfPrevSlide.on('click', function (event) { + event.preventDefault(); + shelfSlider.slick('slickPrev'); + }); + + shelfCollapse.on('click', function (event) { + event.preventDefault(); + shelfSlider.slick('slickPrev'); + }); + + + $('.js-collections').each(function() { + //return; + let collectionsSlider = $('.l-books', this); + if (collectionsSlider.children().length < 2) return; + + // remove flexbox + collectionsSlider.css('display', 'block'); + + let collectionsNextSlide = $('.js-next-slide', this); + let collectionsPrevSlide = $('.js-prev-slide', this); + + collectionsSlider.slick({ + //prevArrow, nextArrow, + + slidesToScroll: 1, + slidesToShow: 1, + infinite: false, + dots: false, + arrows: false, + autoplay: false, + + swipeToSlide: true, + centerMode: false, + mobileFirst: true, + responsive: [ + { + breakpoint: 360 - .01, + settings: { + slidesToShow: 2, + } + }, + { + breakpoint: 520 - .01, + settings: { + slidesToShow: 3 + } + }, + { + breakpoint: 680 - .01, + settings: { + slidesToShow: 4 + } + }, + { + breakpoint: 840 - .01, + settings: { + slidesToShow: 5 + } + }, + { + breakpoint: 1172 - .01, + settings: { + slidesToShow: 5, + variableWidth: true, + } + }, + ] + }); + + collectionsNextSlide.on('click', function (event) { + event.preventDefault(); + collectionsSlider.slick('slickNext'); + }); + + collectionsPrevSlide.on('click', function (event) { + event.preventDefault(); + collectionsSlider.slick('slickPrev'); + }); + }); + let newBooksSlider = $('.js-new-books-slider .l-books'); + let newBooksNextSlide = $('.js-new-books-slider .js-next-slide'); + let newBooksPrevSlide = $('.js-new-books-slider .js-prev-slide'); + + newBooksSlider.slick({ + slidesToScroll: 1, + slidesToShow: 5, + infinite: false, + dots: false, + arrows: false, + autoplay: false, + responsive: [ + { + breakpoint: 768, + settings: { + centerMode: false, + slidesToShow: 2 + } + } + ] + }); + + newBooksNextSlide.on('click', function (event) { + event.preventDefault(); + newBooksSlider.slick('slickNext'); + }); + + newBooksPrevSlide.on('click', function (event) { + event.preventDefault(); + newBooksSlider.slick('slickPrev'); + }); +})(); // Quotes slider (function () { @@ -90,10 +266,46 @@ dots: true, arrows: false, autoplay: true, - autoplaySpeed: 2500 + autoplaySpeed: 3000 + }); + + + let sliderHomepage = $('.l-quotes'); + sliderHomepage.slick({ + slidesToShow: 1, + centerMode: false, + infinite: true, + dots: true, + arrows: false, + autoplay: true, + autoplaySpeed: 4000, + }); + +})(); + + + + +// Carousel +(function () { + let slider = $('.p-homepage__info__box--carousel'); + + slider.slick({ + slidesToScroll: 1, + slidesToShow: 1, + infinite: true, + dots: true, + arrows: false, + autoplay: true, + autoplaySpeed: 5000 }); + + + })(); + + // Text overlay toggler (function () { let overlays = $('.l-article__overlay'); @@ -120,34 +332,6 @@ }); })(); -//Zmieniamy się popup -(function() { - let $change = $('.l-change-pop'); - function change() { - if(localStorage.getItem('change') === null) { - $change.addClass('show'); - } else { - $change.remove(); - return false; - } - - $change.on('click', '.l-change-pop__close', function () { - $change.slideUp(); - localStorage.setItem('change', 'showed'); - }); - } - - if($change.length) { change(); } - - - function quit_experiment() { - document.cookie = 'EXPERIMENT_layout=off; path=/; max-age=31536000'; - window.location.reload(true); - } - $(".quit-experiment").click(quit_experiment); - -})(); - (function() { $('.l-checkout__payments__box button').on('click', function() { let container = $(this).closest('.l-checkout__payments'); @@ -171,3 +355,181 @@ document.execCommand('copy'); }); })(); + + + +// Likes +(function() { + + ids = new Set(); + $(".icon-like").each( + (i, e)=>{ + ids.add($(e).attr('data-book')); + } + ); + ids = [...ids].join(','); + + state = { + liked: [], + }; + + $(document).on('click', '.icon-like', function(e) { + e.preventDefault(); + let liked = $(this).hasClass('icon-liked'); + $btn = $(this); + if (liked) { + $.post({ + url: '/ludzie/lektura/' + $(this).attr('data-book-slug') + '/nie_lubie/', + data: {'csrfmiddlewaretoken': $('[name=csrfmiddlewaretoken]').val()}, + success: function() { + delete state.liked[$btn.attr('data-book')]; + updateLiked($btn); + } + }) + } else { + $.post({ + url: '/ludzie/lektura/' + $(this).attr('data-book-slug') + '/lubie/', + data: {'csrfmiddlewaretoken': $('[name=csrfmiddlewaretoken]').val()}, + success: function() { + state.liked[$btn.attr('data-book')] = []; + updateLiked($btn); + }, + error: function(e) { + if (e.status == 403) { + $('#login-link').click(); + } + }, + }); + } + }) + + // TODO: DYNAMICALLY ADD + $(".add-set-tag input[name=name]").autocomplete({ + source: '/ludzie/moje-tagi/', + }).on('autocompleteopen', function() { + $(this).closest('article').addClass('ac-hover'); + }).on('autocompleteclose', function() { + $(this).closest('article').removeClass('ac-hover'); + }); + $(".add-set-tag").on("submit", function(e) { + e.preventDefault(); + let $form = $(this); + $.post({ + url: $form.attr("action"), + data: $form.serialize(), + success: (data) => { + updateFromData(data); + updateLikedAll(); + $('input[name=name]', $form).val(''); + } + }); + }) + + $(document).on("click", ".sets .close", function() { + let bookId = $(this).closest("[data-book]").attr('data-book'); + $.post({ + url: '/ludzie/usun-tag/', + data: { + csrfmiddlewaretoken: $("[name=csrfmiddlewaretoken]").val(), + book: bookId, + slug: $(this).parent().attr('data-set'), + }, + success: (data) => { + updateFromData(data); + updateLikedAll(); + } + }); + }) + + + function refreshAll(ids) { + $.ajax('/ludzie/ulubione/?ids=' + ids, { + success: function(result) { + updateFromData(result); + updateLikedAll(); + }, + }); + } + refreshAll(ids); + $.refreshLikes = refreshAll; + + function updateFromData(data) { + for (pk in data) { + if (data[pk] === null) { + delete state.liked[pk]; + } else { + state.liked[pk] = data[pk]; + } + } + } + + function updateLikedAll() { + $(".icon-like").each( + (i, e) => { + updateLiked(e); + } + ) + } + + function updateLiked(e) { + let bookId = $(e).attr('data-book'); + let liked = bookId in state.liked; + $(e).toggleClass('icon-liked', liked); + let $bookContainer = $('.book-container-' + bookId); + $bookContainer.toggleClass('book-liked', liked); + let $sets = $(".sets", $bookContainer); + $sets.empty(); + $.each(state.liked[bookId], (i,e) => { + let $set = $(""); + $set.attr("data-set", e.slug); + let $setA = $("").appendTo($set); + $setA.attr("href", e.url); + $setA.text(e.name); + let $setX = $("").appendTo($set); + $sets.append($set); + }); + } + +})(); + + + +// Toggle a class on long press. +(function() { + const TIME = 250; + let timer; + + $("[data-longpress]").on("touchstart", (e) => { + $e = $(e.currentTarget); + timer = setTimeout(() => { + $e.toggleClass($e.attr('data-longpress')); + }, TIME); + }); + + $("[data-longpress]").on("touchend", () => { + clearTimeout(timer); + }); +})(); + + + +// Update search form filters. +(function() { + $('.j-form-auto').each(function() { + let $form = $(this); + $('input', $form).change(function() {$form.submit()}); + $('select', $form).change(function() {$form.submit()}); + $('textarea', $form).change(function() {$form.submit()}); + }); + + + // experiments + $(".experiment input").on('change', function() { + let name = $(this).attr('name'); + let val = $(this).val(); + document.cookie = 'EXPERIMENT_' + name + '=' + val + '; path=/; max-age=31536000'; + window.location.reload(true); + }); + + +})();