src/ui/zoom.js

/**
 * Zoom Controls - Image zoom functionality
 */

import { getZoomLevel, setZoomLevel } from '../state.js';
import { ZOOM_CONFIG } from '../config.js';

/**
 * Adjust zoom level
 */
export function adjustZoom(delta) {
    const currentZoom = getZoomLevel();
    const newZoom = Math.max(ZOOM_CONFIG.min, Math.min(ZOOM_CONFIG.max, currentZoom + delta));
    setZoomLevel(newZoom);
    applyZoom();
}

/**
 * Reset zoom to default
 */
export function resetZoom() {
    setZoomLevel(ZOOM_CONFIG.default);
    applyZoom();
}

/**
 * Apply current zoom level to image
 */
function applyZoom() {
    const img = document.getElementById('mainImage');
    const zoomLevel = getZoomLevel();
    
    if (img) {
        img.style.transform = `scale(${zoomLevel})`;
    }
    
    const zoomDisplay = document.getElementById('zoomLevel');
    if (zoomDisplay) {
        zoomDisplay.textContent = `Zoom: ${Math.round(zoomLevel * 100)}%`;
    }
}

/**
 * Setup zoom event listeners
 */
export function setupZoomListeners() {
    const zoomIn = document.getElementById('zoomIn');
    const zoomOut = document.getElementById('zoomOut');
    const zoomReset = document.getElementById('zoomReset');
    
    if (zoomIn) zoomIn.addEventListener('click', () => adjustZoom(ZOOM_CONFIG.step));
    if (zoomOut) zoomOut.addEventListener('click', () => adjustZoom(-ZOOM_CONFIG.step));
    if (zoomReset) zoomReset.addEventListener('click', resetZoom);
}