script.js

let selectedOption = null;
let isBookmarked = false;

// Make dashboard toggle draggable with edge snapping
let dragStartX, dragStartY, dragStartLeft, dragStartTop;
let isDragging = false;

// 添加一个全局初始化函数，在DOM加载后调用
function initDashboardToggle() {
    console.log('总体初始化仪表板功能');
    
    // 获取元素
    const dashboardToggle = document.getElementById('dashboard-toggle');
    const dashboardPanel = document.getElementById('dashboard-panel');
    
    if (!dashboardToggle) {
        console.error('未找到仪表板切换按钮');
        return;
    }
    
    if (!dashboardPanel) {
        console.error('未找到仪表板面板');
        return;
    }
    
    // 初始化拖动功能 - 如果已经调用过了，这里会再次加强一下
    initDashboardDrag();
    
    // 设置初始标题
    dashboardToggle.setAttribute('title', dashboardPanel.classList.contains('hidden') ? 
        'Open Dashboard' : 'Close Dashboard');
    
    // 设置初始状态
    if (!dashboardPanel.classList.contains('hidden')) {
        dashboardToggle.classList.add('active');
    }
    
    // 每2秒检查一次状态，以确保UI同步
    setInterval(() => {
        // 检查按钮是否在视口内
        ensureDashboardToggleVisible();
        
        // 确保面板和按钮状态同步
        if (dashboardPanel.classList.contains('hidden')) {
            dashboardToggle.classList.remove('active');
            dashboardToggle.setAttribute('title', 'Open Dashboard');
        } else {
            dashboardToggle.classList.add('active');
            dashboardToggle.setAttribute('title', 'Close Dashboard');
        }
    }, 2000);
}

// 修改init代码，在DOMContentLoaded最后添加调用
document.addEventListener('DOMContentLoaded', function() {
    console.log('DOM fully loaded');
    
    // 添加键盘快捷键支持
    document.addEventListener('keydown', handleKeyPress);
    
    // 鼠标移动光效
    document.addEventListener('mousemove', function(e) {
        const glowEffects = document.querySelectorAll('.glow-effect');
        if (glowEffects.length > 0) {
            const x = e.clientX;
            const y = e.clientY;
            
            // 让第一个光效跟随鼠标移动
            glowEffects[0].style.top = (y - 150) + 'px';
            glowEffects[0].style.left = (x - 150) + 'px';
        }
    });
    
    // 初始化系统状态提示
    updateSystemStatus('System ready', 'success');
    
    // 加载设置
    loadSettings();
    
    // 初始化仪表板拖动和点击功能
    setTimeout(initDashboardToggle, 500);
    
    // 添加键盘快捷键
    document.addEventListener('keydown', function(e) {
        if (e.key.toLowerCase() === 'd') {
            toggleDashboard();
        } else if (e.key.toLowerCase() === 't') {
            toggleHints();
        }
    });
});

// 处理键盘快捷键
function handleKeyPress(e) {
    // 如果已经提交答案，部分快捷键不可用
    const isExplanationVisible = !document.getElementById('explanation-section').classList.contains('hidden');
    
    switch(e.key.toLowerCase()) {
        case 'a':
        case 'b':
        case 'c':
        case 'd':
            if (!isExplanationVisible) {
                selectOption(e.key.toLowerCase());
            }
            break;
        case 'enter':
            if (!isExplanationVisible && selectedOption) {
                submitAnswer();
            }
            break;
        case 'arrowleft':
            // 前一题
            navigateToPrevious();
            break;
        case 'arrowright':
            // 后一题
            navigateToNext();
            break;
        case 'h':
            // 显示/隐藏帮助
            showHelp();
            break;
    }
}

// 选择选项
function selectOption(option) {
    // 如果已经提交答案，不允许再选择
    if (document.getElementById('explanation-section').classList.contains('hidden') === false) {
        return;
    }
    
    // 清除之前的选择
    if (selectedOption) {
        document.getElementById('option-' + selectedOption).classList.remove('option-selected');
    }
    
    // 设置新的选择
    selectedOption = option;
    document.getElementById('option-' + selectedOption).classList.add('option-selected');
    
    // 更新系统状态
    updateSystemStatus(`Option ${option.toUpperCase()} selected`, 'info');
}

// 提交答案
function submitAnswer() {
    // 如果没有选择任何选项，不执行提交
    if (!selectedOption) {
        updateSystemStatus('Please select an option first', 'warning');
        return;
    }
    
    // 显示提交中状态
    updateSystemStatus('Submitting answer...', 'info');
    
    // 模拟网络延迟
    setTimeout(() => {
        // 显示正确和错误的选项
        document.getElementById('option-a').classList.add('option-correct');
        document.getElementById('option-a').classList.add('option-answered');
        
        let isCorrect = false;
        if (selectedOption !== 'a') {
            document.getElementById('option-' + selectedOption).classList.add('option-incorrect');
            document.getElementById('option-' + selectedOption).classList.add('option-answered');
            updateSystemStatus('Incorrect answer', 'error');
        } else {
            isCorrect = true;
            updateSystemStatus('Correct answer!', 'success');
        }
        
        // 所有选项添加answered类
        const allOptions = document.querySelectorAll('.option');
        allOptions.forEach(option => {
            option.classList.add('option-answered');
        });
        
        // 显示所有选项的机器人图标
        document.querySelectorAll('.ask-about-option').forEach(el => {
            el.classList.remove('hidden');
            el.classList.add('visible');
        });
        
        // 显示解释部分
        document.getElementById('explanation-section').classList.remove('hidden');
        
        // 隐藏提交按钮
        document.getElementById('submit-container').style.display = 'none';
        
        // 显示AI聊天操作按钮
        document.getElementById('ai-chat-actions').classList.remove('hidden');
        
        // 更新进度条
        document.querySelector('.progress-bar-fill').style.width = '40%';
    }, 500);
    
    // 检查是否开启了自动保存
    const settings = JSON.parse(localStorage.getItem('userSettings'));
    if (settings && settings.autoSave) {
        // 延迟保存以确保UI更新完成
        setTimeout(() => {
            saveSession();
        }, 1000);
    }
}

