wickes-css2 2.105.0-develop.7 → 2.105.0-develop.8

package/src/js/components/general/accordion.js

@@ -1,46 +1,35 @@
 var Wick = Wick || {};
-Wick.Accordion = (function () {
-    var accordionRoot = '.accordion',
-        accordionToggler = '.accordion__header',
-        accordionIcon = '.accordion__action',
-        accordionContent = '.accordion__content',
-        collapsed = 'accordion_collapsed',
-        $asideAccordion = $('.aside-accordion .js-toggle-aside-accordion');
-
-    function getTriggerSelector($acc) {
-        return $acc.attr('data-action-element') === 'icon' ? accordionIcon : accordionToggler;
-    }
-
-    function onAccordionClick(e) {
-        var $trigger = $(e.currentTarget);
-        var $acc = $trigger.closest(accordionRoot);
-        if (!$acc.length) return;
-
-        var triggerSel = getTriggerSelector($acc);
-
-        if (!$trigger.is(triggerSel)) return;
-
-        $acc.toggleClass(collapsed);
-        $acc.children(accordionContent).stop(true, true).slideToggle(200);
-    }
-
-    function init() {
-        $(document)
-            .off('click.wickAccordion', accordionToggler + ',' + accordionIcon)
-            .on('click.wickAccordion', accordionToggler + ',' + accordionIcon, onAccordionClick);
-
-        $asideAccordion.off('click.wickAsideAccordion').on('click.wickAsideAccordion', function () {
-            if (window.matchMedia('(min-width: 992px)').matches) {
-                if ($(this).text().toLowerCase() !== 'useful links') {
-                    $(this)
-                        .closest('.aside-nav2__holder')
-                        .toggleClass('is-active')
-                        .find('.aside-nav2__list')
-                        .slideToggle(250);
-                }
-            }
-        });
-    }
-
-    init();
+Wick.Accordion = (function(){
+  var $accordion = $('.accordion'),
+    accordionToggler = '.accordion__header',
+    accordionIcon = '.accordion__action',
+    accordionContent = '.accordion__content',
+    collapsed = 'accordion_collapsed',
+    $asideAccordion = $('.aside-accordion .js-toggle-aside-accordion');
+  var bindEvents = function (index, element) {
+    var $acc = $(element);
+
+    var accordionTrigger = $acc.attr('data-action-element') === 'icon' ? accordionIcon : accordionToggler
+    $acc.find(accordionTrigger).on('click', function(){
+      $acc.toggleClass(collapsed);
+      $acc.children(accordionContent).slideToggle(200);
+    });
+  };
+
+  var init = function () {
+    $accordion.each(bindEvents);
+
+    $asideAccordion.click(function() {
+      if (window.matchMedia("(min-width: 992px)").matches) {
+          if ($(this).text().toLowerCase() != 'useful links') {
+              $(this).closest('.aside-nav2__holder')
+                     .toggleClass('is-active')
+                     .find('.aside-nav2__list')
+                     .slideToggle(250);
+          }
+      }
+    });
+  }
+
+  init();
 })();

package/src/js/components/general/cart-slider.js

@@ -1,23 +1,20 @@
 const cartSliderHTML = '<div class="custom-slider just-added d-none"></div>';
 
 createPopupSlider({
-    type: 'cart',
-    sliderSelector: '.custom-slider.just-added',
-    onAppendEvent: 'productAddedToCart',
-    onAppend: function (event, { showSlider, handleScroll, el }) {
-        if (!$('.custom-slider.just-added').length) {
-            $('body').append(cartSliderHTML);
-        }
-        const htmlContent = event.detail.html;
-        $(el.slider).append(htmlContent);
-        showSlider();
-        Wick.MiniBasketSliderFE.isMiniBasketLoaded = false;
-        $(el.sliderWrap).on(
-            'scroll',
-            _.debounce(() => handleScroll(el.sliderWrap), 100)
-        );
-    },
-    onClose: function () {
-        Wick.MiniBasketSliderFE.cartEntries = [];
-    },
+  type: 'cart',
+  sliderSelector: '.custom-slider.just-added',
+  onAppendEvent: 'productAddedToCart',
+  onAppend: function (event, { showSlider, handleScroll, el }) {
+    if (!$('.custom-slider.just-added').length) {
+      $('body').append(cartSliderHTML);
+    }
+    const htmlContent = event.detail.html;
+    $(el.slider).append(htmlContent);
+    showSlider();
+    Wick.MiniBasketSliderFE.isMiniBasketLoaded = false;
+    $(el.sliderWrap).on('scroll', _.debounce(() => handleScroll(el.sliderWrap), 100));
+  },
+  onClose: function () {
+    Wick.MiniBasketSliderFE.cartEntries = [];
+  }
 });

package/src/js/components/general/create-popup-slider.js

@@ -1,194 +1,199 @@
 function createEvent(eventName, payload, eventDetail) {
-    return new CustomEvent(eventName, {
-        detail: {
-            payload,
-            resolve: eventDetail.resolve,
-            reject: eventDetail.reject,
-        },
-    });
+  return new CustomEvent(eventName, {
+    detail: {
+      payload,
+      resolve: eventDetail.resolve,
+      reject: eventDetail.reject,
+    },
+  });
 }
 
-/* eslint-disable no-unused-vars -- used globally */
 function createPopupSlider({ type, sliderSelector, onAppendEvent, onAppend, onClose }) {
-    const events = {
-        CLOSE_JUST_ADDED: 'CLOSE_JUST_ADDED',
-        CLOSE_MINI_BASKET: 'CLOSE_MINI_BASKET',
-    };
-
-    const el = {
-        $body: $('body'),
-        slider: sliderSelector,
-        sliderWrap: `${sliderSelector} .custom-slider__wrap`,
-        sliderWrapScroll: 'custom-slider__wrap--scroll',
-        footer: '.custom-slider__footer',
-        closePopup: `${sliderSelector} .close-popup`,
-        $stickyWrapper: $('.sticky-wrapper'),
-        $headerWrapper: $('.header-wrapper'),
-        scrollDisable: 'slider-scroll-disable',
-        footerFixed: 'footer-fixed',
-        btnMiniBasket: '.header-minicart__btn',
-    };
-
-    function isSmallBreakpoint() {
-        return Wick.Responsive.getCurrentBreakpoint() === 'down-sm';
-    }
-
-    function getAnimationClass() {
-        return isSmallBreakpoint() ? 'bottom-to-top' : 'right-to-left';
+  const events = {
+    CLOSE_JUST_ADDED: 'CLOSE_JUST_ADDED',
+    CLOSE_MINI_BASKET: 'CLOSE_MINI_BASKET'
+  }
+
+  const el = {
+    $body: $('body'),
+    slider: sliderSelector,
+    sliderWrap: `${sliderSelector} .custom-slider__wrap`,
+    sliderWrapScroll: 'custom-slider__wrap--scroll',
+    footer: '.custom-slider__footer',
+    closePopup: `${sliderSelector} .close-popup`,
+    $stickyWrapper: $('.sticky-wrapper'),
+    $headerWrapper: $('.header-wrapper'),
+    scrollDisable: 'slider-scroll-disable',
+    footerFixed: 'footer-fixed',
+    btnMiniBasket: '.header-minicart__btn',
+  };
+
+  function isSmallBreakpoint() {
+    return Wick.Responsive.getCurrentBreakpoint() === 'down-sm';
+  }
+
+  function getAnimationClass() {
+    return isSmallBreakpoint() ? 'bottom-to-top' : 'right-to-left';
+  }
+
+  function adjustHeight() {
+    const stickyWrapperHeight = el.$stickyWrapper.outerHeight() || 0;
+    const headerWrapperHeight = el.$headerWrapper.outerHeight() || 0;
+
+    const totalHeight = stickyWrapperHeight + headerWrapperHeight;
+    $(el.slider).css('height', `calc(100% - ${totalHeight}px)`);
+  }
+
+  function hideSlider() {
+    $(el.slider).removeClass('show');
+
+    setTimeout(() => {
+      el.$body.removeClass(el.scrollDisable);
+
+      if (!isSmallBreakpoint()) {
+        el.$body.css('padding-right', '');
+      }
+
+      if (type === 'cart') {
+        $(el.slider)
+          .removeAttr('style')
+          .empty();
+      }
+
+      $(el.slider).addClass('d-none');
+    }, 400);
+  }
+
+  function handleScroll(sliderWrap) {
+    const scrollHeight = $(sliderWrap)[0].scrollHeight;
+    const scrollTop = $(sliderWrap).scrollTop();
+    const clientHeight = $(sliderWrap)[0].clientHeight;
+    const scrollBottom = scrollHeight - scrollTop - clientHeight;
+
+    if (scrollBottom > 75) {
+      $(el.footer).addClass(el.footerFixed);
+      $(sliderWrap).addClass(el.sliderWrapScroll);
+    } else {
+      $(el.footer).removeClass(el.footerFixed);
+      $(sliderWrap).removeClass(el.sliderWrapScroll);
     }
+  }
 
-    function adjustHeight() {
-        const stickyWrapperHeight = el.$stickyWrapper.outerHeight() || 0;
-        const headerWrapperHeight = el.$headerWrapper.outerHeight() || 0;
-
-        const totalHeight = stickyWrapperHeight + headerWrapperHeight;
-        $(el.slider).css('height', `calc(100% - ${totalHeight}px)`);
+  function showSlider() {
+    if (isSmallBreakpoint()) {
+      adjustHeight();
     }
 
-    function hideSlider() {
-        $(el.slider).removeClass('show');
+    const animationClass = getAnimationClass();
+    const scrollBarWidth = window.innerWidth - document.documentElement.clientWidth;
+    $(el.slider)
+      .removeClass('bottom-to-top right-to-left')
+      .addClass(animationClass);
 
-        setTimeout(() => {
-            el.$body.removeClass(el.scrollDisable);
+    $('html, body').animate({ scrollTop: 0 }, 300, () => {
+      Wick.Backdrop.show();
+      $(el.slider).removeClass('d-none');
 
-            if (!isSmallBreakpoint()) {
-                el.$body.css('padding-right', '');
-            }
-
-            if (type === 'cart') {
-                $(el.slider).removeAttr('style').empty();
-            }
-
-            $(el.slider).addClass('d-none');
-        }, 400);
-    }
+      setTimeout(() => {
+        $(el.slider).addClass('show');
+        handleScroll(el.sliderWrap);
+        el.$body.addClass(el.scrollDisable);
 
-    function handleScroll(sliderWrap) {
-        const scrollHeight = $(sliderWrap)[0].scrollHeight;
-        const scrollTop = $(sliderWrap).scrollTop();
-        const clientHeight = $(sliderWrap)[0].clientHeight;
-        const scrollBottom = scrollHeight - scrollTop - clientHeight;
-
-        if (scrollBottom > 75) {
-            $(el.footer).addClass(el.footerFixed);
-            $(sliderWrap).addClass(el.sliderWrapScroll);
-        } else {
-            $(el.footer).removeClass(el.footerFixed);
-            $(sliderWrap).removeClass(el.sliderWrapScroll);
+        if (!isSmallBreakpoint()) {
+          el.$body.css('padding-right', `${scrollBarWidth}px`);
         }
-    }
-
-    function showSlider() {
-        if (isSmallBreakpoint()) {
-            adjustHeight();
+      }, 100);
+    });
+  }
+
+  function handleSliderClose(eventName) {
+    return new Promise((resolve, reject) => {
+      const eventDetail = {resolve, reject};
+      const event = createEvent(eventName, {}, eventDetail);
+      window.dispatchEvent(event);
+    })
+      .then(() => {})
+      .catch((error) => {
+        console.error(error);
+      })
+      .finally(() => {
+        hideSlider();
+        Wick.Backdrop.hide();
+        if (typeof onClose === 'function') {
+          onClose();
         }
+      })
+  }
 
-        const animationClass = getAnimationClass();
-        const scrollBarWidth = window.innerWidth - document.documentElement.clientWidth;
-        $(el.slider).removeClass('bottom-to-top right-to-left').addClass(animationClass);
-
-        $('html, body').animate({ scrollTop: 0 }, 300, () => {
-            Wick.Backdrop.show();
-            $(el.slider).removeClass('d-none');
+  function bindClosePopup() {
+    $(document).on('click', el.closePopup, async () => {
+      if (type === 'cart') {
+        await handleSliderClose(events.CLOSE_JUST_ADDED);
+      }
 
-            setTimeout(() => {
-                $(el.slider).addClass('show');
-                handleScroll(el.sliderWrap);
-                el.$body.addClass(el.scrollDisable);
+      if (type === 'miniBasket') {
+        await handleSliderClose(events.CLOSE_MINI_BASKET)
+      }
 
-                if (!isSmallBreakpoint()) {
-                    el.$body.css('padding-right', `${scrollBarWidth}px`);
-                }
-            }, 100);
-        });
+      hideSlider();
+      Wick.Backdrop.hide();
+    });
+  }
+
+  function handleResize() {
+    const animationClass = getAnimationClass();
+
+    if ($(el.slider).hasClass('show')) {
+      $(el.slider)
+        .removeClass('bottom-to-top right-to-left')
+        .addClass(animationClass);
+
+      if (isSmallBreakpoint()) {
+        adjustHeight();
+      } else {
+        $(el.slider).css('height', '');
+        Wick.Backdrop.show();
+      }
     }
-
-    function handleSliderClose(eventName) {
-        return new Promise((resolve, reject) => {
-            const eventDetail = { resolve, reject };
-            const event = createEvent(eventName, {}, eventDetail);
-            window.dispatchEvent(event);
-        })
-            .then(() => {})
-            .catch((error) => {
-                console.error(error);
-            })
-            .finally(() => {
-                hideSlider();
-                Wick.Backdrop.hide();
-                if (typeof onClose === 'function') {
-                    onClose();
-                }
-            });
+  }
+
+  function shouldClosePopup(event) {
+    const $target = $(event.target);
+    return (
+      !$target.closest(el.slider).length &&
+      !$target.closest(el.closePopup).length &&
+      $(el.slider).hasClass('show')
+    );
+  }
+
+  function init() {
+    bindClosePopup();
+
+    if (onAppendEvent && onAppend) {
+      window.addEventListener(onAppendEvent, (event) => {
+        onAppend(event, { showSlider, handleScroll, el });
+      });
     }
 
-    function bindClosePopup() {
-        $(document).on('click', el.closePopup, async () => {
-            if (type === 'cart') {
-                await handleSliderClose(events.CLOSE_JUST_ADDED);
-            }
-
-            if (type === 'miniBasket') {
-                await handleSliderClose(events.CLOSE_MINI_BASKET);
-            }
+    $(window).on('resize', _.debounce(handleResize, 100));
 
-            hideSlider();
-            Wick.Backdrop.hide();
-        });
-    }
-
-    function handleResize() {
-        const animationClass = getAnimationClass();
-
-        if ($(el.slider).hasClass('show')) {
-            $(el.slider).removeClass('bottom-to-top right-to-left').addClass(animationClass);
-
-            if (isSmallBreakpoint()) {
-                adjustHeight();
-            } else {
-                $(el.slider).css('height', '');
-                Wick.Backdrop.show();
-            }
+    $('body').on('click', async (event) => {
+      if (shouldClosePopup(event)) {
+        if (type === 'cart') {
+          await handleSliderClose(events.CLOSE_JUST_ADDED);
         }
-    }
-
-    function shouldClosePopup(event) {
-        const $target = $(event.target);
-        return (
-            !$target.closest(el.slider).length &&
-            !$target.closest(el.closePopup).length &&
-            $(el.slider).hasClass('show')
-        );
-    }
 
-    function init() {
-        bindClosePopup();
-
-        if (onAppendEvent && onAppend) {
-            window.addEventListener(onAppendEvent, (event) => {
-                onAppend(event, { showSlider, handleScroll, el });
-            });
+        if (type === 'miniBasket') {
+          await handleSliderClose(events.CLOSE_MINI_BASKET)
         }
+      }
+    });
+  }
 
-        $(window).on('resize', _.debounce(handleResize, 100));
-
-        $('body').on('click', async (event) => {
-            if (shouldClosePopup(event)) {
-                if (type === 'cart') {
-                    await handleSliderClose(events.CLOSE_JUST_ADDED);
-                }
-
-                if (type === 'miniBasket') {
-                    await handleSliderClose(events.CLOSE_MINI_BASKET);
-                }
-            }
-        });
-    }
-
-    init();
+  init();
 
-    return {
-        showSlider,
-        handleScroll,
-    };
+  return {
+    showSlider,
+    handleScroll,
+  };
 }

package/src/js/components/general/search-filter.js

@@ -0,0 +1,21 @@
+var Wick = Wick || {};
+Wick.Overlay = (function () {
+  var filterMobile = $('.filter-results_mobile');
+  $('#open-overlay').click(function (event) {
+    event.preventDefault();
+    $('body').addClass('is-filters-visible');
+    filterMobile.toggleClass('show');
+  });
+
+  $('#close-overlay, .filter-results__btn-close').click(function (event) {
+    event.preventDefault();
+    if (filterMobile.hasClass('show')) {
+      $('body').removeClass('is-filters-visible');
+      filterMobile.removeClass('show');
+    }
+  });
+
+  $('.filter-results_desktop .filter__item input[type="checkbox"]').click(function () {
+    $(this).closest('form').submit();
+  });
+})();

package/src/js/components/share-project-list.js

@@ -0,0 +1,53 @@
+var Wick = Wick || {};
+Wick.ShareProjectList = (function () {
+    
+    function init() {
+        var shoppingListLinkInput = $('#share-list-modal #shopping-list-link'),
+            shoppingListLinkEl = shoppingListLinkInput[0],
+            linkContainer = $('#copy-link'),
+            actualLink = linkContainer.find('a'),
+            copyClass = 'copy-link_hovered';
+        
+        actualLink.click(function (e) {
+            e.preventDefault();
+        });
+        
+        linkContainer.click(function () {
+            if (navigator.userAgent.match(/TradeProMobile_iOS|DIYMobile_iOS/i)) {
+                iosCopyToClipboard(shoppingListLinkInput);
+            } else if (navigator.userAgent.match(/ipad|ipod|iphone/i)) {
+                shoppingListLinkEl.select();
+                shoppingListLinkEl.setSelectionRange(0, 999999);
+            } else {
+                shoppingListLinkEl.select();
+            }
+
+            document.execCommand("copy");
+            actualLink.addClass(copyClass);
+        });
+
+        shoppingListLinkInput.click(function () {
+            linkContainer.click();
+            actualLink.removeClass(copyClass);
+        });
+    }
+
+    function iosCopyToClipboard($input) {
+        var el = $input.get(0);
+        var editable = el.contentEditable;
+        var readOnly = el.readOnly;
+
+        el.contentEditable = true;
+        el.readOnly = false;
+        var range = document.createRange();
+        range.selectNodeContents(el);
+        var sel = window.getSelection();
+        sel.removeAllRanges();
+        sel.addRange(range);
+        el.setSelectionRange(0, 999999);
+        el.contentEditable = editable;
+        el.readOnly = readOnly;
+    }
+    
+    init();
+})();