Class Pixelizer

pixelizer.js:13–1224

* Pixelizer - Advanced Pixel Art Converter * Copyright (c) 2024 CatPixelArt.com. All Rights Reserved. * * 核心功能： * 1. 自动识别整数倍放大的像素画 * 2. AI生成图片的不规则像素块识别 * 3. 颜色量化与噪点处理 * 4. 手动网格对齐 * 5. 1000%放大导出和打印

 */

class Pixelizer {
    constructor() {
        this.originalImage = null;
        this.processedCanvas = null;
        this.basePixelCanvas = null;
        this.gridOffsetX = 0;
        this.gridOffsetY = 0;
        this.isProcessing = false;
        this.currentWorker = null;
        
        // 对齐相关状态
        this.isDragging = false;
        this.dragTarget = null;
        this.guideLines = null;
        
        this.initializeEventListeners();
    }

    initializeEventListeners() {
        // 上传相关
        const uploadZone = document.getElementById('uploadZone');
        const fileInput = document.getElementById('pixelImageInput');
        const uploadButton = uploadZone?.querySelector('.upload-button');

        if (uploadZone) {
            uploadZone.addEventListener('click', () => fileInput?.click());
            uploadZone.addEventListener('dragover', this.handleDragOver.bind(this));
            uploadZone.addEventListener('dragleave', this.handleDragLeave.bind(this));
            uploadZone.addEventListener('drop', this.handleDrop.bind(this));
        }

        if (fileInput) {
            fileInput.addEventListener('change', this.handleFileSelect.bind(this));
        }

        // 模式切换
        const detectionModeInputs = document.querySelectorAll('input[name="detectionMode"]');
        detectionModeInputs.forEach(input => {
            input.addEventListener('change', this.handleModeChange.bind(this));
        });

        // 滑块控制
        this.initializeSliderControls();


        // 网格显示开关
        const showGridCheckbox = document.getElementById('showPixelGrid');
        
        if (showGridCheckbox) {
            showGridCheckbox.addEventListener('change', () => {
                this.updateGridDisplay();
            });
        }

        // 导出按钮
        const exportButton = document.getElementById('exportPNG');
        const printButton = document.getElementById('printResult');