// 更新系统状态提示
function updateSystemStatus(message, type = 'info') {
    const statusElement = document.getElementById('status-indicator');
    const iconElement = document.getElementById('status-icon');
    const messageElement = document.getElementById('status-message');
    
    // 清除之前的状态类
    iconElement.classList.remove('success', 'error', 'warning', 'info');
    
    // 设置图标
    let iconClass = 'fa-info-circle';
    switch(type) {
        case 'success':
            iconClass = 'fa-check-circle';
            break;
        case 'error':
            iconClass = 'fa-times-circle';
            break;
        case 'warning':
            iconClass = 'fa-exclamation-triangle';
            break;
    }
    
    // 更新状态
    iconElement.innerHTML = `<i class="fas ${iconClass}"></i>`;
    iconElement.classList.add(type);
    messageElement.textContent = message;
    
    // 显示状态提示并设置自动消失（成功和信息类型）
    statusElement.style.opacity = '1';
    if (type === 'success' || type === 'info') {
        setTimeout(() => {
            statusElement.style.opacity = '0';
        }, 3000);
    }
}

// 切换收藏状态
function toggleBookmark() {
    const bookmarkIcon = document.getElementById('bookmark-icon');
    isBookmarked = !isBookmarked;
    
    if (isBookmarked) {
        bookmarkIcon.innerHTML = '<i class="fas fa-bookmark"></i>';
        bookmarkIcon.classList.add('bookmarked');
        updateSystemStatus('Question bookmarked', 'success');
    } else {
        bookmarkIcon.innerHTML = '<i class="far fa-bookmark"></i>';
        bookmarkIcon.classList.remove('bookmarked');
        updateSystemStatus('Bookmark removed', 'info');
    }
}

// 显示帮助
function showHelp() {
    document.getElementById('help-modal').classList.remove('hidden');
}

// 关闭模态窗口
function closeModal(modalId) {
    document.getElementById(modalId).classList.add('hidden');
}

// 报告问题
function reportProblem() {
    document.getElementById('feedback-modal').classList.remove('hidden');
}

// 提交反馈
function submitFeedback() {
    const feedbackType = document.querySelector('.feedback-type').value;
    const feedbackDetails = document.querySelector('.feedback-details').value;
    
    if (!feedbackDetails.trim()) {
        updateSystemStatus('Please provide feedback details', 'warning');
        return;
    }
    
    // 这里应该是发送反馈到服务器的代码
    // 模拟发送成功
    updateSystemStatus('Thank you for your feedback!', 'success');
    closeModal('feedback-modal');
    
    // 清空反馈表单
    document.querySelector('.feedback-details').value = '';
}

// 询问特定选项
function askAboutOption(option) {
    const optionText = document.querySelector(`#option-${option} .option-text`).textContent;
    
    // 强制打开AI对话
    toggleAskAI(true);
    
    // 设置问题文本并聚焦输入框
    document.getElementById('ai-question').value = `Can you explain more about "${optionText}"?`;
    document.getElementById('ai-question').focus();
    
    // 滚动到AI对话区域
    const askAiSection = document.querySelector('.ask-ai-section');
    askAiSection.scrollIntoView({ behavior: 'smooth', block: 'start' });
    
    // 高亮AI区域以引起注意
    askAiSection.classList.add('highlight-section');
    setTimeout(() => {
        askAiSection.classList.remove('highlight-section');
    }, 1000);
}

// 添加到错题本
function addToMistakeBook() {
    updateSystemStatus('Added to mistake book for later review', 'success');
}

// 显示相似题目
function showSimilarProblems() {
    updateSystemStatus('Loading similar problems...', 'info');
    // 这里应该是加载相似题目的代码
    setTimeout(() => {
        updateSystemStatus('Similar problems loaded', 'success');
    }, 1000);
}

// 保存对话到错题本
function saveConversationToMistakeBook() {
    updateSystemStatus('Conversation saved to mistake book', 'success');
}

// 清除对话
function clearConversation() {
    const chatContainer = document.getElementById('ai-chat-container');
    chatContainer.innerHTML = '';
    
    // 隐藏操作按钮
    document.getElementById('ai-chat-actions').classList.add('hidden');
    
    updateSystemStatus('Conversation cleared', 'info');
}

// 导航到上一题
function navigateToPrevious() {
    updateSystemStatus('Loading previous question...', 'info');
    // 这里应该是加载上一题的代码
}

// 导航到下一题
function navigateToNext() {
    updateSystemStatus('Loading next question...', 'info');
    // 这里应该是加载下一题的代码
}

// AI问答功能
function toggleAskAI(forceOpen = false) {
    const content = document.getElementById('ask-ai-content');
    const header = document.querySelector('.ask-ai-header');
    
    if (forceOpen && content.classList.contains('hidden')) {
        content.classList.remove('hidden');
        header.classList.add('active');
        
        // 确保聊天区域可见
        setTimeout(() => {
            const container = document.getElementById('ai-chat-container');
            if (container) {
                container.scrollTop = container.scrollHeight;
            }
        }, 100);
    } else {
        content.classList.toggle('hidden');
        header.classList.toggle('active');
        
        if (!content.classList.contains('hidden')) {
            // 聚焦到输入框
            setTimeout(() => {
                document.getElementById('ai-question').focus();
                const container = document.getElementById('ai-chat-container');
                if (container) {
                    container.scrollTop = container.scrollHeight;
                }
            }, 100);
        }
    }
}

// 提交AI问题
function submitQuestion() {
    const questionInput = document.getElementById('ai-question');
    const question = questionInput.value.trim();
    
    if (!question) {
        updateSystemStatus('Please enter your question', 'warning');
        return;
    }
    
    // 获取聊天容器
    const chatContainer = document.getElementById('ai-chat-container');
    
    // 添加用户问题
    const userQueryElement = document.createElement('div');
    userQueryElement.className = 'user-query';
    userQueryElement.textContent = question;
    chatContainer.appendChild(userQueryElement);
    
    // 清除输入框
    questionInput.value = '';
    
    // 显示正在输入指示
        const typingElement = document.createElement('div');
        typingElement.className = 'ai-response ai-typing';
        typingElement.innerHTML = '<span class="typing-dot"></span><span class="typing-dot"></span><span class="typing-dot"></span>';
        chatContainer.appendChild(typingElement);
        
        // 滚动到最新消息
        chatContainer.scrollTop = chatContainer.scrollHeight;
        
    // 显示操作按钮
    document.getElementById('ai-chat-actions').classList.remove('hidden');
    
    // 模拟AI响应延迟
        setTimeout(() => {
        // 移除正在输入指示
            chatContainer.removeChild(typingElement);
            
        // 根据问题内容生成响应
        let response = generateResponseBasedOnQuestion(question);
        
        // 添加AI响应
            const aiResponseElement = document.createElement('div');
            aiResponseElement.className = 'ai-response';
        aiResponseElement.textContent = response;
        chatContainer.appendChild(aiResponseElement);
        
        // 滚动到最新消息
        chatContainer.scrollTop = chatContainer.scrollHeight;
        
        // 显示后续问题选项
        addFollowUpOptions(question);
        
        updateSystemStatus('AI responded to your question', 'success');
    }, 1500);
}

