let material_id = null;
function lessonTemplate(material_id,chapter_name,lesson_name) {
    return `
        <li class="lesson-item" data-material-id="${material_id}" data-chapter-name="${chapter_name}" data-lesson-name="${lesson_name}">
            <span class="lesson-text" onclick="editLesson(this)">${lesson_name}
                <button class="icon-btn edit-btn" onclick="editLesson(this)">
                    <i class="fas fa-pencil-alt"></i>
                </button>
            </span>
            <div class="delete-btn-container"  onclick="deleteLesson(this)">
            <button class="icon-btn delete-btn">
                <i class="fas fa-trash-alt"></i>
            </button>
            </div>
        </li>
    `;
}

function show_teacher_data(user_data, user_course_data) {
    // 这里可以根据user_course_data生成课程卡片
    const courseCardsContainer = document.getElementById('course-cards');
    user_course_data.forEach(course => {
        const courseCard = document.createElement('div');
        courseCard.classList.add('course-card');
        courseCard.onclick = function() { openCourseDetails(course.id); };
        courseCard.innerHTML = `
            <img src="${course.cover_image}" alt="课程封面" class="course-image">
            <div class="course-info">
                <h3 class="course-name">${course.name}</h3>
                <p class="course-description">${course.description}</p>
            </div>
        `;
        courseCardsContainer.appendChild(courseCard);
    });
}
let isAddingChapter = false;

function showInputForNewChapter() {
    if (isAddingChapter) return; // 防止重复点击

    isAddingChapter = true;  // 标记正在添加章节

    // 找到新增章节按钮并隐藏
    const addButton = document.querySelector('.add-chapter-btn');
    addButton.style.display = 'none';

    // 创建一个输入框
    const input = document.createElement('input');
    input.type = 'text';
    input.placeholder = '请输入章节名称...';
    input.className = 'new-chapter-input';
    input.onblur = () => checkAndAddChapter(input);
    
    // 将输入框插入到页面
    const chapterList = document.getElementById('chapter-list');
    chapterList.appendChild(input);
    input.focus(); // 聚焦到输入框
}

function checkAndAddChapter(input) {
    const chapterName = input.value.trim();

    // 如果章节名称为空，显示提示并不添加
    if (!chapterName) {
        input.remove();  // 删除输入框
        document.querySelector('.add-chapter-btn').style.display = 'block'; // 重新显示新增章节按钮
        isAddingChapter = false;
        return;
    }

    // 如果章节名称合法，添加到章节列表
    const chapterList = document.getElementById('chapter-list');
    const chapterItem = document.createElement('li');
    chapterItem.innerHTML = `
        <li class="lesson-item">
        <strong>${chapterName}</strong> <button class="icon-btn delete-btn" onclick="deleteChapter(this)">
            <i class="fas fa-trash-alt"></i>
        </button>
        </li>
        <ul>
        </ul>
        <button class="add-lesson-btn" onclick="showInputForNewLesson('${chapterName}', this)">新增课时</button>
    `;
    chapterList.appendChild(chapterItem);
    // 恢复新增按钮的显示
    document.querySelector('.add-chapter-btn').style.display = 'block';
    input.remove();
    isAddingChapter = false;
    fetch(`/materials/addchapter/${material_id}`, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({chapter_name: chapterName})
    })
    .then(response => response.json())
    .then(data => {
        alert(data.message);
    })
    .catch(error => {
        console.error('Error adding chapter:', error);
    });
}
function openCourseDetails(courseId) {
    // 打开课程目录
    const courseDetails = document.getElementById('courseDetails');
    const courseTitle = document.getElementById('course-title');
    courseTitle.textContent = "课程名称: " + courseId; // 假设这里显示课程ID，实际情况应该是课程名称
    
    courseDetails.classList.add('open');

    // 获取章节数据并渲染
    renderChapters(courseId);
}
function deleteChapter(deleteButton) {
    // 删除章节
    const chapterItem = deleteButton.closest('li');
    chapterItem.remove();
}
function renderChapters(courseId) {
    const chapterList = document.getElementById('chapter-list');
    chapterList.innerHTML = ""; // 清空章节列表
    material_id = courseId;

    window.material_id = courseId;            // 兼容你原来的全局变量
    window.EDIT_COURSE_CURRENT = window.EDIT_COURSE_CURRENT || {};
    EDIT_COURSE_CURRENT.material_id = courseId;           // 新的统一来源

    fetch(`/materials/${courseId}`)
    .then(response => response.json())
    .then(data => {
        document.getElementById('course-title').innerText = data.name;
        const detailsContent = document.getElementById('details-content');
        // 填充课程描述
        const description = data.description || '暂无描述';
        detailsContent.innerHTML = `<h3>课程描述：</h3><p>${description}</p>`;
        
        // 填充章节列表
        const chapterList = document.getElementById('chapter-list');
        chapterList.innerHTML = '';  // 清空之前的章节列表

        data.chapters.forEach(chapter => {
            const chapterItem = document.createElement('li');
            chapterItem.classList.add('chapter-item');
            chapterItem.innerHTML = `<strong class="chapter-header">${chapter.chapter_name}</strong>`;
            
            const lessonList = document.createElement('ul');
            lessonList.classList.add('lessons-list');
            chapter.lessons.forEach(lesson => {
                lessonList.innerHTML += lessonTemplate(material_id,chapter.chapter_name,lesson.lesson_name);
            });
            chapterItem.appendChild(lessonList);
            const addBtn = document.createElement('button');
            addBtn.className = 'add-lesson-btn';
            addBtn.onclick = () => showInputForNewLesson(chapter.chapter_name, addBtn);
            addBtn.textContent = '新增课时';
            chapterItem.appendChild(addBtn);

            chapterList.appendChild(chapterItem);
        });

        // 使侧边栏滑出
        document.getElementById('courseDetails').classList.add('open');
    })
    .catch(error => {
        const detailsContent = document.getElementById('details-content');
        detailsContent.innerHTML = '<p>加载课程详情失败，请稍后再试。</p>';
        console.error('Error loading course details:', error);
    });
}


