diff --git a/src/main/resources/static/js/filter.js b/src/main/resources/static/js/filter.js index df9db5080356dbe403abcbba8ff15878a085019a..b8639aadfafc672703ebe0ff8917642b8f2ca62a 100644 --- a/src/main/resources/static/js/filter.js +++ b/src/main/resources/static/js/filter.js @@ -9,6 +9,26 @@ $(document).ready(function () { updateStatus(); }); + $('#section-categories .filter-button-all').click(function() { + setAll('section-categories', true); + updateStatus(); + }); + + $('#section-categories .filter-button-none').click(function() { + setAll('section-categories', false); + updateStatus(); + }); + + $('#section-tags .filter-button-all').click(function() { + setAll('section-tags', true); + updateStatus(); + }); + + $('#section-tags .filter-button-none').click(function() { + setAll('section-tags', false); + updateStatus(); + }); + updateStatus(); }); @@ -47,4 +67,12 @@ function updateStatusForSectionName(identifier) { statusText = '0/1'; } section.querySelector('.collapsible-header-status').innerText = statusText; +} + +function setAll(identifier, checked) { + var section = document.getElementById(identifier); + var checkboxes = $(section).find('input[type=checkbox]'); + for(var i = 0; i < checkboxes.length; i++) { + checkboxes[i].checked = checked; + } } \ No newline at end of file diff --git a/src/main/resources/templates/filter/filterMacros.ftl b/src/main/resources/templates/filter/filterMacros.ftl index 6b924e46f21d70712672c305820b2639d50f6b57..64540d6559b32c07faf9371525ce5121c2b5dd32 100644 --- a/src/main/resources/templates/filter/filterMacros.ftl +++ b/src/main/resources/templates/filter/filterMacros.ftl @@ -35,6 +35,17 @@ </button> </#macro> +<#macro buttonsAllOrNone> + <div class="row no-margin"> + <div class="col s6 right-align"> + <a class="waves-effect waves-light btn budgetmaster-blue filter-button-all">${locale.getString("filter.tags.button.all")}</a> + </div> + <div class="col s6"> + <a class="waves-effect waves-light btn budgetmaster-blue filter-button-none">${locale.getString("filter.tags.button.none")}</a> + </div> + </div> +</#macro> + <#macro filterModal filterConfiguration> <div id="modalFilter" class="modal background-color"> <div class="modal-content"> @@ -100,6 +111,7 @@ <div class="collapsible-header-status"></div> </div> <div class="collapsible-body"> + <@buttonsAllOrNone/> <div class="row no-margin"> <div class="col s12"> <#list filterConfiguration.getFilterCategories() as filterCategory> @@ -119,11 +131,12 @@ <li id="section-tags"> <div class="collapsible-header"> - <i class="material-icons">label</i> + <i class="material-icons">local_offer</i> ${locale.getString("filter.tags")} <div class="collapsible-header-status"></div> </div> <div class="collapsible-body"> + <@buttonsAllOrNone/> <div class="row no-margin"> <div class="col s12"> <#list filterConfiguration.getFilterTags() as filterTag>