// 会话管理相关函数
function saveSession() {
    // 收集当前会话数据
    const sessionData = {
        id: 'session' + Date.now(),
        name: 'Auto-saved session',
        date: new Date().toLocaleString(),
        progress: document.querySelector('.progress-bar-fill').style.width,
        questions: [{
            title: document.querySelector('.question-text').textContent,
            selectedOption: selectedOption,
            isCorrect: selectedOption === 'a'
        }]
    };
    
    // 将会话数据保存到localStorage
    const savedSessions = JSON.parse(localStorage.getItem('questionSessions') || '[]');
    savedSessions.push(sessionData);
    localStorage.setItem('questionSessions', JSON.stringify(savedSessions));
    
    updateSystemStatus('Session saved', 'success');
}

function loadSessionModal() {
    document.getElementById('load-session-modal').classList.remove('hidden');
}

function loadSession(sessionId) {
    // 从localStorage获取会话数据
    const savedSessions = JSON.parse(localStorage.getItem('questionSessions') || '[]');
    const session = savedSessions.find(s => s.id === sessionId);
    
    if (!session) {
        updateSystemStatus('Unable to load session', 'error');
        return;
    }
    
    // 应用会话数据到当前界面
    // 此处应根据实际项目结构加载问题、选项等
    updateSystemStatus(`Session loaded: ${session.name}`, 'success');
    
    // 关闭模态框
    closeModal('load-session-modal');
}

function confirmDeleteSession(event, sessionId) {
    event.stopPropagation(); // 阻止冒泡，防止触发loadSession
    
    // 存储要删除的会话ID
    document.getElementById('confirm-delete-btn').dataset.sessionId = sessionId;
    
    // 显示确认删除模态框
    document.getElementById('confirm-delete-modal').classList.remove('hidden');
}

function deleteSession() {
    const sessionId = document.getElementById('confirm-delete-btn').dataset.sessionId;
    
    // 从localStorage删除会话
    const savedSessions = JSON.parse(localStorage.getItem('questionSessions') || '[]');
    const updatedSessions = savedSessions.filter(s => s.id !== sessionId);
    localStorage.setItem('questionSessions', JSON.stringify(updatedSessions));
    
    updateSystemStatus('Session deleted', 'info');
    
    // 关闭模态框
    closeModal('confirm-delete-modal');
    
    // 如果在会话加载界面，更新列表
    if (!document.getElementById('load-session-modal').classList.contains('hidden')) {
        // 刷新会话列表 (实际应用中需要重新渲染列表)
    }
    
    // 如果在仪表板界面，更新最近会话
    if (!document.getElementById('dashboard-panel').classList.contains('hidden')) {
        // 刷新最近会话列表
    }
}

// 仪表板相关函数
function toggleDashboard() {
    console.log('toggleDashboard called');
    
    const dashboardPanel = document.getElementById('dashboard-panel');
    const dashboardToggle = document.getElementById('dashboard-toggle');
    
    if (!dashboardPanel || !dashboardToggle) {
        console.error('Dashboard elements not found!');
        return;
    }
    
    // 切换hidden类
    const wasHidden = dashboardPanel.classList.contains('hidden');
    dashboardPanel.classList.toggle('hidden');
    
    // 更新按钮状态
    if (wasHidden) {
        // 面板从隐藏变为显示
        console.log('Opening dashboard panel');
        dashboardToggle.classList.add('active');
        dashboardToggle.setAttribute('title', 'Close Dashboard');
        
        // 如果当前在视窗外，滚动到视图内
        if (!isElementInViewport(dashboardPanel)) {
            dashboardPanel.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
        }
            } else {
        // 面板从显示变为隐藏
        console.log('Closing dashboard panel');
        dashboardToggle.classList.remove('active');
        dashboardToggle.setAttribute('title', 'Open Dashboard');
    }
    
    // 记录最终状态，便于调试
    console.log('Dashboard panel hidden:', dashboardPanel.classList.contains('hidden'));
    console.log('Dashboard toggle active:', dashboardToggle.classList.contains('active'));
}

// 检查元素是否在视窗内
function isElementInViewport(el) {
    const rect = el.getBoundingClientRect();
    return (
        rect.top >= 0 &&
        rect.left >= 0 &&
        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
        rect.right <= (window.innerWidth || document.documentElement.clientWidth)
    );
}

// 增强边缘吸附功能
function checkEdgeSnap(left, top) {
    const dashboardToggle = document.getElementById('dashboard-toggle');
    const windowWidth = window.innerWidth;
    const windowHeight = window.innerHeight;
    const toggleWidth = dashboardToggle.offsetWidth;
    const toggleHeight = dashboardToggle.offsetHeight;
    const snapThreshold = 30; // 增大吸附距离阈值
    
    // 移除所有吸附类
    dashboardToggle.classList.remove('snap-left', 'snap-right', 'snap-top', 'snap-bottom');
    
    let newLeft = left;
    let newTop = top;
    let snapped = false;
    
    // 检查左边缘
    if (left < snapThreshold) {
        dashboardToggle.classList.add('snap-left');
        newLeft = 0;
        snapped = true;
    }
    
    // 检查右边缘
    if (windowWidth - (left + toggleWidth) < snapThreshold) {
        dashboardToggle.classList.add('snap-right');
        newLeft = windowWidth - toggleWidth;
        snapped = true;
    }
    
    // 检查上边缘
    if (top < snapThreshold) {
        dashboardToggle.classList.add('snap-top');
        newTop = 0;
        snapped = true;
    }
    
    // 检查下边缘
    if (windowHeight - (top + toggleHeight) < snapThreshold) {
        dashboardToggle.classList.add('snap-bottom');
        newTop = windowHeight - toggleHeight;
        snapped = true;
    }
    
    // 如果吸附了，应用新位置
    if (snapped) {
        dashboardToggle.style.left = newLeft + 'px';
        dashboardToggle.style.top = newTop + 'px';
    }
}

