add buttons over checks and radios

This commit is contained in:
Trent Palmer 2021-08-12 17:23:42 -07:00
parent 223c3f2196
commit 28a527a7d5
8 changed files with 229 additions and 186 deletions

View File

@ -4,7 +4,9 @@
<title>>Hugo Themes Report</title> <title>>Hugo Themes Report</title>
<meta charset='utf-8'> <meta charset='utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1'> <meta name='viewport' content='width=device-width, initial-scale=1'>
<style>{% include 'css/main.css' %}</style> <style>
{% include 'css/main.css' %}
</style>
</head> </head>
<body> <body>
<h1 id="title"> <h1 id="title">
@ -15,15 +17,16 @@
</div> </div>
<div id="results"> <div id="results">
</div> </div>
<script> <script>
var themes = {{ themes }}; var themes = {{ themes }};
{% include 'js/selectionMenuCollapse.js' %} {% include 'js/selectionMenuCollapse.js' %}
{% include 'js/buildTagAndFeatureSelectionInputs.js' %} {% include 'js/buildButton.js' %}
{% include 'js/getAvailableTagsAndFeatures.js' %} {% include 'js/buildTagAndFeatureSelectionInputs.js' %}
{% include 'js/buildSortByDiv.js' %} {% include 'js/getAvailableTagsAndFeatures.js' %}
{% include 'js/buildSelectionMenu.js' %} {% include 'js/buildSortByDiv.js' %}
{% include 'js/buildThemeTableRow.js' %} {% include 'js/buildSelectionMenu.js' %}
{% include 'js/buildPage.js' %} {% include 'js/buildThemeTableRow.js' %}
</script> {% include 'js/buildPage.js' %}
</script>
</body> </body>
</html> </html>

View File

@ -0,0 +1,24 @@
function buildRadioButton(
inputID,
inputName,
inputValue,
sortedBy,
sortedBySelector,
labelText
) {
let result = document.createElement("button");
result.style.display = "flex";
result.style.alignItems = "center";
result.style.height = "2rem";
let inputAttsA = `id=${inputID} type="radio" name=${inputName} value=${inputValue}`;
let inputAttsB = `onclick="buildResults()" style="margin:0 1rem 0 0"`;
let inputAttsC = sortedBy === sortedBySelector ? " checked" : "";
let resultButtonInput = `<input ${inputAttsA} ${inputAttsB} ${inputAttsC}/>`;
let resultButtonLabel = `<label for=${inputID}>${labelText}</label>`;
result.innerHTML = `${resultButtonInput}${resultButtonLabel}`;
return result;
}

View File

