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

View File

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