// 修改endDrag函数，记录拖动结束时间
function endDrag(e) {
    if (!isDragging) return;
    
    // 记录拖动结束时间
    window.lastDragEnd = Date.now();
    
    // 标记拖动为假
    isDragging = false;
    
    const dashboardToggle = document.getElementById('dashboard-toggle');
    dashboardToggle.style.cursor = 'move';
    dashboardToggle.style.transition = 'all 0.3s ease';
    
    // 计算拖动距离
    const dragDistance = 0; // 初始化拖动距离
    if (window.dragStartTime) {
        const dragTime = Date.now() - window.dragStartTime;
        
        // 如果拖动时间很短且没有明显移动，可能是点击意图
        if (dragTime < 200) {
            console.log('Short drag detected, likely a click intention');
            // 这里可以触发toggleDashboard，但我们依赖专门的click事件处理器来做这事
        }
    }
    
    // 获取最终位置（考虑吸附后的位置）
    const rect = dashboardToggle.getBoundingClientRect();
    
    // 保存位置到localStorage
    const position = {
        top: rect.top,
        left: rect.left,
        snapClasses: []
    };
    
    // 添加吸附类到保存的位置
    if (dashboardToggle.classList.contains('snap-left')) position.snapClasses.push('snap-left');
    if (dashboardToggle.classList.contains('snap-right')) position.snapClasses.push('snap-right');
    if (dashboardToggle.classList.contains('snap-top')) position.snapClasses.push('snap-top');
    if (dashboardToggle.classList.contains('snap-bottom')) position.snapClasses.push('snap-bottom');
    
    localStorage.setItem('dashboardPosition', JSON.stringify(position));
    
    // 如果有事件对象，阻止进一步处理
    if (e) e.stopPropagation();
}

// 用户设置相关函数
function toggleUserSettings() {
    document.getElementById('user-settings-modal').classList.remove('hidden');
}

function saveSettings() {
    // 获取设置值
    const theme = document.querySelector('input[name="theme"]:checked').value;
    const autoSave = document.getElementById('auto-save-toggle').checked;
    
    // 保存设置到localStorage
    const settings = { theme, autoSave };
    localStorage.setItem('userSettings', JSON.stringify(settings));
    
    // 应用设置
    applySettings(settings);
    
    updateSystemStatus('Settings saved', 'success');
    closeModal('user-settings-modal');
}

function applySettings(settings) {
    // 应用主题设置
    if (settings.theme === 'dark') {
        document.body.classList.add('dark-theme');
    } else if (settings.theme === 'light') {
        document.body.classList.remove('dark-theme');
    } else if (settings.theme === 'system') {
        // 根据系统主题设置
        if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
            document.body.classList.add('dark-theme');
        } else {
            document.body.classList.remove('dark-theme');
        }
    }
}

function loadSettings() {
    // 从localStorage加载设置
    const settings = JSON.parse(localStorage.getItem('userSettings'));
    if (settings) {
        // 设置表单值
        if (settings.theme) {
            document.querySelector(`input[name="theme"][value="${settings.theme}"]`).checked = true;
        }
        
        if (settings.autoSave !== undefined) {
            document.getElementById('auto-save-toggle').checked = settings.autoSave;
        }
        
        // 应用设置
        applySettings(settings);
    }
}

// 渐进式提示系统
function toggleHints() {
    const hintsContainer = document.getElementById('hints-container');
    hintsContainer.classList.toggle('hidden');
}

function toggleHintLevel(level) {
    const hintHeader = document.querySelector(`.hint-level[data-level="${level}"] .hint-header`);
    const hintContent = document.getElementById(`hint-content-${level}`);
    
    hintHeader.classList.toggle('active');
    hintContent.classList.toggle('hidden');
    
    // 更新系统状态
    if (!hintContent.classList.contains('hidden')) {
        updateSystemStatus(`Level ${level} hint shown`, 'info');
    }
}

// 解释深度切换
function changeExplanationLevel(level) {
    // 移除所有级别的活动状态
    document.querySelectorAll('.level-option').forEach(el => {
        el.classList.remove('active');
    });
    
    // 隐藏所有解释文本
    document.querySelectorAll('.explanation-text').forEach(el => {
        el.classList.add('hidden');
    });
    
    // 激活选中的级别
    document.getElementById(`level-${level}`).classList.add('active');
    
    // 显示对应的解释文本
    document.getElementById(`explanation-text-${level}`).classList.remove('hidden');
    
    updateSystemStatus(`已切换到${level}级解释`, 'info');
}

// 确认关键操作
function confirmClearConversation() {
    if (confirm('确定要清除当前对话吗？此操作无法撤销。')) {
        clearConversation();
    }
}

// 交互式教程
let tutorialStep = 1;
const tutorialSteps = [
    {
        element: '.popup-title',
        content: 'Welcome to AI Smart Practice! This tutorial will guide you through the main features of the system.',
        position: 'bottom'
    },
    {
        element: '.difficulty-tag',
        content: 'Each question is labeled with a difficulty level to help you understand its complexity.',
        position: 'right'
    },
    {
        element: '.bookmark-icon',
        content: 'You can bookmark interesting questions for later review.',
        position: 'bottom'
    },
    {
        element: '.options-container',
        content: 'Select the answer you think is correct. The system will provide immediate feedback.',
        position: 'right'
    },
    {
        element: '.hints-toggle',
        content: 'If you need help, you can get progressive hints ranging from subtle clues to detailed guidance.',
        position: 'top'
    },
    {
        element: '.dashboard-toggle',
        content: 'View your learning dashboard to track progress and statistics. You can drag this button to reposition it!',
        position: 'left'
    },
    {
        element: '.ask-ai-section',
        content: 'Ask the AI assistant any questions for personalized help. The chat interface shows messages above the input area.',
        position: 'top'
    },
    {
        element: '.popup-control[title="User Settings"]',
        content: 'Adjust interface and learning preferences in settings to customize your experience.',
        position: 'bottom'
    }
];

function startTutorial() {
    // 首先关闭帮助模态框
    closeModal('help-modal');
    
    // 设置起始步骤
    tutorialStep = 1;
    
    // 移除隐藏类以显示教程界面
    document.getElementById('tutorial-overlay').classList.remove('hidden');
    document.getElementById('tutorial-container').classList.remove('hidden');
    
    // 更新教程显示
    updateTutorialStep();
}