function showInputForNewLesson(chapterTitle, button) {
    // 防止重复点击
    const addButton = button;
    addButton.style.display = 'none'; // 隐藏按钮
    // 创建一个输入框
    const input = document.createElement('input');
    input.type = 'text';
    input.placeholder = '请输入课时名称...';
    input.className = 'new-lesson-input';
    input.onblur = () => checkAndAddLesson(input, chapterTitle, addButton);  // 失去焦点时检查输入
    // 将输入框插入到章节列表中
    const chapterItem = addButton.closest('li');  // 获取到点击按钮的父元素
    chapterItem.appendChild(input);
    input.focus(); // 聚焦到输入框
}
function checkAndAddLesson(input, chapterTitle, addButton) {
    const lessonName = input.value.trim();

    // 如果课时名称为空，显示提示并不添加
    if (!lessonName) {
        input.remove();  // 删除输入框
        addButton.style.display = 'block'; // 重新显示新增课时按钮
        return;
    }

    // 如果课时名称合法，添加到课时列表
    const chapterList = document.getElementById('chapter-list');
    const chapterItem = Array.from(chapterList.children).find(item => item.querySelector('strong').textContent === chapterTitle);
    const lessonsList = chapterItem.querySelector('ul');

    const lessonItem = document.createElement('span');
    lessonItem.innerHTML = lessonTemplate(material_id, chapterTitle, lessonName);

    lessonsList.appendChild(lessonItem);  // 将新课时添加到章节下
    input.remove();  // 删除输入框
    addButton.style.display = 'block';  // 重新显示新增课时按钮
    fetch(`/materials/addlesson/${material_id}`, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({chapter_name: chapterTitle, lesson_name: lessonName})
    })
}

function deleteLesson(elemOrEvent) {
    const el = elemOrEvent?.target ? elemOrEvent.target : elemOrEvent;
    const li = el?.closest?.('li.lesson-item');
    if (!li) {
      console.warn('未找到父级 lesson-item');
      return;
    }
    const { materialId, chapterName, lessonName } = li.dataset;
    const material_id = materialId;
    const chapter_name = chapterName;
    const lesson_name = lessonName;
    if (!window.confirm(`确认删除课时「${lesson_name}」吗？`)){
        return;
    }
    const lessonItems = document.querySelectorAll('.lesson-item');
    lessonItems.forEach(item => {
        if (item.dataset.lessonName === lesson_name && item.dataset.chapterName === chapter_name && item.dataset.materialId === material_id) {
            fetch(`/materials/deletelesson/${material_id}`, {
                method: 'DELETE',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({chapter_name: chapter_name, lesson_name: lesson_name})
            })
            .then(response => response.json())
            .then(data => {
                alert(data.message);
                item.remove();  // 删除对应的课时项
                renderChapters(material_id);
                return;
            })
            .catch(error => {
                console.error('Error deleting lesson:', error);
            });
        }
    });
}


