條碼生成器技術實作 Barcode Generator Implementation

// 條碼生成器主應用程式類別
class BarcodeGenerator {
    constructor() {
        // 🎯 應用核心狀態管理
        this.currentFormat = 'qrcode';           // 當前選中的條碼格式
        this.currentLanguage = 'zh';             // 當前語言設定
        this.currentMode = 'generate';           // 當前操作模式：'generate' 或 'decode'
        
        // ⚙️ 條碼生成設定物件
        this.currentSettings = {
            width: 200,                          // 條碼寬度 (像素)
            height: 100,                         // 條碼高度 (像素)
            margin: 10,                          // 邊距大小 (像素)
            foreground: '#000000',               // 前景色 (條碼顏色)
            background: '#ffffff',               // 背景色
            errorCorrection: 'M'                 // QR碼容錯等級 (L/M/Q/H)
        };
        
        // 🖼️ DOM 元素引用快取
        this.elements = {};                      // 所有 DOM 元素的快速引用
        
        // 📊 生成結果數據
        this.generatedBarcode = null;            // 生成的條碼數據 (Canvas/圖片)
        
        // 🔍 解碼相關狀態
        this.selectedFile = null;                // 用戶選擇的圖片檔案
        this.decodedContent = null;              // 解碼後的內容文字
        
        // ⏰ 防抖計時器
        this.debounceTimer = null;               // 輸入驗證防抖計時器
        
        // 🔧 配置和翻譯數據
        this.config = null;                      // 應用配置
        this.translations = null;                // 多語言翻譯字典
        
        // 🚀 啟動應用初始化
        this.init();
    }

    // 📋 應用生命週期：異步初始化主流程
    async init() {
        try {
            console.log('🔄 初始化條碼生成器...');
            
            // 1️⃣ 等待 DOM 完全載入
            if (document.readyState === 'loading') {
                await new Promise(resolve => {
                    document.addEventListener('DOMContentLoaded', resolve);
                });
            }

            // 2️⃣ 快取所有 DOM 元素引用
            this.getElementReferences();
            
            // 3️⃣ 載入配置和多語言翻譯
            await this.loadConfig();
            
            // 4️⃣ 整合全域語言系統
            this.setupGlobalLanguageListener();
            
            // 5️⃣ 初始化主題系統
            this.initTheme();
            
            // 6️⃣ 綁定所有事件監聽器
            this.setupEventListeners();
            
            // 7️⃣ 更新界面文字為當前語言
            this.updateUIText();
            
            // 8️⃣ 載入條碼生成/解碼外部庫
            await this.loadExternalLibraries();
            
            console.log('✅ 條碼生成器初始化完成');
            
        } catch (error) {
            console.error('❌ 初始化錯誤:', error);
            const t = this.translations?.[this.currentLanguage] || this.translations?.zh;
            this.showToast(t?.decodeError || '初始化過程中發生錯誤', 'error');
        }
    }

    // 🎯 模式管理：在生成模式和解碼模式之間切換
    switchToGenerateMode() {
        this.currentMode = 'generate';
        this.elements.generateModeBtn.classList.add('active');
        this.elements.decodeModeBtn.classList.remove('active');
        this.elements.generateSection.style.display = 'grid';
        this.elements.decodeSection.style.display = 'none';
        this.updateUIText();
        console.log('🔄 切換到生成模式');
    }

    switchToDecodeMode() {
        this.currentMode = 'decode';
        this.elements.generateModeBtn.classList.remove('active');
        this.elements.decodeModeBtn.classList.add('active');
        this.elements.generateSection.style.display = 'none';
        this.elements.decodeSection.style.display = 'grid';
        this.updateUIText();
        console.log('🔍 切換到解碼模式');
    }

    // 📝 設定更新：同步當前設定到內部狀態
    updateSettings() {
        this.currentSettings.foreground = this.elements.foregroundColor.value;
        this.currentSettings.background = this.elements.backgroundColor.value;
        this.currentSettings.width = parseInt(this.elements.widthRange.value);
        this.currentSettings.height = parseInt(this.elements.heightRange.value);
        this.currentSettings.margin = parseInt(this.elements.marginRange.value);
        
        // 🔄 即時更新顯示值
        this.elements.widthValue.textContent = this.currentSettings.width + 'px';
        this.elements.heightValue.textContent = this.currentSettings.height + 'px';
        this.elements.marginValue.textContent = this.currentSettings.margin + 'px';
    }
}

// 🌐 全域語言系統整合方法
setupGlobalLanguageListener() {
    // 📡 監聽全域語言變更事件
    window.addEventListener('languageChanged', (event) => {
        this.currentLanguage = event.detail.language;
        this.updateLanguage();
        console.log(`🌍 語言已切換至: ${this.currentLanguage}`);
    });
    
    // 🔍 檢查全域語言管理器可用性
    const checkGlobalLanguage = () => {
        if (window.globalI18n) {
            this.currentLanguage = window.globalI18n.currentLanguage;
            this.updateLanguage();
            console.log(`🎯 同步到全域語言: ${this.currentLanguage}`);
            return true;
        }
        return false;
    };
    
    // ⏰ 如果全域語言管理器尚未載入，延遲檢查
    if (!checkGlobalLanguage()) {
        setTimeout(() => {
            checkGlobalLanguage();
        }, 100);
    }
}

// 🔄 語言更新主方法
updateLanguage() {
    this.updateUIText();
    this.updatePreviewPlaceholders();
}