function updateTutorialStep() {
    const step = tutorialSteps[tutorialStep - 1];
    const targetElement = document.querySelector(step.element);
    
    if (!targetElement) {
        console.error(`Tutorial target element not found: ${step.element}`);
        nextTutorialStep();
        return;
    }
    
    // 特殊处理第7步 (AI聊天区域)
    if (tutorialStep === 7) {
        // 确保AI聊天区域可见
        const askAiContent = document.getElementById('ask-ai-content');
        if (askAiContent.classList.contains('hidden')) {
            toggleAskAI(true);
        }
        
        // 添加示例对话，使聊天区域更有内容
        if (document.getElementById('ai-chat-container').children.length === 0) {
            // 添加示例问题和回答
            const exampleQuestion = document.createElement('div');
            exampleQuestion.className = 'user-query';
            exampleQuestion.textContent = "How do shortest path algorithms compare?";
            
            const exampleResponse = document.createElement('div');
            exampleResponse.className = 'ai-response';
            exampleResponse.textContent = "When comparing shortest path algorithms: Dijkstra is fastest for non-negative edge weights, Bellman-Ford can handle negative edges, and Floyd-Warshall finds all-pairs shortest paths but is slower. The choice depends on your specific graph requirements.";
            
            const container = document.getElementById('ai-chat-container');
            container.appendChild(exampleQuestion);
            container.appendChild(exampleResponse);
            
            // 添加示例后续问题
            addFollowUpOptions("How do shortest path algorithms compare?");
            
            // 滚动到对话底部
            container.scrollTop = container.scrollHeight;
        }
    }
    
    const tutorialHighlight = document.getElementById('tutorial-highlight');
    const tutorialTooltip = document.getElementById('tutorial-tooltip');
    
    // Update step text
    document.getElementById('tutorial-step').textContent = `${tutorialStep}/${tutorialSteps.length}`;
    document.getElementById('tutorial-tooltip-content').textContent = step.content;
    
    // Get target element position
    const rect = targetElement.getBoundingClientRect();
    
    // Check if element is in viewport
    const isInView = (
        rect.top >= 0 &&
        rect.left >= 0 &&
        rect.bottom <= window.innerHeight &&
        rect.right <= window.innerWidth
    );
    
    // Scroll element into view if needed
    if (!isInView) {
        targetElement.scrollIntoView({
            behavior: 'smooth',
            block: 'center'
        });
        
        // Give time for scrolling before positioning the highlight
        setTimeout(() => {
            positionTutorialElements(targetElement, step, tutorialHighlight, tutorialTooltip);
        }, 500);
    } else {
        positionTutorialElements(targetElement, step, tutorialHighlight, tutorialTooltip);
    }
}

function positionTutorialElements(targetElement, step, tutorialHighlight, tutorialTooltip) {
    // Get updated position after possible scrolling
    const rect = targetElement.getBoundingClientRect();
    
    // Set highlight position and size
    tutorialHighlight.style.top = `${rect.top - 5}px`;
    tutorialHighlight.style.left = `${rect.left - 5}px`;
    tutorialHighlight.style.width = `${rect.width + 10}px`;
    tutorialHighlight.style.height = `${rect.height + 10}px`;
    
    // Set tooltip position
    let tooltipTop, tooltipLeft;
    
    // Determine best position to avoid going off-screen
    const tooltipWidth = 300; // Width defined in CSS
    const tooltipHeight = 150; // Approximate height, adjust as needed
    
    switch(step.position) {
        case 'top':
            if (rect.top < tooltipHeight + 20) {
                // Not enough space on top, place at bottom
                tooltipTop = rect.bottom + 15;
                tooltipLeft = rect.left + rect.width/2 - tooltipWidth/2;
            } else {
                tooltipTop = rect.top - tooltipHeight - 15;
                tooltipLeft = rect.left + rect.width/2 - tooltipWidth/2;
            }
            break;
        case 'bottom':
            if (window.innerHeight - rect.bottom < tooltipHeight + 20) {
                // Not enough space at bottom, place on top
                tooltipTop = rect.top - tooltipHeight - 15;
                tooltipLeft = rect.left + rect.width/2 - tooltipWidth/2;
            } else {
                tooltipTop = rect.bottom + 15;
                tooltipLeft = rect.left + rect.width/2 - tooltipWidth/2;
            }
            break;
        case 'left':
            if (rect.left < tooltipWidth + 20) {
                // Not enough space on left, place on right
                tooltipTop = rect.top + rect.height/2 - tooltipHeight/2;
                tooltipLeft = rect.right + 15;
            } else {
                tooltipTop = rect.top + rect.height/2 - tooltipHeight/2;
                tooltipLeft = rect.left - tooltipWidth - 15;
            }
            break;
        case 'right':
            if (window.innerWidth - rect.right < tooltipWidth + 20) {
                // Not enough space on right, place on left
                tooltipTop = rect.top + rect.height/2 - tooltipHeight/2;
                tooltipLeft = rect.left - tooltipWidth - 15;
            } else {
                tooltipTop = rect.top + rect.height/2 - tooltipHeight/2;
                tooltipLeft = rect.right + 15;
            }
            break;
    }
    
    // Ensure tooltip stays within viewport
    if (tooltipTop < 10) tooltipTop = 10;
    if (tooltipLeft < 10) tooltipLeft = 10;
    if (tooltipTop + tooltipHeight > window.innerHeight - 10) {
        tooltipTop = window.innerHeight - tooltipHeight - 10;
    }
    if (tooltipLeft + tooltipWidth > window.innerWidth - 10) {
        tooltipLeft = window.innerWidth - tooltipWidth - 10;
    }
    
    tutorialTooltip.style.top = `${tooltipTop}px`;
    tutorialTooltip.style.left = `${tooltipLeft}px`;
    
    // Update prev/next button states
    document.getElementById('tutorial-prev').disabled = tutorialStep === 1;
    document.getElementById('tutorial-next').textContent = tutorialStep === tutorialSteps.length ? 'Finish' : 'Next';
}

function nextTutorialStep() {
    if (tutorialStep < tutorialSteps.length) {
        tutorialStep++;
        updateTutorialStep();
    } else {
        closeTutorial();
    }
}

function prevTutorialStep() {
    if (tutorialStep > 1) {
        tutorialStep--;
        updateTutorialStep();
    }
}

function closeTutorial() {
    document.getElementById('tutorial-overlay').classList.add('hidden');
    document.getElementById('tutorial-container').classList.add('hidden');
}

// 更新原有函数以支持新功能

// 修改clearConversation函数，添加确认机制
const originalClearConversation = clearConversation;
clearConversation = function() {
    if (confirm('确定要清除当前对话吗？此操作无法撤销。')) {
        originalClearConversation();
    }
};

// 增强askAboutOption函数
askAboutOption = function(option) {
    const optionText = document.querySelector(`#option-${option} .option-text`).textContent;
    
    // 强制打开AI对话
    toggleAskAI(true);
    
    // 设置问题文本并聚焦输入框
    document.getElementById('ai-question').value = `Can you explain more about "${optionText}"?`;
    document.getElementById('ai-question').focus();
    
    // 滚动到AI对话区域
    const askAiSection = document.querySelector('.ask-ai-section');
    askAiSection.scrollIntoView({ behavior: 'smooth', block: 'start' });
    
    // 高亮AI区域以引起注意
    askAiSection.classList.add('highlight-section');
    setTimeout(() => {
        askAiSection.classList.remove('highlight-section');
    }, 1000);
};

