diff --git a/express/code/blocks/standalone-search-bar/standalone-search-bar.js b/express/code/blocks/standalone-search-bar/standalone-search-bar.js index f582de1b8..637ab766c 100644 --- a/express/code/blocks/standalone-search-bar/standalone-search-bar.js +++ b/express/code/blocks/standalone-search-bar/standalone-search-bar.js @@ -133,15 +133,16 @@ function initSearchFunction(block, searchBarWrapper) { document.addEventListener('click', handleDocumentClick, { passive: true }); const redirectSearch = async () => { - const { 'search-destination': searchDestination } = blockConfig; + const { 'search-destination': searchDestination, 'search-param-name': searchParamName } = blockConfig; // If destination is authored, use simple redirect with query param if (searchDestination && searchDestination.trim() !== '') { trackSearch('search-inspire'); const searchQuery = searchBar.value || ''; + const paramName = searchParamName?.trim() || 'q'; const separator = searchDestination.includes('?') ? '&' : '?'; - const targetLocation = `${searchDestination}${separator}q=${encodeURIComponent(searchQuery)}`; + const targetLocation = `${searchDestination}${separator}${paramName}=${encodeURIComponent(searchQuery)}`; window.location.assign(targetLocation); } diff --git a/express/code/blocks/template-x/template-x.js b/express/code/blocks/template-x/template-x.js index 0d7964929..0ddc40466 100755 --- a/express/code/blocks/template-x/template-x.js +++ b/express/code/blocks/template-x/template-x.js @@ -488,6 +488,29 @@ function updateLoadMoreButton(props, loadMore) { } } +const rowClampObservers = new WeakMap(); + +function applyRowClamp(block, visibleRows) { + if (!block.classList.contains('row-clamp-2') || !visibleRows) return; + block.querySelectorAll('.masonry-col').forEach((col) => { + Array.from(col.children).forEach((child, index) => { + if (index < visibleRows) { + child.style.removeProperty('display'); + } else { + child.style.display = 'none'; + } + }); + }); +} + +function observeRowClamp(block, props, innerWrapper) { + if (!block.classList.contains('row-clamp-2') || rowClampObservers.has(block)) return; + const observer = new MutationObserver(() => applyRowClamp(block, props.visibleRows)); + observer.observe(innerWrapper, { childList: true, subtree: true }); + rowClampObservers.set(block, observer); + applyRowClamp(block, props.visibleRows); +} + function chunkPairs(arr) { return Array.from( { length: Math.ceil(arr.length / 2) }, @@ -562,6 +585,7 @@ async function decorateLoadMoreButton(block, props) { loadMoreButton.addEventListener('click', async () => { trackSearch('select-load-more', BlockMediator.get('templateSearchSpecs').search_id); + props.visibleRows = (props.visibleRows || 2) + 2; loadMoreButton.classList.add('disabled'); const scrollPosition = window.scrollY; await decorateNewTemplates(block, props); @@ -1564,6 +1588,8 @@ async function decorateTemplates(block, props) { block.remove(); } + props.visibleRows = props.visibleRows || 2; + observeRowClamp(block, props, innerWrapper); props.masonry.draw(); window.addEventListener('resize', () => { props.masonry.draw();