Widget: DevGuidelines: Difference between revisions
From LINKS Community Center
Cschwentker (talk | contribs) No edit summary |
Cschwentker (talk | contribs) No edit summary |
||
Line 309: | Line 309: | ||
// Listen for changes in filter checkbox state. | // Listen for changes in filter checkbox state. | ||
document.getElementById(' | document.getElementById('thematic-filter').addEventListener('change', event => { | ||
applyFilters(); | applyFilters(); | ||
}, { passive: true }); | }, { passive: true }); | ||
document.getElementById(' | document.getElementById('audience-experience').addEventListener('change', event => { | ||
applyFilters(); | applyFilters(); | ||
}, { passive: true }); | }, { passive: true }); | ||
document.getElementById(' | document.getElementById('language-filter').addEventListener('change', event => { | ||
applyFilters(); | applyFilters(); | ||
}, { passive: true }); | }, { passive: true }); | ||
document.getElementById(' | document.getElementById('target-audience-filte').addEventListener('change', event => { | ||
applyFilters(); | applyFilters(); | ||
}, { passive: true }); | }, { passive: true }); | ||
Line 339: | Line 339: | ||
function clearFilters() { | function clearFilters() { | ||
document.querySelectorAll('# | document.querySelectorAll('#gl-filters input[type="checkbox').forEach(checkbox => checkbox.checked = checkbox.defaultChecked); | ||
applyFilters(true); | applyFilters(true); | ||
} | } | ||
function toggleFilter() { | function toggleFilter() { | ||
document.getElementById(' | document.getElementById('gl-filters').classList.toggle('open'); | ||
} | } | ||
</script> | </script> | ||
Line 420: | Line 420: | ||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
<button type="button" onclick="selectAll('# | <button type="button" onclick="selectAll('#thematic-filter')">Select all</button> | | ||
<button type="button" onclick="deselectAll('# | <button type="button" onclick="deselectAll('#thematic-filter')">Clear all</button> | ||
</div> | </div> | ||
<div class="filter-content" id=" | <div class="filter-content" id="thematic-filter"></div> | ||
</div> | </div> | ||
</div> | </div> | ||
Line 430: | Line 430: | ||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
<button type="button" onclick="selectAll('# | <button type="button" onclick="selectAll('#audience-experience-filter')">Select all</button> | | ||
<button type="button" onclick="deselectAll('# | <button type="button" onclick="deselectAll('#audience-experience-filter')">Clear all</button> | ||
</div> | </div> | ||
<div class="filter-content" id=" | <div class="filter-content" id="audience-experience-filter"></div> | ||
</div> | </div> | ||
</div> | </div> | ||
Line 440: | Line 440: | ||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
<button type="button" onclick="selectAll('# | <button type="button" onclick="selectAll('#language-filter')">Select all</button> | | ||
<button type="button" onclick="deselectAll('# | <button type="button" onclick="deselectAll('#language-filter')">Clear all</button> | ||
</div> | </div> | ||
<div class="filter-content" id=" | <div class="filter-content" id="language-filter"></div> | ||
</div> | </div> | ||
</div> | </div> | ||
Line 450: | Line 450: | ||
<div class="filter-container"> | <div class="filter-container"> | ||
<div class="filter-button-wrapper"> | <div class="filter-button-wrapper"> | ||
<button type="button" onclick="selectAll('# | <button type="button" onclick="selectAll('#target-audience-filter')">Select all</button> | | ||
<button type="button" onclick="deselectAll('# | <button type="button" onclick="deselectAll('#target-audience-filter')">Clear all</button> | ||
</div> | </div> | ||
<div class="filter-content" id=" | <div class="filter-content" id="target-audience-filter"></div> | ||
</div> | </div> | ||
</div> | </div> |
Revision as of 14:01, 22 November 2022
Development version of the List of Guidelines.
Not ready for production!