diff --git a/website/modules/asset/ui/src/searchInputHandler.js b/website/modules/asset/ui/src/searchInputHandler.js index 3541553c..c2b222e9 100644 --- a/website/modules/asset/ui/src/searchInputHandler.js +++ b/website/modules/asset/ui/src/searchInputHandler.js @@ -12,6 +12,7 @@ const getTagLabel = function (tagItem) { const showTagItem = function (tagItem) { tagItem.style.display = ''; + tagItem.classList.remove('tag-item--hidden'); }; const hideTagItem = function (tagItem) { @@ -34,16 +35,30 @@ const toggleNoTagsMessage = function (container, hasVisible) { * Implements filtering decisions — determines which tags should be shown. */ -const filterTags = function (tagItems, filterValue, getLabel) { +const filterTags = function ( + tagItems, + filterValue, + getLabel, + defaultVisibleCount, +) { let hasVisible = false; - - tagItems.forEach(function (tag) { - const match = getLabel(tag).includes(filterValue); - if (match) { + const isSearchActive = filterValue.length > 0; + + tagItems.forEach(function (tag, index) { + if (isSearchActive) { + const match = getLabel(tag).includes(filterValue); + if (match) { + showTagItem(tag); + hasVisible = true; + } else { + hideTagItem(tag); + } + } else if (index < defaultVisibleCount) { showTagItem(tag); hasVisible = true; } else { - hideTagItem(tag); + tag.style.display = ''; + tag.classList.add('tag-item--hidden'); } }); @@ -70,13 +85,27 @@ const setupTagSearchForInput = function (input, options) { removePreviousHandler(input); + const csContainer = document.querySelector('.cs_container'); + let defaultVisibleCount = 5; + if (csContainer) { + const parsed = parseInt(csContainer.dataset.defaultVisibleTags, 10); + if (parsed > 0) { + defaultVisibleCount = parsed; + } + } + const handler = function () { const filterValue = input.value.trim().toLowerCase(); const container = input.closest(containerSelector); if (!container) return; const tagItems = container.querySelectorAll(tagSelector); - const hasVisible = filterTags(tagItems, filterValue, getTagLabelFn); + const hasVisible = filterTags( + tagItems, + filterValue, + getTagLabelFn, + defaultVisibleCount, + ); toggleNoTagsMessage(container, hasVisible); }; diff --git a/website/modules/case-studies-page/views/show.html b/website/modules/case-studies-page/views/show.html index fb85ac1d..2618b05c 100644 --- a/website/modules/case-studies-page/views/show.html +++ b/website/modules/case-studies-page/views/show.html @@ -159,7 +159,6 @@ class="cs_partnership-logo" src="{{ apos.attachment.url(partnerLogo, { size: 'full' }) }}" alt="{{ partnerLogo._alt or partner.title or '' }}" - loading="lazy" width="{{ apos.attachment.getWidth(partnerLogo) }}" height="{{ apos.attachment.getHeight(partnerLogo) }}" />