@ -4,52 +4,49 @@ function buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy) {
tagSelectionHeadingRow.style.maxWidth = "100%"; tagSelectionHeadingRow.style.maxWidth = "100%";
tagSelectionHeadingRow.style.display = "flex"; tagSelectionHeadingRow.style.display = "flex";
tagSelectionHeadingRow.style.justifyContent = "space-around"; tagSelectionHeadingRow.style.justifyContent = "space-around";
tagSelectionHeadingRow.style.alignItems = "center";
let tagSelectionHeading = document.createElement("h2"); let tagSelectionHeading = document.createElement("h2");
tagSelectionHeading.innerHTML = "Select Tags"; tagSelectionHeading.innerHTML = "Select Tags";
let tagSortByNameInputDiv = document.createElement("div"); let tagSortByNameInputButton = buildRadioButton(
tagSortByNameInputDiv.style.display = "flex"; (inputID = "tagSortByName"),
tagSortByNameInputDiv.style.alignItems = "center"; (inputName = "tagSortBy"),
let tagSortByNameInput = document.createElement("input"); (inputValue = "tagSortByName"),
tagSortByNameInput.type = "radio"; (sortedBy = tagSortBy),
tagSortByNameInput.id = "tagSortByName"; (sortedBySelector = "name"),
tagSortByNameInput.name = "tagSortBy"; (labelText = "Name")
tagSortByNameInput.value = "tagSortByName"; );
tagSortByNameInput.checked = tagSortBy === "name" ? true : false;
tagSortByNameInput.onclick = function () {
buildResults();
};
tagSortByNameInputDiv.appendChild(tagSortByNameInput);
let tagSortByNameInputLabel = document.createElement("label"); let tagSortByNumThemesInputButton = buildRadioButton(
tagSortByNameInputLabel.for = "tagSortByName"; (inputID = "tagSortByNumThemes"),
tagSortByNameInputLabel.innerHTML = "Name"; (inputName = "tagSortBy"),
tagSortByNameInputDiv.appendChild(tagSortByNameInputLabel); (inputValue = "tagSortByNumThemes"),
(sortedBy = tagSortBy),
let tagSortByNumThemesInputDiv = document.createElement("div"); (sortedBySelector = "numThemes"),
tagSortByNumThemesInputDiv.style.display = "flex"; (labelText = "nThemes")
tagSortByNumThemesInputDiv.style.alignItems = "center"; );
let tagSortByNumThemesInput = document.createElement("input");
tagSortByNumThemesInput.type = "radio";
tagSortByNumThemesInput.id = "tagSortByNumThemes";
tagSortByNumThemesInput.name = "tagSortBy";
tagSortByNumThemesInput.value = "tagSortByNumThemes";
tagSortByNumThemesInput.checked = tagSortBy === "numThemes" ? true : false;
tagSortByNumThemesInput.onclick = function () {
buildResults();
};
tagSortByNumThemesInputDiv.appendChild(tagSortByNumThemesInput);
let tagSortByNumThemesInputLabel = document.createElement("label");
tagSortByNumThemesInputLabel.for = "tagSortByNumThemes";
tagSortByNumThemesInputLabel.innerHTML = "numThemes";
tagSortByNumThemesInputDiv.appendChild(tagSortByNumThemesInputLabel);
tagSelectionHeadingRow.appendChild(tagSelectionHeading); tagSelectionHeadingRow.appendChild(tagSelectionHeading);
tagSelectionHeadingRow.appendChild(tagSortByNameInputDiv); tagSelectionHeadingRow.appendChild(tagSortByNameInputButton);
tagSelectionHeadingRow.appendChild(tagSortByNumThemesInputDiv); tagSelectionHeadingRow.appendChild(tagSortByNumThemesInputButton);
selectionMenuDiv.appendChild(tagSelectionHeadingRow); selectionMenuDiv.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();
}
};
} }
function buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy) { function buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy) {
@ -58,53 +55,51 @@ function buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy) {
featureSelectionHeadingRow.style.maxWidth = "100%"; featureSelectionHeadingRow.style.maxWidth = "100%";
featureSelectionHeadingRow.style.display = "flex"; featureSelectionHeadingRow.style.display = "flex";
featureSelectionHeadingRow.style.justifyContent = "space-around"; featureSelectionHeadingRow.style.justifyContent = "space-around";
featureSelectionHeadingRow.style.alignItems = "center";
let featureSelectionHeading = document.createElement("h2"); let featureSelectionHeading = document.createElement("h2");
featureSelectionHeading.innerHTML = "Select Features"; featureSelectionHeading.innerHTML = "Select Features";
let featureSortByNameInputDiv = document.createElement("div"); let featureSortByNameInputButton = buildRadioButton(
featureSortByNameInputDiv.style.display = "flex"; (inputID = "featureSortByName"),
featureSortByNameInputDiv.style.alignItems = "center"; (inputName = "featureSortBy"),
let featureSortByNameInput = document.createElement("input"); (inputValue = "featureSortByName"),
featureSortByNameInput.type = "radio"; (sortedBy = featureSortBy),
featureSortByNameInput.id = "featureSortByName"; (sortedBySelector = "name"),
featureSortByNameInput.name = "featureSortBy"; (labelText = "Name")
featureSortByNameInput.value = "featureSortByName"; );
featureSortByNameInput.checked = featureSortBy === "name" ? true : false;
featureSortByNameInput.onclick = function () {
buildResults();
};
featureSortByNameInputDiv.appendChild(featureSortByNameInput);
let featureSortByNameInputLabel = document.createElement("label"); let featureSortByNumThemesInputButton = buildRadioButton(
featureSortByNameInputLabel.for = "featureSortByName"; (inputID = "featureSortByNumThemes"),
featureSortByNameInputLabel.innerHTML = "Name"; (inputName = "featureSortBy"),
featureSortByNameInputDiv.appendChild(featureSortByNameInputLabel); (inputValue = "featureSortByNumThemes"),
(sortedBy = featureSortBy),
let featureSortByNumThemesInputDiv = document.createElement("div"); (sortedBySelector = "numThemes"),
featureSortByNumThemesInputDiv.style.display = "flex"; (labelText = "nThemes")
featureSortByNumThemesInputDiv.style.alignItems = "center"; );
let featureSortByNumThemesInput = document.createElement("input");
featureSortByNumThemesInput.type = "radio";
featureSortByNumThemesInput.id = "featureSortByNumThemes";
featureSortByNumThemesInput.name = "featureSortBy";
featureSortByNumThemesInput.value = "featureSortByNumThemes";
featureSortByNumThemesInput.checked =
featureSortBy === "numThemes" ? true : false;
featureSortByNumThemesInput.onclick = function () {
buildResults();
};
featureSortByNumThemesInputDiv.appendChild(featureSortByNumThemesInput);
let featureSortByNumThemesInputLabel = document.createElement("label");
featureSortByNumThemesInputLabel.for = "featureSortByNumThemes";
featureSortByNumThemesInputLabel.innerHTML = "numThemes";
featureSortByNumThemesInputDiv.appendChild(featureSortByNumThemesInputLabel);
featureSelectionHeadingRow.appendChild(featureSelectionHeading); featureSelectionHeadingRow.appendChild(featureSelectionHeading);
featureSelectionHeadingRow.appendChild(featureSortByNameInputDiv); featureSelectionHeadingRow.appendChild(featureSortByNameInputButton);
featureSelectionHeadingRow.appendChild(featureSortByNumThemesInputDiv); featureSelectionHeadingRow.appendChild(featureSortByNumThemesInputButton);
selectionMenuDiv.appendChild(featureSelectionHeadingRow); selectionMenuDiv.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();
}
};
} }
function buildTagSelectionDiv(selectedTags, availableTags, tagSortBy) { function buildTagSelectionDiv(selectedTags, availableTags, tagSortBy) {

View File

@ -1,53 +1,56 @@
function buildSortByDiv(sortedBy) { function buildSortByDiv(sortedBy) {
let menuDiv = document.getElementById('selection-menu'); let menuDiv = document.getElementById("selection-menu");
menuDiv.innerHTML = ''; menuDiv.innerHTML = "";
menuDiv.style.maxWidth = '100%'; menuDiv.style.maxWidth = "100%";
let sortByRow = document.createElement('div'); let sortByRow = document.createElement("div");
sortByRow.id = 'sortByRow'; sortByRow.id = "sortByRow";
sortByRow.style.width = '500px'; sortByRow.style.width = "500px";
sortByRow.style.maxWidth = '100%'; sortByRow.style.maxWidth = "100%";
sortByRow.style.display = 'flex'; sortByRow.style.display = "flex";
sortByRow.style.justifyContent = 'space-around'; sortByRow.style.justifyContent = "space-around";
sortByRow.style.margin = '1rem auto 1rem auto'; sortByRow.style.margin = "1rem auto 1rem auto";
let sortByPrompt = document.createElement('div'); let sortByPrompt = document.createElement("div");
sortByPrompt.style.display = "flex";
sortByPrompt.style.alignItems = "center";
sortByPrompt.innerHTML = "Sort By:"; sortByPrompt.innerHTML = "Sort By:";
sortByRow.appendChild(sortByPrompt); sortByRow.appendChild(sortByPrompt);
let sortByStarsDiv = document.createElement('div'); let sortByStarsButton = buildRadioButton(
let sortByStarsInput = document.createElement('input'); (inputID = "sortByStars"),
sortByStarsInput.type = 'radio'; (inputName = "sortBy"),
sortByStarsInput.id = 'sortByStars'; (inputValue = "stars"),
sortByStarsInput.name = 'sortBy'; (sortedBy = sortedBy),
sortByStarsInput.value = 'stars'; (sortedBySelector = "stars"),
sortByStarsInput.checked = sortedBy === 'stars' ? true : false; (labelText = "Stars")
sortByStarsInput.onclick = function() { buildResults(); }; );
sortByStarsDiv.appendChild(sortByStarsInput);
let sortByStarsLabel = document.createElement('label'); let sortByLastCommitButton = buildRadioButton(
sortByStarsLabel.for = 'stars'; (inputID = "sortByDate"),
sortByStarsLabel.innerHTML = 'Stars'; (inputName = "sortBy"),
sortByStarsDiv.appendChild(sortByStarsLabel); (inputValue = "date"),
(sortedBy = sortedBy),
let sortByLastCommitDiv = document.createElement('div'); (sortedBySelector = "date"),
let sortByLastCommitInput = document.createElement('input'); (labelText = "Latest Commit Date")
sortByLastCommitInput.type = 'radio'; );
sortByLastCommitInput.id = 'sortByDate';
sortByLastCommitInput.name = 'sortBy';
sortByLastCommitInput.value = 'date';
sortByLastCommitInput.checked = sortedBy === 'date' ? true : false;
sortByLastCommitInput.onclick = function() { buildResults(); };
sortByLastCommitDiv.appendChild(sortByLastCommitInput);
let sortByLastCommitLabel = document.createElement('label');
sortByLastCommitLabel.for = 'date';
sortByLastCommitLabel.innerHTML = 'Latest Commit Date';
sortByLastCommitDiv.appendChild(sortByLastCommitLabel);
sortByRow.appendChild(sortByStarsDiv);
sortByRow.appendChild(sortByLastCommitDiv);
sortByRow.appendChild(sortByStarsButton);
sortByRow.appendChild(sortByLastCommitButton);
menuDiv.appendChild(sortByRow); menuDiv.appendChild(sortByRow);
let sortByStarsInput = document.getElementById("sortByStars");
sortByStarsButton.onclick = function () {
if (!sortByStarsInput.checked) {
sortByStarsInput.checked = true;
buildResults();
}
};
let sortByLastCommitInput = document.getElementById("sortByDate");
sortByLastCommitButton.onclick = function () {
if (!sortByLastCommitInput.checked) {
sortByLastCommitInput.checked = true;
buildResults();
}
};
} }

View File

@ -1,49 +1,68 @@
function buildTagSelectionInput(tag, selected, tagSelectionRow) { function buildTagSelectionInput(tag, selected, tagSelectionRow) {
let tagSelectionInputDiv = document.createElement('div'); let tagSelectionInputButton = document.createElement("button");
tagSelectionInputDiv.style.width = '15rem'; tagSelectionInputButton.style.width = "15rem";
tagSelectionInputDiv.style.maxWidth = '50%'; tagSelectionInputButton.style.maxWidth = "50%";
tagSelectionInputDiv.style.marginTop = '.5rem'; tagSelectionInputButton.style.margin = ".5rem";
tagSelectionInputDiv.style.marginBottom = '.5rem'; tagSelectionInputButton.style.display = "flex";
tagSelectionInputButton.style.alignItems = "center";
let tagSelectionInput = document.createElement('input'); let tagSelectionInput = document.createElement("input");
tagSelectionInput.style.marginRight = "1rem";
tagSelectionInput.type = "checkbox"; tagSelectionInput.type = "checkbox";
tagSelectionInput.id = tag.tag + "-selection-input"; tagSelectionInput.id = tag.tag + "-selection-input";
tagSelectionInput.name = tag.tag + "-selection-input"; tagSelectionInput.name = tag.tag + "-selection-input";
tagSelectionInput.value = tag.tag; tagSelectionInput.value = tag.tag;
tagSelectionInput.checked = (selected) ? true : false; tagSelectionInput.checked = selected ? true : false;
tagSelectionInput.classList.add('tagSelectionInput'); tagSelectionInput.classList.add("tagSelectionInput");
tagSelectionInput.onclick = function() { buildResults(); }; tagSelectionInput.onclick = function () {
tagSelectionInputDiv.appendChild(tagSelectionInput); buildResults();
};
tagSelectionInputButton.appendChild(tagSelectionInput);
let tagSelectionInputLabel = document.createElement('label'); let tagSelectionInputLabel = document.createElement("label");
tagSelectionInputLabel.style.textAlign = "left";
tagSelectionInputLabel.for = tag.tag + "-selection-input"; tagSelectionInputLabel.for = tag.tag + "-selection-input";
tagSelectionInputLabel.innerHTML = tag.tag + ' (' + tag.num_themes + ')'; tagSelectionInputLabel.innerHTML = tag.tag + " (" + tag.num_themes + ")";
tagSelectionInputDiv.appendChild(tagSelectionInputLabel); tagSelectionInputButton.appendChild(tagSelectionInputLabel);
tagSelectionInputButton.onclick = function () {
tagSelectionInput.checked = !tagSelectionInput.checked;
buildResults();
};
tagSelectionRow.appendChild(tagSelectionInputDiv); tagSelectionRow.appendChild(tagSelectionInputButton);
} }
function buildFeatureSelectionInput(feature, selected, featureSelectionRow) { function buildFeatureSelectionInput(feature, selected, featureSelectionRow) {
let featureSelectionInputDiv = document.createElement('div'); let featureSelectionInputButton = document.createElement("button");
featureSelectionInputDiv.style.width = '30rem'; featureSelectionInputButton.style.width = "30rem";
featureSelectionInputDiv.style.maxWidth = '50%'; featureSelectionInputButton.style.maxWidth = "50%";
featureSelectionInputDiv.style.marginTop = '.5rem'; featureSelectionInputButton.style.margin = ".5rem";
featureSelectionInputDiv.style.marginBottom = '.5rem'; featureSelectionInputButton.style.display = "flex";
featureSelectionInputButton.style.alignItems = "center";
let featureSelectionInput = document.createElement('input'); let featureSelectionInput = document.createElement("input");
featureSelectionInput.style.marginRight = "1rem";
featureSelectionInput.type = "checkbox"; featureSelectionInput.type = "checkbox";
featureSelectionInput.id = feature.feature + "-selection-input"; featureSelectionInput.id = feature.feature + "-selection-input";
featureSelectionInput.name = feature.feature + "-selection-input"; featureSelectionInput.name = feature.feature + "-selection-input";
featureSelectionInput.value = feature.feature; featureSelectionInput.value = feature.feature;
featureSelectionInput.checked = (selected) ? true : false; featureSelectionInput.checked = selected ? true : false;
featureSelectionInput.classList.add('featureSelectionInput'); featureSelectionInput.classList.add("featureSelectionInput");
featureSelectionInput.onclick = function() { buildResults(); }; featureSelectionInput.onclick = function () {
featureSelectionInputDiv.appendChild(featureSelectionInput); buildResults();
};
featureSelectionInputButton.appendChild(featureSelectionInput);
let featureSelectionInputLabel = document.createElement('label'); let featureSelectionInputLabel = document.createElement("label");
featureSelectionInputLabel.for = feature.feature + "-selection-input"; featureSelectionInputLabel.style.textAlign = "left";
featureSelectionInputLabel.innerHTML = feature.feature + ' (' + feature.num_themes + ')'; featureSelectionInputLabel.for = feature.feature + "-selection-input";
featureSelectionInputDiv.appendChild(featureSelectionInputLabel); featureSelectionInputLabel.innerHTML =
feature.feature + " (" + feature.num_themes + ")";
featureSelectionInputButton.appendChild(featureSelectionInputLabel);
featureSelectionInputButton.onclick = function () {
featureSelectionInput.checked = !featureSelectionInput.checked;
buildResults();
};
featureSelectionRow.appendChild(featureSelectionInputDiv); featureSelectionRow.appendChild(featureSelectionInputButton);
} }

View File

@ -1,18 +1,19 @@
function addThemeTableRow(theme) { function addThemeTableRow(theme) {
let resultsTable = document.getElementById('resultsTable'); let resultsTable = document.getElementById("resultsTable");
let resultsTableRow = document.createElement("tr"); let resultsTableRow = document.createElement("tr");
let themeTD = document.createElement("td"); let themeTD = document.createElement("td");
themeTD.innerHTML = '<a href="' + theme.url + '" target="_blank">' + theme.short_name + '</a>'; themeTD.innerHTML =
themeTD.style.whiteSpace = 'nowrap'; '<a href="' + theme.url + '" target="_blank">' + theme.short_name + "</a>";
themeTD.style.overFlow = 'hidden'; themeTD.style.whiteSpace = "nowrap";
themeTD.style.width = '20%'; themeTD.style.overFlow = "hidden";
themeTD.style.width = "20%";
resultsTableRow.appendChild(themeTD); resultsTableRow.appendChild(themeTD);
let dateTD = document.createElement("td"); let dateTD = document.createElement("td");
dateTD.innerHTML = theme.date; dateTD.innerHTML = theme.date;
dateTD.style.textAlign = 'center'; dateTD.style.textAlign = "center";
dateTD.style.minWidth = '8rem'; dateTD.style.minWidth = "8rem";
resultsTableRow.appendChild(dateTD); resultsTableRow.appendChild(dateTD);
let starsTD = document.createElement("td"); let starsTD = document.createElement("td");
@ -21,8 +22,8 @@ function addThemeTableRow(theme) {
let commitTD = document.createElement("td"); let commitTD = document.createElement("td");
commitTD.innerHTML = theme.commit; commitTD.innerHTML = theme.commit;
commitTD.style.minWidth = '7rem'; commitTD.style.minWidth = "7rem";
resultsTableRow.appendChild(commitTD); resultsTableRow.appendChild(commitTD);
resultsTable.appendChild(resultsTableRow); resultsTable.appendChild(resultsTableRow);
}; }

View File

@ -1,24 +1,24 @@
function getAvailableFeatures(sorted_themes, featureSortBy) { function getAvailableFeatures(sorted_themes, featureSortBy) {
let result = []; let result = [];
sorted_themes.forEach(x => { sorted_themes.forEach((x) => {
x.features.forEach(feature => { x.features.forEach((feature) => {
if (result.length === 0) { if (result.length === 0) {
result.push({'feature': feature, 'num_themes': 1}); result.push({ feature: feature, num_themes: 1 });
} else { } else {
let features_in_result = result.map(y => y.feature); let features_in_result = result.map((y) => y.feature);
if (features_in_result.includes(feature)) { if (features_in_result.includes(feature)) {
result.forEach(w => { result.forEach((w) => {
if (w.feature === feature) { if (w.feature === feature) {
w.num_themes += 1; w.num_themes += 1;
} }
}); });
} else { } else {
result.push({'feature': feature, 'num_themes': 1}); result.push({ feature: feature, num_themes: 1 });
} }
} }
}); });
}); });
if (featureSortBy === 'numThemes') { if (featureSortBy === "numThemes") {
return result return result
.sort((a, b) => a.feature.localeCompare(b.feature)) .sort((a, b) => a.feature.localeCompare(b.feature))
.sort((a, b) => b.num_themes - a.num_themes); .sort((a, b) => b.num_themes - a.num_themes);
@ -29,25 +29,25 @@ function getAvailableFeatures(sorted_themes, featureSortBy) {
function getAvailableTags(sorted_themes, tagSortBy) { function getAvailableTags(sorted_themes, tagSortBy) {
let result = []; let result = [];
sorted_themes.forEach(x => { sorted_themes.forEach((x) => {
x.tags.forEach(tag => { x.tags.forEach((tag) => {
if (result.length === 0) { if (result.length === 0) {
result.push({'tag': tag, 'num_themes': 1}); result.push({ tag: tag, num_themes: 1 });
} else { } else {
let tags_in_result = result.map(y => y.tag); let tags_in_result = result.map((y) => y.tag);
if (tags_in_result.includes(tag)) { if (tags_in_result.includes(tag)) {
result.forEach(w => { result.forEach((w) => {
if (w.tag === tag) { if (w.tag === tag) {
w.num_themes += 1; w.num_themes += 1;
} }
}); });
} else { } else {
result.push({'tag': tag, 'num_themes': 1}); result.push({ tag: tag, num_themes: 1 });
} }
} }
}); });
}); });
if (tagSortBy === 'numThemes') { if (tagSortBy === "numThemes") {
return result return result
.sort((a, b) => a.tag.localeCompare(b.tag)) .sort((a, b) => a.tag.localeCompare(b.tag))
.sort((a, b) => b.num_themes - a.num_themes); .sort((a, b) => b.num_themes - a.num_themes);
@ -55,5 +55,3 @@ function getAvailableTags(sorted_themes, tagSortBy) {
return result.sort((a, b) => a.tag.localeCompare(b.tag)); return result.sort((a, b) => a.tag.localeCompare(b.tag));
} }
} }

View File

@ -1,6 +1,6 @@
var menuButton = document.getElementById("selection-button"); var menuButton = document.getElementById("selection-button");
menuButton.addEventListener("click", function() { menuButton.addEventListener("click", function () {
menuButton.classList.toggle("active"); menuButton.classList.toggle("active");
var selectionMenu = document.getElementById("selection-menu"); var selectionMenu = document.getElementById("selection-menu");
if (selectionMenu.style.display === "block") { if (selectionMenu.style.display === "block") {