ez4prompt/js/settings.js

// 设置控制器
export class SettingsController {
    constructor() {
        this.init();
    }
    
    init() {
        this.setupFontSettings();
        this.loadSettings();
    }
    
    setupFontSettings() {
        const fontFamily = document.getElementById('fontFamily');
        const fontSize = document.getElementById('fontSize');
        const fontSizeValue = document.getElementById('fontSizeValue');
        const fontColor = document.getElementById('fontColor');
        const marginLeft = document.getElementById('marginLeft');
        const marginLeftValue = document.getElementById('marginLeftValue');
        const marginRight = document.getElementById('marginRight');
        const marginRightValue = document.getElementById('marginRightValue');
        const letterSpacing = document.getElementById('letterSpacing');
        const letterSpacingValue = document.getElementById('letterSpacingValue');
        const lineHeight = document.getElementById('lineHeight');
        const lineHeightValue = document.getElementById('lineHeightValue');
        
        const editor = document.getElementById('textEditor');
        
        // 字体系列
        fontFamily.addEventListener('change', () => {
            editor.style.fontFamily = fontFamily.value;
            this.saveSettings();
        });
        
        // 字体大小
        fontSize.addEventListener('input', () => {
            const size = fontSize.value + 'px';
            editor.style.fontSize = size;
            fontSizeValue.textContent = size;
            this.saveSettings();
        });
        
        // 字体颜色
        fontColor.addEventListener('input', () => {
            editor.style.color = fontColor.value;
            this.saveSettings();
        });
        
        // 左边距
        marginLeft.addEventListener('input', () => {
            const margin = marginLeft.value + 'px';
            editor.style.paddingLeft = margin;
            marginLeftValue.textContent = margin;
            this.saveSettings();
        });
        
        // 右边距
        marginRight.addEventListener('input', () => {
            const margin = marginRight.value + 'px';
            editor.style.paddingRight = margin;
            marginRightValue.textContent = margin;
            this.saveSettings();
        });
        
        // 字间距
        letterSpacing.addEventListener('input', () => {
            const spacing = letterSpacing.value + 'px';
            editor.style.letterSpacing = spacing;
            letterSpacingValue.textContent = spacing;
            this.saveSettings();
        });
        
        // 行距
        lineHeight.addEventListener('input', () => {
            const height = lineHeight.value;
            editor.style.lineHeight = height;
            lineHeightValue.textContent = height;
            this.saveSettings();
        });
    }
    
    saveSettings() {
        const settings = {
            fontFamily: document.getElementById('fontFamily').value,
            fontSize: document.getElementById('fontSize').value,
            fontColor: document.getElementById('fontColor').value,
            marginLeft: document.getElementById('marginLeft').value,
            marginRight: document.getElementById('marginRight').value,
            letterSpacing: document.getElementById('letterSpacing').value,
            lineHeight: document.getElementById('lineHeight').value,
            autoScroll: document.getElementById('autoScroll').checked,
            scrollType: document.getElementById('scrollType').value,
            scrollSpeed: document.getElementById('scrollSpeed').value,
            horizontalFlip: document.getElementById('horizontalFlip')?.checked || false,
            verticalFlip: document.getElementById('verticalFlip')?.checked || false,
            watermarkEnabled: document.getElementById('watermarkEnabled')?.checked || false,
            watermarkText: document.getElementById('watermarkText')?.value || '',
            watermarkType: document.getElementById('watermarkType')?.value || 'center'
        };
        
        localStorage.setItem('teleprompter-settings', JSON.stringify(settings));
    }
    
    loadSettings() {
        const savedSettings = localStorage.getItem('teleprompter-settings');
        if (!savedSettings) {
            this.applyDefaultSettings();
            return;
        }
        
        try {
            const settings = JSON.parse(savedSettings);
            this.applySettings(settings);
        } catch (error) {
            console.error('加载设置失败:', error);
            this.applyDefaultSettings();
        }
    }
    
    applyDefaultSettings() {
        const defaultSettings = {
            fontFamily: 'SimSun, serif',
            fontSize: 40,
            fontColor: window.themeController?.isDarkTheme() ? '#ffffff' : '#333333',
            marginLeft: 100,
            marginRight: 50,
            letterSpacing: 1,
            lineHeight: 1.6,
            autoScroll: true,
            scrollType: 'line',
            scrollSpeed: 10,
            horizontalFlip: false,
            verticalFlip: false,
            watermarkEnabled: false,
            watermarkText: '',
            watermarkType: 'center'
        };
        
        this.applySettings(defaultSettings);
    }
    