// 📝 完整的多語言翻譯字典
useBuiltinConfig() {
    this.translations = {
        zh: {
            // 🎯 基本界面文字
            pageTitle: '條碼／QR碼生成器',
            formatLabel: '條碼格式',
            contentLabel: '輸入內容',
            contentPlaceholder: '請輸入要編碼的內容...',
            
            // 🎨 控制界面
            colorLabel: '顏色設定',
            foregroundLabel: '前景色',
            backgroundLabel: '背景色',
            sizeLabel: '尺寸設定',
            widthLabel: '寬度',
            heightLabel: '高度',
            marginLabel: '邊距',
            errorCorrectionLabel: '容錯等級',
            
            // 🔘 按鈕文字
            generateBtn: '生成條碼',
            clearBtn: '清除',
            downloadPng: '下載 PNG',
            downloadSvg: '下載 SVG',
            copyImage: '複製圖片',
            generateModeBtn: '生成模式',
            decodeModeBtn: '解碼模式',
            
            // 🔍 解碼界面
            fileLabel: '選擇QR碼圖片',
            fileInfoText: '支援格式: PNG, JPG, JPEG, GIF, WebP',
            decodeBtn: '解碼QR碼',
            clearDecodeBtn: '清除',
            decodeResultLabel: '解碼結果',
            copyResult: '複製內容',
            visitLink: '前往連結',
            
            // 💬 提示文字
            generatePlaceholder: '請設定參數並點擊「生成條碼」',
            decodePlaceholder: '請選擇QR碼圖片文件',
            decoding: '解碼中...',
            
            // ✅ 成功訊息
            barcodeGenerated: '條碼生成成功！',
            allCleared: '已清除所有內容',
            imageCopied: '圖片已複製到剪貼簿！',
            downloadStarted: '文件下載開始',
            qrDecodeSuccess: 'QR碼解碼成功！',
            decodeCleared: '已清除解碼內容',
            contentCopied: '內容已複製到剪貼簿！',
            linkOpening: '正在打開連結...',
            
            // ❌ 錯誤訊息
            pleaseEnterContent: '請輸入要編碼的內容',
            generationFailed: '生成條碼失敗',
            copyFailed: '複製失敗，請使用下載功能',
            nothingToCopy: '沒有可複製的內容',
            copyFailedManual: '複製失敗，請手動選擇複製',
            invalidUrl: '無效的網址',
            pleaseSelectFile: '請先選擇QR碼圖片',
            libNotLoaded: 'QR解碼庫尚未載入完成，請稍後再試',
            cannotReadQR: '無法讀取QR碼內容，請確認圖片清晰並包含有效的QR碼',
            decodeError: '解碼過程中發生錯誤',
            selectValidImage: '請選擇有效的圖片文件',
            fileTooLarge: '圖片文件過大，請選擇小於10MB的文件',
            generateFirst: '請先生成條碼',
            
            // 🔍 驗證訊息
            validContent: '內容格式正確',
            invalidContent: '內容格式錯誤'
        },
        en: {
            // 🎯 Basic interface text
            pageTitle: 'Barcode / QR Code Generator',
            formatLabel: 'Barcode Format',
            contentLabel: 'Input Content',
            contentPlaceholder: 'Enter content to encode...',
            
            // 🎨 Control interface
            colorLabel: 'Color Settings',
            foregroundLabel: 'Foreground',
            backgroundLabel: 'Background',
            sizeLabel: 'Size Settings',
            widthLabel: 'Width',
            heightLabel: 'Height',
            marginLabel: 'Margin',
            errorCorrectionLabel: 'Error Correction',
            
            // 🔘 Button text
            generateBtn: 'Generate',
            clearBtn: 'Clear',
            downloadPng: 'Download PNG',
            downloadSvg: 'Download SVG',
            copyImage: 'Copy Image',
            generateModeBtn: 'Generate Mode',
            decodeModeBtn: 'Decode Mode',
            
            // 🔍 Decode interface
            fileLabel: 'Select QR Code Image',
            fileInfoText: 'Supported formats: PNG, JPG, JPEG, GIF, WebP',
            decodeBtn: 'Decode QR Code',
            clearDecodeBtn: 'Clear',
            decodeResultLabel: 'Decode Result',
            copyResult: 'Copy Content',
            visitLink: 'Visit Link',
            
            // 💬 Hint text
            generatePlaceholder: 'Please set parameters and click "Generate"',
            decodePlaceholder: 'Please select QR code image file',
            decoding: 'Decoding...',
            
            // ✅ Success messages
            barcodeGenerated: 'Barcode generated successfully!',
            allCleared: 'All content cleared',
            imageCopied: 'Image copied to clipboard!',
            downloadStarted: 'Download started',
            qrDecodeSuccess: 'QR code decoded successfully!',
            decodeCleared: 'Decode content cleared',
            contentCopied: 'Content copied to clipboard!',
            linkOpening: 'Opening link...',
            
            // ❌ Error messages
            pleaseEnterContent: 'Please enter content to encode',
            generationFailed: 'Failed to generate barcode',
            copyFailed: 'Copy failed, please use download',
            nothingToCopy: 'Nothing to copy',
            copyFailedManual: 'Copy failed, please select manually',
            invalidUrl: 'Invalid URL',
            pleaseSelectFile: 'Please select QR code image first',
            libNotLoaded: 'QR decode library not loaded, please try again',
            cannotReadQR: 'Cannot read QR code content, please ensure image is clear and contains valid QR code',
            decodeError: 'Error occurred during decoding',
            selectValidImage: 'Please select a valid image file',
            fileTooLarge: 'Image file too large, please select file smaller than 10MB',
            generateFirst: 'Please generate barcode first',
            
            // 🔍 Validation messages
            validContent: 'Content format is valid',
            invalidContent: 'Content format is invalid'
        }
    };
}

// 🎨 界面文字更新方法
updateUIText() {
    if (!this.translations) return;
    
    const t = this.translations[this.currentLanguage] || this.translations.zh;
    
    // 📝 更新所有界面標籤文字
    if (this.elements.pageTitle) this.elements.pageTitle.textContent = t.pageTitle;
    if (this.elements.formatLabel) this.elements.formatLabel.textContent = t.formatLabel;
    if (this.elements.contentLabel) this.elements.contentLabel.textContent = t.contentLabel;
    if (this.elements.colorLabel) this.elements.colorLabel.textContent = t.colorLabel;
    if (this.elements.foregroundLabel) this.elements.foregroundLabel.textContent = t.foregroundLabel;
    if (this.elements.backgroundLabel) this.elements.backgroundLabel.textContent = t.backgroundLabel;
    if (this.elements.sizeLabel) this.elements.sizeLabel.textContent = t.sizeLabel;
    if (this.elements.widthLabel) this.elements.widthLabel.textContent = t.widthLabel;
    if (this.elements.heightLabel) this.elements.heightLabel.textContent = t.heightLabel;
    if (this.elements.marginLabel) this.elements.marginLabel.textContent = t.marginLabel;
    if (this.elements.errorCorrectionLabel) this.elements.errorCorrectionLabel.textContent = t.errorCorrectionLabel;
    
    // 🔘 更新按鈕文字
    if (this.elements.generateBtn) this.elements.generateBtn.textContent = t.generateBtn;
    if (this.elements.clearBtn) this.elements.clearBtn.textContent = t.clearBtn;
    if (this.elements.downloadPng) this.elements.downloadPng.textContent = t.downloadPng;
    if (this.elements.downloadSvg) this.elements.downloadSvg.textContent = t.downloadSvg;
    if (this.elements.copyImage) this.elements.copyImage.textContent = t.copyImage;
    if (this.elements.generateModeBtn) this.elements.generateModeBtn.textContent = t.generateModeBtn;
    if (this.elements.decodeModeBtn) this.elements.decodeModeBtn.textContent = t.decodeModeBtn;
    
    // 🔍 更新解碼界面文字
    if (this.elements.fileLabel) this.elements.fileLabel.textContent = t.fileLabel;
    if (this.elements.fileInfoText) this.elements.fileInfoText.textContent = t.fileInfoText;
    if (this.elements.decodeBtn) this.elements.decodeBtn.textContent = t.decodeBtn;
    if (this.elements.clearDecodeBtn) this.elements.clearDecodeBtn.textContent = t.clearDecodeBtn;
    if (this.elements.decodeResultLabel) this.elements.decodeResultLabel.textContent = t.decodeResultLabel;
    if (this.elements.copyResult) this.elements.copyResult.textContent = t.copyResult;
    if (this.elements.visitLink) this.elements.visitLink.textContent = t.visitLink;
    
    // 💭 更新提示文字
    if (this.elements.contentInput) this.elements.contentInput.placeholder = t.contentPlaceholder;
    
    // 🖼️ 更新預覽區域占位符
    this.updatePreviewPlaceholders();
}

