/**
 * 事件处理模块
 * @type {module}
 */
import { loadScenarioFiles, loadFileContent, saveFileContent, createNewConfig } from './file-operations.js';
import { createModal, resetEditState, checkSaveNeeded } from './utils.js';

/**
 * 初始化事件监听器
 * @param {HTMLElement} component - 组件实例
 */
export function setupEventListeners(component) {
    // 新建按钮
    const newButton = component.shadowRoot.getElementById('newConfig');
    newButton.addEventListener('click', async () => {
        // 检查是否需要保存当前文件
        if (await checkSaveNeeded(component)) {
            showNewConfigDialog(component);
        }
    });

    // 保存按钮
    const saveButton = component.shadowRoot.getElementById('saveConfig');
    saveButton.addEventListener('click', () => {
        if (component.currentFile && component.xmlContent) {
            saveFileContent(component, component.currentFile, component.xmlContent);
        } else {
            // 如果没有选择文件，则提示另存为
            if (component.xmlContent) {
                showSaveAsDialog(component);
            }
        }
    });

    // 另存为按钮
    const saveAsButton = component.shadowRoot.getElementById('saveAsConfig');
    saveAsButton.addEventListener('click', () => {
        showSaveAsDialog(component);
    });
    
    // 刷新按钮
    const refreshButton = component.shadowRoot.getElementById('refreshButton');
    refreshButton.addEventListener('click', async () => {
        // 检查是否需要保存当前文件
        if (await checkSaveNeeded(component)) {
            // 添加刷新中的样式
            refreshButton.classList.add('refreshing');
            
            try {
                // 重新加载文件列表
                await loadScenarioFiles(component);
                
                // 清除编辑状态和内容
                resetEditState(component.shadowRoot);
                
                // 清空内容区域
                component.xmlContent = '';
                component.xmlDoc = null;
                component.currentFile = null;
                
                const contentElement = component.shadowRoot.getElementById('fileContent');
                if (contentElement) {
                    contentElement.innerHTML = '<div class="no-file-selected">请选择一个运行环境配置文件查看内容</div>';
                }
                
                // 清空文件选择
                const fileSelector = component.shadowRoot.getElementById('scenarioFile');
                if (fileSelector) {
                    fileSelector.value = '';
                }
            } catch (error) {
                console.error('刷新文件列表失败:', error);
                alert('刷新文件列表失败: ' + error.message);
            } finally {
                // 移除刷新中的样式
                setTimeout(() => {
                    refreshButton.classList.remove('refreshing');
                }, 500);
            }
        }
        // 如果用户点击取消，什么也不做，保留当前内容
    });

    // 文件选择下拉框
    const fileSelector = component.shadowRoot.getElementById('scenarioFile');
    fileSelector.addEventListener('change', async (e) => {
        // 检查是否需要保存当前文件
        if (await checkSaveNeeded(component)) {
            const selectedFile = e.target.value;
            if (selectedFile) {
                loadFileContent(component, selectedFile);
            } else {
                component.currentFile = null;
                component.xmlContent = '';
                const contentElement = component.shadowRoot.getElementById('fileContent');
                contentElement.innerHTML = '<div class="no-file-selected">请选择一个运行环境配置文件查看内容</div>';
                component.isEdited = resetEditState(component.shadowRoot);
            }
        } else {
            // 恢复之前的选择
            fileSelector.value = component.currentFile || '';
        }
    });

    // 添加fileSelectorChange处理器供外部调用
    component.handleFileSelectorChange = async (e) => {
        // 检查是否需要保存当前文件
        if (await checkSaveNeeded(component)) {
            const selectedFile = e.target.value;
            if (selectedFile) {
                loadFileContent(component, selectedFile);
            }
        } else {
            // 恢复之前的选择
            fileSelector.value = component.currentFile || '';
        }
    };
}

/**
 * 显示新建配置对话框
 * @param {HTMLElement} component - 组件实例
 */
