trent
/
hugo_themes_report
mirror of https://github.com/TrentSPalmer/hugo_themes_report.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

lint buildSelectionMenu.js

This commit is contained in:
Trent Palmer 2021-08-11 20:57:34 -07:00
parent 5c3d0a661d
commit 223c3f2196
1 changed files with 106 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

186
templates/js/buildSelectionMenu.js
View File

@ -1,45 +1,49 @@
function buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy) { function buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy) {
let tagSelectionHeadingRow = document.createElement('div'); let tagSelectionHeadingRow = document.createElement("div");
tagSelectionHeadingRow.id = 'tagSelectionHeadingRow'; tagSelectionHeadingRow.id = "tagSelectionHeadingRow";
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";
let tagSelectionHeading = document.createElement('h2'); let tagSelectionHeading = document.createElement("h2");
tagSelectionHeading.innerHTML = "Select Tags"; tagSelectionHeading.innerHTML = "Select Tags";
let tagSortByNameInputDiv = document.createElement('div'); let tagSortByNameInputDiv = document.createElement("div");
tagSortByNameInputDiv.style.display = 'flex'; tagSortByNameInputDiv.style.display = "flex";
tagSortByNameInputDiv.style.alignItems = 'center'; tagSortByNameInputDiv.style.alignItems = "center";
let tagSortByNameInput = document.createElement('input'); let tagSortByNameInput = document.createElement("input");
tagSortByNameInput.type = 'radio'; tagSortByNameInput.type = "radio";
tagSortByNameInput.id = 'tagSortByName'; tagSortByNameInput.id = "tagSortByName";
tagSortByNameInput.name = 'tagSortBy'; tagSortByNameInput.name = "tagSortBy";
tagSortByNameInput.value = 'tagSortByName'; tagSortByNameInput.value = "tagSortByName";
tagSortByNameInput.checked = tagSortBy === 'name' ? true : false; tagSortByNameInput.checked = tagSortBy === "name" ? true : false;
tagSortByNameInput.onclick = function() { buildResults(); }; tagSortByNameInput.onclick = function () {
buildResults();
};
tagSortByNameInputDiv.appendChild(tagSortByNameInput); tagSortByNameInputDiv.appendChild(tagSortByNameInput);
let tagSortByNameInputLabel = document.createElement('label'); let tagSortByNameInputLabel = document.createElement("label");
tagSortByNameInputLabel.for = 'tagSortByName'; tagSortByNameInputLabel.for = "tagSortByName";
tagSortByNameInputLabel.innerHTML = 'Name'; tagSortByNameInputLabel.innerHTML = "Name";
tagSortByNameInputDiv.appendChild(tagSortByNameInputLabel); tagSortByNameInputDiv.appendChild(tagSortByNameInputLabel);
let tagSortByNumThemesInputDiv = document.createElement('div'); let tagSortByNumThemesInputDiv = document.createElement("div");
tagSortByNumThemesInputDiv.style.display = 'flex'; tagSortByNumThemesInputDiv.style.display = "flex";
tagSortByNumThemesInputDiv.style.alignItems = 'center'; tagSortByNumThemesInputDiv.style.alignItems = "center";
let tagSortByNumThemesInput = document.createElement('input'); let tagSortByNumThemesInput = document.createElement("input");
tagSortByNumThemesInput.type = 'radio'; tagSortByNumThemesInput.type = "radio";
tagSortByNumThemesInput.id = 'tagSortByNumThemes'; tagSortByNumThemesInput.id = "tagSortByNumThemes";
tagSortByNumThemesInput.name = 'tagSortBy'; tagSortByNumThemesInput.name = "tagSortBy";
tagSortByNumThemesInput.value = 'tagSortByNumThemes'; tagSortByNumThemesInput.value = "tagSortByNumThemes";
tagSortByNumThemesInput.checked = tagSortBy === 'numThemes' ? true : false; tagSortByNumThemesInput.checked = tagSortBy === "numThemes" ? true : false;
tagSortByNumThemesInput.onclick = function() { buildResults(); }; tagSortByNumThemesInput.onclick = function () {
buildResults();
};
tagSortByNumThemesInputDiv.appendChild(tagSortByNumThemesInput); tagSortByNumThemesInputDiv.appendChild(tagSortByNumThemesInput);
let tagSortByNumThemesInputLabel = document.createElement('label'); let tagSortByNumThemesInputLabel = document.createElement("label");
tagSortByNumThemesInputLabel.for = 'tagSortByNumThemes'; tagSortByNumThemesInputLabel.for = "tagSortByNumThemes";
tagSortByNumThemesInputLabel.innerHTML = 'numThemes'; tagSortByNumThemesInputLabel.innerHTML = "numThemes";
tagSortByNumThemesInputDiv.appendChild(tagSortByNumThemesInputLabel); tagSortByNumThemesInputDiv.appendChild(tagSortByNumThemesInputLabel);
tagSelectionHeadingRow.appendChild(tagSelectionHeading); tagSelectionHeadingRow.appendChild(tagSelectionHeading);
@ -49,47 +53,52 @@ function buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy) {
} }
function buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy) { function buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy) {
let featureSelectionHeadingRow = document.createElement('div'); let featureSelectionHeadingRow = document.createElement("div");
featureSelectionHeadingRow.id = 'featureSelectionHeadingRow'; featureSelectionHeadingRow.id = "featureSelectionHeadingRow";
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";
let featureSelectionHeading = document.createElement('h2'); let featureSelectionHeading = document.createElement("h2");
featureSelectionHeading.innerHTML = "Select Features"; featureSelectionHeading.innerHTML = "Select Features";
let featureSortByNameInputDiv = document.createElement('div'); let featureSortByNameInputDiv = document.createElement("div");
featureSortByNameInputDiv.style.display = 'flex'; featureSortByNameInputDiv.style.display = "flex";
featureSortByNameInputDiv.style.alignItems = 'center'; featureSortByNameInputDiv.style.alignItems = "center";
let featureSortByNameInput = document.createElement('input'); let featureSortByNameInput = document.createElement("input");
featureSortByNameInput.type = 'radio'; featureSortByNameInput.type = "radio";
featureSortByNameInput.id = 'featureSortByName'; featureSortByNameInput.id = "featureSortByName";
featureSortByNameInput.name = 'featureSortBy'; featureSortByNameInput.name = "featureSortBy";
featureSortByNameInput.value = 'featureSortByName'; featureSortByNameInput.value = "featureSortByName";
featureSortByNameInput.checked = featureSortBy === 'name' ? true : false; featureSortByNameInput.checked = featureSortBy === "name" ? true : false;
featureSortByNameInput.onclick = function() { buildResults(); }; featureSortByNameInput.onclick = function () {
buildResults();
};
featureSortByNameInputDiv.appendChild(featureSortByNameInput); featureSortByNameInputDiv.appendChild(featureSortByNameInput);
let featureSortByNameInputLabel = document.createElement('label'); let featureSortByNameInputLabel = document.createElement("label");
featureSortByNameInputLabel.for = 'featureSortByName'; featureSortByNameInputLabel.for = "featureSortByName";
featureSortByNameInputLabel.innerHTML = 'Name'; featureSortByNameInputLabel.innerHTML = "Name";
featureSortByNameInputDiv.appendChild(featureSortByNameInputLabel); featureSortByNameInputDiv.appendChild(featureSortByNameInputLabel);
let featureSortByNumThemesInputDiv = document.createElement('div'); let featureSortByNumThemesInputDiv = document.createElement("div");
featureSortByNumThemesInputDiv.style.display = 'flex'; featureSortByNumThemesInputDiv.style.display = "flex";
featureSortByNumThemesInputDiv.style.alignItems = 'center'; featureSortByNumThemesInputDiv.style.alignItems = "center";
let featureSortByNumThemesInput = document.createElement('input'); let featureSortByNumThemesInput = document.createElement("input");
featureSortByNumThemesInput.type = 'radio'; featureSortByNumThemesInput.type = "radio";
featureSortByNumThemesInput.id = 'featureSortByNumThemes'; featureSortByNumThemesInput.id = "featureSortByNumThemes";
featureSortByNumThemesInput.name = 'featureSortBy'; featureSortByNumThemesInput.name = "featureSortBy";
featureSortByNumThemesInput.value = 'featureSortByNumThemes'; featureSortByNumThemesInput.value = "featureSortByNumThemes";
featureSortByNumThemesInput.checked = featureSortBy === 'numThemes' ? true : false; featureSortByNumThemesInput.checked =
featureSortByNumThemesInput.onclick = function() { buildResults(); }; featureSortBy === "numThemes" ? true : false;
featureSortByNumThemesInput.onclick = function () {
buildResults();
};
featureSortByNumThemesInputDiv.appendChild(featureSortByNumThemesInput); featureSortByNumThemesInputDiv.appendChild(featureSortByNumThemesInput);
let featureSortByNumThemesInputLabel = document.createElement('label'); let featureSortByNumThemesInputLabel = document.createElement("label");
featureSortByNumThemesInputLabel.for = 'featureSortByNumThemes'; featureSortByNumThemesInputLabel.for = "featureSortByNumThemes";
featureSortByNumThemesInputLabel.innerHTML = 'numThemes'; featureSortByNumThemesInputLabel.innerHTML = "numThemes";
featureSortByNumThemesInputDiv.appendChild(featureSortByNumThemesInputLabel); featureSortByNumThemesInputDiv.appendChild(featureSortByNumThemesInputLabel);
featureSelectionHeadingRow.appendChild(featureSelectionHeading); featureSelectionHeadingRow.appendChild(featureSelectionHeading);
@ -99,46 +108,63 @@ function buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy) {
} }
function buildTagSelectionDiv(selectedTags, availableTags, tagSortBy) { function buildTagSelectionDiv(selectedTags, availableTags, tagSortBy) {
let selectionMenuDiv = document.getElementById('selection-menu'); let selectionMenuDiv = document.getElementById("selection-menu");
buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy); buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy);
let tagSelectionRow = document.createElement('div'); let tagSelectionRow = document.createElement("div");
tagSelectionRow.style.display = 'flex'; tagSelectionRow.style.display = "flex";
tagSelectionRow.style.flexWrap = 'wrap'; tagSelectionRow.style.flexWrap = "wrap";
tagSelectionRow.style.justifyContent = 'space-around'; tagSelectionRow.style.justifyContent = "space-around";
selectionMenuDiv.appendChild(tagSelectionRow); selectionMenuDiv.appendChild(tagSelectionRow);
availableTags availableTags
.filter((x) => selectedTags.includes(x.tag)) .filter((x) => selectedTags.includes(x.tag))
.forEach((y) => { buildTagSelectionInput(y, true, tagSelectionRow); }); .forEach((y) => {
buildTagSelectionInput(y, true, tagSelectionRow);
});
availableTags availableTags
.filter((x) => !selectedTags.includes(x.tag)) .filter((x) => !selectedTags.includes(x.tag))
.forEach((y) => { buildTagSelectionInput(y, false, tagSelectionRow); }); .forEach((y) => {
buildTagSelectionInput(y, false, tagSelectionRow);
});
} }
function buildFeatureSelectionDiv(selectedFeatures, availableFeatures, featureSortBy) { function buildFeatureSelectionDiv(
let selectionMenuDiv = document.getElementById('selection-menu'); selectedFeatures,
availableFeatures,
featureSortBy
) {
let selectionMenuDiv = document.getElementById("selection-menu");
buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy); buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy);
let featureSelectionRow = document.createElement('div'); let featureSelectionRow = document.createElement("div");
featureSelectionRow.style.display = 'flex'; featureSelectionRow.style.display = "flex";
featureSelectionRow.style.flexWrap = 'wrap'; featureSelectionRow.style.flexWrap = "wrap";
featureSelectionRow.style.justifyContent = 'space-around'; featureSelectionRow.style.justifyContent = "space-around";
selectionMenuDiv.appendChild(featureSelectionRow); selectionMenuDiv.appendChild(featureSelectionRow);
availableFeatures availableFeatures
.filter((x) => selectedFeatures.includes(x.feature)) .filter((x) => selectedFeatures.includes(x.feature))
.forEach((y) => { buildFeatureSelectionInput(y, true, featureSelectionRow); }); .forEach((y) => {
buildFeatureSelectionInput(y, true, featureSelectionRow);
});
availableFeatures availableFeatures
.filter((x) => !selectedFeatures.includes(x.feature)) .filter((x) => !selectedFeatures.includes(x.feature))
.forEach((y) => { buildFeatureSelectionInput(y, false, featureSelectionRow); }); .forEach((y) => {
buildFeatureSelectionInput(y, false, featureSelectionRow);
});
} }
function buildSelectionMenu(sorted_themes, sortedBy, selectedTags, selectedFeatures) { function buildSelectionMenu(
sorted_themes,
sortedBy,
selectedTags,
selectedFeatures
) {
let tagSortBy = getTagSortBy(); let tagSortBy = getTagSortBy();
let featureSortBy = getFeatureSortBy(); let featureSortBy = getFeatureSortBy();
let availableTags = getAvailableTags(sorted_themes, tagSortBy); let availableTags = getAvailableTags(sorted_themes, tagSortBy);