From 804208b7b5a9ca4e2fc22ce01bbd8dfccc6ea472 Mon Sep 17 00:00:00 2001 From: Julian Lam Date: Wed, 9 Apr 2025 11:50:24 -0400 Subject: [PATCH] feat: show/hide categories on world page, #13255 --- public/language/en-GB/world.json | 5 ++++- public/src/client/world.js | 34 ++++++++++++++++++++++++++++++++ 2 files changed, 38 insertions(+), 1 deletion(-) diff --git a/public/language/en-GB/world.json b/public/language/en-GB/world.json index 3753335278..7fdb1569f2 100644 --- a/public/language/en-GB/world.json +++ b/public/language/en-GB/world.json @@ -14,5 +14,8 @@ "onboard.title": "Your window to the fediverse...", "onboard.what": "This is your personalized category made up of only content found outside of this forum. Whether something shows up in this page depends on whether you follow them, or whether that post was shared by someone you follow.", "onboard.why": "There's a lot that goes on outside of this forum, and not all of it is relevant to your interests. That's why following people is the best way to signal that you want to see more from someone.", - "onboard.how": "In the meantime, you can click on the shortcut buttons at the top to see what else this forum knows about, and start discovering some new content!" + "onboard.how": "In the meantime, you can click on the shortcut buttons at the top to see what else this forum knows about, and start discovering some new content!", + + "show-categories": "Show categories", + "hide-categories": "Hide categories" } \ No newline at end of file diff --git a/public/src/client/world.js b/public/src/client/world.js index 46cde7b32d..4642f9b6aa 100644 --- a/public/src/client/world.js +++ b/public/src/client/world.js @@ -11,6 +11,7 @@ define('forum/world', ['topicList', 'search', 'sort', 'hooks', 'alerts', 'api', handleIgnoreWatch(-1); handleHelp(); + handleCategories(); search.enableQuickSearch({ searchElements: { @@ -81,5 +82,38 @@ define('forum/world', ['topicList', 'search', 'sort', 'hooks', 'alerts', 'api', }); } + function handleCategories() { + // const optionsEl = document.getElementById('category-options'); + // const dropdownEl = optionsEl.querySelector('ul'); + const showEl = document.getElementById('show-categories'); + const hideEl = document.getElementById('hide-categories'); + const categoriesEl = document.querySelector('.categories-list'); + if (![showEl, hideEl, categoriesEl].every(Boolean)) { + return; + } + + const update = () => { + showEl.classList.toggle('hidden', visibility); + hideEl.classList.toggle('hidden', !visibility); + categoriesEl.classList.toggle('hidden', !visibility); + localStorage.setItem('world:show-categories', visibility); + } + + let visibility = localStorage.getItem('world:show-categories'); + console.log('got value', visibility); + visibility = visibility ? visibility === 'true' : true; // localStorage values are strings + update(); + + showEl.addEventListener('click', () => { + visibility = true; + update(); + }); + + hideEl.addEventListener('click', () => { + visibility = false; + update(); + }); + } + return World; });