feat: add auto-save functionality to question entry form

- Add auto-save on blur for question_number, marked_solution, actual_solution fields
- Add auto-save on status button click (correct/wrong/unattempted)
- Add auto-save for PDF metadata fields (subject, tags, notes)
- Add /autosave_question route for saving single question data
- Add /autosave_session_metadata route for saving session metadata
- Show subtle "Saved" badge indicator on successful auto-save
- Update save_questions to use UPSERT pattern (preserves classification data)
- Remove DELETE + INSERT pattern that was losing subject/chapter data

This provides a much better UX - users no longer lose data if they forget
to click "Generate PDF". All changes are saved automatically as they type.

Co-Authored-By: Claude (claude-opus-4-5-thinking) <noreply@anthropic.com>

routes/questions.py

@@ -363,14 +363,117 @@ def save_questions():
     if not session_owner or session_owner['user_id'] != current_user.id:
         conn.close(); return jsonify({'error': 'Unauthorized'}), 403
     conn.execute('UPDATE sessions SET subject = ?, tags = ?, notes = ? WHERE id = ?', (data.get('pdf_subject', ''), data.get('pdf_tags', ''), data.get('pdf_notes', ''), session_id))
-    conn.execute('DELETE FROM questions WHERE session_id = ?', (session_id,))
-    questions_to_insert = []
+
+    # Use UPSERT to preserve subject and chapter data from classification
     for q in questions:
-        questions_to_insert.append((session_id, q['image_id'], q['question_number'], "", q['status'], q.get('marked_solution', ""), q.get('actual_solution', ""), q.get('time_taken', ""), data.get('pdf_tags', '')))
-    conn.executemany('INSERT INTO questions (session_id, image_id, question_number, subject, status, marked_solution, actual_solution, time_taken, tags) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)', questions_to_insert)
+        existing = conn.execute('SELECT id, subject, chapter FROM questions WHERE image_id = ?', (q['image_id'],)).fetchone()
+        if existing:
+            # Update existing, preserve subject and chapter
+            conn.execute('''
+                UPDATE questions
+                SET question_number = ?, status = ?, marked_solution = ?, actual_solution = ?, tags = ?
+                WHERE image_id = ?
+            ''', (q['question_number'], q['status'], q.get('marked_solution', ''), q.get('actual_solution', ''), data.get('pdf_tags', ''), q['image_id']))
+        else:
+            # Insert new
+            conn.execute('''
+                INSERT INTO questions (session_id, image_id, question_number, subject, status, marked_solution, actual_solution, time_taken, tags)
+                VALUES (?, ?, ?, '', ?, ?, ?, ?, ?)
+            ''', (session_id, q['image_id'], q['question_number'], q['status'], q.get('marked_solution', ''), q.get('actual_solution', ''), q.get('time_taken', ''), data.get('pdf_tags', '')))
+
     conn.commit(); conn.close()
     return jsonify({'success': True, 'message': 'Questions saved successfully.'})
 
+@main_bp.route('/autosave_question', methods=['POST'])
+@login_required
+def autosave_question():
+    """Auto-save a single question's data without affecting other questions."""
+    data = request.json
+    session_id = data.get('session_id')
+    question = data.get('question', {})
+
+    if not session_id or not question.get('image_id'):
+        return jsonify({'error': 'Missing session_id or image_id'}), 400
+
+    conn = get_db_connection()
+    try:
+        # Verify session ownership
+        session_owner = conn.execute('SELECT user_id FROM sessions WHERE id = ?', (session_id,)).fetchone()
+        if not session_owner or session_owner['user_id'] != current_user.id:
+            conn.close()
+            return jsonify({'error': 'Unauthorized'}), 403
+
+        image_id = question['image_id']
+        question_number = question.get('question_number', '')
+        status = question.get('status', 'unattempted')
+        marked_solution = question.get('marked_solution', '')
+        actual_solution = question.get('actual_solution', '')
+
+        # Check if question already exists
+        existing = conn.execute('SELECT id, subject, chapter, tags FROM questions WHERE image_id = ?', (image_id,)).fetchone()
+
+        if existing:
+            # Update existing question, preserving subject and chapter
+            conn.execute('''
+                UPDATE questions
+                SET question_number = ?, status = ?, marked_solution = ?, actual_solution = ?
+                WHERE image_id = ?
+            ''', (question_number, status, marked_solution, actual_solution, image_id))
+        else:
+            # Insert new question
+            conn.execute('''
+                INSERT INTO questions (session_id, image_id, question_number, subject, status, marked_solution, actual_solution, time_taken, tags)
+                VALUES (?, ?, ?, '', ?, ?, ?, '', '')
+            ''', (session_id, image_id, question_number, status, marked_solution, actual_solution))
+
+        conn.commit()
+        conn.close()
+        return jsonify({'success': True})
+
+    except Exception as e:
+        conn.close()
+        current_app.logger.error(f"Auto-save question error: {e}")
+        return jsonify({'error': str(e)}), 500
+
+@main_bp.route('/autosave_session_metadata', methods=['POST'])
+@login_required
+def autosave_session_metadata():
+    """Auto-save session metadata (PDF subject, tags, notes)."""
+    data = request.json
+    session_id = data.get('session_id')
+
+    if not session_id:
+        return jsonify({'error': 'Missing session_id'}), 400
+
+    conn = get_db_connection()
+    try:
+        # Verify session ownership
+        session_owner = conn.execute('SELECT user_id FROM sessions WHERE id = ?', (session_id,)).fetchone()
+        if not session_owner or session_owner['user_id'] != current_user.id:
+            conn.close()
+            return jsonify({'error': 'Unauthorized'}), 403
+
+        # Update session metadata
+        conn.execute('''
+            UPDATE sessions
+            SET subject = ?, tags = ?, notes = ?
+            WHERE id = ?
+        ''', (
+            data.get('pdf_subject', ''),
+            data.get('pdf_tags', ''),
+            data.get('pdf_notes', ''),
+            session_id
+        ))
+
+        conn.commit()
+        conn.close()
+        return jsonify({'success': True})
+
+    except Exception as e:
+        conn.close()
+        current_app.logger.error(f"Auto-save metadata error: {e}")
+        return jsonify({'error': str(e)}), 500
+
 @main_bp.route(ROUTE_EXTRACT_QUESTION_NUMBER, methods=[METHOD_POST])
 @login_required
 def extract_question_number():

templates/question_entry_v2.html

@@ -1166,7 +1166,119 @@
             showStatus('Error: ' + e.message, 'danger');
         }
     }
