Making the main page folders open and close instead of showing everything

This commit is contained in:
2026-08-20 18:10:54 -04:00
parent c67ab034e0
commit 5c5b068c4c
2 changed files with 22 additions and 14 deletions
+21 -13
View File
@@ -698,20 +698,28 @@
return; return;
} }
container.innerHTML = groupNames.map(group => ` container.innerHTML = groupNames.map((group, i) => `
<div style="margin-bottom: 20px;"> <div class="tree-item">
<div style="font-weight:bold; color:#00a0ff; border-bottom:1px solid #444; padding-bottom:4px; margin-bottom:8px;"> <div class="tree-header directory" onclick="toggleTree(this)">
📁 ${group} <div class="tree-title">
</div> <span class="tree-icon">📁</span>
${data.groups[group].map(course => ` <span class="tree-name">${group}</span>
<div class="library-course" <span class="tree-stats">${data.groups[group].length} course${data.groups[group].length === 1 ? '' : 's'}</span>
onclick="loadCoursePath('${course.path.replace(/'/g, "\\'")}')"
style="background:#333; border-radius:5px; padding:10px 14px; margin:6px 0;
cursor:pointer; display:flex; justify-content:space-between; align-items:center;">
<span>🎓 ${course.name}</span>
<span style="color:#999; font-size:12px;">${course.media_files} media file${course.media_files === 1 ? '' : 's'}</span>
</div> </div>
`).join('')} <button class="tree-toggle">▶</button>
</div>
<div class="tree-content">
${data.groups[group].map(course => `
<div class="lesson-item"
onclick="loadCoursePath('${course.path.replace(/'/g, "\\'")}')">
<div class="lesson-title">
<span class="lesson-icon">🎓</span>
<span>${course.name}</span>
</div>
<span class="lesson-meta">${course.media_files} media file${course.media_files === 1 ? '' : 's'}</span>
</div>
`).join('')}
</div>
</div> </div>
`).join(''); `).join('');
}) })