ac8cc38e3b
- New GET /api/learning/content/:slug/slides (authMiddleware only)
Renders Marp markdown via marp-core, returns {css, slides[]} for
any authenticated user — no moderator access required
- showViewer: when content_type === 'presentation', hides the body card
and shows a presentation card with title, slide count, and View Slides button
Auto-opens the slide modal immediately on load; button allows re-opening
- openSlidesFromSlug(): fetches slides from user-accessible endpoint
then opens the existing slide preview modal (arrow keys, swipe, dots)
- Viewer already correctly hides feed/categories/search when viewing content;
"Back to Feed" button returns to the main list
64 lines
3 KiB
HTML
64 lines
3 KiB
HTML
<div class="module-header">
|
|
<h2><i class="fas fa-graduation-cap"></i> Learning Hub</h2>
|
|
<p>Pediatric education, clinical pearls, and self-assessment quizzes</p>
|
|
</div>
|
|
|
|
<!-- Search bar -->
|
|
<div class="card" style="padding:12px 16px;">
|
|
<div style="display:flex;gap:8px;align-items:center;">
|
|
<i class="fas fa-search" style="color:var(--g400);"></i>
|
|
<input type="text" id="lh-search" class="full-input" placeholder="Search topics, subjects..." style="border:none;flex:1;">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Category pills -->
|
|
<div id="lh-categories" class="lh-category-bar"></div>
|
|
|
|
<!-- Content feed -->
|
|
<div id="lh-feed" class="lh-feed"></div>
|
|
|
|
<!-- Content viewer (hidden until item clicked) -->
|
|
<div id="lh-viewer" class="lh-viewer hidden">
|
|
<button id="lh-back" class="btn-sm btn-ghost" style="margin-bottom:12px;"><i class="fas fa-arrow-left"></i> Back to Feed</button>
|
|
<!-- Presentation viewer — shown instead of body card for slide content -->
|
|
<div id="lh-presentation-viewer" class="hidden" style="margin-bottom:12px;"></div>
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 id="lh-viewer-title"></h3>
|
|
<span id="lh-viewer-meta" style="font-size:12px;color:var(--g500);"></span>
|
|
</div>
|
|
<div id="lh-viewer-body" class="lh-content-body" style="padding:16px;"></div>
|
|
</div>
|
|
|
|
<!-- Quiz section (if content has questions) -->
|
|
<div id="lh-quiz-section" class="hidden" style="margin-top:16px;">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-clipboard-question"></i> Quiz</h3>
|
|
<span id="lh-quiz-count" style="font-size:12px;color:var(--g500);"></span>
|
|
</div>
|
|
<div id="lh-quiz-questions" style="padding:16px;"></div>
|
|
<div style="padding:0 16px 16px;">
|
|
<button id="lh-submit-quiz" class="btn-generate"><i class="fas fa-check"></i> Submit Answers</button>
|
|
</div>
|
|
</div>
|
|
<!-- Results -->
|
|
<div id="lh-quiz-results" class="hidden" style="margin-top:12px;">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3><i class="fas fa-chart-bar"></i> Results</h3>
|
|
<span id="lh-quiz-score" class="model-tag"></span>
|
|
</div>
|
|
<div id="lh-quiz-explanations" style="padding:16px;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Past attempts -->
|
|
<div id="lh-progress-section" class="hidden" style="margin-top:12px;">
|
|
<div class="card" style="padding:12px 16px;">
|
|
<h4 style="margin:0 0 8px;font-size:13px;color:var(--g600);"><i class="fas fa-history"></i> Your Past Attempts</h4>
|
|
<div id="lh-progress-list" style="font-size:13px;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|