// 提交答案时自动保存会话
const originalSubmitAnswer = submitAnswer;
submitAnswer = function() {
    originalSubmitAnswer();
    
    // 检查是否开启了自动保存
    const settings = JSON.parse(localStorage.getItem('userSettings'));
    if (settings && settings.autoSave) {
        // 延迟保存以确保UI更新完成
        setTimeout(() => {
            saveSession();
        }, 1000);
    }
};

function initDashboardDrag() {
    console.log('开始初始化仪表板拖拽和点击功能');
    const dashboardToggle = document.getElementById('dashboard-toggle');
    
    if (!dashboardToggle) {
        console.error('未找到仪表板切换按钮');
        return;
    }
    
    // 从localStorage加载位置
    const savedPosition = JSON.parse(localStorage.getItem('dashboardPosition') || 'null');
    if (savedPosition) {
        console.log('从localStorage恢复仪表板位置', savedPosition);
        // 应用保存的位置
        dashboardToggle.style.left = savedPosition.left + 'px';
        dashboardToggle.style.top = savedPosition.top + 'px';
        dashboardToggle.style.right = 'auto';
        dashboardToggle.style.bottom = 'auto';
        
        // 添加任何已保存的吸附类
        if (savedPosition.snapClasses && savedPosition.snapClasses.length > 0) {
            console.log('应用已保存的吸附类:', savedPosition.snapClasses);
            savedPosition.snapClasses.forEach(cls => {
                dashboardToggle.classList.add(cls);
            });
        }
    } else {
        console.log('未找到保存的位置，使用默认位置');
    }
    
    // 确保仪表板按钮在视窗内
    setTimeout(ensureDashboardToggleVisible, 300);
    
    // 清除所有可能存在的事件监听器
    dashboardToggle.removeEventListener('mousedown', startDrag);
    dashboardToggle.removeEventListener('contextmenu', handleRightClick);
    document.removeEventListener('mousemove', drag);
    document.removeEventListener('mouseup', endDrag);
    dashboardToggle.removeEventListener('touchstart', startDragTouch);
    document.removeEventListener('touchmove', dragTouch);
    document.removeEventListener('touchend', endDrag);
    
    // 左键点击 - 只用于打开/关闭面板
    dashboardToggle.addEventListener('click', function(event) {
        // 只有左键点击才触发打开/关闭面板
        if (event.button === 0 || event.button === undefined) {
            console.log('左键点击仪表板按钮');
            event.preventDefault();
            event.stopPropagation();
            toggleDashboard();
        }
    });
    
    // 右键点击 - 只用于拖拽
    dashboardToggle.addEventListener('contextmenu', handleRightClick);
    
    // 拖拽相关事件
    document.addEventListener('mousemove', drag);
    document.addEventListener('mouseup', endDrag);
    
    // 触摸设备支持
    dashboardToggle.addEventListener('touchstart', startDragTouch);
    document.addEventListener('touchmove', dragTouch);
    document.addEventListener('touchend', endDrag);
    
    console.log('仪表板拖拽和点击功能初始化完成');
}

// 处理右键点击，启动拖拽
function handleRightClick(e) {
    console.log('右键点击，启动拖拽');
    e.preventDefault(); // 阻止默认的右键菜单
    startDrag(e);
    return false; // 阻止默认操作
}

// 修改startDrag函数，确保只在右键点击时触发
function startDrag(e) {
    // 对于鼠标事件，确保只有右键才能拖动
    if (e.type === 'mousedown' && e.button !== 2) {
        return;
    }
    
    e.preventDefault();
    e.stopPropagation();
    
    // 标记开始拖动
    isDragging = true;
    window.dragStartTime = Date.now();
    
    const dashboardToggle = document.getElementById('dashboard-toggle');
    const rect = dashboardToggle.getBoundingClientRect();
    
    // 移除边缘吸附类
    dashboardToggle.classList.remove('snap-left', 'snap-right', 'snap-top', 'snap-bottom');
    
    dragStartX = e.clientX || (e.touches && e.touches[0].clientX);
    dragStartY = e.clientY || (e.touches && e.touches[0].clientY);
    dragStartLeft = rect.left;
    dragStartTop = rect.top;
    
    // 更改鼠标样式
    dashboardToggle.style.cursor = 'grabbing';
    dashboardToggle.style.transition = 'none';
    
    console.log('开始拖拽', {x: dragStartX, y: dragStartY});
}

// 确保仪表板按钮始终在视图内
function ensureDashboardToggleVisible() {
    const dashboardToggle = document.getElementById('dashboard-toggle');
    const rect = dashboardToggle.getBoundingClientRect();
    const windowWidth = window.innerWidth;
    const windowHeight = window.innerHeight;
    
    let needsAdjustment = false;
    let newLeft = rect.left;
    let newTop = rect.top;
    
    // 检查是否超出视图
    if (rect.right < 0) {
        newLeft = 0;
        needsAdjustment = true;
    } else if (rect.left > windowWidth) {
        newLeft = windowWidth - rect.width;
        needsAdjustment = true;
    }
    
    if (rect.bottom < 0) {
        newTop = 0;
        needsAdjustment = true;
    } else if (rect.top > windowHeight) {
        newTop = windowHeight - rect.height;
        needsAdjustment = true;
    }
    
    // 应用调整
    if (needsAdjustment) {
        dashboardToggle.style.left = newLeft + 'px';
        dashboardToggle.style.top = newTop + 'px';
        
        // 检查是否需要应用吸附
        checkEdgeSnap(newLeft, newTop);
        
        // 保存新位置
        const position = {
            top: dashboardToggle.style.top,
            left: dashboardToggle.style.left,
            snapClasses: []
        };
        
        if (dashboardToggle.classList.contains('snap-left')) position.snapClasses.push('snap-left');
        if (dashboardToggle.classList.contains('snap-right')) position.snapClasses.push('snap-right');
        if (dashboardToggle.classList.contains('snap-top')) position.snapClasses.push('snap-top');
        if (dashboardToggle.classList.contains('snap-bottom')) position.snapClasses.push('snap-bottom');
        
        localStorage.setItem('dashboardPosition', JSON.stringify(position));
    }
}

