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

package/src/js/page/filters/plp-filters.js

@@ -1,256 +0,0 @@
-var Wick = window.Wick || {};
-
-Wick.PLPFilters = {
-    ROOT_WRAPPER:
-        '.page-KitchenPLPPage, .products-list-page:not(.page-responsiveThematicProductListPage)',
-    ROOT: '.plp-filters',
-    GROUP: '.plp-filters__group',
-    APPLY_BTN: '.plp-filters__apply',
-
-    INPUTS: '.filter-card__checkbox, .swatch__checkbox, .checkbox__input',
-
-    appliedState: {},
-
-    init() {
-        // 1) initialize submodules
-        Wick.PLPFiltersPanel.init();
-        Wick.PLPFiltersMobile.init();
-
-        // 2) initial state with URL
-        const root = $(Wick.PLPFilters.ROOT);
-        const rootWrapper = $(Wick.PLPFilters.ROOT_WRAPPER);
-        if (!root.length) {
-            return;
-        }
-
-        Wick.PLPFilters.appliedState = Wick.PLPFilters.readStateFromURL(rootWrapper);
-        Wick.PLPFilters.setDOMFromState(rootWrapper, Wick.PLPFilters.appliedState);
-
-        // 3) chips
-        Wick.PLPChips.bindChipActions(rootWrapper);
-
-        // 4) apply (desktop "View results")
-        $(document).on('click', Wick.PLPFilters.APPLY_BTN, Wick.PLPFilters.applyFilters);
-
-        // 5) primary render
-        Wick.PLPFilters.updateSelectedUI(rootWrapper);
-    },
-
-    // ===== URL <-> STATE
-    readStateFromURL(rootWrapper) {
-        const url = new URL(window.location.href);
-        const params = url.searchParams;
-        const state = {};
-
-        const groupsMeta = Wick.PLPUtils.getGroupsMeta(rootWrapper, Wick.PLPFilters.GROUP);
-        if (!groupsMeta.length) {
-            return state;
-        }
-
-        const byDomName = {};
-        groupsMeta.forEach((m) => {
-            byDomName[m.domName] = m;
-        });
-
-        for (const [key, val] of params.entries()) {
-            const meta = byDomName[key];
-            if (!meta) {
-                continue;
-            }
-
-            const values = val
-                .split(',')
-                .map((v) => v.trim())
-                .filter(Boolean);
-            if (!values.length) {
-                continue;
-            }
-
-            values.forEach((want) => {
-                const inp = meta.group
-                    .find(Wick.PLPFilters.INPUTS)
-                    .filter(function () {
-                        return $(this).val() === want;
-                    })
-                    .first();
-
-                if (!inp.length) {
-                    return;
-                }
-
-                const originalValue = inp.val();
-                if (!state[meta.domName]) {
-                    state[meta.domName] = new Set();
-                }
-                state[meta.domName].add(originalValue);
-            });
-        }
-
-        return state;
-    },
-
-    writeStateToURL(state) {
-        const url = new URL(window.location.href);
-
-        const groupsMeta = Wick.PLPUtils.getGroupsMeta(
-            $(Wick.PLPFilters.ROOT_WRAPPER),
-            Wick.PLPFilters.GROUP
-        );
-        const groupKeysDecoded = new Set(groupsMeta.map((m) => m.domName));
-
-        const pairs = [];
-        for (const [k, v] of url.searchParams.entries()) {
-            if (!groupKeysDecoded.has(k)) {
-                pairs.push(`${encodeURIComponent(k)}=${encodeURIComponent(v)}`);
-            }
-        }
-
-        groupsMeta.forEach((meta) => {
-            const set = state[meta.domName];
-            if (!set || !set.size) return;
-
-            const keyEnc = encodeURIComponent(meta.domName);
-            const valueEnc = Array.from(set)
-                .map((v) => encodeURIComponent(v))
-                .join(',');
-            pairs.push(`${keyEnc}=${valueEnc}`);
-        });
-
-        url.search = pairs.join('&');
-
-        window.location.href = url.origin + url.pathname + url.search;
-    },
-
-    // set checkboxes according to state (both for desktop and modal)
-    setDOMFromState(rootWrapper, state) {
-        rootWrapper.find(Wick.PLPFilters.INPUTS).prop('checked', false);
-
-        Object.keys(state).forEach((groupDomName) => {
-            state[groupDomName].forEach((originalValue) => {
-                const want = originalValue;
-
-                const cand = rootWrapper
-                    .find(Wick.PLPFilters.INPUTS)
-                    .filter(function () {
-                        const i = $(this);
-                        const valMatch = i.val() === want;
-                        const g = i.closest(Wick.PLPFilters.GROUP);
-                        const groupMatch = g.length ? g.attr('data-filter') === groupDomName : true;
-                        return valMatch && groupMatch;
-                    })
-                    .first();
-
-                if (cand.length) {
-                    cand.prop('checked', true);
-                }
-            });
-        });
-    },
-
-    collectStateFromDOM(rootWrapper) {
-        const state = {};
-        rootWrapper
-            .find(Wick.PLPFilters.INPUTS)
-            .filter(':checked')
-            .each((_, el) => {
-                const input = $(el);
-                const group = input.closest(Wick.PLPFilters.GROUP);
-                const groupDomName = group.attr('data-filter') || '';
-                if (!groupDomName) {
-                    return;
-                }
-
-                const val = (input.val() || '').trim();
-                if (!val) {
-                    return;
-                }
-
-                if (!state[groupDomName]) {
-                    state[groupDomName] = new Set();
-                }
-                state[groupDomName].add(val);
-            });
-        return state;
-    },
-
-    // ===== APPLY
-    applyFromScopes(scopeForCollect, push) {
-        Wick.PLPFilters.appliedState = Wick.PLPFilters.collectStateFromDOM(scopeForCollect);
-        Wick.PLPFilters.writeStateToURL(Wick.PLPFilters.appliedState, !!push);
-    },
-
-    applyFilters(e) {
-        e.preventDefault();
-        const scope = $(Wick.PLPFilters.ROOT_WRAPPER).add($(Wick.PLPFiltersMobile.MODAL_SEL));
-        Wick.PLPFilters.applyFromScopes(scope, true);
-    },
-
-    // ===== RENDER
-    updateSelectedUI(rootWrapper) {
-        Wick.PLPChips.renderGroupCounters(rootWrapper);
-        Wick.PLPChips.renderChips(rootWrapper);
-        Wick.PLPFiltersMobile.updateMobileFilterInfo();
-    },
-
-    totalApplied() {
-        return Object.values(Wick.PLPFilters.appliedState).reduce((n, set) => n + set.size, 0);
-    },
-
-    // Wick.PLPUtils for appliedState
-    removeFromApplied(groupDomName, valOriginal) {
-        const st = Wick.PLPFilters.appliedState[groupDomName];
-        if (!st) {
-            return;
-        }
-        st.delete(valOriginal);
-        if (st.size === 0) {
-            delete Wick.PLPFilters.appliedState[groupDomName];
-        }
-    },
-
-    exportState() {
-        const out = {};
-        Object.keys(Wick.PLPFilters.appliedState).forEach((g) => {
-            out[g] = Array.from(Wick.PLPFilters.appliedState[g]);
-        });
-        return out;
-    },
-};
-
-Wick.Overlay = (function () {
-    const BODY_CLASS = 'page-responsiveThematicProductListPage';
-
-    if (!$('body').hasClass(BODY_CLASS)) {
-        return;
-    }
-
-    const $filterMobile = $('.filter-results_mobile');
-
-    $(document).on('click', '#open-overlay', function (event) {
-        event.preventDefault();
-
-        $('body').addClass('is-filters-visible');
-        $filterMobile.addClass('show');
-    });
-
-    $(document).on('click', '#close-overlay, .filter-results__btn-close', function (event) {
-        event.preventDefault();
-
-        if ($filterMobile.hasClass('show')) {
-            $('body').removeClass('is-filters-visible');
-            $filterMobile.removeClass('show');
-        }
-    });
-
-    $(document).on(
-        'click',
-        '.filter-results_desktop .filter__item input[type="checkbox"]',
-        function () {
-            $(this).closest('form').submit();
-        }
-    );
-})();
-
-$(function () {
-    Wick.PLPFilters.init();
-});

