import { renderEtiqueta } from './canvasRenderer.js';
import { applyMask } from './formatter.js';

document.addEventListener('DOMContentLoaded', async () => {
    const canvas = document.getElementById('etiquetaCanvas');
    const ctx = canvas.getContext('2d');

    const fundo = new Image();
    fundo.src = './assets/imagens/fundo_etiqueta.png';
    await fundo.decode();

    const form = document.getElementById('formEtiqueta');
    form.addEventListener('input', () => {
        const data = {
            produto: form.produto.value,
            preco: parseFloat(form.preco.value.replace(',', '.')) || 0,
            promocao: parseFloat(form.promocao.value.replace(',', '.')) || null,
            parcelas: parseInt(form.parcelas.value) || null,
            info: form.info.value
        };

        renderEtiqueta(ctx, data, { fundo });
    });

    form.dispatchEvent(new Event('input'));
});