// 🎯 DOM 元素引用快取系統
getElementReferences() {
    this.elements = {
        // 🎛️ 主要控制元件
        formatSelect: document.getElementById('format-select'),           // 格式選擇下拉選單
        contentInput: document.getElementById('content-input'),           // 內容輸入文字區域
        foregroundColor: document.getElementById('foreground-color'),     // 前景色選擇器
        backgroundColor: document.getElementById('background-color'),     // 背景色選擇器
        widthRange: document.getElementById('width-range'),               // 寬度滑桿
        heightRange: document.getElementById('height-range'),             // 高度滑桿
        marginRange: document.getElementById('margin-range'),             // 邊距滑桿
        
        // 🔘 功能按鈕
        generateBtn: document.getElementById('generate-btn'),             // 生成條碼按鈕
        clearBtn: document.getElementById('clear-btn'),                   // 清除按鈕
        themeToggle: document.getElementById('theme-toggle'),             // 主題切換按鈕
        downloadPng: document.getElementById('download-png'),             // PNG下載按鈕
        downloadSvg: document.getElementById('download-svg'),             // SVG下載按鈕
        copyImage: document.getElementById('copy-image'),                 // 複製圖片按鈕
        
        // 🔄 模式切換相關
        modeToggle: document.getElementById('mode-toggle'),               // 模式切換按鈕
        generateModeBtn: document.getElementById('generate-mode-btn'),    // 生成模式按鈕
        decodeModeBtn: document.getElementById('decode-mode-btn'),        // 解碼模式按鈕
        generateSection: document.getElementById('generate-section'),     // 生成模式區域
        decodeSection: document.getElementById('decode-section'),         // 解碼模式區域
        
        // 🔍 解碼功能控件
        fileInput: document.getElementById('file-input'),                 // 檔案上傳輸入
        decodeBtn: document.getElementById('decode-btn'),                 // 解碼按鈕
        clearDecodeBtn: document.getElementById('clear-decode-btn'),      // 清除解碼按鈕
        decodePreviewArea: document.getElementById('decode-preview-area'), // 解碼預覽區域
        decodeResultGroup: document.getElementById('decode-result-group'), // 解碼結果群組
        decodeErrorGroup: document.getElementById('decode-error-group'),  // 解碼錯誤群組
        decodeErrorMessage: document.getElementById('decode-error-message'), // 解碼錯誤訊息
        resultText: document.getElementById('result-text'),               // 結果文字顯示
        copyResult: document.getElementById('copy-result'),               // 複製結果按鈕
        visitLink: document.getElementById('visit-link'),                 // 造訪連結按鈕
        
        // 📦 容器和顯示區域
        previewArea: document.getElementById('preview-area'),             // 預覽區域
        downloadOptions: document.getElementById('download-options'),     // 下載選項區域
        errorCorrectionGroup: document.getElementById('error-correction-group'), // 容錯群組
        validationMessage: document.getElementById('validation-message'), // 驗證訊息
        
        // 📊 數值顯示
        widthValue: document.getElementById('width-value'),               // 寬度值顯示
        heightValue: document.getElementById('height-value'),             // 高度值顯示
        marginValue: document.getElementById('margin-value'),             // 邊距值顯示
        
        // 🏷️ 文字標籤
        pageTitle: document.getElementById('page-title'),                 // 頁面標題
        formatLabel: document.getElementById('format-label'),             // 格式標籤
        contentLabel: document.getElementById('content-label'),           // 內容標籤
        colorLabel: document.getElementById('color-label'),               // 顏色標籤
        foregroundLabel: document.getElementById('foreground-label'),     // 前景色標籤
        backgroundLabel: document.getElementById('background-label'),     // 背景色標籤
        sizeLabel: document.getElementById('size-label'),                 // 尺寸標籤
        widthLabel: document.getElementById('width-label'),               // 寬度標籤
        heightLabel: document.getElementById('height-label'),             // 高度標籤
        marginLabel: document.getElementById('margin-label'),             // 邊距標籤
        errorCorrectionLabel: document.getElementById('error-correction-label'), // 容錯標籤
        fileLabel: document.getElementById('file-label'),                 // 檔案標籤
        decodeResultLabel: document.getElementById('decode-result-label'), // 解碼結果標籤
        fileInfoText: document.getElementById('file-info-text')           // 檔案資訊文字
    };
    
    console.log('📋 DOM 元素引用快取完成，共', Object.keys(this.elements).length, '個元素');
}