package/src/js/page/filters/sort-by.js

@@ -1,172 +0,0 @@
-var Wick = window.Wick || {};
-
-Wick.Sort = {
-    ROOT: '.page-KitchenPLPPage, .products-list-page:not(.page-responsiveThematicProductListPage)',
-    WRAP: '.sort',
-    DROPDOWN: '.sort-dd',
-    OPTION: '.sort-opt',
-    INFO: '.js-sort-info',
-    CHEVRON: '.sort__chevron',
-
-    TRIGGER_MOBILE: '.sort--mobile',
-    TRIGGER_DESKTOP_BTN: '.sort--desktop .sort-button',
-
-    MAP_VALUE_TO_LABEL: {
-        relevance: 'Relevance',
-        priceLow: 'Price (lowest first)',
-        priceHigh: 'Price (highest first)',
-    },
-
-    init: function () {
-        const root = $(Wick.Sort.ROOT);
-        if (!root.length) {
-            return;
-        }
-
-        root.on('click', Wick.Sort.TRIGGER_MOBILE, (e) => {
-            if ($(e.target).closest(Wick.Sort.DROPDOWN).length) {
-                return;
-            }
-            e.preventDefault();
-            Wick.Sort.toggle($(e.currentTarget));
-        });
-
-        root.on('click', Wick.Sort.TRIGGER_DESKTOP_BTN, (e) => {
-            e.preventDefault();
-            Wick.Sort.toggle($(e.currentTarget).closest(Wick.Sort.WRAP));
-        });
-
-        root.on('keydown', `${Wick.Sort.TRIGGER_MOBILE}, ${Wick.Sort.TRIGGER_DESKTOP_BTN}`, (e) => {
-            if (e.key === 'Enter' || e.key === ' ') {
-                e.preventDefault();
-                Wick.Sort.toggle($(e.currentTarget).closest(Wick.Sort.WRAP));
-            }
-        });
-
-        root.on('click', Wick.Sort.OPTION, (e) => {
-            e.preventDefault();
-            e.stopPropagation();
-
-            const opt = $(e.currentTarget);
-            const value = opt.data('value');
-
-            if (opt.data('is-plp-srp')) {
-                return;
-            }
-
-            Wick.Sort.updateSortParamInURL(value);
-        });
-
-        $(document).on('click', (e) => {
-            const open = $(`${Wick.Sort.WRAP}.is-open`);
-            if (!open.length) {
-                return;
-            }
-            if (!open.is(e.target) && open.has(e.target).length === 0) {
-                Wick.Sort.closeAll();
-            }
-        });
-
-        $(document).on('keydown', (e) => {
-            if (e.key === 'Escape') {
-                Wick.Sort.closeAll();
-            }
-        });
-
-        Wick.Sort.bootstrap();
-    },
-
-    updateSortParamInURL: function (value) {
-        const url = new URL(window.location.href);
-        const params = url.searchParams;
-
-        if (value === 'relevance') {
-            params.delete('sortBy');
-        } else {
-            params.set('sortBy', value);
-        }
-
-        url.search = params.toString();
-
-        window.location.href = url.toString();
-    },
-
-    toggle: function (wrap) {
-        const isOpen = wrap.hasClass('is-open');
-        Wick.Sort.closeAll();
-        if (!isOpen) {
-            wrap.addClass('is-open');
-            wrap.find(Wick.Sort.DROPDOWN).removeAttr('hidden');
-            Wick.Sort.setExpanded(wrap, true);
-
-            if (window.Wick && Wick.PLPFilters && typeof Wick.PLPFilters.closeAll === 'function') {
-                Wick.PLPFilters.closeAll();
-            }
-        }
-    },
-
-    close: function (wrap) {
-        wrap.removeClass('is-open');
-        wrap.find(Wick.Sort.DROPDOWN).attr('hidden', true);
-        Wick.Sort.setExpanded(wrap, false);
-    },
-
-    closeAll: function () {
-        const all = $(Wick.Sort.WRAP);
-        all.removeClass('is-open');
-        all.find(Wick.Sort.DROPDOWN).attr('hidden', true);
-        all.each((_, el) => Wick.Sort.setExpanded($(el), false));
-    },
-
-    bootstrap: function () {
-        const urlParams = new URLSearchParams(window.location.search);
-        const value = urlParams.get('sortBy') || 'relevance';
-        const label = Wick.Sort.valueToLabel(value);
-
-        $(Wick.Sort.WRAP).each((_, el) => {
-            const w = $(el);
-
-            const isPlpSrp = w.find(Wick.Sort.OPTION).first().data('is-plp-srp');
-
-            if (isPlpSrp) {
-                return;
-            }
-
-            w.find(Wick.Sort.OPTION)
-                .removeClass('is-active')
-                .filter(`[data-value="${value}"]`)
-                .addClass('is-active');
-        });
-
-        const hasPlpSrp = $(Wick.Sort.OPTION).first().data('is-plp-srp');
-
-        if (!hasPlpSrp) {
-            $(document).trigger('sort:change', { value, label });
-            $(Wick.Sort.INFO).text(label);
-        }
-    },
-
-    setExpanded: function (wrap, expanded) {
-        const btn = wrap.is('.sort--mobile') ? wrap : wrap.find('.sort-button').first();
-        if (btn.length) {
-            btn.attr('aria-expanded', expanded ? 'true' : 'false');
-        }
-    },
-
-    valueToLabel: function (value) {
-        return Wick.Sort.MAP_VALUE_TO_LABEL[value] || 'Relevance';
-    },
-    labelToValue: function (label) {
-        const entries = Object.entries(Wick.Sort.MAP_VALUE_TO_LABEL);
-        for (const [val, lab] of entries) {
-            if (lab.toLowerCase() === label.toString().toLowerCase()) {
-                return val;
-            }
-        }
-        return 'relevance';
-    },
-};
-
-$(function () {
-    Wick.Sort.init();
-});