// 修改触摸事件处理函数，区分点击和拖拽
function startDragTouch(e) {
    // 用于触摸设备的拖拽启动
    
    // 保存触摸起始时间和位置，用于区分点击和拖拽
    const touch = e.touches[0];
    window.touchStartTime = Date.now();
    window.touchStartX = touch.clientX;
    window.touchStartY = touch.clientY;
    
    const dashboardToggle = document.getElementById('dashboard-toggle');
    if (!dashboardToggle) return;
    
    // 添加触摸移动监听，仅用于检测是否是拖拽
    let touchMoveHandler = function(moveEvent) {
        // 计算移动距离
        const moveTouch = moveEvent.touches[0];
        const deltaX = Math.abs(moveTouch.clientX - window.touchStartX);
        const deltaY = Math.abs(moveTouch.clientY - window.touchStartY);
        
        // 如果移动距离大于阈值，认为是拖拽意图
        if (deltaX > 10 || deltaY > 10) {
            console.log('触摸移动检测到拖拽意图');
            
            // 启动真正的拖拽
            isDragging = true;
            
            const rect = dashboardToggle.getBoundingClientRect();
            
            // 移除边缘吸附类
            dashboardToggle.classList.remove('snap-left', 'snap-right', 'snap-top', 'snap-bottom');
            
            dragStartX = window.touchStartX;
            dragStartY = window.touchStartY;
            dragStartLeft = rect.left;
            dragStartTop = rect.top;
            
            // 更改样式
            dashboardToggle.style.transition = 'none';
            
            // 移除这个临时的监听器
            document.removeEventListener('touchmove', touchMoveHandler);
        }
    };
    
    // 添加触摸结束监听，用于处理点击事件
    let touchEndHandler = function(endEvent) {
        // 移除临时监听器
        document.removeEventListener('touchmove', touchMoveHandler);
        document.removeEventListener('touchend', touchEndHandler);
        
        // 如果没有拖动，且触摸时间短，认为是点击
        if (!isDragging && (Date.now() - window.touchStartTime < 300)) {
            console.log('检测到触摸点击');
            toggleDashboard();
        }
    };
    
    // 添加临时监听器
    document.addEventListener('touchmove', touchMoveHandler);
    document.addEventListener('touchend', touchEndHandler);
    
    // 阻止默认行为
    e.preventDefault();
}

// 修改dragTouch函数，确保只有拖拽模式下才移动
function dragTouch(e) {
    if (!isDragging) return;
    
    // 阻止页面滚动
    e.preventDefault();
    
    const touch = e.touches[0];
    const dashboardToggle = document.getElementById('dashboard-toggle');
    
    if (!dashboardToggle) return;
    
    const deltaX = touch.clientX - dragStartX;
    const deltaY = touch.clientY - dragStartY;
    
    const newLeft = dragStartLeft + deltaX;
    const newTop = dragStartTop + deltaY;
    
    dashboardToggle.style.left = newLeft + 'px';
    dashboardToggle.style.top = newTop + 'px';
    dashboardToggle.style.right = 'auto';
    dashboardToggle.style.bottom = 'auto';
    
    // 检查边缘吸附
    checkEdgeSnap(newLeft, newTop);
}

// Request more detailed explanation
function requestDetailedExplanation() {
    updateSystemStatus('Generating more detailed explanation...', 'info');
    
    // Here you would typically make an API call to get a more detailed explanation
    // For now, let's simulate it with a timeout
    setTimeout(() => {
        const container = document.getElementById('explanation-container');
        const currentText = container.querySelector('.explanation-text').textContent;
        
        // Add a more detailed paragraph
        const moreDetailedText = `${currentText}\n\nAdditionally, it's worth noting that Dijkstra's algorithm maintains a priority queue of vertices to visit next, always selecting the one with the lowest current distance. This greedy approach works perfectly with non-negative edges because once a vertex is visited, the shortest path to it is guaranteed to be found. With negative edges, however, a path through a vertex that has already been processed might be discovered later that has a shorter total distance, invalidating the earlier result.`;
        
        container.querySelector('.explanation-text').textContent = moreDetailedText;
        
        updateSystemStatus('Detailed explanation provided', 'success');
    }, 1000);
}

// Follow-up question handling
function addFollowUpQuestion() {
    // Add follow-up question UI after the explanation
    const container = document.getElementById('explanation-container');
    
    // Check if follow-up container already exists
    if (!document.getElementById('follow-up-container')) {
        const followUpHtml = `
            <div id="follow-up-container" class="follow-up-container">
                <div class="follow-up-prompt">Have a follow-up question?</div>
                <input type="text" class="follow-up-input" id="follow-up-input" placeholder="Ask about this explanation...">
                <button class="follow-up-send" onclick="submitFollowUp()">
                    <i class="fas fa-paper-plane"></i> Ask
                </button>
            </div>
        `;
        
        container.insertAdjacentHTML('beforeend', followUpHtml);
        
        // Focus on the input
        setTimeout(() => {
            document.getElementById('follow-up-input').focus();
        }, 100);
    }
}

function submitFollowUp() {
    const input = document.getElementById('follow-up-input');
    const question = input.value.trim();
    
    if (!question) {
        updateSystemStatus('Please enter a question', 'warning');
        return;
    }
    
    // Clear the input
    input.value = '';
    
    // Add to AI chat
    const chatContainer = document.getElementById('ai-chat-container');
    
    // Add user question
    const userQueryElement = document.createElement('div');
    userQueryElement.className = 'user-query';
    userQueryElement.textContent = question;
    chatContainer.appendChild(userQueryElement);
    
    // Show AI typing indicator
    const typingElement = document.createElement('div');
    typingElement.className = 'ai-response ai-typing';
    typingElement.innerHTML = '<span class="typing-dot"></span><span class="typing-dot"></span><span class="typing-dot"></span>';
    chatContainer.appendChild(typingElement);
    
    // Scroll to the latest message
    chatContainer.scrollTop = chatContainer.scrollHeight;
    
    // Auto-open AI chat section if closed
    if (document.getElementById('ask-ai-content').classList.contains('hidden')) {
        toggleAskAI(true);
    }
    
    // Simulate AI response
    setTimeout(() => {
        // Remove typing indicator
        chatContainer.removeChild(typingElement);
        
        // Add AI response based on the question
        const aiResponseElement = document.createElement('div');
        aiResponseElement.className = 'ai-response';
        
        // Generate response based on question content
        let response = generateAIResponse(question);
            
            aiResponseElement.textContent = response;
            chatContainer.appendChild(aiResponseElement);
            
        // Scroll to the new message
            chatContainer.scrollTop = chatContainer.scrollHeight;
            
        // Update status
            updateSystemStatus('AI responded to your question', 'success');
        }, 1500);
}