// 🎪 完整事件監聽器設定
setupEventListeners() {
    // 🔄 模式切換事件
    this.elements.generateModeBtn.addEventListener('click', () => this.switchToGenerateMode());
    this.elements.decodeModeBtn.addEventListener('click', () => this.switchToDecodeMode());
    this.elements.modeToggle.addEventListener('click', () => this.toggleMode());

    // 📝 格式和內容變更事件
    this.elements.formatSelect.addEventListener('change', () => {
        this.currentFormat = this.elements.formatSelect.value;
        this.updateErrorCorrectionVisibility();  // 根據格式調整容錯顯示
        this.updateHeightRangeVisibility();      // 根據格式調整高度滑桿
        this.validateInput();                    // 觸發輸入驗證
        console.log('🎯 格式已變更為:', this.currentFormat);
    });

    // ⌨️ 內容輸入事件（使用防抖優化）
    this.elements.contentInput.addEventListener('input', () => {
        this.debounce(() => this.validateInput(), 500);
    });

    // 🎨 顏色變更事件
    this.elements.foregroundColor.addEventListener('change', () => {
        this.updateSettings();
        console.log('🎨 前景色已變更為:', this.elements.foregroundColor.value);
    });
    this.elements.backgroundColor.addEventListener('change', () => {
        this.updateSettings();
        console.log('🎨 背景色已變更為:', this.elements.backgroundColor.value);
    });

    // 📏 尺寸滑桿事件（即時更新）
    this.elements.widthRange.addEventListener('input', () => {
        this.currentSettings.width = parseInt(this.elements.widthRange.value);
        this.elements.widthValue.textContent = this.currentSettings.width + 'px';
    });

    this.elements.heightRange.addEventListener('input', () => {
        this.currentSettings.height = parseInt(this.elements.heightRange.value);
        this.elements.heightValue.textContent = this.currentSettings.height + 'px';
    });

    this.elements.marginRange.addEventListener('input', () => {
        this.currentSettings.margin = parseInt(this.elements.marginRange.value);
        this.elements.marginValue.textContent = this.currentSettings.margin + 'px';
    });

    // 🛡️ 容錯等級按鈕事件
    document.querySelectorAll('.ec-btn').forEach(btn => {
        btn.addEventListener('click', () => {
            // 移除所有按鈕的active狀態
            document.querySelectorAll('.ec-btn').forEach(b => b.classList.remove('active'));
            // 啟用被點擊的按鈕
            btn.classList.add('active');
            this.currentSettings.errorCorrection = btn.dataset.level;
            console.log('🛡️ 容錯等級已設為:', this.currentSettings.errorCorrection);
        });
    });

    // 🎬 生成模式按鈕事件
    this.elements.generateBtn.addEventListener('click', () => {
        console.log('🖱️ 生成按鈕被點擊');
        this.generateBarcode();
    });
    this.elements.clearBtn.addEventListener('click', () => this.clearAll());

    // 🔍 解碼模式按鈕事件
    this.elements.fileInput.addEventListener('change', (e) => this.handleFileSelect(e));
    this.elements.decodeBtn.addEventListener('click', () => this.decodeQRCode());
    this.elements.clearDecodeBtn.addEventListener('click', () => this.clearDecode());
    this.elements.copyResult.addEventListener('click', () => this.copyDecodeResult());
    this.elements.visitLink.addEventListener('click', () => this.visitDecodedLink());

    // 💾 下載和複製按鈕事件
    this.elements.downloadPng.addEventListener('click', () => this.downloadImage('png'));
    this.elements.downloadSvg.addEventListener('click', () => this.downloadImage('svg'));
    this.elements.copyImage.addEventListener('click', () => this.copyImageToClipboard());

    // 🌓 主題切換事件
    this.elements.themeToggle.addEventListener('click', () => this.toggleTheme());
    
    console.log('🎪 所有事件監聽器設定完成');
}

// 🔍 智能顯示控制方法
updateErrorCorrectionVisibility() {
    // 只有二維碼格式才顯示容錯等級選項
    const isQRCode = ['qrcode', 'datamatrix', 'pdf417'].includes(this.currentFormat);
    this.elements.errorCorrectionGroup.style.display = isQRCode ? 'block' : 'none';
}

updateHeightRangeVisibility() {
    // 二維碼顯示高度控制，一維條碼隱藏（自動計算高度）
    const is2D = ['qrcode', 'datamatrix', 'pdf417'].includes(this.currentFormat);
    this.elements.heightRange.parentElement.style.display = is2D ? 'block' : 'none';
    
    if (!is2D) {
        // 一維條碼使用固定高度比例
        this.currentSettings.height = Math.max(50, this.currentSettings.width * 0.3);
        this.elements.heightValue.textContent = this.currentSettings.height + 'px';
    }
}

// ⏰ 防抖工具方法
debounce(func, wait) {
    clearTimeout(this.debounceTimer);
    this.debounceTimer = setTimeout(func, wait);
}

// ⚙️ 條碼生成主控制方法
async generateBarcode() {
    console.log('🔄 開始生成條碼...');
    const content = this.elements.contentInput.value.trim();
    console.log('📝 輸入內容:', content);
    const t = this.translations[this.currentLanguage];
    
    // 🔍 輸入內容驗證
    if (!content) {
        console.log('❌ 沒有輸入內容');
        this.showToast(t.pleaseEnterContent, 'error');
        return;
    }

    // 📚 檢查必要的庫是否已載入
    if (this.currentFormat === 'qrcode' && typeof QRCode === 'undefined') {
        console.log('⏳ QR Code 庫尚未載入，嘗試重新載入...');
        try {
            await this.loadExternalLibraries();
            // 短暫延遲確保庫完全載入
            await new Promise(resolve => setTimeout(resolve, 100));
        } catch (error) {
            console.error('載入庫失敗:', error);
            this.showToast(t.libNotLoaded, 'error');
            return;
        }
    }

    try {
        console.log('⚙️ 更新設定...');
        this.updateSettings();
        
        // 🧹 清除預覽區域
        console.log('🧹 清除預覽區域...');
        this.elements.previewArea.innerHTML = '';
        
        console.log('🎯 當前格式:', this.currentFormat);
        
        // 🎨 根據格式類型選擇生成方法
        if (['qrcode', 'datamatrix', 'pdf417'].includes(this.currentFormat)) {
            console.log('📱 生成二維碼...');
            await this.generateQRCode(content);
        } else {
            console.log('📊 生成一維條碼...');
            await this.generateLinearBarcode(content);
        }
        
        // ⬇️ 顯示下載選項
        console.log('⬇️ 顯示下載選項...');
        this.elements.downloadOptions.style.display = 'flex';
        this.showToast(t.barcodeGenerated, 'success');
        
    } catch (error) {
        console.error('生成條碼失敗:', error);
        this.showToast(t.generationFailed + ': ' + error.message, 'error');
    }
}

