Add Notes Hub, transcript search, stale nudges, study guide export, Next Up queue, activity heatmap

Six more dashboard features, all built on the per-course progress-file
scanning infrastructure from earlier sessions:

- Notes Hub (/notes): every lesson note across the library in one place,
  newest first, reusing the existing /recent/open cross-course jump route.
- Transcript search: opt-in checkbox on the Library search box, searching
  inside .srt/.vtt files. Kept cheap by doing a raw substring match as the
  filter step and only extracting a snippet for files that actually match.
- Stale course nudges ("Pick Back Up"): courses with progress that haven't
  been touched in 14+ days.
- Study guide export: compiles a course's notes into one downloadable
  markdown file, section/lesson structure preserved.
- Next Up queue: an ordered, persisted "what to tackle next" list with
  up/down reordering and a queue button on every course row.
- Activity heatmap: a 90-day contribution-style calendar in the Library
  Stats card.

_scan_library_activity() now does one walk over every course's progress
file per dashboard load; library stats, stale courses, and the heatmap all
derive from that single scan instead of three independent ones.

Also refactored the duplicated lesson-progress-key lookup (used in three
places now) into _resolve_lesson_progress_key(), and flagged a pre-existing
bug found along the way (not fixed here, kept out of scope): subtitle files
never actually attach to a Lesson object, so the video player's caption
track has never had anything to render.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

templates/course_dashboard.html

@@ -277,6 +277,41 @@
             margin-top: 2px;
         }
 
+        .heatmap-scroll {
+            overflow-x: auto;
+            margin-top: 15px;
+            padding-bottom: 4px;
+        }
+
+        .heatmap-grid {
+            display: flex;
+            gap: 3px;
+            width: max-content;
+        }
+
+        .heatmap-week {
+            display: flex;
+            flex-direction: column;
+            gap: 3px;
+        }
+
+        .heatmap-day {
+            width: 11px;
+            height: 11px;
+            border-radius: 2px;
+            background: var(--accent);
+            opacity: 0.12;
+        }
+
+        .heatmap-day.level-1 { opacity: 0.4; }
+        .heatmap-day.level-2 { opacity: 0.7; }
+        .heatmap-day.level-3 { opacity: 1; }
+
+        .btn-sm {
+            padding: 5px 10px;
+            font-size: 0.8em;
+        }
+
         .library-breadcrumb {
             color: var(--text-muted);
             font-size: 13px;
@@ -521,6 +556,45 @@
             font-size: 14px;
         }
 