function editLesson(elemOrEvent) {
    const el = elemOrEvent?.target ? elemOrEvent.target : elemOrEvent;
    const li = el?.closest?.('li.lesson-item');
    if (!li) {
      console.warn('未找到父级 lesson-item');
      return;
    }
    const { materialId, chapterName, lessonName } = li.dataset;
    const material_id = materialId;
    const chapter_name = chapterName;
    const lesson_name = lessonName;
    const renameMode = document.getElementById('toggle-rename').getAttribute('aria-pressed') === 'true';
    if (renameMode) {
        return;
    }
    // 编辑课时的逻辑
    alert("编辑课时: " + lesson_name);
    window.location.href = `/api/materials/${material_id}/chapters/${chapter_name}/lessons/${lesson_name}`;
}

function closeCourseDetails() {
    document.getElementById('courseDetails').classList.remove('open');
    material_id = null;
}



// 打开新建课程浮窗
function openAddCourseModal() {
    document.getElementById('add-course-modal').style.display = 'block';
}

// 关闭新建课程浮窗
function closeAddCourseModal() {
    document.getElementById('add-course-modal').style.display = 'none';
}

// 显示删除课程确认弹窗
function showDeleteCourseConfirmation() {
    if (!material_id) {
        alert('无法删除课程：未找到课程ID');
        return;
    }
    
    if (confirm('确定要删除这个课程吗？此操作无法撤销！')) {
        deleteCourse(material_id);
    }
}

// 删除课程
function deleteCourse(courseId) {
    fetch(`/materials/${courseId}`, {
        method: 'DELETE',
        headers: {
            'Content-Type': 'application/json'
        }
    })
    .then(response => response.json())
    .then(data => {
        if (data.message) {
            alert(data.message);
            if (data.success) {
                // 关闭侧边栏并刷新页面
                closeCourseDetails();
                location.reload();
            }
        }
    })
    .catch(error => {
        console.error('删除课程时出错:', error);
        alert('删除课程失败，请稍后再试！');
    });
}

function onTeacherboardPageLoad(){
// 提交表单处理
document.getElementById('add-course-form').addEventListener('submit', function(event) {
    event.preventDefault();

    const courseName = document.getElementById('course-name').value;
    const courseSelection = document.getElementById('course-selection').value; // 获取选择值
    const coverImage = document.getElementById('cover-preview').src;
    const courseDescription = document.getElementById('course-description').value;
    // 构建发送的数据
    const data = {
        material_name: courseName,
        description: courseDescription,
        chapters: [], // 这里可以根据需要添加章节信息，如果有的话
        image_url: coverImage
    };

    // 如果选择了已有课程，可以通过 courseSelection 传递课程ID（根据需要修改）
    if (courseSelection !== 'new') {
        // 如果是修改已有课程，设置相关的章节信息或其他数据
        data.chapters = ["Chapter 1", "Chapter 2"];
    }

    // 发送 POST 请求到 /create_material
    fetch('/create_material', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(data) // 将数据转为 JSON 格式
    })
    .then(response => response.json())
    .then(data => {
        console.log("返回消息:", data.message); // 打印返回消息
        alert(data.message); // 显示一个警告框来显示返回的消息
        courseName.value = "";
        closeAddCourseModal(); // 关闭浮窗
    })
    .catch(error => {
        console.error("请求失败:", error); // 如果请求失败，打印错误
        alert("创建课程失败，请稍后再试！");
    });
});

document.getElementById("cover-image").addEventListener("click", function() {
    document.getElementById("cover-image-input").click();
});

document.getElementById("cover-image-input").addEventListener("change", function(event) {
    const file = event.target.files[0];
    if (file) {
        const formData = new FormData();
        formData.append("file", file);

        // 上传图片到服务器
        fetch('/teacher/upload_image', {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.image_url) {
                // 显示上传后的图片预览
                document.getElementById("cover-preview").src = data.image_url;
                document.getElementById("cover-preview").style.display = 'block';
                document.getElementById("cover-image").style.display = 'none';  // 隐藏占位符
            } else {
                alert('图片上传失败');
            }
        })
        .catch(error => {
            alert('上传出错');
            console.error(error);
        });
    }
});

}