Make this actually work!
This commit is contained in:
parent
7304e0079b
commit
398032ebe1
1 changed files with 18 additions and 27 deletions
|
@ -14,12 +14,11 @@ const sideProjects = {
|
||||||
},
|
},
|
||||||
|
|
||||||
populate(projectsElement) {
|
populate(projectsElement) {
|
||||||
const btn = projectsElement.querySelector('button[data-category="all"]');
|
projectsElement.querySelectorAll('button[data-category]').forEach((btn) => {
|
||||||
this._setupAllButton(btn);
|
|
||||||
|
|
||||||
projectsElement.querySelectorAll('button[data-category]').forEach(function(btn) {
|
|
||||||
let category = btn.dataset.category;
|
let category = btn.dataset.category;
|
||||||
if (category != null && category != 'all') {
|
if (category == 'all') {
|
||||||
|
sideProjects._setupAllButton(btn);
|
||||||
|
} else if (category != null) {
|
||||||
sideProjects.categoryButtons.push(btn);
|
sideProjects.categoryButtons.push(btn);
|
||||||
sideProjects._setupCategoryButton(btn);
|
sideProjects._setupCategoryButton(btn);
|
||||||
}
|
}
|
||||||
|
@ -42,44 +41,36 @@ const sideProjects = {
|
||||||
|
|
||||||
_setupAllButton(btn) {
|
_setupAllButton(btn) {
|
||||||
this.allButton = btn;
|
this.allButton = btn;
|
||||||
|
|
||||||
btn.addEventListener('click', function() {
|
btn.addEventListener('click', function() {
|
||||||
let toggledOn = this.classList.contains('selected');
|
this.classList.add('selected');
|
||||||
if (!toggledOn) {
|
sideProjects.categoryButtons.forEach((btn) => {
|
||||||
return;
|
btn.classList.remove('selected');
|
||||||
}
|
|
||||||
|
|
||||||
sideProjects.categoryButtons.forEach((cBtn) => {
|
|
||||||
cBtn.classList.remove('selected');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
sideProjects.updateProjectVisibility();
|
sideProjects.updateProjectVisibility();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
_setupCategoryButton(btn) {
|
_setupCategoryButton(btn) {
|
||||||
btn.addEventListener('click', function() {
|
btn.addEventListener('click', function() {
|
||||||
const stat = sideProjects.categoryStatus();
|
this.classList.toggle('selected');
|
||||||
let noCategoriesSelected = Object.values(stat).every((v) => !v);
|
|
||||||
let allCategoriesSelected = Object.values(stat).every((v) => v);
|
if (this.classList.contains('selected')) {
|
||||||
if (noCategoriesSelected || allCategoriesSelected) {
|
|
||||||
sideProjects.allButton.click();
|
|
||||||
} else {
|
|
||||||
sideProjects.allButton.classList.remove('selected');
|
sideProjects.allButton.classList.remove('selected');
|
||||||
|
} else {
|
||||||
|
const stat = sideProjects.categoryStatus();
|
||||||
|
const noCategoriesSelected = Object.values(stat).every((v) => !v);
|
||||||
|
const allCategoriesSelected = Object.values(stat).every((v) => v);
|
||||||
|
if (noCategoriesSelected || allCategoriesSelected) {
|
||||||
|
sideProjects.allButton.classList.add('selected');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
sideProjects.updateProjectVisibility();
|
sideProjects.updateProjectVisibility();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
window.addEventListener('load', function() {
|
window.addEventListener('load', function() {
|
||||||
// Set up toggle buttons.
|
|
||||||
document.querySelectorAll('button.toggle').forEach((btn) => {
|
|
||||||
btn.addEventListener('click', function(event) {
|
|
||||||
event.currentTarget.classList.toggle('selected');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
const projectsElement = document.querySelector('#side-projects');
|
const projectsElement = document.querySelector('#side-projects');
|
||||||
sideProjects.populate(projectsElement);
|
sideProjects.populate(projectsElement);
|
||||||
sideProjects.allButton.click();
|
sideProjects.allButton.click();
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue