Spaces:
Running
Running
| <!-- ────────────────────────────── static/index.html ────────────────────────────── --> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>StudyBuddy</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📚</text></svg>"> | |
| <link rel="stylesheet" href="/static/styles.css"> | |
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/highlight.js@11.9.0/styles/github-dark.min.css"> | |
| </head> | |
| <body> | |
| <div class="app-container"> | |
| <!-- Sidebar Overlay for Mobile --> | |
| <div class="sidebar-overlay" id="sidebar-overlay"></div> | |
| <!-- Sidebar --> | |
| <aside class="sidebar" id="sidebar"> | |
| <div class="sidebar-header"> | |
| <div class="logo"> | |
| <div class="logo-icon">📚</div> | |
| <div class="logo-text"> | |
| <h1>StudyBuddy</h1> | |
| <p>AI Document Analysis</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Website Menu --> | |
| <div class="sidebar-section"> | |
| <div class="section-header"> | |
| <h3>Menu</h3> | |
| </div> | |
| <nav class="website-menu"> | |
| <a href="#" class="menu-item active" data-section="projects"> | |
| <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> | |
| <path d="M3 7v10a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2H5a2 2 0 0 0-2-2z"/> | |
| <path d="M8 5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2H8V5z"/> | |
| </svg> | |
| <span>Projects</span> | |
| </a> | |
| <a href="#" class="menu-item" data-section="files"> | |
| <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> | |
| <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/> | |
| <polyline points="14,2 14,8 20,8"/> | |
| <line x1="16" y1="13" x2="8" y2="13"/> | |
| <line x1="16" y1="17" x2="8" y2="17"/> | |
| <polyline points="10,9 9,9 8,9"/> | |
| </svg> | |
| <span>Files</span> | |
| </a> | |
| <a href="#" class="menu-item" data-section="chat"> | |
| <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> | |
| <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/> | |
| </svg> | |
| <span>Chat</span> | |
| </a> | |
| <a href="#" class="menu-item" data-section="analytics"> | |
| <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> | |
| <path d="M3 3v18h18"/> | |
| <path d="M18.7 8l-5.1 5.2-2.8-2.7L7 14.3"/> | |
| </svg> | |
| <span>Analytics</span> | |
| </a> | |
| <a href="#" class="menu-item" data-section="settings"> | |
| <svg class="menu-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> | |
| <circle cx="12" cy="12" r="3"/> | |
| <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/> | |
| </svg> | |
| <span>Settings</span> | |
| </a> | |
| </nav> | |
| </div> | |
| <!-- Project Management --> | |
| <div class="sidebar-section"> | |
| <div class="section-header"> | |
| <h3>Projects</h3> | |
| <button id="new-project-btn" class="btn-icon" title="Create new project">+</button> | |
| </div> | |
| <div class="project-list" id="project-list"> | |
| <!-- Projects will be populated here --> | |
| </div> | |
| </div> | |
| <!-- User Controls --> | |
| <div class="sidebar-section"> | |
| <div class="section-header"> | |
| <h3>Account</h3> | |
| </div> | |
| <div class="user-info" id="user-info" style="display:none;"> | |
| <div class="user-avatar">👤</div> | |
| <div class="user-details"> | |
| <span class="user-email" id="user-email"></span> | |
| <button id="logout" class="btn-secondary">Logout</button> | |
| </div> | |
| </div> | |
| <div class="theme-toggle-wrapper"> | |
| <button id="theme-toggle" class="btn-icon" title="Toggle theme">🌙</button> | |
| </div> | |
| </div> | |
| </aside> | |
| <!-- Main Content --> | |
| <main class="main-content"> | |
| <!-- Top Bar with Hamburger Menu --> | |
| <div class="top-bar"> | |
| <button id="sidebar-toggle" class="hamburger-menu" aria-label="Toggle sidebar"> | |
| <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> | |
| <line x1="3" y1="6" x2="21" y2="6"/> | |
| <line x1="3" y1="12" x2="21" y2="12"/> | |
| <line x1="3" y1="18" x2="21" y2="18"/> | |
| </svg> | |
| </button> | |
| <div class="top-bar-title"> | |
| <h2 id="page-title">StudyBuddy</h2> | |
| </div> | |
| </div> | |
| <div class="content-container"> | |
| <!-- Project Header --> | |
| <header class="project-header" id="project-header" style="display:none;"> | |
| <div class="project-info"> | |
| <h2 id="current-project-name">Project Name</h2> | |
| <p id="current-project-description">Project description</p> | |
| </div> | |
| <div class="project-actions"> | |
| <button id="delete-project-btn" class="btn-secondary" style="display:none;">Delete Project</button> | |
| </div> | |
| </header> | |
| <!-- Welcome Screen (when no project selected) --> | |
| <div class="welcome-screen" id="welcome-screen"> | |
| <div class="welcome-content"> | |
| <div class="welcome-icon">🚀</div> | |
| <h2>Welcome to StudyBuddy</h2> | |
| <p>Create a new project to get started with AI-powered document analysis</p> | |
| <button id="welcome-new-project" class="btn-primary">Create Your First Project</button> | |
| </div> | |
| </div> | |
| <!-- Project Content (hidden until project selected) --> | |
| <div class="project-content" id="project-content" style="display:none;"> | |
| <!-- Files Section --> | |
| <section class="card reveal" id="files-section" style="display:none;"> | |
| <div class="card-header"> | |
| <h2>📄 Project Files</h2> | |
| <p>Browse your files, view summaries, and manage them</p> | |
| </div> | |
| <div id="files-list"></div> | |
| </section> | |
| <!-- Upload Section --> | |
| <section class="card reveal" id="upload-section"> | |
| <div class="card-header"> | |
| <h2>📁 Upload Documents</h2> | |
| <p>Upload your PDFs and DOCX files to start chatting with your materials</p> | |
| </div> | |
| <form id="upload-form"> | |
| <div class="file-drop-zone" id="file-drop-zone"> | |
| <div class="drop-zone-content"> | |
| <div class="drop-zone-icon">📄</div> | |
| <p>Drag & drop files here or click to browse</p> | |
| <span class="file-types">Supports: PDF, DOCX</span> | |
| </div> | |
| <input type="file" id="files" multiple accept=".pdf,.docx" hidden> | |
| </div> | |
| <div class="file-list" id="file-list" style="display:none;"> | |
| <h4>Selected Files:</h4> | |
| <div class="file-items" id="file-items"></div> | |
| </div> | |
| <div class="stored-files" id="stored-files" style="margin-top:16px;"> | |
| <h4>Project Files:</h4> | |
| <div id="stored-file-items"></div> | |
| </div> | |
| <button type="submit" class="btn-primary" id="upload-btn"> | |
| <span class="btn-text">Upload Documents</span> | |
| <span class="btn-loading" style="display:none;"> | |
| <div class="spinner"></div> | |
| Processing... | |
| </span> | |
| </button> | |
| </form> | |
| <div class="upload-progress" id="upload-progress" style="display:none;"> | |
| <div class="progress-header"> | |
| <h4>Processing Documents</h4> | |
| <span class="progress-status" id="progress-status">Initializing...</span> | |
| </div> | |
| <div class="progress-bar"> | |
| <div class="progress-fill" id="progress-fill"></div> | |
| </div> | |
| <div class="progress-log" id="progress-log"></div> | |
| </div> | |
| </section> | |
| <!-- Analytics Section --> | |
| <section class="card reveal" id="analytics-section" style="display:none;"> | |
| <div class="card-header"> | |
| <h2>📊 Analytics Dashboard</h2> | |
| <p>Track your usage of AI models and agents</p> | |
| </div> | |
| <div class="analytics-content"> | |
| <div class="analytics-controls"> | |
| <div class="analytics-period"> | |
| <label for="analytics-period">Time Period:</label> | |
| <select id="analytics-period" class="analytics-select"> | |
| <option value="7">Last 7 days</option> | |
| <option value="30" selected>Last 30 days</option> | |
| <option value="90">Last 90 days</option> | |
| </select> | |
| </div> | |
| <div class="analytics-actions"> | |
| <button id="refresh-analytics" class="btn-primary">Refresh Data</button> | |
| <!-- <button id="debug-analytics" class="btn-secondary">Debug Load</button> --> | |
| </div> | |
| </div> | |
| <div class="analytics-grid"> | |
| <!-- Model Usage --> | |
| <div class="analytics-card"> | |
| <h3>🤖 Model Usage</h3> | |
| <div class="analytics-chart" id="model-usage-chart"> | |
| <div class="analytics-loading"> | |
| <div class="spinner"></div> | |
| <div class="loading-text">Loading...</div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Agent Usage --> | |
| <div class="analytics-card"> | |
| <h3>🔧 Agent Usage</h3> | |
| <div class="analytics-chart" id="agent-usage-chart"> | |
| <div class="analytics-loading"> | |
| <div class="spinner"></div> | |
| <div class="loading-text">Loading...</div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Daily Trends --> | |
| <div class="analytics-card analytics-wide"> | |
| <h3>📈 Daily Usage Trends</h3> | |
| <div class="analytics-chart" id="daily-trends-chart"> | |
| <div class="analytics-loading"> | |
| <div class="spinner"></div> | |
| <div class="loading-text">Loading...</div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Usage Summary --> | |
| <div class="analytics-card"> | |
| <h3>📋 Usage Summary</h3> | |
| <div class="analytics-summary" id="usage-summary"> | |
| <div class="analytics-loading"> | |
| <div class="spinner"></div> | |
| <div class="loading-text">Loading...</div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Chat Section --> | |
| <section class="card reveal" id="chat-section"> | |
| <div class="card-header"> | |
| <h2>💬 Chat with Documents</h2> | |
| <p>Ask questions about your uploaded materials and get AI-powered answers</p> | |
| <div class="session-controls"> | |
| <div class="session-left"> | |
| <div class="session-dropdown-wrapper"> | |
| <select id="session-dropdown" class="session-dropdown"> | |
| <option value="">Select Session</option> | |
| </select> | |
| <button id="create-session-btn" class="btn-icon" title="Create new session">+</button> | |
| </div> | |
| </div> | |
| <div class="session-center"> | |
| <button id="clear-chat-btn" class="btn-secondary">Clear History</button> | |
| </div> | |
| <div class="session-right"> | |
| <div class="session-actions" style="display:none;"> | |
| <button id="rename-session-btn" class="btn-icon" title="Rename session">✏️</button> | |
| <button id="delete-session-btn" class="btn-icon" title="Delete session">🗑️</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="chat"> | |
| <div id="messages"></div> | |
| <div class="chat-controls" id="chat-controls"> | |
| <div class="chat-input-wrapper"> | |
| <textarea id="question" placeholder="Ask something about your documents..." rows="2" disabled></textarea> | |
| <button id="send-btn" class="send-btn" aria-label="Submit" disabled> | |
| <span class="btn-loading" style="display:none;"> | |
| <div class="spinner"></div> | |
| </span> | |
| <svg class="send-icon" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2"> | |
| <path d="M5 12h14"/> | |
| <path d="M12 5l7 7-7 7"/> | |
| </svg> | |
| </button> | |
| </div> | |
| <div class="chat-underbar"> | |
| <div class="action-pills"> | |
| <button id="report-link" class="action-pill" title="Generate report from selected document"> | |
| <svg viewBox="0 0 24 24" aria-hidden="true"> | |
| <circle cx="12" cy="12" r="9"></circle> | |
| <path d="M12 3v18M3 12h18" stroke-linecap="round"></path> | |
| </svg> | |
| <span>Report</span> | |
| </button> | |
| <button id="search-link" class="action-pill" title="Semantic search (coming soon)"> | |
| <svg viewBox="0 0 24 24" aria-hidden="true"> | |
| <circle cx="11" cy="11" r="7"></circle> | |
| <line x1="21" y1="21" x2="16.65" y2="16.65" stroke-linecap="round"></line> | |
| </svg> | |
| <span>Search</span> | |
| </button> | |
| <button id="quiz-link" class="action-pill" title="Create quiz from selected documents"> | |
| <svg viewBox="0 0 24 24" aria-hidden="true"> | |
| <path d="M9 12l2 2 4-4"></path> | |
| <path d="M21 12c0 4.97-4.03 9-9 9s-9-4.03-9-9 4.03-9 9-9 9 4.03 9 9z"></path> | |
| </svg> | |
| <span>Quiz</span> | |
| </button> | |
| </div> | |
| </div> | |
| <div class="chat-hint" id="chat-hint"> | |
| Upload documents first to start chatting | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| </div> | |
| </div> | |
| </main> | |
| </div> | |
| <!-- Auth Modal --> | |
| <div id="auth-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="auth-title"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <div class="modal-logo">📚</div> | |
| <h2 id="auth-title">Welcome to StudyBuddy</h2> | |
| <p class="modal-subtitle">Your AI-powered document analysis companion</p> | |
| </div> | |
| <div class="tabs"> | |
| <button class="tab active" data-tab="login">Sign In</button> | |
| <button class="tab" data-tab="signup">Create Account</button> | |
| </div> | |
| <div class="tab-body" id="tab-login"> | |
| <form id="login-form"> | |
| <div class="form-group"> | |
| <label>Email Address</label> | |
| <input type="email" id="login-email" placeholder="you@example.com" required> | |
| </div> | |
| <div class="form-group"> | |
| <label>Password</label> | |
| <input type="password" id="login-password" placeholder="••••••••" required> | |
| </div> | |
| <button type="submit" class="btn-primary">Sign in</button> | |
| </form> | |
| </div> | |
| <div class="tab-body hidden" id="tab-signup"> | |
| <form id="signup-form"> | |
| <div class="form-group"> | |
| <label>Email Address</label> | |
| <input type="email" id="signup-email" placeholder="you@example.com" required> | |
| </div> | |
| <div class="form-group"> | |
| <label>Password</label> | |
| <input type="password" id="signup-password" placeholder="At least 8 characters" minlength="8" required> | |
| </div> | |
| <button type="submit" class="btn-primary">Create account</button> | |
| </form> | |
| </div> | |
| <div class="modal-footer"> | |
| <p>By continuing, you agree to our Terms of Service and Privacy Policy</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- New Project Modal --> | |
| <div id="new-project-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="new-project-title"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h2 id="new-project-title">Create New Project</h2> | |
| <p class="modal-subtitle">Organize your documents into projects</p> | |
| </div> | |
| <form id="new-project-form"> | |
| <div class="form-group"> | |
| <label>Project Name</label> | |
| <input type="text" id="project-name" placeholder="e.g., Research Paper, Course Notes" required> | |
| </div> | |
| <div class="form-group"> | |
| <label>Description (Optional)</label> | |
| <textarea id="project-description" placeholder="Brief description of your project" rows="3"></textarea> | |
| </div> | |
| <div class="form-actions"> | |
| <button type="button" id="cancel-project" class="btn-secondary">Cancel</button> | |
| <button type="submit" class="btn-primary">Create Project</button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| <!-- Session Management Modals --> | |
| <div id="rename-session-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="rename-session-title"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h2 id="rename-session-title">Rename Session</h2> | |
| <p class="modal-subtitle">Enter a new name for this chat session</p> | |
| </div> | |
| <form id="rename-session-form"> | |
| <div class="form-group"> | |
| <label>Session Name</label> | |
| <input type="text" id="session-name-input" placeholder="Enter session name" required> | |
| </div> | |
| <div class="form-actions"> | |
| <button type="button" id="cancel-rename-session" class="btn-secondary">Cancel</button> | |
| <button type="submit" class="btn-primary">Rename</button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| <div id="delete-session-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="delete-session-title"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h2 id="delete-session-title">Delete Session</h2> | |
| <p class="modal-subtitle">Are you sure you want to delete this session? This action cannot be undone.</p> | |
| </div> | |
| <div class="form-actions"> | |
| <button type="button" id="cancel-delete-session" class="btn-secondary">Cancel</button> | |
| <button type="button" id="confirm-delete-session" class="btn-danger">Delete</button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Quiz Setup Modal --> | |
| <div id="quiz-setup-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="quiz-setup-title"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h2 id="quiz-setup-title">Create Quiz</h2> | |
| <p class="modal-subtitle">Configure your quiz settings</p> | |
| </div> | |
| <form id="quiz-setup-form"> | |
| <!-- Step 1: Question Configuration --> | |
| <div class="quiz-step" id="quiz-step-1"> | |
| <div class="form-group"> | |
| <label>How many questions would you like?</label> | |
| <textarea id="quiz-questions-input" placeholder="Tell me how many MCQ and self-reflect questions you want. For example: 'I want 25 multiple choice questions and 10 self-reflection questions' or 'Give me 30 questions total, split between MCQ and self-reflect questions'" rows="3" required></textarea> | |
| </div> | |
| </div> | |
| <!-- Step 2: Time Limit --> | |
| <div class="quiz-step" id="quiz-step-2" style="display:none;"> | |
| <div class="form-group"> | |
| <label>Time Limit (minutes)</label> | |
| <input type="number" id="quiz-time-limit" placeholder="Enter time limit in minutes (0 for no limit)" min="0" value="0"> | |
| <small>Enter 0 for no time limit</small> | |
| </div> | |
| </div> | |
| <!-- Step 3: Document Selection --> | |
| <div class="quiz-step" id="quiz-step-3" style="display:none;"> | |
| <div class="form-group"> | |
| <label>Select Documents</label> | |
| <div id="quiz-document-list" class="document-checkbox-list"> | |
| <!-- Documents will be populated here --> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="form-actions"> | |
| <button type="button" id="quiz-prev-step" class="btn-secondary" style="display:none;">Previous</button> | |
| <button type="button" id="quiz-next-step" class="btn-primary">Next</button> | |
| <button type="button" id="quiz-cancel" class="btn-secondary">Cancel</button> | |
| <button type="submit" id="quiz-submit" class="btn-primary" style="display:none;">Create Quiz</button> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| <!-- Quiz Taking Modal --> | |
| <div id="quiz-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="quiz-title"> | |
| <div class="modal-content quiz-modal-content"> | |
| <div class="modal-header"> | |
| <h2 id="quiz-title">Quiz</h2> | |
| <div class="quiz-timer" id="quiz-timer">Time: --:--</div> | |
| </div> | |
| <div class="quiz-content"> | |
| <div class="quiz-progress"> | |
| <div class="quiz-progress-bar"> | |
| <div class="quiz-progress-fill" id="quiz-progress-fill"></div> | |
| </div> | |
| <span class="quiz-progress-text" id="quiz-progress-text">Question 1 of 10</span> | |
| </div> | |
| <div class="quiz-question" id="quiz-question"> | |
| <!-- Question content will be populated here --> | |
| </div> | |
| <div class="quiz-answers" id="quiz-answers"> | |
| <!-- Answer options will be populated here --> | |
| </div> | |
| <div class="quiz-navigation"> | |
| <button id="quiz-prev" class="btn-secondary" disabled>Previous</button> | |
| <button id="quiz-next" class="btn-primary">Next</button> | |
| <button id="quiz-submit" class="btn-primary" style="display:none;">Submit Quiz</button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Quiz Results Modal --> | |
| <div id="quiz-results-modal" class="modal hidden" aria-hidden="true" role="dialog" aria-labelledby="quiz-results-title"> | |
| <div class="modal-content"> | |
| <div class="modal-header"> | |
| <h2 id="quiz-results-title">Quiz Results</h2> | |
| <p class="modal-subtitle">Your quiz has been completed</p> | |
| </div> | |
| <div class="quiz-results-content" id="quiz-results-content"> | |
| <!-- Results will be populated here --> | |
| </div> | |
| <div class="form-actions"> | |
| <button type="button" id="quiz-results-close" class="btn-primary">Close</button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Loading Overlay --> | |
| <div id="loading-overlay" class="loading-overlay hidden"> | |
| <div class="loading-content"> | |
| <div class="loading-spinner"></div> | |
| <h3>Processing...</h3> | |
| <p id="loading-message">Please wait while we process your request</p> | |
| </div> | |
| </div> | |
| <!-- Load markdown parser first so appendMessage can use it --> | |
| <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/highlight.js@11.9.0/lib/common.min.js"></script> | |
| <script src="/static/auth.js"></script> | |
| <script src="/static/sidebar.js"></script> | |
| <script src="/static/projects.js"></script> | |
| <script src="/static/script.js"></script> | |
| <script src="/static/sessions.js"></script> | |
| <script src="/static/analytics.js"></script> | |
| <script src="/static/quiz.js"></script> | |
| </body> | |
| </html> |