trent/hugo_themes_report
1
0
Fork 0
mirror of https://github.com/TrentSPalmer/hugo_themes_report.git synced 2025-07-06 02:53:14 -07:00
Code Issues Projects Releases Wiki Activity

make columns selectable

Browse Source
This commit is contained in:
Trent Palmer
2021-08-14 17:42:01 -07:00
parent 3eb9282438
commit 7c58e22aa8
12 changed files with 427 additions and 306 deletions
Download Patch File Download Diff File Expand all files Collapse all files

222
templates/js/buildSelectionMenu.js
View File

@ -1,183 +1,101 @@
function buildTagSelectionHeadingRow(selectionMenuDiv, 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);
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 getTagSortBy() {
let tagSortByNumThemes = document.getElementById("tagSortByNumThemes");
if (tagSortByNumThemes === null) {
return "numThemes";
} else {
return tagSortByNumThemes.checked ? "numThemes" : "name";
}
}
function buildFeatureSelectionHeadingRow(
selectionMenuDiv,
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);
selectionMenuDiv.appendChild(featureSelectionHeadingRow);
let featureSortByNameInput = document.getElementById("featureSortByName");
featureSortByNameInputButton.onclick = function () {
if (!featureSortByNameInput.checked) {
featureSortByNameInput.checked = true;
buildResults();
}
};
let featureSortByNumThemesInput = document.getElementById(
function getFeatureSortBy() {
let featureSortByNumThemes = document.getElementById(
"featureSortByNumThemes"
);
featureSortByNumThemesInputButton.onclick = function () {
if (!featureSortByNumThemesInput.checked) {
featureSortByNumThemesInput.checked = true;
buildResults();
}
};
if (featureSortByNumThemes === null) {
return "numThemes";
} else {
return featureSortByNumThemes.checked ? "numThemes" : "name";
}
}
function buildTagSelectionDiv(selectedTags, availableTags, tagSortBy, dState) {
let selectionMenuDiv = document.getElementById("selection-menu");
buildTagSelectionHeadingRow(selectionMenuDiv, tagSortBy, dState);
function buildColumnSelectionHeadingRow(eParent, dState) {
let columnSelectionHeadingRow = document.createElement("div");
columnSelectionHeadingRow.id = "columnSelectionHeadingRow";
columnSelectionHeadingRow.style.maxWidth = "100%";
columnSelectionHeadingRow.style.display = dState.columnSelectionHeadingRow;
columnSelectionHeadingRow.style.alignItems = "center";
let tagSelectionRow = document.createElement("div");
tagSelectionRow.id = "tagSelectionRow";
tagSelectionRow.style.display = dState.tagSelectionRow;
tagSelectionRow.style.flexWrap = "wrap";
tagSelectionRow.style.justifyContent = "space-around";
let columnSelectionHeading = document.createElement("h2");
columnSelectionHeading.innerHTML = "Select Columns";
columnSelectionHeadingRow.appendChild(columnSelectionHeading);
eParent.appendChild(columnSelectionHeadingRow);
}
selectionMenuDiv.appendChild(tagSelectionRow);
function buildColumnSelectionDiv(selectedColumns, dState, eParent) {
buildColumnSelectionHeadingRow(eParent, dState);
availableTags
.filter((x) => selectedTags.includes(x.tag))
let columnSelectionRow = document.createElement("div");
columnSelectionRow.id = "columnSelectionRow";
columnSelectionRow.style.display = dState.columnSelectionRow;
columnSelectionRow.style.flexWrap = "wrap";
columnSelectionRow.style.justifyContent = "space-around";
eParent.appendChild(columnSelectionRow);
tableColumns
.filter((x) => selectedColumns.includes(x.headingName))
.forEach((y) => {
buildTagSelectionInput(y, true, tagSelectionRow);
buildInput(y, true, columnSelectionRow);
});
availableTags
.filter((x) => !selectedTags.includes(x.tag))
tableColumns
.filter((x) => !selectedColumns.includes(x.headingName))
.forEach((y) => {
buildTagSelectionInput(y, false, tagSelectionRow);
});
}
function buildFeatureSelectionDiv(
selectedFeatures,
availableFeatures,
featureSortBy,
dState
) {
let selectionMenuDiv = document.getElementById("selection-menu");
buildFeatureSelectionHeadingRow(selectionMenuDiv, featureSortBy, dState);
let featureSelectionRow = document.createElement("div");
featureSelectionRow.id = "featureSelectionRow";
featureSelectionRow.style.display = dState.featureSelectionRow;
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);
});
availableFeatures
.filter((x) => !selectedFeatures.includes(x.feature))
.forEach((y) => {
buildFeatureSelectionInput(y, false, featureSelectionRow);
buildInput(y, false, columnSelectionRow);
});
}
// called from buildPage.js
function buildSelectionMenu(
sorted_themes,
sortedBy,
selectedTags,
selectedFeatures,
selectedColumns,
dState
) {
let tagSortBy = getTagSortBy();
let featureSortBy = getFeatureSortBy();
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 buildSortByDiv.js
buildSortByDiv(sortedBy, dState.sortByRow);
buildTagSelectionDiv(selectedTags, availableTags, tagSortBy, dState);
buildColumnSelectionDiv(
(selectedColumns = selectedColumns),
(dState = dState),
(eParent = selectionMenuDiv)
);
// from buildTagAndFeatureSelectionDivs.js
buildTagSelectionDiv(
(selectedTags = selectedTags),
(availableTags = availableTags),
(tagSortBy = tagSortBy),
(dState = dState),
(eParent = selectionMenuDiv)
);
// from buildTagAndFeatureSelectionDivs.js
buildFeatureSelectionDiv(
selectedFeatures,
availableFeatures,
featureSortBy,
dState
(selectedFeatures = selectedFeatures),
(availableFeatures = availableFeatures),
(featureSortBy = featureSortBy),
(dState = dState),
(eParent = selectionMenuDiv)
);
}