package/src/js/page/search-filter.js

@@ -1,62 +0,0 @@
-// import { createShowMoreLess } from './utils/show-more-less';
-
-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();
-    });
-})();
-
-Wick.SearchFilter = (function () {
-    const SEL = {
-        CATEGORY: '.category-filter',
-        FILTER_MOBILE: '.filter-results_mobile',
-        OPEN: '.filter-modal-cta',
-        CLOSE: '.close',
-        FILTER_RESULT: '.filter-results_desktop',
-        DESKTOP_CHECKBOX: '.filter-results_desktop .filter__item input[type="checkbox"]',
-        BODY_ACTIVE: 'is-filters-visible',
-    };
-
-    // removed show more/show less logic from frontend (will be implemented on backend)
-    // const SRPShowMoreLess = createShowMoreLess({
-    //     excludeGroup: ($group) => $group.hasClass(SEL.CATEGORY),
-    // });
-
-    // const $fm = $(SEL.FILTER_MOBILE);
-    // SRPShowMoreLess.init($(SEL.FILTER_RESULT));
-    // SRPShowMoreLess.init($fm);
-
-    $(SEL.OPEN).on('click', function (event) {
-        event.preventDefault();
-        // removed show more/show less logic from frontend (will be implemented on backend)
-        // SRPShowMoreLess.init($fm);
-        // SRPShowMoreLess.resetAll($fm);
-    });
-
-    $(document).on('click', SEL.CLOSE, function (event) {
-        event.preventDefault();
-        // removed show more/show less logic from frontend (will be implemented on backend)
-        // SRPShowMoreLess.resetAll($fm);
-    });
-
-    $(document).on('click', SEL.DESKTOP_CHECKBOX, function () {
-        $(this).closest('form').submit();
-    });
-})();

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