export function showNewConfigDialog(component) {
    // 创建表单容器
    const formContent = document.createElement('div');
    
    // 创建文件名输入组
    const formGroup = document.createElement('div');
    formGroup.className = 'form-group';
    formGroup.style.marginBottom = '16px';
    
    // 创建标签
    const label = document.createElement('label');
    label.htmlFor = 'fileName';
    label.textContent = '文件名';
    label.style.display = 'block';
    label.style.marginBottom = '8px';
    label.style.fontWeight = '500';
    label.style.color = '#2d3748';
    
    // 创建输入框
    const input = document.createElement('input');
    input.id = 'fileName';
    input.className = 'form-control';
    input.type = 'text';
    input.value = 'NewConfig';
    input.placeholder = '请输入文件名';
    input.style.width = '100%';
    input.style.padding = '10px 12px';
    input.style.border = '1px solid #ddd';
    input.style.borderRadius = '6px';
    input.style.fontSize = '15px';
    input.style.boxSizing = 'border-box';
    
    // 添加提示信息
    const helpText = document.createElement('div');
    helpText.textContent = '如未指定后缀，将自动添加.sce后缀';
    helpText.style.fontSize = '12px';
    helpText.style.color = '#718096';
    helpText.style.marginTop = '4px';
    
    // 组装表单组
    formGroup.appendChild(label);
    formGroup.appendChild(input);
    formGroup.appendChild(helpText);
    formContent.appendChild(formGroup);
    
    // 显示对话框
    const modal = createModal(component.shadowRoot, '新建配置文件', formContent, () => {
        let fileName = input.value.trim();
        
        if (!fileName) {
            alert('文件名不能为空');
            return;
        }
        
        // 自动添加后缀
        const ext = fileName.toLowerCase();
        if (!ext.endsWith('.xml') && !ext.endsWith('.sce')) {
            fileName += '.sce';
        }
        
        // 创建新文件
        createNewConfig(component, fileName);
        
        // 关闭模态框
        modal.modal.remove();
    });
}

/**
 * 显示另存为对话框
 * @param {HTMLElement} component - 组件实例
 */
export function showSaveAsDialog(component) {
    if (!component.xmlContent) {
        alert('没有内容可保存');
        return;
    }
    
    // 创建表单容器
    const formContent = document.createElement('div');
    
    // 创建文件名输入组
    const formGroup = document.createElement('div');
    formGroup.className = 'form-group';
    formGroup.style.marginBottom = '16px';
    
    // 创建标签
    const label = document.createElement('label');
    label.htmlFor = 'fileName';
    label.textContent = '文件名';
    label.style.display = 'block';
    label.style.marginBottom = '8px';
    label.style.fontWeight = '500';
    label.style.color = '#2d3748';
    
    // 获取原文件名（不含路径和后缀）
    let defaultFileName = 'NewConfig';
    if (component.currentFile) {
        const fileName = component.currentFile.split('/').pop();
        defaultFileName = fileName.substring(0, fileName.lastIndexOf('.')) || fileName;
    }
    
    // 创建输入框
    const input = document.createElement('input');
    input.id = 'fileName';
    input.className = 'form-control';
    input.type = 'text';
    input.value = defaultFileName;
    input.placeholder = '请输入文件名';
    input.style.width = '100%';
    input.style.padding = '10px 12px';
    input.style.border = '1px solid #ddd';
    input.style.borderRadius = '6px';
    input.style.fontSize = '15px';
    input.style.boxSizing = 'border-box';
    
    // 添加提示信息
    const helpText = document.createElement('div');
    helpText.textContent = '如未指定后缀，将自动添加.sce后缀';
    helpText.style.fontSize = '12px';
    helpText.style.color = '#718096';
    helpText.style.marginTop = '4px';
    
    // 组装表单组
    formGroup.appendChild(label);
    formGroup.appendChild(input);
    formGroup.appendChild(helpText);
    formContent.appendChild(formGroup);
    
    // 显示对话框
    createModal(component.shadowRoot, '另存为', formContent, () => {
        let fileName = input.value.trim();
        
        if (!fileName) {
            alert('文件名不能为空');
            return;
        }
        
        // 自动添加后缀
        const ext = fileName.toLowerCase();
        if (!ext.endsWith('.xml') && !ext.endsWith('.sce')) {
            fileName += '.sce';
        }
        
        // 直接使用文件名，saveFileContent 函数会处理成绝对路径
        saveFileContent(component, fileName, component.xmlContent);
    });
}