// 📱 QR碼生成專用方法
async generateQRCode(content) {
    const t = this.translations[this.currentLanguage];
    
    // 🔍 檢查 QR Code 庫可用性
    if (typeof QRCode === 'undefined') {
        throw new Error(t.libNotLoaded);
    }

    // 🎨 創建 QR 碼容器
    const qrContainer = document.createElement('div');
    qrContainer.style.display = 'inline-block';
    qrContainer.style.backgroundColor = 'white';
    qrContainer.style.padding = '10px';
    qrContainer.style.borderRadius = '8px';
    qrContainer.style.boxShadow = '0 4px 12px rgba(0,0,0,0.15)';
    
    // 🖼️ 先添加到預覽區域
    this.elements.previewArea.appendChild(qrContainer);

    // 🔧 使用 QRCodeJS 生成 QR 碼
    const qrcode = new QRCode(qrContainer, {
        text: content,                                                    // 編碼內容
        width: this.currentSettings.width,                               // QR碼寬度
        height: this.currentSettings.width,                              // QR碼高度（正方形）
        colorDark: this.currentSettings.foreground,                      // 前景色
        colorLight: this.currentSettings.background,                     // 背景色
        correctLevel: QRCode.CorrectLevel[this.currentSettings.errorCorrection] // 容錯等級
    });

    // ⏰ 等待圖片生成完成
    await new Promise(resolve => setTimeout(resolve, 200));

    // 🖼️ 獲取生成的圖片元素
    const img = qrContainer.querySelector('img');
    if (img) {
        img.className = 'preview-image';
        img.style.display = 'block';
        
        // 🎨 為下載功能創建 Canvas
        const canvas = document.createElement('canvas');
        canvas.width = this.currentSettings.width;
        canvas.height = this.currentSettings.width;
        const ctx = canvas.getContext('2d');
        
        // ⏰ 等待圖片載入完成
        await new Promise((resolve) => {
            if (img.complete) {
                resolve();
            } else {
                img.onload = resolve;
            }
        });
        
        // 🎨 繪製圖片到 Canvas
        ctx.drawImage(img, 0, 0);
        
        // 💾 保存生成的數據
        this.generatedBarcode = {
            canvas: canvas,
            content: content,
            format: this.currentFormat,
            settings: {...this.currentSettings}
        };
        
        console.log('✅ QR碼生成完成');
    }
}

// 📊 一維條碼生成專用方法
async generateLinearBarcode(content) {
    const t = this.translations[this.currentLanguage];
    
    // 🔍 檢查 JsBarcode 庫可用性
    if (typeof JsBarcode === 'undefined') {
        throw new Error(t.libNotLoaded);
    }

    // 🎨 創建 Canvas 元素
    const canvas = document.createElement('canvas');
    this.elements.previewArea.appendChild(canvas);

    // ⚙️ 條碼生成選項配置
    const options = {
        format: this.currentFormat,                  // 條碼格式
        width: 2,                                   // 條寬（像素）
        height: this.currentSettings.height,        // 條碼高度
        displayValue: true,                         // 顯示文字
        background: this.currentSettings.background, // 背景色
        lineColor: this.currentSettings.foreground, // 線條顏色
        margin: this.currentSettings.margin,        // 邊距
        fontSize: 14,                               // 字體大小
        textAlign: "center",                        // 文字對齊
        textPosition: "bottom",                     // 文字位置
        textMargin: 2,                             // 文字邊距
        fontOptions: "",                           // 字體選項
        font: "monospace"                          // 字體
    };

    // 🎯 生成條碼
    JsBarcode(canvas, content, options);
    canvas.className = 'preview-image';
    
    // 💾 保存生成的數據
    this.generatedBarcode = {
        canvas: canvas,
        content: content,
        format: this.currentFormat,
        settings: {...this.currentSettings}
    };
    
    console.log('✅ 一維條碼生成完成');
}

// ✅ 輸入內容即時驗證
async validateInput() {
    const content = this.elements.contentInput.value.trim();
    const format = this.currentFormat;

    // 🔍 空內容檢查
    if (!content) {
        this.hideValidationMessage();
        return;
    }

    try {
        // 📡 發送驗證請求到後端
        const response = await fetch('/api/barcode-generator/validate', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                format: format,
                content: content
            })
        });

        const result = await response.json();
        const t = this.translations[this.currentLanguage];

        // 🎨 根據驗證結果顯示訊息
        if (result.success) {
            if (result.valid) {
                this.showValidationMessage(t.validContent, 'success');
            } else {
                this.showValidationMessage(t.invalidContent + (result.message ? ': ' + result.message : ''), 'error');
            }
        }

    } catch (error) {
        console.error('驗證失敗:', error);
        // 🔇 驗證失敗時靜默處理，不影響用戶體驗
    }
}

// 💬 驗證訊息顯示管理
showValidationMessage(message, type) {
    this.elements.validationMessage.textContent = message;
    this.elements.validationMessage.className = `validation-message ${type}`;
    this.elements.validationMessage.style.display = 'block';
}

hideValidationMessage() {
    this.elements.validationMessage.style.display = 'none';
}

// 🧹 清除所有內容
clearAll() {
    // 🔄 重置輸入
    this.elements.contentInput.value = '';
    
    // 🎨 重置預覽區域
    const t = this.translations[this.currentLanguage];
    this.elements.previewArea.innerHTML = `
        

            
📱
            
${t.generatePlaceholder}
        
    `;
    
    // 🔒 隱藏下載選項
    this.elements.downloadOptions.style.display = 'none';
    
    // 🔇 隱藏驗證訊息
    this.hideValidationMessage();
    
    // 🗑️ 清除生成數據
    this.generatedBarcode = null;
    
    // ✅ 顯示成功提示
    this.showToast(t.allCleared, 'success');
    console.log('🧹 所有內容已清除');
}

// 📁 檔案選擇處理方法
handleFileSelect(event) {
    const file = event.target.files[0];
    if (!file) {
        this.clearDecode();
        return;
    }

    const t = this.translations[this.currentLanguage];
    
    // 🔍 檢查檔案類型
    if (!file.type.startsWith('image/')) {
        this.showDecodeError(t.selectValidImage);
        this.elements.fileInput.value = '';
        console.log('❌ 無效的檔案類型:', file.type);
        return;
    }

    // 📏 檢查檔案大小 (限制10MB)
    if (file.size > 10 * 1024 * 1024) {
        this.showDecodeError(t.fileTooLarge);
        this.elements.fileInput.value = '';
        console.log('❌ 檔案過大:', file.size, 'bytes');
        return;
    }

    // ✅ 檔案驗證通過
    this.selectedFile = file;
    this.previewImage(file);
    this.elements.decodeBtn.disabled = false;
    this.hideDecodeError();
    console.log('✅ 檔案選擇成功:', file.name, file.size, 'bytes');
}

