Fix wiki accordion: topics first, then subtopics, then wiki text
This commit is contained in:
+30
-10
@@ -379,39 +379,59 @@ async function loadWiki() {
|
||||
const subtopicsDiv = topicDiv.querySelector('.wiki-subtopics');
|
||||
const topicTitle = topicDiv.querySelector('.topic-title');
|
||||
|
||||
// Topics start collapsed
|
||||
// All topics start collapsed
|
||||
subtopicsDiv.classList.add('hidden');
|
||||
|
||||
// Toggle topic on click
|
||||
// Track open state for this topic
|
||||
let isOpen = false;
|
||||
let openSubtopicIndex = -1;
|
||||
|
||||
// Toggle topic: click opens/closes subtopics, closes other topics
|
||||
topicTitle.onclick = () => {
|
||||
console.log('Topic clicked:', topicName, 'current hidden:', subtopicsDiv.classList.contains('hidden'));
|
||||
if (subtopicsDiv.classList.contains('hidden')) {
|
||||
subtopicsDiv.classList.remove('hidden');
|
||||
} else {
|
||||
// Close all other topics first
|
||||
document.querySelectorAll('.wiki-subtopics:not(.hidden)').forEach(otherSubtopics => {
|
||||
if (otherSubtopics !== subtopicsDiv) {
|
||||
otherSubtopics.classList.add('hidden');
|
||||
}
|
||||
});
|
||||
|
||||
if (isOpen) {
|
||||
subtopicsDiv.classList.add('hidden');
|
||||
isOpen = false;
|
||||
} else {
|
||||
subtopicsDiv.classList.remove('hidden');
|
||||
isOpen = true;
|
||||
}
|
||||
};
|
||||
|
||||
subtopics.forEach(sub => {
|
||||
subtopics.forEach((sub, index) => {
|
||||
const subtopicTitle = isEN && sub.subtopic_en ? sub.subtopic_en : sub.subtopic;
|
||||
const subtopicContent = isEN && sub.wiki_en ? sub.wiki_en : sub.wiki;
|
||||
const subtopicDiv = document.createElement('div');
|
||||
subtopicDiv.className = 'wiki-subtopic';
|
||||
subtopicDiv.innerHTML = `
|
||||
<div class="wiki-subtopic-title">${subtopicTitle || ''}</div>
|
||||
<div class="wiki-subtopic-content">
|
||||
<div class="wiki-subtopic-content hidden">
|
||||
<p>${subtopicContent || ''}</p>
|
||||
</div>
|
||||
`;
|
||||
subtopicsDiv.appendChild(subtopicDiv);
|
||||
|
||||
const title = subtopicDiv.querySelector('.wiki-subtopic-title');
|
||||
const content = subtopicDiv.querySelector('.wiki-subtopic-content');
|
||||
|
||||
title.onclick = (e) => {
|
||||
e.stopPropagation();
|
||||
|
||||
// Close other subtopics in this topic
|
||||
subtopicsDiv.querySelectorAll('.wiki-subtopic').forEach(s => {
|
||||
if (s !== subtopicDiv) s.classList.add('hidden');
|
||||
if (s !== subtopicDiv) {
|
||||
s.querySelector('.wiki-subtopic-content').classList.add('hidden');
|
||||
}
|
||||
});
|
||||
subtopicDiv.classList.toggle('hidden');
|
||||
|
||||
// Toggle this subtopic's content
|
||||
content.classList.toggle('hidden');
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user