@@ -1,57 +0,0 @@
-import { copyToClipboard } from './utils/copy-to-clipboard';
-
-var Wick = Wick || {};
-Wick.ShareProjectList = (function () {
-    function init() {
-        var $input = $('#share-list-modal #shopping-list-link');
-        var linkContainer = $('#copy-link');
-        var $actualLink = linkContainer.find('a');
-        var copyClass = 'copy-link_hovered';
-
-        $actualLink.on('click', function (e) {
-            e.preventDefault();
-        });
-
-        function focusAndSelectInput() {
-            if (!$input.length) return;
-
-            var el = $input.get(0);
-
-            $input.removeAttr('disabled');
-
-            el.focus();
-
-            var len = (el.value || '').length;
-            if (typeof el.setSelectionRange === 'function') {
-                el.setSelectionRange(0, len);
-            } else if (typeof el.select === 'function') {
-                el.select();
-            }
-        }
-
-        linkContainer.on('click', function (e) {
-            e.preventDefault();
-
-            focusAndSelectInput();
-
-            var value = ($input.val() || '').trim();
-            if (!value) return;
-
-            copyToClipboard(value, linkContainer[0], { noUpperCase: true })
-                .then(function () {
-                    $actualLink.addClass(copyClass);
-                })
-                .catch(function (e) {
-                    console.error(e);
-                });
-        });
-
-        $input.on('click', function (e) {
-            e.preventDefault();
-            focusAndSelectInput();
-            $actualLink.removeClass(copyClass);
-        });
-    }
-
-    init();
-})();