' + data.msg + '
');\n\n setTimeout(function () {\n $('.add-to-wishlist-messages').remove();\n }, 5000);\n}\n\nmodule.exports = {\n addToWishlist: function () {\n $('body').on('click', '.wishlistTile', function (e) {\n e.preventDefault();\n var icon = $(this).find($('i'));\n var url = $(this).attr('href');\n var pid = $(this).closest('.product').data('pid');\n var optionId = $(this).closest('.product-detail').find('.product-option').attr('data-option-id');\n var optionVal = $(this).closest('.product-detail').find('.options-select option:selected').attr('data-value-id');\n optionId = optionId || null;\n optionVal = optionVal || null;\n if (!url || !pid) {\n return;\n }\n\n $.spinner().start();\n $.ajax({\n url: url,\n type: 'post',\n dataType: 'json',\n data: {\n pid: pid,\n optionId: optionId,\n optionVal: optionVal\n },\n success: function (data) {\n displayMessageAndChangeIcon(data, icon);\n },\n error: function (err) {\n displayMessageAndChangeIcon(err, icon);\n }\n });\n });\n }\n};\n","'use strict';\n\nvar $compareBar = $('.compare-bar-wrapper');\nvar maxSlots = parseInt($('.compare-bar').data('max-slots'), 10);\nvar productsForComparison = [];\nvar compareButtonText = $('button.compare').text();\n\nvar lastKnownUrl = location.href;\n\n\n/**\n * @typedef ProductComparisonList\n * @type Object\n * @property {string} pid - ID for product to compare\n * @property {string} imgSrc - Image URL for selected product\n */\n\n/**\n * Compiles the HTML for a single slot\n *\n * @param {ProductComparisonList} product - Selected product to compare\n * @param {number} idx - Slot number (zero-based)\n * @return {string} - HTML for a single slot\n */\nfunction compileSlot(product, idx) {\n var pid = product.pid;\n var name = 'pid' + idx;\n\n return '' +\n '' +\n '
\\n';\n}\n\n/**\n * Draw and render the Compare Bar product slots\n *\n * @param {ProductComparisonList []} productsToCompare - List of ID's of the products to compare\n */\nfunction redrawCompareSlots(productsToCompare) {\n var html = productsToCompare.map(function (product, idx) {\n return compileSlot(product, idx);\n }).join('');\n\n // Render empty slots\n if (productsToCompare.length < maxSlots) {\n var numAvailableSlots = maxSlots - productsToCompare.length;\n\n for (var i = 0; i < numAvailableSlots; i++) {\n if (i === 0 && productsToCompare.length < 2) {\n html += '' +\n '![\"'](\"')
' +\n '' +\n '
' +\n '' +\n '' +\n '
' + $('.compare-bar').data('min-products-msg') +\n '
';\n }\n }\n }\n\n $('.compare-bar .product-slots').empty().append(html);\n}\n\n/**\n * Enables/disables the Compare button, depending on whether at least two products have been\n * selected for comparison\n *\n * @param {number} numProducts - Number of products selected for comparison\n */\nfunction setCompareButton(numProducts) {\n if (numProducts > 0) {\n $('button.compare').text(compareButtonText + '(' + numProducts + ')');\n } else {\n $('button.compare').text(compareButtonText);\n }\n if (numProducts < 2) {\n $('button.compare').attr('disabled', true);\n } else {\n $('button.compare').removeAttr('disabled');\n }\n}\n\n/**\n * Returns a copy of a list of products to compare\n *\n * @param {ProductComparisonList []} productsToCompare - List of ID's of the products to compare\n * @return {ProductComparisonList []} List of ID's of the products to compare\n */\nfunction copyProducts(productsToCompare) {\n return productsToCompare.map(function (product) {\n var proxy = {};\n\n Object.keys(product).forEach(function (key) {\n proxy[key] = product[key];\n });\n\n return proxy;\n });\n}\n\n/**\n * Handles the selection of a product for comparison\n *\n * @param {ProductComparisonList []} products - List of ID's of the products to compare\n * @param {string} pid - ID for product to compare\n * @param {string} imgSrc - Image URL for selected product\n * @param {string} altText - Alt text for selected product image\n * @return {ProductComparisonList []} List of ID's of the products to compare\n */\nfunction selectProduct(products, pid, imgSrc, altText) {\n var productsToCompare = copyProducts(products) || [];\n\n if (productsToCompare.length < maxSlots) {\n productsToCompare.push({\n pid: pid,\n imgSrc: imgSrc,\n altText: altText\n });\n\n if (productsToCompare.length === maxSlots) {\n $('input[type=checkbox]:not(:checked)').attr('disabled', true);\n }\n\n redrawCompareSlots(productsToCompare);\n setCompareButton(productsToCompare.length);\n $compareBar.show();\n }\n\n return productsToCompare;\n}\n\n/**\n * Handles the deselection of a product\n *\n * @param {ProductComparisonList []} products - List of ID's of the products to compare\n * @param {string} pid - ID for product to compare\n * @return {ProductComparisonList []} List of ID's of the products to compare\n */\nfunction deselectProduct(products, pid) {\n var productsToCompare = copyProducts(products) || [];\n\n productsToCompare = productsToCompare.filter(function (product) {\n return product.pid !== pid;\n });\n\n if (productsToCompare.length === 0) {\n $compareBar.hide();\n }\n\n $('input#' + pid).prop('checked', false);\n $('input[type=checkbox]:not(:checked)').removeAttr('disabled');\n\n redrawCompareSlots(productsToCompare);\n setCompareButton(productsToCompare.length);\n return productsToCompare;\n}\n\n/**\n * Clears the Compare Bar and hides it\n * @return {undefined}\n */\nfunction clearCompareBar() {\n productsForComparison.forEach(function (product) {\n $(this).trigger('compare:deselected', { pid: product.pid });\n });\n\n productsForComparison = [];\n $('.compare input').prop('checked', false);\n $('.compare input[type=checkbox]:not(:checked)').removeAttr('disabled');\n $compareBar.hide();\n}\n\n/**\n * Update form action url to not have query string\n * @returns {undefined}\n */\nfunction updateSubmitUrl() {\n var form = $('.compare-products-form');\n var targetUrl = form.attr('action');\n var urlParts = targetUrl.split('?');\n if (urlParts[1]) {\n urlParts[1].split('&').forEach(function (keyValue) {\n var splittedValues = keyValue.split('=');\n var key = decodeURIComponent(splittedValues[0]);\n var value = decodeURIComponent(splittedValues[1]);\n if (key && value) {\n if (form.find('[name=\"' + key + '\"]').length === 0) {\n form.append('');\n }\n }\n });\n form.attr('action', urlParts[0]);\n }\n}\n\nmodule.exports = {\n /**\n * Handles Compare checkbox click\n */\n handleCompareClick: function () {\n $('div.page').on('click', '.compare input[type=checkbox]', function () {\n var pid = $(this).attr('id');\n var checked = $(this).is(':checked');\n var imgSrc = $(this).closest('.product-tile')\n .find('.tile-image')\n .prop('src');\n var altText = $(this).closest('.product-tile')\n .find('.tile-image')\n .attr('alt');\n\n if (checked) {\n productsForComparison = selectProduct(productsForComparison, pid, imgSrc, altText);\n $(this).trigger('compare:selected', { pid: pid });\n } else {\n productsForComparison = deselectProduct(productsForComparison, pid);\n $(this).trigger('compare:deselected', { pid: pid });\n }\n });\n },\n\n /**\n * Handles the Clear All link\n */\n handleClearAll: function () {\n $('.compare-bar a.clear-all').on('click', function (e) {\n e.preventDefault();\n clearCompareBar();\n });\n },\n\n /**\n * Handles deselection of a product on the Compare Bar\n */\n deselectProductOnCompareBar: function () {\n $('.compare-bar').on('click', '.close', function () {\n var pid = $(this).closest('.slot').data('pid').toString();\n productsForComparison = deselectProduct(productsForComparison, pid);\n $(this).trigger('compare:deselected', { pid: pid });\n });\n },\n\n /**\n * Selects products for comparison based on the checked status of the Compare checkboxes in\n * each product tile. Used when user goes back from the Compare Products page.\n */\n selectCheckedProducts: function () {\n $('.product-grid').ready(function () {\n if (location.hash) {\n location.hash.replace('#', '').split(',').forEach(function (id) {\n $('input#' + id).prop('checked', 'checked');\n });\n }\n $('.compare input:checked').each(function () {\n var pid = $(this).prop('id');\n var imgSrc = $(this).closest('.product-tile')\n .find('img.tile-image')\n .prop('src');\n var altText = $(this).closest('.product-tile')\n .find('.tile-image')\n .attr('alt');\n\n productsForComparison = selectProduct(productsForComparison, pid, imgSrc, altText);\n $(this).trigger('compare:selected', { pid: pid });\n });\n });\n },\n\n /**\n * Sets the \"backUrl\" property to the last attribute selected URL to ensure that when the user\n * goes back from the Compare Products page, the previously selected attributes are still\n * selected and applied to the previous search.\n */\n setBackUrl: function () {\n $('.search-results').on('click', '.refinements a', function () {\n $('input[name=\"backUrl\"]').val($(this).prop('href'));\n });\n },\n\n /**\n * Sets the history.pushState for history.back() to work from the Compare Products page.\n */\n setPushState: function () {\n $('.compare-products-form').on('submit', function () {\n updateSubmitUrl();\n var selectedProducts = $('.compare input:checked').map(function () { return this.id; }).get().join(',');\n history.pushState({}, document.title, lastKnownUrl + '#' + selectedProducts);\n location.hash = selectedProducts;\n\n $(this).find('input[name=\"cgid\"]').attr('value', $('input.category-id').val());\n });\n },\n catchFilterChange: function () {\n $('.container').on('click', '.refinements li a, .refinement-bar a.reset', function (e) {\n e.preventDefault();\n clearCompareBar();\n });\n },\n listenToFilterChange: function () {\n $('body').on('search:filter', function (e, data) {\n lastKnownUrl = data.currentTarget.href;\n });\n }\n};\n","'use strict';\n\n\n$(document).ready(function () {\n\n /**\n * Update DOM elements with Ajax results\n *\n * @param {Object} $results - jQuery DOM element\n * @param {string} selector - DOM element to look up in the $results\n * @return {undefined}\n */\n function updateDom($results, selector) {\n var $updates = $results.find(selector);\n $(selector).empty().html($updates.html());\n if ($updates.hasClass('refinements')) {\n let searchURL = $updates.find('.refinement .content .values button').data('href');\n history.replaceState('Search', document.title, decodeURIComponent(searchURL.replace('Ajax', '')));\n }\n }\n\n /**\n * Check if there are filters selected. If yes it will show the clear results button\n *\n */\n function validateClearResults() {\n var urlParams = new URLSearchParams(location.href);\n if ($('.filter__button--style.filter__button--active, .filter__box--style.filter__box--active, .color-attribute .selected').length > 0 ||\n $('.range-min').val() !== $('.range-min').attr('min') ||\n (urlParams.get('pmin') && urlParams.get('pmin') !== $('.range-min').attr('min')) ||\n $('.range-max').val() !== $('.range-max').attr('max') ||\n (urlParams.get('pmax') && urlParams.get('pmax') !== $('.range-min').attr('max'))) {\n $('.refinement-bar .secondary-bar').removeClass('d-none');\n } else {\n $('.refinement-bar .secondary-bar').addClass('d-none');\n }\n }\n\n /**\n * Keep refinement panes expanded/collapsed after Ajax refresh\n *\n * @param {Object} $results - jQuery DOM element\n * @return {undefined}\n */\n function handleRefinements($results) {\n $('.refinement.active').each(function () {\n $(this).removeClass('active');\n var activeDiv = $results.find('.' + $(this)[0].className.replace(/ /g, '.'));\n activeDiv.addClass('active');\n activeDiv.find('button.title').attr('aria-expanded', 'true');\n });\n\n updateDom($results, '.refinements');\n }\n /**\n * Parse Ajax results and updated select DOM elements\n *\n * @param {string} response - Ajax response HTML code\n * @return {undefined}\n */\n function parseResults(response) {\n var $results = $(response);\n var specialHandlers = {\n '.refinements': handleRefinements\n };\n\n // Update DOM elements that do not require special handling\n [\n '.grid-header',\n '.header-bar',\n '.header.page-title',\n '.product-grid',\n '.show-more',\n '.filter-bar',\n '.refinement-bar__show-button'\n ].forEach(function (selector) {\n updateDom($results, selector);\n });\n\n Object.keys(specialHandlers).forEach(function (selector) {\n specialHandlers[selector]($results);\n });\n }\n\n /**\n * Update param in url\n *\n * @return {string}\n */\n function replaceUrlParam(url, paramName, paramValue) {\n if (paramValue == null) {\n paramValue = '';\n }\n var pattern = new RegExp('\\\\b(' + paramName + '=).*?(&|#|$)');\n if (url.search(pattern) >= 0) {\n return url.replace(pattern, '$1' + paramValue + '$2');\n }\n url = url.replace(/[?#]$/, '');\n return url + (url.indexOf('?') > 0 ? '&' : '?') + paramName + '=' + paramValue;\n }\n\n /**\n * Update Filter values after result appear\n *\n * @return {null}\n */\n function parseResultsCustomPrice(minV, maxV, maxPriceFilter) {\n $('.range-min').val(minV);\n $('.range-max').val(maxV);\n $('.input-min').val(minV);\n $('.input-max').val(maxV);\n $('.range-min').attr('max', maxPriceFilter);\n $('.range-max').attr('max', maxPriceFilter);\n $('.price-interval .price-interval-max').empty().text('$' + maxPriceFilter);\n $('.price-placeholder .price-placeholder-min span').empty().text('$' + minV);\n $('.price-placeholder .price-placeholder-max span').empty().text('$' + maxV);\n $('.price-placeholder .price-placeholder-min').css('left', ((minV / maxPriceFilter) * 100) + '%');\n $('.price-placeholder .price-placeholder-max').css('right', ((100 - ((maxV / maxPriceFilter) * 100))) + '%');\n $('.slider .progress').css('left', ((minV / maxPriceFilter) * 100) + '%');\n $('.slider .progress').css('right', (100 - ((maxV / maxPriceFilter) * 100)) + '%');\n }\n\n let priceGap = $('.price-gap').val() ? $('.price-gap').val() : 100;\n let priceFilterList = $('.filter__refinementulprice--style .filter__pricerefinementvalue--style span[aria-hidden=\"true\"]').last();\n let maxValuePrice = 1000;\n\n if ($(priceFilterList).length > 0) {\n let priceFilterValues = $(priceFilterList).text().trim().split('-');\n\n if (priceFilterValues.length > 0) {\n maxValuePrice = parseInt(priceFilterValues[1].trim(), 10) + 1;\n $('.price-interval .price-interval-max').empty().text('$' + maxValuePrice);\n $('.range-max').attr('max', maxValuePrice);\n $('.range-min').attr('max', maxValuePrice);\n $('.input-max').val(maxValuePrice);\n $('.range-max').val(maxValuePrice);\n $('.price-placeholder .price-placeholder-max span').empty().text('$' + maxValuePrice);\n }\n }\n\n $(document).on('input', '.range-input input', function (e) {\n let minVal = parseInt($('.range-min').val(), 10),\n maxVal = parseInt($('.range-max').val(), 10);\n if ((maxVal - minVal) < priceGap) {\n if ($(this).hasClass('range-min')) {\n $('.range-min').val(maxVal - priceGap);\n } else {\n $('.range-max').val(maxVal + priceGap);\n }\n } else {\n $('.input-min').val(minVal);\n $('.input-max').val(maxVal);\n $('.price-placeholder .price-placeholder-min span').empty().text('$' + minVal);\n $('.price-placeholder .price-placeholder-max span').empty().text('$' + maxVal);\n $('.price-placeholder .price-placeholder-min').css('left', ((minVal / $('.range-max').attr('max')) * 100) + '%');\n $('.price-placeholder .price-placeholder-max').css('right', ((100 - (maxVal / $('.range-max').attr('max')) * 100)) + '%');\n $('.slider .progress').css('left', ((minVal / $('.range-min').attr('max')) * 100) + '%');\n $('.slider .progress').css('right', 100 - (maxVal / $('.range-max').attr('max')) * 100 + '%');\n }\n });\n\n $(document).on('input', '.price-input input', function (e) {\n let minPrice = parseInt($('.input-min').val(), 10),\n maxPrice = parseInt($('.input-max').val(), 10);\n\n if ((maxPrice - minPrice >= priceGap) && maxPrice <= $('.input-max').attr('max')) {\n if ($(this).hasClass('input-min')) {\n $('.range-min').val(minPrice);\n $('.slider .progress').css('left', ((minPrice / $('.range-max').attr('min')) * 100) + '%');\n } else {\n $('.range-max').val(maxPrice);\n $('.slider .progress').css('right', 100 - (maxPrice / $('.range-max').attr('max')) * 100 + '%');\n }\n }\n });\n\n $(document).on('change', '.range-input input', function (e) {\n e.preventDefault();\n e.stopPropagation();\n let min = $('.range-min').val();\n let max = $('.range-max').val();\n let filterRoute = $('.filter__refinementulprice--style .filter__pricerefinementvalue--style button').first().data('href');\n filterRoute = replaceUrlParam(filterRoute, 'pmin', min);\n filterRoute = replaceUrlParam(filterRoute, 'pmax', max);\n\n $.spinner().start();\n $(this).trigger('search:filter', {\n currentTarget: {\n href: location.host + filterRoute\n }\n });\n\n $.ajax({\n url: filterRoute,\n data: {\n page: $('.grid-footer').data('page-number'),\n selectedUrl: filterRoute\n },\n method: 'GET',\n success: function (response) {\n parseResults(response);\n parseResultsCustomPrice(min, max, maxValuePrice);\n validateClearResults()\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n});","'use strict';\n\nvar base = require('base/search/search');\n\nfunction toggleFilterDrawer() {\n const toggle = document.getElementById('toggle-filter-drawer');\n const filterDrawer = document.getElementById('filter-drawer');\n if (toggle && filterDrawer) {\n toggle.addEventListener('click', () => {\n filterDrawer.classList.toggle('collapsed');\n toggle.classList.toggle('collapsed');\n });\n }\n}\n\n/**\n * Set cookie value\n * @param {string} cookieName - selected sort option\n * @param {string} cookieValue - selected sort option\n * @param {string} expiryDays - selected sort option\n */\nfunction setCookie(cookieName, cookieValue, expiryDays) {\n const d = new Date();\n d.setTime(d.getTime() + (expiryDays * 24 * 60 * 60 * 1000));\n let expires = 'expires=' + d.toUTCString();\n document.cookie = cookieName + '=' + cookieValue + ';' + expires + ';path=/';\n}\n\n/**\n * Initialize Grid Size Selector Elements\n * @param {string} gridSizeSelectorBtn - selected sort option\n * @param {string} gridTwoUpBtnIcon - selected sort option\n * @param {string} squareBtnIcon - selected sort option\n * @return {Object} - grid size button DOM elements\n */\nfunction initializeGridSizeElements() {\n var gridSizeSelectorBtn = document.querySelector('.grid-size-selector .grid-size-btn');\n var gridTwoUpBtnIcon = document.querySelector('.grid-size-selector .grid-size-btn .grid-2-btn i');\n var squareBtnIcon = document.querySelector('.grid-size-selector .grid-size-btn .square-btn i');\n\n return {\n gridSizeSelectorBtn: gridSizeSelectorBtn,\n gridTwoUpBtnIcon: gridTwoUpBtnIcon,\n squareBtnIcon: squareBtnIcon\n };\n}\n\n/**\n * Update product grid size on PLP and result page\n * @param {string} gridSize - gridSize value 'small' or 'large'\n */\nfunction updateProductGridSize(gridSize) {\n var productGrids = document.querySelectorAll('.product-grid > div:not(.grid-footer)');\n\n productGrids.forEach(function (productGrid) {\n if (gridSize === 'large') {\n productGrid.classList.add('col-12');\n productGrid.classList.remove('col-6');\n } else {\n productGrid.classList.add('col-6');\n productGrid.classList.remove('col-12');\n }\n });\n}\n\n/**\n * Update grid size selector UI and set product grid size preference to large\n * @param {Object} elements - DOM elements for grid selector button\n */\nfunction setGridSizePreferenceLarge(elements) {\n if (elements.gridSizeSelectorBtn) {\n setCookie('customerPLPGridSizePreference', 'large', 30);\n elements.gridSizeSelectorBtn.setAttribute('aria-checked', 'true');\n elements.gridTwoUpBtnIcon.classList.remove('fa-solid');\n elements.gridTwoUpBtnIcon.classList.add('fa-regular');\n elements.squareBtnIcon.classList.remove('fa-regular');\n elements.squareBtnIcon.classList.add('fa-solid');\n updateProductGridSize('large');\n }\n}\n\n/**\n * Update grid size selector UI and set product grid size preference to small\n * @param {Object} elements - DOM elements for grid selector button\n */\nfunction setGridSizePreferenceSmall(elements) {\n if (elements.gridSizeSelectorBtn) {\n setCookie('customerPLPGridSizePreference', 'small', 30);\n elements.gridSizeSelectorBtn.setAttribute('aria-checked', 'false');\n elements.gridTwoUpBtnIcon.classList.remove('fa-regular');\n elements.gridTwoUpBtnIcon.classList.add('fa-solid');\n elements.squareBtnIcon.classList.remove('fa-solid');\n elements.squareBtnIcon.classList.add('fa-regular');\n updateProductGridSize('small');\n }\n}\n\nif (document.querySelector('.grid-size-selector')) {\n var elements = initializeGridSizeElements();\n\n // Toggle product grid size selector when button is clicked\n elements.gridSizeSelectorBtn.addEventListener('click', function (e) {\n e.preventDefault();\n if (elements.gridSizeSelectorBtn.getAttribute('aria-checked') === 'true') {\n setGridSizePreferenceSmall(elements);\n } else {\n setGridSizePreferenceLarge(elements);\n }\n });\n}\n\nfunction observeStickyHeader() {\n const el = document.querySelector('.grid-header');\n\n if (el) {\n const observer = new IntersectionObserver(([e]) => e.target.classList.toggle('is-pinned', e.intersectionRatio < 1), { rootMargin: '-98.6px 0px 0px 0px', threshold: [1] }); // rootMargin set to offset the mobile navigation height\n\n observer.observe(el);\n }\n}\n\nlet priceFilterList = $('.filter__refinementulprice--style .filter__pricerefinementvalue--style span[aria-hidden=\"true\"]').last();\nlet maxValuePrice = 1000;\nvar searchURL = null;\nif ($(priceFilterList).length > 0) {\n let priceFilterValues = $(priceFilterList).text().trim().split('-');\n\n if (priceFilterValues.length > 0) {\n maxValuePrice = parseInt(priceFilterValues[1].trim(), 10) + 1;\n }\n}\n\n/**\n * Update DOM elements with Ajax results\n *\n * @param {Object} $results - jQuery DOM element\n * @param {string} selector - DOM element to look up in the $results\n * @return {undefined}\n */\nfunction updateDom($results, selector) {\n var $updates = $results.find(selector);\n\n $(selector).empty().html($updates.html());\n if ($updates.hasClass('refinements')) {\n if (!searchURL) {\n searchURL = $updates.find('.refinement .content .values button').data('href');\n }\n history.replaceState('Search', document.title, decodeURIComponent(searchURL.replace('Ajax', '')));\n }\n}\n\n/**\n * Keep refinement panes expanded/collapsed after Ajax refresh\n *\n * @param {Object} $results - jQuery DOM element\n * @return {undefined}\n */\nfunction handleRefinements($results) {\n $('.refinement.active').each(function () {\n $(this).removeClass('active');\n var activeDiv = $results.find('.' + $(this)[0].className.replace(/ /g, '.'));\n activeDiv.addClass('active');\n activeDiv.find('button.title').attr('aria-expanded', 'true');\n });\n\n updateDom($results, '.refinements');\n}\n/**\n * Parse Ajax results and updated select DOM elements\n *\n * @param {string} response - Ajax response HTML code\n * @return {undefined}\n */\nfunction parseResults(response) {\n var $results = $(response);\n var specialHandlers = {\n '.refinements': handleRefinements\n };\n\n // Update DOM elements that do not require special handling\n [\n '.grid-header',\n '.header-bar',\n '.header.page-title',\n '.product-grid',\n '.show-more',\n '.filter-bar',\n '.refinement-bar__show-button'\n ].forEach(function (selector) {\n updateDom($results, selector);\n });\n\n Object.keys(specialHandlers).forEach(function (selector) {\n specialHandlers[selector]($results);\n });\n\n toggleFilterDrawer();\n}\n\n/**\n * Update param in url\n *\n * @param {string} url - url to be updated\n * @param {string} paramName - param to be updated\n * @param {string} paramValue - value to be updated\n * @return {string} - search result url\n */\nfunction replaceUrlParam(url, paramName, paramValue) {\n let tempParamValue = paramValue;\n let tempUrl = url;\n if (tempParamValue == null) {\n tempParamValue = '';\n }\n var pattern = new RegExp('\\\\b(' + paramName + '=).*?(&|#|$)');\n if (tempUrl.search(pattern) >= 0) {\n return tempUrl.replace(pattern, '$1' + tempParamValue + '$2');\n }\n tempUrl = tempUrl.replace(/[?#]$/, '');\n return tempUrl + (tempUrl.indexOf('?') > 0 ? '&' : '?') + paramName + '=' + tempParamValue;\n}\n\n/**\n * Update Filter values after result appear\n *\n * @param {string} minV - current min value from the interval\n * @param {string} maxV - current max value from the interval\n * @param {string} maxPriceFilter - Max Price Filter value\n * @return {undefined}\n */\nfunction parseResultsCustomPrice(minV, maxV, maxPriceFilter) {\n $('.range-min').val(minV);\n $('.range-max').val(maxV);\n $('.input-min').val(minV);\n $('.input-max').val(maxV);\n $('.range-min').attr('max', maxPriceFilter);\n $('.range-max').attr('max', maxPriceFilter);\n $('.price-interval .price-interval-max').empty().text('$' + maxPriceFilter);\n $('.price-placeholder .price-placeholder-min span').empty().text('$' + minV);\n $('.price-placeholder .price-placeholder-max span').empty().text('$' + maxV);\n $('.price-placeholder .price-placeholder-min').css('left', ((minV / maxPriceFilter) * 100) + '%');\n $('.price-placeholder .price-placeholder-max').css('right', (100 - ((maxV / maxPriceFilter) * 100)) + '%');\n $('.slider .progress').css('left', ((minV / maxPriceFilter) * 100) + '%');\n $('.slider .progress').css('right', (100 - ((maxV / maxPriceFilter) * 100)) + '%');\n}\n\n/**\n * Update sort option URLs from Ajax response\n *\n * @param {string} response - Ajax response HTML code\n * @return {undefined}\n */\nfunction updateSortOptions(response) {\n var $tempDom = $('
').append($(response));\n var sortOptions = $tempDom.find('.grid-footer').data('sort-options').options;\n sortOptions.forEach(function (option) {\n $('option.' + option.id).val(option.url);\n });\n}\n\n/**\n * Check if there are filters selected. If yes it will show the clear results button\n *\n */\nfunction validateClearResults() {\n var urlParams = new URLSearchParams(location.href);\n if ($('.filter__button--style.filter__button--active, .filter__box--style.filter__box--active, .color-attribute .selected').length > 0 ||\n $('.range-min').val() !== $('.range-min').attr('min') ||\n (urlParams.get('pmin') && urlParams.get('pmin') !== $('.range-min').attr('min')) ||\n $('.range-max').val() !== $('.range-max').attr('max') ||\n (urlParams.get('pmax') && urlParams.get('pmax') !== $('.range-min').attr('max'))) {\n $('.refinement-bar .secondary-bar').removeClass('d-none');\n } else {\n $('.refinement-bar .secondary-bar').addClass('d-none');\n }\n}\n\n/**\n * Check if there is a sort rule in the URL params. If so, make sure sort dropdown has the correct sort option selected\n *\n */\nfunction updateSortDropDown() {\n let params = new URLSearchParams(document.location.search);\n let sortRule = params.get('srule');\n if (sortRule !== null) {\n let sortDropDown = document.querySelector('.custom-select.sort-order');\n\n let currentlySelectedOption = sortDropDown.options[sortDropDown.selectedIndex];\n\n if (currentlySelectedOption.className !== sortRule) {\n currentlySelectedOption.removeAttribute('selected');\n }\n\n let selectedOption = sortDropDown.querySelector(`.${sortRule}`);\n if (selectedOption) {\n selectedOption.setAttribute('selected', '');\n }\n }\n}\n\n/**\n * Update the filer URL with sort rule selected parameter\n *\n * @param {string} url - filter url\n * @param {string} param - sort rule key\n * @param {string} value - sort rule value\n * @return {string} - search result url\n */\nfunction updateUrlParameter(url, param, value) {\n var urlParts = url.split('?');\n var baseUrl = urlParts[0];\n var queryString = urlParts[1] || '';\n var newQueryString = '';\n var paramRegex = new RegExp('(^|&)' + param + '=([^&]*)');\n\n if (queryString.match(paramRegex)) {\n // If the parameter exists, remove it add selected sort parameter\n var updatedQueryString = queryString.replace(paramRegex, '').replace(/^&|&$/, '');\n newQueryString = updatedQueryString + '&' + param + '=' + value;\n } else {\n // If the parameter doesn't exist, add it\n newQueryString = queryString + '&' + param + '=' + value;\n }\n\n return baseUrl + '?' + newQueryString;\n}\n\n/**\n * Update the selected sort rule in dropdown\n * @param {string} parameter - selected sort option\n */\nfunction selectSortOption(parameter) {\n var selectElement = $('#sortOrderSelect');\n\n // Find the option with the given data-id attribute value\n var newOption = selectElement.find('option[data-id=\"' + parameter + '\"]');\n\n if (newOption.length) {\n // Deselect the currently selected option\n selectElement.find('option:selected').prop('selected', false);\n newOption.prop('selected', true);\n selectElement.trigger('change');\n }\n}\n\nbase.applyFilter = function () {\n // Handle refinement value selection and reset click\n $('.container').on(\n 'click',\n '.refinements li button, .refinement-bar button.reset, .filter-value button, .swatch-filter button, .filter-reset-btn button',\n function (e) {\n e.preventDefault();\n e.stopPropagation();\n let url = $(this).data('href');\n var selectedSortOption = $('.custom-select.sort-order').find('option:selected').data('id');\n // update the filer url with sort rule parameter\n url = updateUrlParameter(url, 'srule', selectedSortOption);\n let min;\n let max;\n if (!$(this).hasClass('reset')) {\n min = $('.range-min').val();\n max = $('.range-max').val();\n url = replaceUrlParam(url, 'pmin', min);\n url = replaceUrlParam(url, 'pmax', max);\n } else {\n min = $('.range-min').attr('min');\n max = $('.range-max').attr('max');\n }\n $.spinner().start();\n $(this).trigger('search:filter', e);\n searchURL = url;\n\n $.ajax({\n url: url,\n data: {\n page: $('.grid-footer').data('page-number'),\n selectedUrl: url\n },\n method: 'GET',\n success: function (response) {\n parseResults(response);\n parseResultsCustomPrice(min, max, maxValuePrice);\n validateClearResults();\n selectSortOption(selectedSortOption);\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n};\n\nbase.showMore = function () {\n // Show more products\n $('.container').on('click', '.show-more button', function (e) {\n e.stopPropagation();\n var showMoreUrl = $(this).data('url');\n e.preventDefault();\n\n $.spinner().start();\n $(this).trigger('search:showMore', e);\n $.ajax({\n url: showMoreUrl,\n data: {\n selectedUrl: showMoreUrl\n },\n method: 'GET',\n success: function (response) {\n $('.grid-footer').replaceWith(response);\n updateSortOptions(response);\n $('.resultsNo-pagesize').text($('.search-keywords').text().trim().replace(/[“”]/g, '') + ' ( ' + $('.product-tile').length + ' of ' + $('.search-result-count').text().trim().toLowerCase().replace(/[^\\d,]/g, '') + ' ) ');\n var urlParams = new URLSearchParams(showMoreUrl);\n var start = parseInt(urlParams.get('start'), 10);\n var sz = parseInt(urlParams.get('sz'), 10);\n if (start && sz) {\n var newSearchURL = replaceUrlParam(location.href, 'sz', sz + start);\n newSearchURL = replaceUrlParam(newSearchURL, 'start', '0');\n history.replaceState('Search', document.title, decodeURIComponent(newSearchURL));\n }\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n};\n\nbase.sort = function () {\n // Handle sort order menu selection\n $('.container').on('change', '[name=sort-order]', function (e) {\n e.preventDefault();\n if (this.value.toLocaleLowerCase().replace(' ', '') !== 'sortby') {\n $.spinner().start();\n $(this).trigger('search:sort', this.value);\n $.ajax({\n url: this.value,\n data: {\n selectedUrl: this.value\n },\n method: 'GET',\n success: function (response) {\n $('.product-grid').empty().html(response);\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n }\n });\n};\n\nbase.filter = function () {\n // Display refinements bar when Menu icon clicked\n $('.container').on('click', 'button.filter-results', function () {\n $('.refinement-bar, .modal-background').show();\n $('.refinement-bar').addClass('open');\n $('.refinement-bar').siblings().attr('aria-hidden', true);\n $('.refinement-bar').closest('.row').siblings().attr('aria-hidden', true);\n $('.refinement-bar').closest('.tab-pane.active').siblings().attr('aria-hidden', true);\n $('.refinement-bar').closest('.container.search-results').siblings().attr('aria-hidden', true);\n $('.refinement-bar .close').focus();\n });\n};\n\nbase.closeRefinements = function () {\n // Refinements close button\n $('.container').on('click', '.refinement-bar button.close, .modal-background, .refinement-bar .clearfix-close', function () {\n $('.refinement-bar').removeClass('open');\n $('.refinement-bar, .modal-background').delay(400).hide();\n $('.refinement-bar').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.row').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.tab-pane.active').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.container.search-results').siblings().attr('aria-hidden', false);\n $('.btn.filter-results').focus();\n });\n\n // This code would be placed in the method that opens the modal/menu:\n $('.container').on('keyup', function (event) {\n if (event.keyCode == 27) {\n $('.refinement-bar').removeClass('open');\n $('.refinement-bar, .modal-background').delay(400).hide(400);\n $('.refinement-bar').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.row').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.tab-pane.active').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.container.search-results').siblings().attr('aria-hidden', false);\n $('.btn.filter-results').focus();\n }\n });\n};\n\nbase.showProductTileAltImage = function () {\n $('body').on('mouseover', '.product-tile .image-container .tile-image--primary', function () {\n let image = $(this);\n if ($(image).attr('data-secondary-src') !== '' && $(image).attr('data-secondary-srcset') !== '') {\n $(image).attr('src', $(image).attr('data-secondary-src'));\n $(image).attr('srcset', $(image).attr('data-secondary-srcset'));\n }\n });\n};\n\nbase.showProductTileFirstImage = function () {\n $('body').on('mouseout', '.product-tile .image-container .tile-image--primary', function () {\n let image = $(this);\n $(image).attr('src', $(image).attr('data-primary-src'));\n $(image).attr('srcset', $(image).attr('data-primary-srcset'));\n });\n};\n\nbase.showProductTileSwatchImage = function () {\n $('body').on('click', '.product-tile .swatch--color__action', function (e) {\n e.preventDefault();\n var swatchTrigger = $(this);\n let params = $(this).data('params');\n if (params) {\n params = '&' + params;\n }\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('.image-container').spinner().start();\n $.get($(swatchTrigger).data('action') + params, function (data) {\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('src', data.images['hi-res'][0].mobile);\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('srcset', data.images['hi-res'][0].mobile + ' 300w, ' + data.images['hi-res'][0].mobile2x + ' 600w');\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('data-primary-src', data.images['hi-res'][0].mobile);\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('data-primary-srcset', data.images['hi-res'][0].mobile + ' 300w, ' + data.images['hi-res'][0].mobile2x + ' 600w');\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('alt', data.images['hi-res'][0].alt);\n if (data.images['hi-res'].length > 1) {\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('data-secondary-src', data.images['hi-res'][1].mobile);\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('data-secondary-srcset', data.images['hi-res'][1].mobile + ' 300w, ' + data.images['hi-res'][1].mobile2x + ' 600w');\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('alt', data.images['hi-res'][1].alt);\n } else {\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('data-secondary-srcset', '');\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('img.tile-image--primary').attr('data-secondary-src', '');\n }\n $(swatchTrigger).parent().siblings().children()\n .removeClass('selected');\n $(swatchTrigger).addClass('selected');\n // Update tile link to match selected swatch so that appropriate parameters are added to URL for selection on PDP.\n $(swatchTrigger).closest('.product-tile').find('.image-container a').attr('href', $(swatchTrigger).attr('href'));\n $('.product[data-pid=\"' + $(swatchTrigger).data('pid') + '\"]').find('.image-container').spinner().stop();\n });\n });\n};\n\nvar productIdViewed = localStorage.getItem('productIdViewed');\nif (productIdViewed && $(productIdViewed).length > 0) {\n localStorage.removeItem('productIdViewed');\n $('html, body').animate({\n scrollTop: $(productIdViewed).offset().top - 300\n }, 2000);\n}\nvalidateClearResults();\nupdateSortDropDown();\ntoggleFilterDrawer();\nobserveStickyHeader();\n\nmodule.exports = base;\n","'use strict';\n\n/**\n * Update DOM elements with Ajax results\n *\n * @param {Object} $results - jQuery DOM element\n * @param {string} selector - DOM element to look up in the $results\n * @return {undefined}\n */\nfunction updateDom($results, selector) {\n var $updates = $results.find(selector);\n $(selector).empty().html($updates.html());\n}\n\n/**\n * Keep refinement panes expanded/collapsed after Ajax refresh\n *\n * @param {Object} $results - jQuery DOM element\n * @return {undefined}\n */\nfunction handleRefinements($results) {\n $('.refinement.active').each(function () {\n $(this).removeClass('active');\n var activeDiv = $results.find('.' + $(this)[0].className.replace(/ /g, '.'));\n activeDiv.addClass('active');\n activeDiv.find('button.title').attr('aria-expanded', 'true');\n });\n\n updateDom($results, '.refinements');\n}\n\n/**\n * Parse Ajax results and updated select DOM elements\n *\n * @param {string} response - Ajax response HTML code\n * @return {undefined}\n */\nfunction parseResults(response) {\n var $results = $(response);\n var specialHandlers = {\n '.refinements': handleRefinements\n };\n\n // Update DOM elements that do not require special handling\n [\n '.grid-header',\n '.header-bar',\n '.header.page-title',\n '.product-grid',\n '.show-more',\n '.filter-bar'\n ].forEach(function (selector) {\n updateDom($results, selector);\n });\n\n Object.keys(specialHandlers).forEach(function (selector) {\n specialHandlers[selector]($results);\n });\n}\n\n/**\n * This function retrieves another page of content to display in the content search grid\n * @param {JQuery} $element - the jquery element that has the click event attached\n * @param {JQuery} $target - the jquery element that will receive the response\n * @return {undefined}\n */\nfunction getContent($element, $target) {\n var showMoreUrl = $element.data('url');\n $.spinner().start();\n $.ajax({\n url: showMoreUrl,\n method: 'GET',\n success: function (response) {\n $target.append(response);\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n}\n\n/**\n * Update sort option URLs from Ajax response\n *\n * @param {string} response - Ajax response HTML code\n * @return {undefined}\n */\nfunction updateSortOptions(response) {\n var $tempDom = $('
').append($(response));\n var sortOptions = $tempDom.find('.grid-footer').data('sort-options').options;\n sortOptions.forEach(function (option) {\n $('option.' + option.id).val(option.url);\n });\n}\n\nmodule.exports = {\n filter: function () {\n // Display refinements bar when Menu icon clicked\n $('.container').on('click', 'button.filter-results', function () {\n $('.refinement-bar, .modal-background').show();\n $('.refinement-bar').siblings().attr('aria-hidden', true);\n $('.refinement-bar').closest('.row').siblings().attr('aria-hidden', true);\n $('.refinement-bar').closest('.tab-pane.active').siblings().attr('aria-hidden', true);\n $('.refinement-bar').closest('.container.search-results').siblings().attr('aria-hidden', true);\n $('.refinement-bar .close').focus();\n });\n },\n\n closeRefinements: function () {\n // Refinements close button\n $('.container').on('click', '.refinement-bar button.close, .modal-background', function () {\n $('.refinement-bar, .modal-background').hide();\n $('.refinement-bar').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.row').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.tab-pane.active').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.container.search-results').siblings().attr('aria-hidden', false);\n $('.btn.filter-results').focus();\n });\n },\n\n resize: function () {\n // Close refinement bar and hide modal background if user resizes browser\n $(window).resize(function () {\n $('.refinement-bar, .modal-background').hide();\n $('.refinement-bar').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.row').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.tab-pane.active').siblings().attr('aria-hidden', false);\n $('.refinement-bar').closest('.container.search-results').siblings().attr('aria-hidden', false);\n });\n },\n\n sort: function () {\n // Handle sort order menu selection\n $('.container').on('change', '[name=sort-order]', function (e) {\n e.preventDefault();\n\n $.spinner().start();\n $(this).trigger('search:sort', this.value);\n $.ajax({\n url: this.value,\n data: { selectedUrl: this.value },\n method: 'GET',\n success: function (response) {\n $('.product-grid').empty().html(response);\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n },\n\n showMore: function () {\n // Show more products\n $('.container').on('click', '.show-more button', function (e) {\n e.stopPropagation();\n var showMoreUrl = $(this).data('url');\n e.preventDefault();\n\n $.spinner().start();\n $(this).trigger('search:showMore', e);\n $.ajax({\n url: showMoreUrl,\n data: { selectedUrl: showMoreUrl },\n method: 'GET',\n success: function (response) {\n $('.grid-footer').replaceWith(response);\n updateSortOptions(response);\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n },\n\n applyFilter: function () {\n // Handle refinement value selection and reset click\n $('.container').on(\n 'click',\n '.refinements li button, .refinement-bar button.reset, .filter-value button, .swatch-filter button',\n function (e) {\n e.preventDefault();\n e.stopPropagation();\n\n $.spinner().start();\n $(this).trigger('search:filter', e);\n $.ajax({\n url: $(this).data('href'),\n data: {\n page: $('.grid-footer').data('page-number'),\n selectedUrl: $(this).data('href')\n },\n method: 'GET',\n success: function (response) {\n parseResults(response);\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n },\n\n showContentTab: function () {\n // Display content results from the search\n $('.container').on('click', '.content-search', function () {\n if ($('#content-search-results').html() === '') {\n getContent($(this), $('#content-search-results'));\n }\n });\n\n // Display the next page of content results from the search\n $('.container').on('click', '.show-more-content button', function () {\n getContent($(this), $('#content-search-results'));\n $('.show-more-content').remove();\n });\n }\n};\n","'use strict';\n\nmodule.exports = function (include) {\n if (typeof include === 'function') {\n include();\n } else if (typeof include === 'object') {\n Object.keys(include).forEach(function (key) {\n if (typeof include[key] === 'function') {\n include[key]();\n }\n });\n }\n};\n","'use strict';\nvar focusHelper = require('../components/focus');\n\n/**\n * Retrieves the relevant pid value\n * @param {jquery} $el - DOM container for a given add to cart button\n * @return {string} - value to be used when adding product to cart\n */\nfunction getPidValue($el) {\n var pid;\n\n if ($('#quickViewModal').hasClass('show') && !$('.product-set').length) {\n pid = $($el).closest('.modal-content').find('.product-quickview').data('pid');\n } else if ($('.product-set-detail').length || $('.product-set').length) {\n pid = $($el).closest('.product-detail').find('.product-id').text();\n } else {\n pid = $('.product-detail:not(\".bundle-item\")').data('pid');\n }\n\n return pid;\n}\n\n/**\n * Retrieve contextual quantity selector\n * @param {jquery} $el - DOM container for the relevant quantity\n * @return {jquery} - quantity selector DOM container\n */\nfunction getQuantitySelector($el) {\n var quantitySelected;\n if ($el && $('.set-items').length) {\n quantitySelected = $($el).closest('.product-detail').find('.quantity-select');\n } else if ($el && $('.product-bundle').length) {\n var quantitySelectedModal = $($el).closest('.modal-footer').find('.quantity-select');\n var quantitySelectedPDP = $($el).closest('.bundle-footer').find('.quantity-select');\n if (quantitySelectedModal.val() === undefined) {\n quantitySelected = quantitySelectedPDP;\n } else {\n quantitySelected = quantitySelectedModal;\n }\n } else {\n quantitySelected = $('.quantity-select');\n }\n return quantitySelected;\n}\n\n/**\n * Retrieves the value associated with the Quantity pull-down menu\n * @param {jquery} $el - DOM container for the relevant quantity\n * @return {string} - value found in the quantity input\n */\nfunction getQuantitySelected($el) {\n return getQuantitySelector($el).val();\n}\n\n/**\n * Process the attribute values for an attribute that has image swatches\n *\n * @param {Object} attr - Attribute\n * @param {string} attr.id - Attribute ID\n * @param {Object[]} attr.values - Array of attribute value objects\n * @param {string} attr.values.value - Attribute coded value\n * @param {string} attr.values.url - URL to de/select an attribute value of the product\n * @param {boolean} attr.values.isSelectable - Flag as to whether an attribute value can be\n * selected. If there is no variant that corresponds to a specific combination of attribute\n * values, an attribute may be disabled in the Product Detail Page\n * @param {jQuery} $productContainer - DOM container for a given product\n * @param {Object} msgs - object containing resource messages\n */\nfunction processSwatchValues(attr, $productContainer, msgs) {\n attr.values.forEach(function (attrValue) {\n var $attrValue = $productContainer.find('[data-attr=\"' + attr.id + '\"] [data-attr-value=\"' +\n attrValue.value + '\"]');\n var $swatchButton = $attrValue.parent();\n\n if (attrValue.selected) {\n $attrValue.addClass('selected');\n $attrValue.siblings('.selected-assistive-text').text(msgs.assistiveSelectedText);\n } else {\n $attrValue.removeClass('selected');\n $attrValue.siblings('.selected-assistive-text').empty();\n }\n\n if (attrValue.url) {\n $swatchButton.attr('data-url', attrValue.url);\n } else {\n $swatchButton.removeAttr('data-url');\n }\n\n // Disable if not selectable\n $attrValue.removeClass('selectable unselectable');\n\n $attrValue.addClass(attrValue.selectable ? 'selectable' : 'unselectable');\n });\n}\n\n/**\n * Process attribute values associated with an attribute that does not have image swatches\n *\n * @param {Object} attr - Attribute\n * @param {string} attr.id - Attribute ID\n * @param {Object[]} attr.values - Array of attribute value objects\n * @param {string} attr.values.value - Attribute coded value\n * @param {string} attr.values.url - URL to de/select an attribute value of the product\n * @param {boolean} attr.values.isSelectable - Flag as to whether an attribute value can be\n * selected. If there is no variant that corresponds to a specific combination of attribute\n * values, an attribute may be disabled in the Product Detail Page\n * @param {jQuery} $productContainer - DOM container for a given product\n */\nfunction processNonSwatchValues(attr, $productContainer) {\n var $attr = '[data-attr=\"' + attr.id + '\"]';\n var $defaultOption = $productContainer.find($attr + ' .select-' + attr.id + ' option:first');\n $defaultOption.attr('value', attr.resetUrl);\n\n attr.values.forEach(function (attrValue) {\n var $attrValue = $productContainer\n .find($attr + ' [data-attr-value=\"' + attrValue.value + '\"]');\n $attrValue.attr('value', attrValue.url)\n .removeAttr('disabled');\n\n if (!attrValue.selectable) {\n $attrValue.attr('disabled', true);\n }\n });\n}\n\n/**\n * Routes the handling of attribute processing depending on whether the attribute has image\n * swatches or not\n *\n * @param {Object} attrs - Attribute\n * @param {string} attr.id - Attribute ID\n * @param {jQuery} $productContainer - DOM element for a given product\n * @param {Object} msgs - object containing resource messages\n */\nfunction updateAttrs(attrs, $productContainer, msgs) {\n // Currently, the only attribute type that has image swatches is Color.\n var attrsWithSwatches = ['color'];\n\n attrs.forEach(function (attr) {\n if (attrsWithSwatches.indexOf(attr.id) > -1) {\n processSwatchValues(attr, $productContainer, msgs);\n } else {\n processNonSwatchValues(attr, $productContainer);\n }\n });\n}\n\n/**\n * Updates the availability status in the Product Detail Page\n *\n * @param {Object} response - Ajax response object after an\n * attribute value has been [de]selected\n * @param {jQuery} $productContainer - DOM element for a given product\n */\nfunction updateAvailability(response, $productContainer) {\n var availabilityValue = '';\n var availabilityMessages = response.product.availability.messages;\n if (!response.product.readyToOrder) {\n availabilityValue = '
' + response.resources.info_selectforstock + '
' + message + '
' + attribute.label + ': '\n + attribute.value + '
';\n });\n }\n });\n\n return html;\n}\n\n/**\n * @typedef UpdatedOptionValue\n * @type Object\n * @property {string} id - Option value ID for look up\n * @property {string} url - Updated option value selection URL\n */\n\n/**\n * @typedef OptionSelectionResponse\n * @type Object\n * @property {string} priceHtml - Updated price HTML code\n * @property {Object} options - Updated Options\n * @property {string} options.id - Option ID\n * @property {UpdatedOptionValue[]} options.values - Option values\n */\n\n/**\n * Updates DOM using post-option selection Ajax response\n *\n * @param {OptionSelectionResponse} optionsHtml - Ajax response optionsHtml from selecting a product option\n * @param {jQuery} $productContainer - DOM element for current product\n */\nfunction updateOptions(optionsHtml, $productContainer) {\n\t// Update options\n $productContainer.find('.product-options').empty().html(optionsHtml);\n}\n\n/**\n * Dynamically creates Bootstrap carousel from response containing images\n * @param {Object[]} imgs - Array of large product images,along with related information\n * @param {jQuery} $productContainer - DOM element for a given product\n */\nfunction createCarousel(imgs, $productContainer) {\n var carousel = $productContainer.find('.carousel');\n $(carousel).carousel('dispose');\n var carouselId = $(carousel).attr('id');\n $(carousel).empty().append('').append($.parseHTML(html));\n\n var body = $html.find('.choice-of-bonus-product');\n var footer = $html.find('.modal-footer').children();\n\n return { body: body, footer: footer };\n}\n\n/**\n * Retrieves url to use when adding a product to the cart\n *\n * @param {Object} data - data object used to fill in dynamic portions of the html\n */\nfunction chooseBonusProducts(data) {\n $('.modal-body').spinner().start();\n\n if ($('#chooseBonusProductModal').length !== 0) {\n $('#chooseBonusProductModal').remove();\n }\n var bonusUrl;\n if (data.bonusChoiceRuleBased) {\n bonusUrl = data.showProductsUrlRuleBased;\n } else {\n bonusUrl = data.showProductsUrlListBased;\n }\n\n var htmlString = ''\n + '
'\n + ''\n + '
';\n $('body').append(htmlString);\n $('.modal-body').spinner().start();\n\n $.ajax({\n url: bonusUrl,\n method: 'GET',\n dataType: 'json',\n success: function (response) {\n var parsedHtml = parseHtml(response.renderedTemplate);\n $('#chooseBonusProductModal .modal-body').empty();\n $('#chooseBonusProductModal .enter-message').text(response.enterDialogMessage);\n $('#chooseBonusProductModal .modal-header .close .sr-only').text(response.closeButtonText);\n $('#chooseBonusProductModal .modal-body').html(parsedHtml.body);\n $('#chooseBonusProductModal .modal-footer').html(parsedHtml.footer);\n $('#chooseBonusProductModal').modal('show');\n $.spinner().stop();\n },\n error: function () {\n $.spinner().stop();\n }\n });\n}\n\n/**\n * Updates the Mini-Cart quantity value after the customer has pressed the \"Add to Cart\" button\n * @param {string} response - ajax response from clicking the add to cart button\n */\nfunction handlePostCartAdd(response) {\n $('.minicart').trigger('count:update', response);\n var messageType = response.error ? 'alert-danger' : 'alert-success';\n // show add to cart toast\n if (response.newBonusDiscountLineItem\n && Object.keys(response.newBonusDiscountLineItem).length !== 0) {\n chooseBonusProducts(response.newBonusDiscountLineItem);\n } else {\n if ($('.add-to-cart-messages').length === 0) {\n $('body').append(\n ''\n );\n }\n\n $('.add-to-cart-messages').append(\n ''\n + ''\n + ''\n + '
'\n + ''\n + response.message\n + '
'\n );\n\n setTimeout(function () {\n $('.add-to-basket-alert').remove();\n }, 5000);\n }\n}\n\n/**\n * Retrieves the bundle product item ID's for the Controller to replace bundle master product\n * items with their selected variants\n *\n * @return {string[]} - List of selected bundle product item ID's\n */\nfunction getChildProducts() {\n var childProducts = [];\n $('.bundle-item').each(function () {\n childProducts.push({\n pid: $(this).find('.product-id').text(),\n quantity: parseInt($(this).find('label.quantity').data('quantity'), 10)\n });\n });\n\n return childProducts.length ? JSON.stringify(childProducts) : [];\n}\n\n/**\n * Retrieve product options\n *\n * @param {jQuery} $productContainer - DOM element for current product\n * @return {string} - Product options and their selected values\n */\nfunction getOptions($productContainer) {\n var options = $productContainer\n .find('.product-option')\n .map(function () {\n var $elOption = $(this).find('.options-select');\n var urlValue = $elOption.val();\n var selectedValueId = $elOption.find('option[value=\"' + urlValue + '\"]')\n .data('value-id');\n return {\n optionId: $(this).data('option-id'),\n selectedValueId: selectedValueId\n };\n }).toArray();\n\n return JSON.stringify(options);\n}\n\n/**\n * Makes a call to the server to report the event of adding an item to the cart\n *\n * @param {string | boolean} url - a string representing the end point to hit so that the event can be recorded, or false\n */\nfunction miniCartReportingUrl(url) {\n if (url) {\n $.ajax({\n url: url,\n method: 'GET',\n success: function () {\n // reporting urls hit on the server\n },\n error: function () {\n // no reporting urls hit on the server\n }\n });\n }\n}\n\nmodule.exports = {\n attributeSelect: attributeSelect,\n methods: {\n editBonusProducts: function (data) {\n chooseBonusProducts(data);\n }\n },\n\n focusChooseBonusProductModal: function () {\n $('body').on('shown.bs.modal', '#chooseBonusProductModal', function () {\n $('#chooseBonusProductModal').siblings().attr('aria-hidden', 'true');\n $('#chooseBonusProductModal .close').focus();\n });\n },\n\n onClosingChooseBonusProductModal: function () {\n $('body').on('hidden.bs.modal', '#chooseBonusProductModal', function () {\n $('#chooseBonusProductModal').siblings().attr('aria-hidden', 'false');\n });\n },\n\n trapChooseBonusProductModalFocus: function () {\n $('body').on('keydown', '#chooseBonusProductModal', function (e) {\n var focusParams = {\n event: e,\n containerSelector: '#chooseBonusProductModal',\n firstElementSelector: '.close',\n lastElementSelector: '.add-bonus-products'\n };\n focusHelper.setTabNextFocus(focusParams);\n });\n },\n\n colorAttribute: function () {\n $(document).on('click', '[data-attr=\"color\"] button', function (e) {\n e.preventDefault();\n\n if ($(this).attr('disabled')) {\n return;\n }\n var $productContainer = $(this).closest('.set-item');\n if (!$productContainer.length) {\n $productContainer = $(this).closest('.product-detail');\n }\n\n attributeSelect($(this).attr('data-url'), $productContainer);\n });\n },\n\n selectAttribute: function () {\n $(document).on('change', 'select[class*=\"select-\"], .options-select', function (e) {\n e.preventDefault();\n\n var $productContainer = $(this).closest('.set-item');\n if (!$productContainer.length) {\n $productContainer = $(this).closest('.product-detail');\n }\n attributeSelect(e.currentTarget.value, $productContainer);\n });\n },\n\n availability: function () {\n $(document).on('change', '.quantity-select', function (e) {\n e.preventDefault();\n\n var $productContainer = $(this).closest('.product-detail');\n if (!$productContainer.length) {\n $productContainer = $(this).closest('.modal-content').find('.product-quickview');\n }\n\n if ($('.bundle-items', $productContainer).length === 0) {\n attributeSelect($(e.currentTarget).find('option:selected').data('url'),\n $productContainer);\n }\n });\n },\n\n addToCart: function () {\n $(document).on('click', 'button.add-to-cart, button.add-to-cart-global', function () {\n var addToCartUrl;\n var pid;\n var pidsObj;\n var setPids;\n\n $('body').trigger('product:beforeAddToCart', this);\n\n if ($('.set-items').length && $(this).hasClass('add-to-cart-global')) {\n setPids = [];\n\n $('.product-detail').each(function () {\n if (!$(this).hasClass('product-set-detail')) {\n setPids.push({\n pid: $(this).find('.product-id').text(),\n qty: $(this).find('.quantity-select').val(),\n options: getOptions($(this))\n });\n }\n });\n pidsObj = JSON.stringify(setPids);\n }\n\n pid = getPidValue($(this));\n\n var $productContainer = $(this).closest('.product-detail');\n if (!$productContainer.length) {\n $productContainer = $(this).closest('.quick-view-dialog').find('.product-detail');\n }\n\n addToCartUrl = getAddToCartUrl();\n\n var form = {\n pid: pid,\n pidsObj: pidsObj,\n childProducts: getChildProducts(),\n quantity: getQuantitySelected($(this))\n };\n\n if (!$('.bundle-item').length) {\n form.options = getOptions($productContainer);\n }\n\n $(this).trigger('updateAddToCartFormData', form);\n if (addToCartUrl) {\n $.ajax({\n url: addToCartUrl,\n method: 'POST',\n data: form,\n success: function (data) {\n handlePostCartAdd(data);\n $('body').trigger('product:afterAddToCart', data);\n $.spinner().stop();\n miniCartReportingUrl(data.reportingURL);\n },\n error: function () {\n $.spinner().stop();\n }\n });\n }\n });\n },\n selectBonusProduct: function () {\n $(document).on('click', '.select-bonus-product', function () {\n var $choiceOfBonusProduct = $(this).parents('.choice-of-bonus-product');\n var pid = $(this).data('pid');\n var maxPids = $('.choose-bonus-product-dialog').data('total-qty');\n var submittedQty = parseInt($choiceOfBonusProduct.find('.bonus-quantity-select').val(), 10);\n var totalQty = 0;\n $.each($('#chooseBonusProductModal .selected-bonus-products .selected-pid'), function () {\n totalQty += $(this).data('qty');\n });\n totalQty += submittedQty;\n var optionID = $choiceOfBonusProduct.find('.product-option').data('option-id');\n var valueId = $choiceOfBonusProduct.find('.options-select option:selected').data('valueId');\n if (totalQty <= maxPids) {\n var selectedBonusProductHtml = ''\n + ''\n + '
'\n ;\n $('#chooseBonusProductModal .selected-bonus-products').append(selectedBonusProductHtml);\n $('.pre-cart-products').html(totalQty);\n $('.selected-bonus-products .bonus-summary').removeClass('alert-danger');\n } else {\n $('.selected-bonus-products .bonus-summary').addClass('alert-danger');\n }\n });\n },\n removeBonusProduct: function () {\n $(document).on('click', '.selected-pid', function () {\n $(this).remove();\n var $selected = $('#chooseBonusProductModal .selected-bonus-products .selected-pid');\n var count = 0;\n if ($selected.length) {\n $selected.each(function () {\n count += parseInt($(this).data('qty'), 10);\n });\n }\n\n $('.pre-cart-products').html(count);\n $('.selected-bonus-products .bonus-summary').removeClass('alert-danger');\n });\n },\n enableBonusProductSelection: function () {\n $('body').on('bonusproduct:updateSelectButton', function (e, response) {\n $('button.select-bonus-product', response.$productContainer).attr('disabled',\n (!response.product.readyToOrder || !response.product.available));\n var pid = response.product.id;\n $('button.select-bonus-product', response.$productContainer).data('pid', pid);\n });\n },\n showMoreBonusProducts: function () {\n $(document).on('click', '.show-more-bonus-products', function () {\n var url = $(this).data('url');\n $('.modal-content').spinner().start();\n $.ajax({\n url: url,\n method: 'GET',\n success: function (html) {\n var parsedHtml = parseHtml(html);\n $('.modal-body').append(parsedHtml.body);\n $('.show-more-bonus-products:first').remove();\n $('.modal-content').spinner().stop();\n },\n error: function () {\n $('.modal-content').spinner().stop();\n }\n });\n });\n },\n addBonusProductsToCart: function () {\n $(document).on('click', '.add-bonus-products', function () {\n var $readyToOrderBonusProducts = $('.choose-bonus-product-dialog .selected-pid');\n var queryString = '?pids=';\n var url = $('.choose-bonus-product-dialog').data('addtocarturl');\n var pidsObject = {\n bonusProducts: []\n };\n\n $.each($readyToOrderBonusProducts, function () {\n var qtyOption =\n parseInt($(this)\n .data('qty'), 10);\n\n var option = null;\n if (qtyOption > 0) {\n if ($(this).data('optionid') && $(this).data('option-selected-value')) {\n option = {};\n option.optionId = $(this).data('optionid');\n option.productId = $(this).data('pid');\n option.selectedValueId = $(this).data('option-selected-value');\n }\n pidsObject.bonusProducts.push({\n pid: $(this).data('pid'),\n qty: qtyOption,\n options: [option]\n });\n pidsObject.totalQty = parseInt($('.pre-cart-products').html(), 10);\n }\n });\n queryString += JSON.stringify(pidsObject);\n queryString = queryString + '&uuid=' + $('.choose-bonus-product-dialog').data('uuid');\n queryString = queryString + '&pliuuid=' + $('.choose-bonus-product-dialog').data('pliuuid');\n $.spinner().start();\n $.ajax({\n url: url + queryString,\n method: 'POST',\n success: function (data) {\n $.spinner().stop();\n if (data.error) {\n $('#chooseBonusProductModal').modal('hide');\n if ($('.add-to-cart-messages').length === 0) {\n $('body').append('');\n }\n $('.add-to-cart-messages').append(\n ''\n + $choiceOfBonusProduct.find('.product-name').html()\n + '
'\n + ''\n + '
'\n + data.errorMessage + '
'\n );\n setTimeout(function () {\n $('.add-to-basket-alert').remove();\n }, 3000);\n } else {\n $('.configure-bonus-product-attributes').html(data);\n $('.bonus-products-step2').removeClass('hidden-xl-down');\n $('#chooseBonusProductModal').modal('hide');\n\n if ($('.add-to-cart-messages').length === 0) {\n $('body').append('');\n }\n $('.minicart-quantity').html(data.totalQty);\n $('.add-to-cart-messages').append(\n ''\n + data.msgSuccess + '
'\n );\n setTimeout(function () {\n $('.add-to-basket-alert').remove();\n if ($('.cart-page').length) {\n location.reload();\n }\n }, 1500);\n }\n },\n error: function () {\n $.spinner().stop();\n }\n });\n });\n },\n\n getPidValue: getPidValue,\n getQuantitySelected: getQuantitySelected,\n miniCartReportingUrl: miniCartReportingUrl\n};\n","'use strict';\n\nmodule.exports = {\n setTabNextFocus: function (focusParams) {\n var KEYCODE_TAB = 9;\n var isTabPressed = (focusParams.event.key === 'Tab' || focusParams.event.keyCode === KEYCODE_TAB);\n\n if (!isTabPressed) {\n return;\n }\n\n var firstFocusableEl = $(focusParams.containerSelector + ' ' + focusParams.firstElementSelector);\n var lastFocusableEl = $(focusParams.containerSelector + ' ' + focusParams.lastElementSelector);\n\n if ($(focusParams.containerSelector + ' ' + focusParams.lastElementSelector).is(':disabled')) {\n lastFocusableEl = $(focusParams.containerSelector + ' ' + focusParams.nextToLastElementSelector);\n if ($('.product-quickview.product-set').length > 0) {\n var linkElements = $(focusParams.containerSelector + ' a#fa-link.share-icons');\n lastFocusableEl = linkElements[linkElements.length - 1];\n }\n }\n\n if (focusParams.event.shiftKey) /* shift + tab */ {\n if ($(':focus').is(firstFocusableEl)) {\n lastFocusableEl.focus();\n focusParams.event.preventDefault();\n }\n } else /* tab */ {\n if ($(':focus').is(lastFocusableEl)) { // eslint-disable-line\n firstFocusableEl.focus();\n focusParams.event.preventDefault();\n }\n }\n }\n};\n"],"sourceRoot":""}