// 🖼️ 圖片預覽功能
previewImage(file) {
    const reader = new FileReader();
    reader.onload = (e) => {
        this.elements.decodePreviewArea.innerHTML = `
            
        `;
        console.log('🖼️ 圖片預覽載入完成');
    };
    reader.readAsDataURL(file);
}

// 🔍 QR碼解碼主方法
async decodeQRCode() {
    const t = this.translations[this.currentLanguage];
    
    // 📁 檢查是否已選擇檔案
    if (!this.selectedFile) {
        this.showDecodeError(t.pleaseSelectFile);
        return;
    }

    // 📚 檢查解碼庫是否可用
    if (typeof jsQR === 'undefined') {
        this.showDecodeError(t.libNotLoaded);
        return;
    }

    try {
        // 🔄 更新按鈕狀態
        this.elements.decodeBtn.disabled = true;
        this.elements.decodeBtn.textContent = t.decoding;
        console.log('🔍 開始解碼QR碼...');
        
        // 🎨 獲取圖片像素數據
        const imageData = await this.getImageData(this.selectedFile);
        
        // 🔍 使用 jsQR 解碼
        const code = jsQR(imageData.data, imageData.width, imageData.height);

        if (code) {
            // ✅ 解碼成功
            this.showDecodeResult(code.data);
            this.hideDecodeError();
            this.showToast(t.qrDecodeSuccess, 'success');
            console.log('✅ QR碼解碼成功:', code.data);
        } else {
            // ❌ 解碼失敗
            this.showDecodeError(t.cannotReadQR);
            this.hideDecodeResult();
            console.log('❌ 無法識別QR碼');
        }

    } catch (error) {
        console.error('解碼失敗:', error);
        this.showDecodeError(t.decodeError + ': ' + error.message);
        this.hideDecodeResult();
    } finally {
        // 🔄 恢復按鈕狀態
        this.elements.decodeBtn.disabled = false;
        this.elements.decodeBtn.textContent = t.decodeBtn;
    }
}

// 🎨 圖片像素數據提取
async getImageData(file) {
    return new Promise((resolve, reject) => {
        const canvas = document.createElement('canvas');
        const ctx = canvas.getContext('2d');
        const img = new Image();

        img.onload = () => {
            // 🎨 調整 Canvas 尺寸
            canvas.width = img.width;
            canvas.height = img.height;
            
            // 🖼️ 繪製圖片到 Canvas
            ctx.drawImage(img, 0, 0);
            
            // 📊 提取像素數據
            const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
            resolve(imageData);
            console.log('🎨 圖片數據提取完成:', canvas.width, 'x', canvas.height);
        };

        img.onerror = () => reject(new Error('無法載入圖片'));
        img.src = URL.createObjectURL(file);
    });
}

// 📄 解碼結果顯示管理
showDecodeResult(content) {
    this.decodedContent = content;
    this.elements.resultText.textContent = content;
    this.elements.decodeResultGroup.style.display = 'block';
    
    // 🔗 檢查是否為有效網址
    const isUrl = this.isValidUrl(content);
    this.elements.visitLink.style.display = isUrl ? 'inline-block' : 'none';
    
    console.log('📄 解碼結果已顯示，內容長度:', content.length, '字符');
}

hideDecodeResult() {
    this.elements.decodeResultGroup.style.display = 'none';
    this.decodedContent = null;
}

// 🔗 網址有效性檢查
isValidUrl(string) {
    try {
        const url = new URL(string);
        return url.protocol === 'http:' || url.protocol === 'https:';
    } catch {
        return false;
    }
}

// 📋 複製解碼結果到剪貼簿
copyDecodeResult() {
    const t = this.translations[this.currentLanguage];
    
    if (!this.decodedContent) {
        this.showToast(t.nothingToCopy, 'error');
        return;
    }

    navigator.clipboard.writeText(this.decodedContent).then(() => {
        this.showToast(t.contentCopied, 'success');
        console.log('📋 內容已複製到剪貼簿');
    }).catch(err => {
        console.error('複製失敗:', err);
        this.showToast(t.copyFailedManual, 'error');
    });
}

// 🌐 造訪解碼的網址連結
visitDecodedLink() {
    const t = this.translations[this.currentLanguage];
    
    if (!this.decodedContent || !this.isValidUrl(this.decodedContent)) {
        this.showToast(t.invalidUrl, 'error');
        return;
    }

    window.open(this.decodedContent, '_blank');
    this.showToast(t.linkOpening, 'success');
    console.log('🌐 正在打開連結:', this.decodedContent);
}

// 💾 圖片下載功能
downloadImage(format) {
    const t = this.translations[this.currentLanguage];
    
    if (!this.generatedBarcode) {
        this.showToast(t.generateFirst, 'error');
        return;
    }

    const canvas = this.generatedBarcode.canvas;
    const filename = `barcode_${this.currentFormat}_${Date.now()}`;

    if (format === 'png') {
        // 🖼️ PNG 格式下載
        const link = document.createElement('a');
        link.download = filename + '.png';
        link.href = canvas.toDataURL('image/png');
        link.click();
        console.log('💾 PNG 下載已觸發');
    } else if (format === 'svg') {
        // 🎨 SVG 格式下載（需要重新生成）
        this.generateSVGDownload();
    }

    this.showToast(`${format.toUpperCase()} ${t.downloadStarted}`, 'success');
}

// 📋 複製圖片到剪貼簿
async copyImageToClipboard() {
    const t = this.translations[this.currentLanguage];
    
    if (!this.generatedBarcode) {
        this.showToast(t.generateFirst, 'error');
        return;
    }

    try {
        const canvas = this.generatedBarcode.canvas;
        
        // 🎨 轉換 Canvas 為 Blob
        const blob = await new Promise(resolve => canvas.toBlob(resolve, 'image/png'));
        
        // 📋 寫入剪貼簿
        await navigator.clipboard.write([
            new ClipboardItem({
                'image/png': blob
            })
        ]);
        
        this.showToast(t.imageCopied, 'success');
        console.log('📋 圖片已複製到剪貼簿');
    } catch (error) {
        console.error('複製失敗:', error);
        this.showToast(t.copyFailed, 'error');
    }
}