    applySettings(settings) {
        const editor = document.getElementById('textEditor');
        
        // 应用字体设置
        if (settings.fontFamily) {
            document.getElementById('fontFamily').value = settings.fontFamily;
            editor.style.fontFamily = settings.fontFamily;
        }
        
        if (settings.fontSize) {
            document.getElementById('fontSize').value = settings.fontSize;
            document.getElementById('fontSizeValue').textContent = settings.fontSize + 'px';
            editor.style.fontSize = settings.fontSize + 'px';
        }
        
        if (settings.fontColor) {
            document.getElementById('fontColor').value = settings.fontColor;
            editor.style.color = settings.fontColor;
        }
        
        if (settings.marginLeft !== undefined) {
            document.getElementById('marginLeft').value = settings.marginLeft;
            document.getElementById('marginLeftValue').textContent = settings.marginLeft + 'px';
            editor.style.paddingLeft = settings.marginLeft + 'px';
        }
        
        if (settings.marginRight !== undefined) {
            document.getElementById('marginRight').value = settings.marginRight;
            document.getElementById('marginRightValue').textContent = settings.marginRight + 'px';
            editor.style.paddingRight = settings.marginRight + 'px';
        }
        
        if (settings.letterSpacing !== undefined) {
            document.getElementById('letterSpacing').value = settings.letterSpacing;
            document.getElementById('letterSpacingValue').textContent = settings.letterSpacing + 'px';
            editor.style.letterSpacing = settings.letterSpacing + 'px';
        }
        
        if (settings.lineHeight !== undefined) {
            document.getElementById('lineHeight').value = settings.lineHeight;
            document.getElementById('lineHeightValue').textContent = settings.lineHeight;
            editor.style.lineHeight = settings.lineHeight;
        }
        
        // 应用滚动设置
        if (settings.autoScroll !== undefined) {
            document.getElementById('autoScroll').checked = settings.autoScroll;
        }
        
        if (settings.scrollType) {
            document.getElementById('scrollType').value = settings.scrollType;
        }
        
        if (settings.scrollSpeed !== undefined) {
            document.getElementById('scrollSpeed').value = settings.scrollSpeed;
            document.getElementById('scrollSpeedValue').textContent = settings.scrollSpeed;
        }
        
        // 应用翻转设置
        if (settings.horizontalFlip !== undefined && document.getElementById('horizontalFlip')) {
            document.getElementById('horizontalFlip').checked = settings.horizontalFlip;
        }
        
        if (settings.verticalFlip !== undefined && document.getElementById('verticalFlip')) {
            document.getElementById('verticalFlip').checked = settings.verticalFlip;
        }
        
        // 应用水印设置
        if (settings.watermarkEnabled !== undefined && document.getElementById('watermarkEnabled')) {
            document.getElementById('watermarkEnabled').checked = settings.watermarkEnabled;
        }
        
        if (settings.watermarkText && document.getElementById('watermarkText')) {
            document.getElementById('watermarkText').value = settings.watermarkText;
        }
        
        if (settings.watermarkType && document.getElementById('watermarkType')) {
            document.getElementById('watermarkType').value = settings.watermarkType;
        }
    }
    
    resetSettings() {
        if (confirm('确定要重置所有设置吗？')) {
            localStorage.removeItem('teleprompter-settings');
            this.applyDefaultSettings();
        }
    }
    
    exportSettings() {
        const settings = localStorage.getItem('teleprompter-settings');
        if (settings) {
            const blob = new Blob([settings], { type: 'application/json' });
            const url = URL.createObjectURL(blob);
            
            const a = document.createElement('a');
            a.href = url;
            a.download = `teleprompter-settings-${new Date().toISOString().slice(0, 10)}.json`;
            document.body.appendChild(a);
            a.click();
            document.body.removeChild(a);
            URL.revokeObjectURL(url);
        }
    }
    
    importSettings(file) {
        const reader = new FileReader();
        reader.onload = (e) => {
            try {
                const settings = JSON.parse(e.target.result);
                this.applySettings(settings);
                this.saveSettings();
                alert('设置导入成功！');
            } catch (error) {
                alert('设置文件格式错误！');
            }
        };
        reader.readAsText(file);
    }
}