Make this actually work!

This commit is contained in:
Eryn Wells 2018-07-28 16:04:22 -07:00
parent 7304e0079b
commit 398032ebe1

View file

@ -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();