From 44b725f1170553a84933faa94fad41baccabaa5a Mon Sep 17 00:00:00 2001 From: Trent Palmer Date: Tue, 17 Aug 2021 17:23:51 -0700 Subject: [PATCH] add filter by license --- templates/base.html | 5 +- templates/js/buildPage.js | 70 +++++++----- templates/js/buildSelectionDivs.js | 40 +++++++ templates/js/buildSelectionHeadingRows.js | 58 ++++++++++ templates/js/buildSelectionInputs.js | 5 + templates/js/buildSelectionMenu.js | 80 +++++++------ templates/js/buildSortByDiv.js | 60 +++++----- .../js/buildTagAndFeatureSelectionDivs.js | 67 ----------- .../buildTagAndFeatureSelectionHeadingRows.js | 105 ------------------ templates/js/getAvailableTagsAndFeatures.js | 26 +++++ templates/js/selectionMenuCollapse.js | 11 ++ 11 files changed, 258 insertions(+), 269 deletions(-) create mode 100644 templates/js/buildSelectionDivs.js create mode 100644 templates/js/buildSelectionHeadingRows.js delete mode 100644 templates/js/buildTagAndFeatureSelectionDivs.js delete mode 100644 templates/js/buildTagAndFeatureSelectionHeadingRows.js diff --git a/templates/base.html b/templates/base.html index 1ae4d1d..ad1bded 100644 --- a/templates/base.html +++ b/templates/base.html @@ -19,6 +19,7 @@ +
@@ -31,8 +32,8 @@ var themes = {{ themes }}; {% include 'js/buildSelectionInputs.js' %} {% include 'js/getAvailableTagsAndFeatures.js' %} {% include 'js/buildSortByDiv.js' %} -{% include 'js/buildTagAndFeatureSelectionHeadingRows.js' %} -{% include 'js/buildTagAndFeatureSelectionDivs.js' %} +{% include 'js/buildSelectionHeadingRows.js' %} +{% include 'js/buildSelectionDivs.js' %} {% include 'js/buildSelectionMenu.js' %} {% include 'js/buildThemeTableRow.js' %} {% include 'js/getSortedThemes.js' %} diff --git a/templates/js/buildPage.js b/templates/js/buildPage.js index 6354b47..f364f8b 100644 --- a/templates/js/buildPage.js +++ b/templates/js/buildPage.js @@ -10,10 +10,12 @@ function getSortBy() { } } -function getSelectedTags() { - let tagSelectionInputs = document.getElementsByClassName("tagSelectionInput"); - if (tagSelectionInputs.length > 0) { - return [...tagSelectionInputs].filter((x) => x.checked).map((y) => y.value); +function getSelected(filterCategory) { + let selectionInputs = document.getElementsByClassName( + `${filterCategory}SelectionInput` + ); + if (selectionInputs.length > 0) { + return [...selectionInputs].filter((x) => x.checked).map((y) => y.value); } else { return []; } @@ -35,20 +37,7 @@ function getSelectedColumns() { } } -function getSelectedFeatures() { - let featureSelectionInputs = document.getElementsByClassName( - "featureSelectionInput" - ); - if (featureSelectionInputs.length > 0) { - return [...featureSelectionInputs] - .filter((x) => x.checked) - .map((y) => y.value); - } else { - return []; - } -} - -function getFilteredThemes(selectedTags, selectedFeatures) { +function getTagAndFeatureFilteredThemes(selectedTags, selectedFeatures) { if (selectedTags.length === 0 && selectedFeatures.length === 0) { return themes; } else { @@ -58,6 +47,16 @@ function getFilteredThemes(selectedTags, selectedFeatures) { } } +function getFilteredThemes(tagAndFeatureFilteredThemes, selectedLicenses) { + if (selectedLicenses.length === 0) { + return tagAndFeatureFilteredThemes; + } else { + return tagAndFeatureFilteredThemes.filter((x) => + selectedLicenses.includes(x.license) + ); + } +} + function getDState(x) { let e = document.getElementById(x); return e !== null ? e.style.display : "none"; @@ -69,6 +68,8 @@ function getDiplayState() { "sortByRow", "columnSelectionHeadingRow", "columnSelectionRow", + "licenseSelectionHeadingRow", + "licenseSelectionRow", "tagSelectionHeadingRow", "tagSelectionRow", "featureSelectionHeadingRow", @@ -110,22 +111,31 @@ function buildResults() { resultsTableHeadRow.appendChild(xTH); }); - let selectedTags = getSelectedTags(); - let selectedFeatures = getSelectedFeatures(); + let selectedTags = getSelected("tag"); + let selectedFeatures = getSelected("feature"); + let selectedLicenses = getSelected("license"); let sortedBy = getSortBy(); - // let filtered_themes = getFilteredThemes(selectedTags, selectedFeatures); - let sorted_themes = getFilteredThemes(selectedTags, selectedFeatures); - sortThemes(sorted_themes, sortedBy); - sorted_themes.forEach((theme) => addThemeTableRow(theme, selectedColumns)); + let tagAndFeatureFilteredThemes = getTagAndFeatureFilteredThemes( + selectedTags, + selectedFeatures + ); + let filtered_themes = getFilteredThemes( + tagAndFeatureFilteredThemes, + selectedLicenses + ); + sortThemes(filtered_themes, sortedBy); + filtered_themes.forEach((theme) => addThemeTableRow(theme, selectedColumns)); // from buildSelectionMenu.js buildSelectionMenu( - (sorted_themes = sorted_themes), - (sortBy = sortedBy), - (selectedTags = selectedTags), - (selectedFeatures = selectedFeatures), - (selectedColumns = selectedColumns), - (dState = getDiplayState()) + tagAndFeatureFilteredThemes, + filtered_themes, + sortedBy, + selectedTags, + selectedFeatures, + selectedLicenses, + selectedColumns, + getDiplayState() ); } diff --git a/templates/js/buildSelectionDivs.js b/templates/js/buildSelectionDivs.js new file mode 100644 index 0000000..ba7ccec --- /dev/null +++ b/templates/js/buildSelectionDivs.js @@ -0,0 +1,40 @@ +// called from buildSelectionMenu.js +function buildSelectionDiv( + selectedItems, + availableItems, + sortBy, + dStateSelectionRow, + dStateSelectionHeadingRow, + eParent, + menuSection +) { + // from buildSelectionHeadingRows.js + buildSelectionHeadingRow( + eParent, + sortBy, + dStateSelectionHeadingRow, + menuSection + ); + + let selectionRow = document.createElement("div"); + selectionRow.id = `${menuSection}SelectionRow`; + selectionRow.style.display = dStateSelectionRow; + selectionRow.style.flexWrap = "wrap"; + selectionRow.style.justifyContent = "space-around"; + + eParent.appendChild(selectionRow); + + availableItems + .filter((x) => selectedItems.includes(x[menuSection])) + .forEach((y) => { + // from buildSelectionInputs.js + buildInput(y, true, selectionRow); + }); + + availableItems + .filter((x) => !selectedItems.includes(x[menuSection])) + .forEach((y) => { + // from buildSelectionInputs.js + buildInput(y, false, selectionRow); + }); +} diff --git a/templates/js/buildSelectionHeadingRows.js b/templates/js/buildSelectionHeadingRows.js new file mode 100644 index 0000000..30a0ff8 --- /dev/null +++ b/templates/js/buildSelectionHeadingRows.js @@ -0,0 +1,58 @@ +// called from buildTagAndFeatureSelectionDivs.js +function buildSelectionHeadingRow( + eParent, + sortBy, + dStateSelectionHeadingRow, + menuSection +) { + let selectionHeadingRow = document.createElement("div"); + selectionHeadingRow.id = `${menuSection}SelectionHeadingRow`; + selectionHeadingRow.style.maxWidth = "100%"; + selectionHeadingRow.style.display = dStateSelectionHeadingRow; + selectionHeadingRow.style.justifyContent = "space-around"; + selectionHeadingRow.style.alignItems = "center"; + + let selectionHeading = document.createElement("h2"); + selectionHeading.innerHTML = `Select ${menuSection}s`; + + let sortByNameInputButton = buildRadioButton( + `${menuSection}SortByName`, + `${menuSection}SortBy`, + `${menuSection}SortByName`, + sortBy, + "name", + "Name" + ); + + let sortByNumThemesInputButton = buildRadioButton( + `${menuSection}SortByNumThemes`, + `${menuSection}SortBy`, + `${menuSection}SortByNumThemes`, + sortBy, + "numThemes", + "nThemes" + ); + + selectionHeadingRow.appendChild(selectionHeading); + selectionHeadingRow.appendChild(sortByNameInputButton); + selectionHeadingRow.appendChild(sortByNumThemesInputButton); + eParent.appendChild(selectionHeadingRow); + + let sortByNameInput = document.getElementById(`${menuSection}SortByName`); + sortByNameInputButton.onclick = function () { + if (!sortByNameInput.checked) { + sortByNameInput.checked = true; + buildResults(); + } + }; + + let sortByNumThemesInput = document.getElementById( + `${menuSection}SortByNumThemes` + ); + sortByNumThemesInputButton.onclick = function () { + if (!sortByNumThemesInput.checked) { + sortByNumThemesInput.checked = true; + buildResults(); + } + }; +} diff --git a/templates/js/buildSelectionInputs.js b/templates/js/buildSelectionInputs.js index cff600e..f4b097a 100644 --- a/templates/js/buildSelectionInputs.js +++ b/templates/js/buildSelectionInputs.js @@ -33,6 +33,11 @@ function buildInput(item, selected, inpParent) { inputSelectionButton.style.width = "12rem"; selectionInputLabel.innerHTML = `${item.tag} (${item.num_themes})`; selectionInput.classList.add("tagSelectionInput"); + } else if ("license" in item) { + selectionInput.value = item.license; + inputSelectionButton.style.width = "15rem"; + selectionInputLabel.innerHTML = `${item.license} (${item.num_themes})`; + selectionInput.classList.add("licenseSelectionInput"); } else if ("headingName" in item) { selectionInput.value = `${item.headingName}-column`; selectionInputLabel.innerHTML = item.headingText; diff --git a/templates/js/buildSelectionMenu.js b/templates/js/buildSelectionMenu.js index 67dee4f..ebbf74c 100644 --- a/templates/js/buildSelectionMenu.js +++ b/templates/js/buildSelectionMenu.js @@ -1,20 +1,11 @@ -function getTagSortBy() { - let tagSortByNumThemes = document.getElementById("tagSortByNumThemes"); - if (tagSortByNumThemes === null) { - return "numThemes"; - } else { - return tagSortByNumThemes.checked ? "numThemes" : "name"; - } -} - -function getFeatureSortBy() { - let featureSortByNumThemes = document.getElementById( - "featureSortByNumThemes" +function getMenuSortBy(sortBySelector) { + let sortByNumThemes = document.getElementById( + `${sortBySelector}SortByNumThemes` ); - if (featureSortByNumThemes === null) { + if (sortByNumThemes === null) { return "numThemes"; } else { - return featureSortByNumThemes.checked ? "numThemes" : "name"; + return sortByNumThemes.checked ? "numThemes" : "name"; } } @@ -56,46 +47,65 @@ function buildColumnSelectionDiv(selectedColumns, dState, eParent) { // called from buildPage.js function buildSelectionMenu( + tagAndFeatureFilteredThemes, sorted_themes, sortBy, selectedTags, selectedFeatures, + selectedLicenses, selectedColumns, dState ) { - let tagSortBy = getTagSortBy(); - let featureSortBy = getFeatureSortBy(); + let tagSortBy = getMenuSortBy("tag"); + let featureSortBy = getMenuSortBy("feature"); + let licenseSortBy = getMenuSortBy("license"); let selectionMenuDiv = document.getElementById("selection-menu"); // from getAvailableTagsAndFeatures.js let availableTags = getAvailableTags(sorted_themes, tagSortBy); // from getAvailableTagsAndFeatures.js let availableFeatures = getAvailableFeatures(sorted_themes, featureSortBy); + // from getAvailableTagsAndFeatures.js + let availableLicences = getAvailableLicenses( + tagAndFeatureFilteredThemes, + licenseSortBy + ); // from buildSortByDiv.js - buildSortByDiv((sortedBy = sortBy), (sortByRowDisplay = dState.sortByRow)); + buildSortByDiv(sortBy, dState.sortByRow); - buildColumnSelectionDiv( - (selectedColumns = selectedColumns), - (dState = dState), - (eParent = selectionMenuDiv) + buildColumnSelectionDiv(selectedColumns, dState, selectionMenuDiv); + + // from buildSelectionDivs.js + buildSelectionDiv( + selectedLicenses, + availableLicences, + licenseSortBy, + dState.licenseSelectionRow, + dState.licenseSelectionHeadingRow, + selectionMenuDiv, + "license" ); - // from buildTagAndFeatureSelectionDivs.js - buildTagSelectionDiv( - (selectedTags = selectedTags), - (availableTags = availableTags), - (tagSortBy = tagSortBy), - (dState = dState), - (eParent = selectionMenuDiv) + // from buildSelectionDivs.js + buildSelectionDiv( + selectedTags, + availableTags, + tagSortBy, + dState.tagSelectionRow, + dState.tagSelectionHeadingRow, + selectionMenuDiv, + "tag" ); - // from buildTagAndFeatureSelectionDivs.js - buildFeatureSelectionDiv( - (selectedFeatures = selectedFeatures), - (availableFeatures = availableFeatures), - (featureSortBy = featureSortBy), - (dState = dState), - (eParent = selectionMenuDiv) + // from buildSelectionDivs.js + buildSelectionDiv( + selectedFeatures, + availableFeatures, + featureSortBy, + dState.featureSelectionRow, + dState.featureSelectionHeadingRow, + selectionMenuDiv, + "feature" ); } diff --git a/templates/js/buildSortByDiv.js b/templates/js/buildSortByDiv.js index bf11f27..d94b521 100644 --- a/templates/js/buildSortByDiv.js +++ b/templates/js/buildSortByDiv.js @@ -21,52 +21,52 @@ function buildSortByDiv(sortBy, sortByRowDisplay) { // from buildButton.js let sortByStarsButton = buildRadioButton( - (inputID = "sortByStars"), - (inputName = "sortBy"), - (inputValue = "stars"), - (sortedBy = sortBy[0]), - (sortedBySelector = "stars"), - (labelText = "Stars") + "sortByStars", + "sortBy", + "stars", + sortBy[0], + "stars", + "Stars" ); // from buildButton.js let sortByLastCommitButton = buildRadioButton( - (inputID = "sortByDate"), - (inputName = "sortBy"), - (inputValue = "date"), - (sortedBy = sortBy[0]), - (sortedBySelector = "date"), - (labelText = "Latest Commit Date") + "sortByDate", + "sortBy", + "date", + sortBy[0], + "date", + "Latest Commit Date" ); // from buildButton.js let sortByMinVerButton = buildRadioButton( - (inputID = "sortByMinVer"), - (inputName = "sortBy"), - (inputValue = "minVer"), - (sortedBy = sortBy[0]), - (sortedBySelector = "minVer"), - (labelText = "Min Hugo Version") + "sortByMinVer", + "sortBy", + "minVer", + sortBy[0], + "minVer", + "Min Hugo Version" ); // from buildButton.js let sortByLicenseButton = buildRadioButton( - (inputID = "sortByLicense"), - (inputName = "sortBy"), - (inputValue = "license"), - (sortedBy = sortBy[0]), - (sortedBySelector = "license"), - (labelText = "License") + "sortByLicense", + "sortBy", + "license", + sortBy[0], + "license", + "License" ); // from buildButton.js let sortByNameButton = buildRadioButton( - (inputID = "sortByName"), - (inputName = "sortBy"), - (inputValue = "name"), - (sortedBy = sortBy[0]), - (sortedBySelector = "name"), - (labelText = "Name") + "sortByName", + "sortBy", + "name", + sortBy[0], + "name", + "Name" ); sortBy.forEach((x) => { diff --git a/templates/js/buildTagAndFeatureSelectionDivs.js b/templates/js/buildTagAndFeatureSelectionDivs.js deleted file mode 100644 index 51e8352..0000000 --- a/templates/js/buildTagAndFeatureSelectionDivs.js +++ /dev/null @@ -1,67 +0,0 @@ -// called from buildSelectionMenu.js -function buildTagSelectionDiv( - selectedTags, - availableTags, - tagSortBy, - dState, - eParent -) { - // from buildTagAndFeatureSelectionHeadingRows.js - buildTagSelectionHeadingRow(eParent, tagSortBy, dState); - - let tagSelectionRow = document.createElement("div"); - tagSelectionRow.id = "tagSelectionRow"; - tagSelectionRow.style.display = dState.tagSelectionRow; - tagSelectionRow.style.flexWrap = "wrap"; - tagSelectionRow.style.justifyContent = "space-around"; - - eParent.appendChild(tagSelectionRow); - - availableTags - .filter((x) => selectedTags.includes(x.tag)) - .forEach((y) => { - // from buildSelectionInputs.js - buildInput(y, true, tagSelectionRow); - }); - - availableTags - .filter((x) => !selectedTags.includes(x.tag)) - .forEach((y) => { - // from buildSelectionInputs.js - buildInput(y, false, tagSelectionRow); - }); -} - -// called from buildSelectionMenu.js -function buildFeatureSelectionDiv( - selectedFeatures, - availableFeatures, - featureSortBy, - dState, - eParent -) { - // from buildTagAndFeatureSelectionHeadingRows.js - buildFeatureSelectionHeadingRow(eParent, featureSortBy, dState); - - let featureSelectionRow = document.createElement("div"); - featureSelectionRow.id = "featureSelectionRow"; - featureSelectionRow.style.display = dState.featureSelectionRow; - featureSelectionRow.style.flexWrap = "wrap"; - featureSelectionRow.style.justifyContent = "space-around"; - - eParent.appendChild(featureSelectionRow); - - availableFeatures - .filter((x) => selectedFeatures.includes(x.feature)) - .forEach((y) => { - // from buildSelectionInputs.js - buildInput(y, true, featureSelectionRow); - }); - - availableFeatures - .filter((x) => !selectedFeatures.includes(x.feature)) - .forEach((y) => { - // from buildSelectionInputs.js - buildInput(y, false, featureSelectionRow); - }); -} diff --git a/templates/js/buildTagAndFeatureSelectionHeadingRows.js b/templates/js/buildTagAndFeatureSelectionHeadingRows.js deleted file mode 100644 index 45642fd..0000000 --- a/templates/js/buildTagAndFeatureSelectionHeadingRows.js +++ /dev/null @@ -1,105 +0,0 @@ -// called from buildTagAndFeatureSelectionDivs.js -function buildTagSelectionHeadingRow(eParent, tagSortBy, dState) { - let tagSelectionHeadingRow = document.createElement("div"); - tagSelectionHeadingRow.id = "tagSelectionHeadingRow"; - tagSelectionHeadingRow.style.maxWidth = "100%"; - tagSelectionHeadingRow.style.display = dState.tagSelectionHeadingRow; - tagSelectionHeadingRow.style.justifyContent = "space-around"; - tagSelectionHeadingRow.style.alignItems = "center"; - - let tagSelectionHeading = document.createElement("h2"); - tagSelectionHeading.innerHTML = "Select Tags"; - - let tagSortByNameInputButton = buildRadioButton( - (inputID = "tagSortByName"), - (inputName = "tagSortBy"), - (inputValue = "tagSortByName"), - (sortedBy = tagSortBy), - (sortedBySelector = "name"), - (labelText = "Name") - ); - - let tagSortByNumThemesInputButton = buildRadioButton( - (inputID = "tagSortByNumThemes"), - (inputName = "tagSortBy"), - (inputValue = "tagSortByNumThemes"), - (sortedBy = tagSortBy), - (sortedBySelector = "numThemes"), - (labelText = "nThemes") - ); - - tagSelectionHeadingRow.appendChild(tagSelectionHeading); - tagSelectionHeadingRow.appendChild(tagSortByNameInputButton); - tagSelectionHeadingRow.appendChild(tagSortByNumThemesInputButton); - eParent.appendChild(tagSelectionHeadingRow); - - let tagSortByNameInput = document.getElementById("tagSortByName"); - tagSortByNameInputButton.onclick = function () { - if (!tagSortByNameInput.checked) { - tagSortByNameInput.checked = true; - buildResults(); - } - }; - - let tagSortByNumThemesInput = document.getElementById("tagSortByNumThemes"); - tagSortByNumThemesInputButton.onclick = function () { - if (!tagSortByNumThemesInput.checked) { - tagSortByNumThemesInput.checked = true; - buildResults(); - } - }; -} - -// called from buildTagAndFeatureSelectionDivs.js -function buildFeatureSelectionHeadingRow(eParent, featureSortBy, dState) { - let featureSelectionHeadingRow = document.createElement("div"); - featureSelectionHeadingRow.id = "featureSelectionHeadingRow"; - featureSelectionHeadingRow.style.maxWidth = "100%"; - featureSelectionHeadingRow.style.display = dState.featureSelectionHeadingRow; - featureSelectionHeadingRow.style.justifyContent = "space-around"; - featureSelectionHeadingRow.style.alignItems = "center"; - - let featureSelectionHeading = document.createElement("h2"); - featureSelectionHeading.innerHTML = "Select Features"; - - let featureSortByNameInputButton = buildRadioButton( - (inputID = "featureSortByName"), - (inputName = "featureSortBy"), - (inputValue = "featureSortByName"), - (sortedBy = featureSortBy), - (sortedBySelector = "name"), - (labelText = "Name") - ); - - let featureSortByNumThemesInputButton = buildRadioButton( - (inputID = "featureSortByNumThemes"), - (inputName = "featureSortBy"), - (inputValue = "featureSortByNumThemes"), - (sortedBy = featureSortBy), - (sortedBySelector = "numThemes"), - (labelText = "nThemes") - ); - - featureSelectionHeadingRow.appendChild(featureSelectionHeading); - featureSelectionHeadingRow.appendChild(featureSortByNameInputButton); - featureSelectionHeadingRow.appendChild(featureSortByNumThemesInputButton); - eParent.appendChild(featureSelectionHeadingRow); - - let featureSortByNameInput = document.getElementById("featureSortByName"); - featureSortByNameInputButton.onclick = function () { - if (!featureSortByNameInput.checked) { - featureSortByNameInput.checked = true; - buildResults(); - } - }; - - let featureSortByNumThemesInput = document.getElementById( - "featureSortByNumThemes" - ); - featureSortByNumThemesInputButton.onclick = function () { - if (!featureSortByNumThemesInput.checked) { - featureSortByNumThemesInput.checked = true; - buildResults(); - } - }; -} diff --git a/templates/js/getAvailableTagsAndFeatures.js b/templates/js/getAvailableTagsAndFeatures.js index 0e09ee7..000c492 100644 --- a/templates/js/getAvailableTagsAndFeatures.js +++ b/templates/js/getAvailableTagsAndFeatures.js @@ -28,6 +28,32 @@ function getAvailableFeatures(sorted_themes, featureSortBy) { } } +// called from buildSelectionMenu.js +function getAvailableLicenses(tagAndFeatureFilteredThemes, licenseSortBy) { + let availableLicences = []; + tagAndFeatureFilteredThemes.forEach((x) => { + if (!availableLicences.includes(x.license)) { + availableLicences.push(x.license); + } + }); + let availableLicencesMap = availableLicences.map((x) => { + return { + license: x, + num_themes: tagAndFeatureFilteredThemes.filter((y) => y.license === x) + .length, + }; + }); + if (licenseSortBy === "numThemes") { + return availableLicencesMap + .sort((a, b) => a.license.localeCompare(b.license)) + .sort((a, b) => b.num_themes - a.num_themes); + } else { + return availableLicencesMap.sort((a, b) => + a.license.localeCompare(b.license) + ); + } +} + // called from buildSelectionMenu.js function getAvailableTags(sorted_themes, tagSortBy) { let result = []; diff --git a/templates/js/selectionMenuCollapse.js b/templates/js/selectionMenuCollapse.js index 1ff4ffe..f24ab22 100644 --- a/templates/js/selectionMenuCollapse.js +++ b/templates/js/selectionMenuCollapse.js @@ -4,12 +4,15 @@ function showSelectionOptionsButtons() { "button-for-showing-columns", "button-for-filter-by-tags", "button-for-filter-by-features", + "button-for-filter-by-license", "button-for-filter-by-tags-and-features", ].forEach((x) => (document.getElementById(x).style.display = "inline-block")); } let closeableMenus = [ "sortByRow", + "licenseSelectionHeadingRow", + "licenseSelectionRow", "columnSelectionHeadingRow", "columnSelectionRow", "tagSelectionHeadingRow", @@ -85,6 +88,14 @@ document.getElementById("button-for-filter-by-features").onclick = function () { document.getElementById("featureSelectionRow").style.display = "flex"; }; +document.getElementById("button-for-filter-by-license").onclick = function () { + closeMenus(); + showSelectionOptionsButtons(); + this.style.display = "none"; + document.getElementById("licenseSelectionHeadingRow").style.display = "flex"; + document.getElementById("licenseSelectionRow").style.display = "flex"; +}; + document.getElementById("button-for-filter-by-tags-and-features").onclick = function () { closeMenus();