-    
+
+    // --- AUTO-SAVE FUNCTIONALITY ---
+    let autoSaveTimeout = null;
+    let pendingSaves = new Set();
+
+    // Debounced auto-save for a single question
+    async function autoSaveQuestion(fieldset) {
+        if (!fieldset) return;
+
+        const imageId = fieldset.querySelector('input[name^="image_id_"]')?.value;
+        if (!imageId) return;
+
+        // Skip if already pending
+        if (pendingSaves.has(imageId)) return;
+        pendingSaves.add(imageId);
+
+        const questionData = {
+            image_id: imageId,
+            question_number: fieldset.querySelector('input[name^="question_number_"]')?.value || '',
+            status: fieldset.querySelector('select[name^="status_"]')?.value || 'unattempted',
+            marked_solution: fieldset.querySelector('input[name^="marked_solution_"]')?.value || '',
+            actual_solution: fieldset.querySelector('input[name^="actual_solution_"]')?.value || ''
+        };
+
+        try {
+            const response = await fetch('/autosave_question', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    session_id: sessionId,
+                    question: questionData
+                })
+            });
+
+            const result = await response.json();
+            if (result.success) {
+                // Show subtle save indicator on the fieldset
+                showAutoSaveIndicator(fieldset, true);
+            } else {
+                showAutoSaveIndicator(fieldset, false);
+            }
+        } catch (e) {
+            console.error('Auto-save failed:', e);
+            showAutoSaveIndicator(fieldset, false);
+        } finally {
+            pendingSaves.delete(imageId);
+        }
+    }
+
+    // Auto-save session metadata (PDF subject, tags, notes)
+    async function autoSaveSessionMetadata() {
+        try {
+            const response = await fetch('/autosave_session_metadata', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    session_id: sessionId,
+                    pdf_subject: document.getElementById('pdf_subject')?.value || '',
+                    pdf_tags: document.getElementById('pdf_tags')?.value || '',
+                    pdf_notes: document.getElementById('pdf_notes')?.value || '',
+                    pdf_name: document.getElementById('pdf_name')?.value || ''
+                })
+            });
+
+            const result = await response.json();
+            if (result.success) {
+                // Show subtle indicator near the generate PDF section
+                const legend = document.querySelector('legend.h4');
+                if (legend && !legend.querySelector('.autosave-badge')) {
+                    const badge = document.createElement('span');
+                    badge.className = 'autosave-badge badge bg-success ms-2';
+                    badge.innerHTML = '<i class="bi bi-check"></i> Saved';
+                    legend.appendChild(badge);
+                    setTimeout(() => badge.remove(), 2000);
+                }
+            }
+        } catch (e) {
+            console.error('Metadata auto-save failed:', e);
+        }
+    }
+
+    // Show a subtle save indicator on the fieldset
+    function showAutoSaveIndicator(fieldset, success) {
+        // Remove any existing indicator
+        const existing = fieldset.querySelector('.autosave-indicator');
+        if (existing) existing.remove();
+
+        const indicator = document.createElement('span');
+        indicator.className = 'autosave-indicator position-absolute';
+        indicator.style.cssText = 'top: 5px; right: 100px; font-size: 0.75rem;';
+
+        if (success) {
+            indicator.innerHTML = '<span class="badge bg-success"><i class="bi bi-check"></i> Saved</span>';
+        } else {
+            indicator.innerHTML = '<span class="badge bg-danger"><i class="bi bi-x"></i> Error</span>';
+        }
+
+        // Position relative to the legend
+        const legend = fieldset.querySelector('legend');
+        if (legend) {
+            legend.style.position = 'relative';
+            legend.appendChild(indicator);
+        }
+
+        // Remove after 2 seconds
+        setTimeout(() => indicator.remove(), 2000);
+    }
+
+    // Auto-save status when changed via status buttons
+    function autoSaveOnStatusChange(fieldset) {
+        autoSaveQuestion(fieldset);
+    }
+
     async function saveNotes() {
         if (!canvas || !currentNoteImageId) return;
 
@@ -1325,12 +1437,23 @@
         document.getElementById('practice_mode').addEventListener('change', handlePracticeModeChange);
         document.querySelectorAll('input[id^="question_number_"]').forEach(input => {
             input.addEventListener('change', handleQuestionNumberChange);
+            input.addEventListener('blur', () => autoSaveQuestion(input.closest('fieldset')));
+        });
+        // Auto-save on marked_solution and actual_solution change
+        document.querySelectorAll('input[id^="marked_solution_"], input[id^="actual_solution_"]').forEach(input => {
+            input.addEventListener('blur', () => autoSaveQuestion(input.closest('fieldset')));
         });
         document.addEventListener('keydown', handleShortcuts);
         document.querySelectorAll('.status-buttons').forEach(setupStatusButtons);
         document.getElementById('questions-form').addEventListener('submit', handleFormSubmit);
         document.getElementById('preview-btn').addEventListener('click', handlePreview);
-        
+
+        // Auto-save PDF metadata fields on blur
+        ['pdf_subject', 'pdf_tags', 'pdf_notes', 'pdf_name'].forEach(fieldId => {
+            const field = document.getElementById(fieldId);
+            if (field) field.addEventListener('blur', autoSaveSessionMetadata);
+        });
+
         document.getElementById('add-misc-question').addEventListener('click', handleAddMiscQuestion);
         
         document.getElementById('extract-classify-all').addEventListener('click', async () => {
@@ -1487,6 +1610,9 @@
                 buttons.forEach(b => b.classList.remove('active'));
                 btn.classList.add('active');
                 select.value = btn.dataset.status;
+                // Auto-save when status changes
+                const fieldset = group.closest('fieldset');
+                if (fieldset) autoSaveOnStatusChange(fieldset);
             });
         });
     }