// 🗑️ 清除解碼內容
clearDecode() {
    this.elements.fileInput.value = '';
    this.selectedFile = null;
    this.decodedContent = null;
    this.elements.decodeBtn.disabled = true;
    
    const t = this.translations[this.currentLanguage];
    this.elements.decodePreviewArea.innerHTML = `
        

            
🖼️
            
${t.decodePlaceholder}
        
    `;
    
    this.hideDecodeResult();
    this.hideDecodeError();
    this.showToast(t.decodeCleared, 'success');
    console.log('🗑️ 解碼內容已清除');
}

// 🌓 主題系統管理
initTheme() {
    // 📱 讀取保存的主題設定
    const savedTheme = localStorage.getItem('barcode-generator-theme') || 'light';
    this.setTheme(savedTheme);
    console.log('🌓 主題系統初始化，當前主題:', savedTheme);
}

toggleTheme() {
    const currentTheme = document.querySelector('.barcode-generator-standalone').getAttribute('data-theme') || 'light';
    const newTheme = currentTheme === 'light' ? 'dark' : 'light';
    this.setTheme(newTheme);
    console.log('🔄 主題已切換:', currentTheme, '→', newTheme);
}

setTheme(theme) {
    // 🎨 應用主題到根元素
    document.querySelector('.barcode-generator-standalone').setAttribute('data-theme', theme);
    
    // 💾 保存主題設定到本地存儲
    localStorage.setItem('barcode-generator-theme', theme);
    
    // 🎯 更新主題切換按鈕圖示
    const themeIcon = theme === 'dark' ? '☀️' : '🌓';
    this.elements.themeToggle.textContent = themeIcon;
    
    console.log('🎨 主題已設定為:', theme);
}

// 📚 外部庫動態載入系統
async loadExternalLibraries() {
    try {
        console.log('📚 開始載入外部庫...');
        
        // 🔗 載入條碼生成庫
        const libraries = [
            { name: 'QRCode.js', src: '/assets/libs/qrcode.js', check: () => typeof QRCode !== 'undefined' },
            { name: 'JsBarcode', src: '/assets/libs/jsbarcode.all.min.js', check: () => typeof JsBarcode !== 'undefined' },
            { name: 'jsQR', src: '/assets/libs/jsqr.min.js', check: () => typeof jsQR !== 'undefined' }
        ];
        
        // 📦 並行載入所有庫
        const loadPromises = libraries.map(lib => {
            if (lib.check()) {
                console.log(`✅ ${lib.name} 已載入`);
                return Promise.resolve();
            }
            console.log(`⏳ 載入 ${lib.name}...`);
            return this.loadScript(lib.src);
        });
        
        await Promise.all(loadPromises);
        console.log('✅ 所有外部庫載入完成');
        
        // 🔍 驗證載入結果
        libraries.forEach(lib => {
            if (lib.check()) {
                console.log(`✅ ${lib.name} 載入成功`);
            } else {
                console.warn(`⚠️ ${lib.name} 載入失敗`);
            }
        });
        
    } catch (error) {
        console.error('載入外部庫失敗:', error);
        const t = this.translations[this.currentLanguage] || this.translations.zh;
        this.showToast(t.libNotLoaded || '庫文件載入失敗，某些功能可能不可用', 'error');
    }
}

// 🔗 動態腳本載入工具
loadScript(src) {
    return new Promise((resolve, reject) => {
        // 🔍 檢查是否已存在相同腳本
        const existingScript = document.querySelector(`script[src="${src}"]`);
        if (existingScript) {
            console.log('📜 腳本已存在:', src);
            resolve();
            return;
        }
        
        // 📜 創建新的腳本元素
        const script = document.createElement('script');
        script.src = src;
        script.async = true;
        
        // ✅ 載入成功處理
        script.onload = () => {
            console.log('✅ 腳本載入成功:', src);
            resolve();
        };
        
        // ❌ 載入失敗處理
        script.onerror = (error) => {
            console.error('❌ 腳本載入失敗:', src, error);
            reject(new Error(`無法載入腳本: ${src}`));
        };
        
        // 📎 添加到頁面
        document.head.appendChild(script);
    });
}

// 💬 Toast 通知系統
showToast(message, type = 'success') {
    // 🎨 創建 Toast 元素
    const toast = document.createElement('div');
    toast.className = `toast ${type}`;
    toast.textContent = message;
    
    // 🎯 獲取 Toast 容器
    const toastContainer = document.getElementById('toast-container');
    if (!toastContainer) {
        console.warn('⚠️ Toast 容器未找到');
        return;
    }
    
    // 📦 添加到容器
    toastContainer.appendChild(toast);
    console.log(`💬 Toast 顯示: [${type}] ${message}`);
    
    // 🎭 顯示動畫
    setTimeout(() => toast.classList.add('show'), 100);
    
    // ⏰ 自動隱藏和移除
    setTimeout(() => {
        toast.classList.remove('show');
        setTimeout(() => {
            if (toastContainer.contains(toast)) {
                toastContainer.removeChild(toast);
            }
        }, 300);
    }, 3000);
}

// 🔍 錯誤訊息顯示管理
showDecodeError(message) {
    this.elements.decodeErrorMessage.textContent = message;
    this.elements.decodeErrorGroup.style.display = 'block';
    console.log('❌ 解碼錯誤:', message);
}

hideDecodeError() {
    this.elements.decodeErrorGroup.style.display = 'none';
}

// 🔄 預覽區域占位符更新
updatePreviewPlaceholders() {
    const t = this.translations[this.currentLanguage];
    
    // 🎨 更新生成模式預覽區域
    if (this.elements.previewArea && !this.generatedBarcode) {
        const placeholder = this.elements.previewArea.querySelector('.preview-placeholder');
        if (placeholder) {
            const textDiv = placeholder.querySelector('div:last-child');
            if (textDiv) {
                textDiv.textContent = t.generatePlaceholder;
            }
        }
    }
    
    // 🔍 更新解碼模式預覽區域
    if (this.elements.decodePreviewArea && !this.selectedFile) {
        const placeholder = this.elements.decodePreviewArea.querySelector('.preview-placeholder');
        if (placeholder) {
            const textDiv = placeholder.querySelector('div:last-child');
            if (textDiv) {
                textDiv.textContent = t.decodePlaceholder;
            }
        }
    }
}

// 🔄 模式切換快速方法
toggleMode() {
    if (this.currentMode === 'generate') {
        this.switchToDecodeMode();
    } else {
        this.switchToGenerateMode();
    }
}

// 📝 配置載入方法
async loadConfig() {
    // 🔧 使用內建配置
    this.useBuiltinConfig();
    console.log('⚙️ 配置載入完成');
}