+        .transcript-search-toggle {
+            display: flex;
+            align-items: center;
+            gap: 6px;
+            margin-top: 8px;
+            font-size: 0.85em;
+            color: var(--text-muted);
+            cursor: pointer;
+        }
+
+        .transcript-result {
+            background: var(--bg-tertiary);
+            border-radius: var(--radius);
+            padding: 10px 15px;
+            margin-bottom: 5px;
+            border-left: 3px solid var(--accent);
+            cursor: pointer;
+        }
+
+        .transcript-result:hover {
+            background: var(--bg-tertiary-hover);
+        }
+
+        .transcript-result-title {
+            font-weight: 500;
+        }
+
+        .transcript-result-course {
+            font-size: 0.8em;
+            color: var(--text-muted);
+        }
+
+        .transcript-result-snippet {
+            font-size: 0.85em;
+            color: var(--text-muted);
+            margin-top: 4px;
+            font-style: italic;
+        }
+
         .lesson-name {
             flex: 1;
             min-width: 0;
@@ -677,9 +751,17 @@
                 </div>
 
                 {% if stats.total_lessons %}
-                <button class="btn btn-secondary" style="margin-top: 5px;" onclick="markCourseWatched()">
-                    Mark all as completed
-                </button>
+                <div style="display: flex; gap: 10px; flex-wrap: wrap; margin-top: 5px;">
+                    <button class="btn btn-secondary" onclick="markCourseWatched()">
+                        Mark all as completed
+                    </button>
+                    <button class="btn btn-secondary" id="queue-toggle-btn" onclick="toggleQueued()">
+                        {{ '📌 Remove from Next Up' if is_queued else '📌 Add to Next Up' }}
+                    </button>
+                    {% if has_note %}
+                    <a class="btn btn-secondary" href="/course/study-guide">Download Study Guide</a>
+                    {% endif %}
+                </div>
                 {% endif %}
 
                 {% if stats.last_accessed_path %}
@@ -816,6 +898,60 @@
                         <div class="stats-tile-label">Day streak</div>
                     </div>
                 </div>
+                {% if activity_heatmap %}
+                <div class="heatmap-scroll">
+                    <div class="heatmap-grid">
+                        {% for week in activity_heatmap|batch(7) %}
+                        <div class="heatmap-week">
+                            {% for day in week %}
+                            {% set level = 0 if day.count == 0 else (1 if day.count == 1 else (2 if day.count == 2 else 3)) %}
+                            <div class="heatmap-day level-{{ level }}"
+                                 title="{{ day.date }}: {{ day.count }} lesson{{ '' if day.count == 1 else 's' }}"></div>
+                            {% endfor %}
+                        </div>
+                        {% endfor %}
+                    </div>
+                </div>
+                {% endif %}
+            </div>
+        </div>
+        {% endif %}
+        {% if next_up %}
+        <div class="container">
+            <div class="card" id="next-up-card">
+                <h2>📌 Next Up</h2>
+                <div id="next-up-list" style="margin-top: 12px;">
+                    {% for item in next_up %}
+                    <div class="lesson-item" data-path="{{ item.path }}">
+                        <div class="lesson-title" style="cursor: pointer;" onclick="loadCoursePath('{{ item.path|replace("'", "\\'") }}')">
+                            {% if item.has_thumbnail %}
+                            <img class="lesson-thumb" src="/library/thumbnail?path={{ item.path | urlencode }}" alt=""
+                                 onerror="this.replaceWith(courseFallbackIcon('🎓'))">
+                            {% else %}
+                            <span class="lesson-icon">🎓</span>
+                            {% endif %}
+                            <span class="lesson-name">{{ item.name }}</span>
+                        </div>
+                        <div class="lesson-meta">
+                            <button class="btn btn-secondary btn-sm" onclick="event.stopPropagation(); moveNextUp(this, -1)" title="Move up">▲</button>
+                            <button class="btn btn-secondary btn-sm" onclick="event.stopPropagation(); moveNextUp(this, 1)" title="Move down">▼</button>
+                            <button class="btn btn-secondary btn-sm" onclick="event.stopPropagation(); removeNextUp(this)" title="Remove">✕</button>
+                        </div>
+                    </div>
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+        {% endif %}
+        {% if stale_courses %}
+        <div class="container">
+            <div class="card">
+                <h2>⏰ Pick Back Up</h2>
+                <div style="margin-top: 12px;">
+                    {% for item in stale_courses %}
+                    {{ render_course_row(item, 'Last touched ' + item.last_touched_display) }}
+                    {% endfor %}
+                </div>
             </div>
         </div>
         {% endif %}
@@ -866,8 +1002,13 @@
                         <option value="name-desc">Name (Z→A)</option>
                     </select>
                 </div>
+                <label class="transcript-search-toggle">
+                    <input type="checkbox" id="search-transcripts-toggle" onchange="handleLibrarySearchInput(document.getElementById('library-search-input').value)">
+                    Also search transcripts
+                </label>
                 <p id="library-path-bar" class="library-breadcrumb"></p>
                 <div id="library-groups" style="margin-top: 15px;"></div>
+                <div id="transcript-results"></div>
             </div>
         </div>
     {% endif %}
@@ -879,6 +1020,7 @@
                 📚 <a href="/reset_course" style="color: inherit; text-decoration: none;">OfflineU</a>
             </div>
             <div class="footer-links">
+                <a href="/notes">📝 Notes</a>
                 <a href="/help">❓ Help</a>
                 <a href="/settings">⚙ Settings</a>
             </div>
@@ -931,6 +1073,8 @@
             searchActive = false;
             const searchInput = document.getElementById('library-search-input');
             if (searchInput) searchInput.value = '';
+            const transcriptResults = document.getElementById('transcript-results');
+            if (transcriptResults) transcriptResults.innerHTML = '';
 
             const container = document.getElementById('library-groups');
             container.innerHTML = '<p style="color:#999; padding: 6px 0;">Loading...</p>';
@@ -1015,7 +1159,10 @@
                         ${iconHtml}
                         <span class="lesson-name">${item.name}</span>
                     </div>
-                    <span class="lesson-meta">${item.media_files} media file${item.media_files === 1 ? '' : 's'}</span>
+                    <div class="lesson-meta">
+                        <span>${item.media_files} media file${item.media_files === 1 ? '' : 's'}</span>
+                        <button class="btn btn-secondary btn-sm" onclick="event.stopPropagation(); queueCourse('${safePath}', this)" title="Add to Next Up">📌</button>
+                    </div>
                 </div>
             `;
         }
@@ -1067,7 +1214,10 @@
         function runLibrarySearch(query) {
             searchActive = true;
             const container = document.getElementById('library-groups');
+            const transcriptContainer = document.getElementById('transcript-results');
             container.innerHTML = '<p style="color:#999; padding: 6px 0;">Searching...</p>';
+            if (transcriptContainer) transcriptContainer.innerHTML = '';
+
             fetch(`/library/search?q=${encodeURIComponent(query)}`)
                 .then(r => r.json())
                 .then(data => {
@@ -1083,6 +1233,53 @@
                 .catch(() => {
                     container.innerHTML = '<p style="color:#ff6b6b;">Search failed.</p>';
                 });
+
+            const searchTranscripts = document.getElementById('search-transcripts-toggle');
+            if (searchTranscripts && searchTranscripts.checked) {
+                runTranscriptSearch(query);
+            }
+        }
+
+        function runTranscriptSearch(query) {
+            const transcriptContainer = document.getElementById('transcript-results');
+            if (!transcriptContainer) return;
+            transcriptContainer.innerHTML = '<p style="color:#999; padding: 6px 0;">Searching transcripts...</p>';
+            fetch(`/library/search-transcripts?q=${encodeURIComponent(query)}`)
+                .then(r => r.json())
+                .then(data => {
+                    const results = data.results || [];
+                    if (!results.length) {
+                        transcriptContainer.innerHTML = '';
+                        return;
+                    }
+                    transcriptContainer.innerHTML = `<div style="font-weight:600; margin: 10px 0 8px; font-size: 0.9em; color: var(--text-muted);">In transcripts</div>` +
+                        results.map(r => `
+                            <div class="transcript-result" onclick="window.location.href='/recent/open?course_path=${encodeURIComponent(r.course_path)}&lesson_path=${encodeURIComponent(r.lesson_path)}'">
+                                <div class="transcript-result-title">${r.lesson_title}</div>
+                                <div class="transcript-result-course">${r.course_name}</div>
+                                <div class="transcript-result-snippet">${r.snippet}</div>
+                            </div>
+                        `).join('');
+                })
+                .catch(() => {
+                    transcriptContainer.innerHTML = '';
+                });
+        }
+
+        function queueCourse(path, btnEl) {
+            fetch('/api/next-up', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ path: path, queued: true })
+            })
+            .then(r => r.json())
+            .then(data => {
+                if (data.success && btnEl) {
+                    btnEl.textContent = '✓';
+                    btnEl.disabled = true;
+                }
+            })
+            .catch(() => {});
         }
 
         function loadCoursePath(path) {
@@ -1101,6 +1298,49 @@
             });
         }
 
+        // ---- Next Up queue (dashboard card) ----
+        function saveNextUpOrder() {
+            const paths = Array.from(document.querySelectorAll('#next-up-list .lesson-item')).map(row => row.dataset.path);
+            fetch('/api/next-up/reorder', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ paths: paths })
+            }).catch(() => {});
+        }
+
+        function moveNextUp(btnEl, direction) {
+            const row = btnEl.closest('.lesson-item');
+            const sibling = direction < 0 ? row.previousElementSibling : row.nextElementSibling;
+            if (!sibling) return;
+            if (direction < 0) {
+                row.parentNode.insertBefore(row, sibling);
+            } else {
+                row.parentNode.insertBefore(sibling, row);
+            }
+            saveNextUpOrder();
+        }
+
+        function removeNextUp(btnEl) {
+            const row = btnEl.closest('.lesson-item');
+            const path = row.dataset.path;
+            fetch('/api/next-up', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ path: path, queued: false })
+            })
+            .then(r => r.json())
+            .then(data => {
+                if (data.success) {
+                    row.remove();
+                    const list = document.getElementById('next-up-list');
+                    if (list && list.children.length === 0) {
+                        document.getElementById('next-up-card').closest('.container').remove();
+                    }
+                }
+            })
+            .catch(() => {});
+        }
+
         function markCourseWatched() {
             if (!confirm('Mark every lesson in this course as completed?')) return;
             fetch('/api/course/mark-watched', { method: 'POST' })
@@ -1114,6 +1354,25 @@
                 });
         }
 
+        {% if course %}
+        function toggleQueued() {
+            const btn = document.getElementById('queue-toggle-btn');
+            const currentlyQueued = btn.textContent.includes('Remove');
+            fetch('/api/next-up', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ path: {{ course.path|tojson }}, queued: !currentlyQueued })
+            })
+            .then(r => r.json())
+            .then(data => {
+                if (data.success) {
+                    btn.textContent = currentlyQueued ? '📌 Add to Next Up' : '📌 Remove from Next Up';
+                }
+            })
+            .catch(() => {});
+        }
+        {% endif %}
+
         document.addEventListener('DOMContentLoaded', loadLibrary);
 
     </script>