function generateAIResponse(question) {
    // Simple response generation based on keywords in the question
    const questionLower = question.toLowerCase();
    
    if (questionLower.includes('dijkstra') && questionLower.includes('negative')) {
        return "Dijkstra's algorithm fails with negative edges because it greedily selects vertices with the lowest current distance. Once a vertex is processed, Dijkstra never revisits it. With negative edges, a previously processed vertex might actually be part of a shorter path discovered later, but Dijkstra would have already 'finalized' its distance.";
    } else if (questionLower.includes('dijkstra')) {
        return "Dijkstra's algorithm is a greedy algorithm that finds the shortest path from a source vertex to all other vertices in a graph with non-negative edge weights. It maintains a priority queue of vertices sorted by their tentative distances from the source.";
    } else if (questionLower.includes('bellman') || questionLower.includes('ford')) {
        return "The Bellman-Ford algorithm can handle graphs with negative edge weights. It works by repeatedly relaxing all edges V-1 times (where V is the number of vertices), ensuring that the shortest path to each vertex is found even with negative edges (as long as there are no negative cycles).";
    } else if (questionLower.includes('floyd') || questionLower.includes('warshall')) {
        return "Floyd-Warshall is a dynamic programming algorithm that finds shortest paths between all pairs of vertices in a graph. It can handle negative edge weights but not negative cycles. It works by considering each vertex as a potential intermediate vertex in the shortest path between any two vertices.";
    } else if (questionLower.includes('negative') && questionLower.includes('cycle')) {
        return "A negative cycle is a cycle in a graph where the sum of edge weights is negative. In such cases, shortest path is not well-defined because you could traverse the cycle repeatedly to make the path arbitrarily short. Bellman-Ford can detect negative cycles, while Dijkstra cannot.";
    } else if (questionLower.includes('algorithm') || questionLower.includes('compare')) {
        return "When comparing shortest path algorithms: Dijkstra is fastest (O(E+VlogV) with a binary heap) but doesn't work with negative edges. Bellman-Ford is slower (O(VE)) but handles negative edges and detects negative cycles. Floyd-Warshall (O(V³)) finds all-pairs shortest paths and works with negative edges.";
    } else {
        return "I'm not sure about the specifics of your question. Could you please ask about a particular algorithm or concept related to shortest path problems? I can explain Dijkstra's algorithm, Bellman-Ford, Floyd-Warshall, or concepts like negative edge weights and their implications.";
    }
}

// 根据问题生成回答
function generateResponseBasedOnQuestion(question) {
    const questionLower = question.toLowerCase();
    
    if (questionLower.includes('dijkstra')) {
        return "Regarding this question, Dijkstra's algorithm is suitable for graphs without negative edges but not for graphs with negative edges. This is because Dijkstra's algorithm is based on a greedy strategy, assuming that the shortest path from the source to any vertex is fixed once determined, but negative edges break this assumption.";
    } else if (questionLower.includes('bellman') || questionLower.includes('ford')) {
        return "The Bellman-Ford algorithm is specifically designed to handle single-source shortest path problems in graphs with negative edges. It works by relaxing all edges V-1 times (where V is the number of vertices), which guarantees finding the shortest path if there are no negative cycles.";
    } else if (questionLower.includes('floyd') || questionLower.includes('warshall')) {
        return "The Floyd-Warshall algorithm is a dynamic programming approach that finds the shortest paths between all pairs of vertices in a graph. It can handle negative edge weights but not negative cycles. It's particularly efficient for dense graphs.";
    } else if (questionLower.includes('algorithm') || questionLower.includes('compare')) {
        return "When comparing the algorithms: Dijkstra is efficient but fails with negative edges; Bellman-Ford handles negative edges but is slower; Floyd-Warshall finds all-pairs shortest paths and works with negative edges but not negative cycles.";
    } else {
        return "I'd be happy to help with your question about shortest path algorithms. Could you please be more specific about which algorithm you'd like to understand better?";
    }
}

// 添加后续问题选项
function addFollowUpOptions(question) {
    const chatContainer = document.getElementById('ai-chat-container');
    
    // 创建后续问题选项容器
    const followUpContainer = document.createElement('div');
    followUpContainer.className = 'follow-up-options';
    
    // 根据当前问题生成相关的后续问题
    const followUpQuestions = generateFollowUpQuestions(question);
    
    // 添加提示文本
    const promptElement = document.createElement('div');
    promptElement.className = 'follow-up-prompt';
    promptElement.textContent = 'You might also want to ask:';
    followUpContainer.appendChild(promptElement);
    
    // 添加问题选项
    followUpQuestions.forEach(q => {
        const optionElement = document.createElement('div');
        optionElement.className = 'follow-up-option';
        optionElement.textContent = q;
        optionElement.onclick = function() {
            document.getElementById('ai-question').value = q;
            submitQuestion();
        };
        followUpContainer.appendChild(optionElement);
    });
    
    // 添加到聊天容器
    chatContainer.appendChild(followUpContainer);
    
    // 滚动到底部
    chatContainer.scrollTop = chatContainer.scrollHeight;
}

// 生成后续问题
function generateFollowUpQuestions(question) {
    const questionLower = question.toLowerCase();
    
    if (questionLower.includes('dijkstra')) {
        return [
            "What is the time complexity of Dijkstra's algorithm?",
            "How does Dijkstra's algorithm work with a priority queue?",
            "Can you explain why Dijkstra fails with negative edges?"
        ];
    } else if (questionLower.includes('bellman') || questionLower.includes('ford')) {
        return [
            "How does Bellman-Ford detect negative cycles?",
            "What is the time complexity of Bellman-Ford?",
            "When would you use Bellman-Ford instead of Dijkstra?"
        ];
    } else if (questionLower.includes('floyd') || questionLower.includes('warshall')) {
        return [
            "What is the time complexity of Floyd-Warshall?",
            "How does Floyd-Warshall handle multiple sources?",
            "What are the limitations of Floyd-Warshall?"
        ];
    } else {
        return [
            "Can you explain Dijkstra's algorithm?",
            "How does the Bellman-Ford algorithm work?",
            "What are the key differences between these algorithms?"
        ];
    }
}

// 确保鼠标拖动函数存在
function drag(e) {
    if (!isDragging) return;
    
    const dashboardToggle = document.getElementById('dashboard-toggle');
    if (!dashboardToggle) return;
    
    const deltaX = e.clientX - dragStartX;
    const deltaY = e.clientY - dragStartY;
    
    const newLeft = dragStartLeft + deltaX;
    const newTop = dragStartTop + deltaY;
    
    dashboardToggle.style.left = newLeft + 'px';
    dashboardToggle.style.top = newTop + 'px';
    dashboardToggle.style.right = 'auto';
    dashboardToggle.style.bottom = 'auto';
    
    // 检查边缘吸附
    checkEdgeSnap(newLeft, newTop);
}