// 🎨 SVG 下載生成 (預留擴展)
generateSVGDownload() {
    const t = this.translations[this.currentLanguage];
    // 📝 這裡可以實現 SVG 格式下載功能
    this.showToast('SVG ' + t.downloadStarted + ' (功能開發中)', 'error');
    console.log('🎨 SVG 下載功能調用（預留）');
}

// 🚀 全域變數宣告
let barcodeGenerator;

// 📋 應用啟動主流程
document.addEventListener('DOMContentLoaded', () => {
    console.log('🎬 DOM 內容載入完成，開始初始化條碼生成器...');
    
    try {
        // 🏗️ 實例化主應用類別
        barcodeGenerator = new BarcodeGenerator();
        
        // 🌐 註冊到全域範圍（便於除錯）
        if (typeof window !== 'undefined') {
            window.barcodeGenerator = barcodeGenerator;
            console.log('🌐 條碼生成器已註冊到全域範圍');
        }
        
    } catch (error) {
        console.error('❌ 條碼生成器初始化失敗:', error);
        
        // 🚨 顯示錯誤提示給用戶
        const errorMessage = document.createElement('div');
        errorMessage.style.cssText = `
            position: fixed;
            top: 20px;
            right: 20px;
            background: #f44336;
            color: white;
            padding: 15px 20px;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(244, 67, 54, 0.3);
            z-index: 9999;
            font-size: 14px;
            max-width: 300px;
        `;
        errorMessage.textContent = '條碼生成器載入失敗，請重新整理頁面';
        document.body.appendChild(errorMessage);
        
        // ⏰ 5秒後自動移除錯誤提示
        setTimeout(() => {
            if (document.body.contains(errorMessage)) {
                document.body.removeChild(errorMessage);
            }
        }, 5000);
    }
});

// 🔧 開發者工具輔助功能
if (typeof window !== 'undefined') {
    // 🛠️ 開發模式檢測
    const isDevelopment = window.location.hostname === 'localhost' || 
                         window.location.hostname === '127.0.0.1' ||
                         window.location.hostname.includes('dev');
    
    if (isDevelopment) {
        console.log('🔧 開發模式已啟用');
        
        // 📊 性能監控
        window.addEventListener('load', () => {
            if (window.performance && window.performance.timing) {
                const timing = window.performance.timing;
                const loadTime = timing.loadEventEnd - timing.navigationStart;
                console.log(`⚡ 頁面載入時間: ${loadTime}ms`);
            }
        });
        
        // 🎯 全域除錯方法
        window.debugBarcode = {
            // 🔍 獲取當前狀態
            getState: () => {
                if (window.barcodeGenerator) {
                    return {
                        mode: window.barcodeGenerator.currentMode,
                        format: window.barcodeGenerator.currentFormat,
                        language: window.barcodeGenerator.currentLanguage,
                        settings: window.barcodeGenerator.currentSettings,
                        hasGeneratedBarcode: !!window.barcodeGenerator.generatedBarcode,
                        hasSelectedFile: !!window.barcodeGenerator.selectedFile
                    };
                }
                return null;
            },
            
            // 🎨 強制切換主題
            setTheme: (theme) => {
                if (window.barcodeGenerator) {
                    window.barcodeGenerator.setTheme(theme);
                }
            },
            
            // 🌐 強制切換語言
            setLanguage: (lang) => {
                if (window.barcodeGenerator) {
                    window.barcodeGenerator.currentLanguage = lang;
                    window.barcodeGenerator.updateUIText();
                }
            },
            
            // 🔄 重新載入庫
            reloadLibraries: () => {
                if (window.barcodeGenerator) {
                    return window.barcodeGenerator.loadExternalLibraries();
                }
            },
            
            // 📊 獲取性能數據
            getPerformance: () => {
                return {
                    memory: window.performance.memory,
                    timing: window.performance.timing,
                    navigation: window.performance.navigation
                };
            }
        };
        
        console.log('🛠️ 除錯工具已載入，使用 window.debugBarcode 訪問');
    }
}

// 🎯 頁面可見性變化處理
document.addEventListener('visibilitychange', () => {
    if (document.hidden) {
        console.log('👁️ 頁面已隱藏');
    } else {
        console.log('👁️ 頁面已顯示');
        
        // 🔄 頁面重新顯示時檢查語言同步
        if (window.barcodeGenerator && window.globalI18n) {
            const globalLang = window.globalI18n.currentLanguage;
            const appLang = window.barcodeGenerator.currentLanguage;
            
            if (globalLang !== appLang) {
                console.log('🌐 檢測到語言不同步，正在同步...', appLang, '→', globalLang);
                window.barcodeGenerator.currentLanguage = globalLang;
                window.barcodeGenerator.updateUIText();
            }
        }
    }
});

// 🚨 全域錯誤處理
window.addEventListener('error', (event) => {
    console.error('🚨 全域錯誤:', event.error);
    
    // 📝 條碼生成器相關錯誤特殊處理
    if (event.filename && event.filename.includes('barcode')) {
        console.error('🔧 條碼生成器相關錯誤:', {
            message: event.message,
            filename: event.filename,
            lineno: event.lineno,
            colno: event.colno
        });
    }
});

// 📱 移動設備適配
if (/Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
    document.addEventListener('DOMContentLoaded', () => {
        console.log('📱 移動設備已檢測');
        
        // 🔍 調整移動設備體驗
        const viewport = document.querySelector('meta[name="viewport"]');
        if (viewport) {
            viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no');
        }
        
        // 📱 禁用雙擊縮放
        document.addEventListener('dblclick', (e) => {
            e.preventDefault();
        });
    });
}

// 🎯 最終確認訊息
console.log(`
🎉 條碼生成器載入完成！

📋 功能特色：
• 🎯 雙模式操作（生成 + 解碼）
• 📱 支援 9 種條碼格式
• 🌐 完整雙語支援
• 🎨 深色/亮色主題
• 💾 多格式下載
• 🔍 即時驗證
• 📋 剪貼簿整合

🛠️ 開發資訊：
• 版本: 1.0.0
• 架構: 純前端 JavaScript
• 庫: QRCode.js + JsBarcode + jsQR
• 隱私: 100% 本地處理

💻 除錯指令：
• window.debugBarcode.getState() - 查看狀態
• window.debugBarcode.setTheme('dark') - 切換主題
• window.debugBarcode.setLanguage('en') - 切換語言
`);