
💬 Creador de Frases para Sublimación
Ideal para tus trabajos de estampados
¿Cómo usarlo? Elige una frase del banco o escribe la tuya. Personaliza estilo, color y efecto. Descarga tu diseño en PNG, SVG o PDF.
¡Gracias, Maestro! 🍎
📄 Creador de Catálogo - SubliSeek
Agrega logo, nombre, detalle y precio a cada imagen
¿Cómo usarlo? Sube tu logo, diseños y completa: nombre, descripción y precio. Elige una plantilla y descarga un catálogo profesional con tu marca.
Logo
Catálogo -
Colección -
¡Hola! Soy
CATÁLOGO -
Colección -
Catálogo
🔥 CATÁLOGO RETRO 🔥
CATÁLOGO OFICIAL
🎨 Hecho a Mano
×
`;
actualizarVistaPrevia();
};
reader.readAsDataURL(file);
}
});
});
// Escuchar cambios en campos de texto
document.querySelectorAll('.img-item input[type="text"]').forEach(input => {
input.addEventListener('input', function() {
const index = this.dataset.index;
const campo = this.dataset.campo;
productos[index][campo] = this.value;
actualizarVistaPrevia();
});
});
// Eliminar imagen
window.eliminarImagen = function(index) {
productos[index] = { img: null, nombre: '', detalle: '', precio: '' };
const item = document.querySelectorAll('.img-item')[index];
item.querySelector('.preview').innerHTML = '+';
item.querySelectorAll('input[type="text"]').forEach(inp => inp.value = '');
actualizarVistaPrevia();
};
// Actualizar vista previa del catálogo
function actualizarVistaPrevia() {
const nombreNegocio = document.getElementById('nombre-negocio').value || 'SubliSeek';
const contacto = document.getElementById('contacto').value || '@subliseek';
// Actualizar nombre y contacto
for (let i = 1; i {
img.src = logoDataURL;
img.style.display = 'block';
});
} else {
document.querySelectorAll('[id^="logo-preview-"]').forEach(img => {
img.style.display = 'none';
});
}
// Actualizar productos
const plantillas = [
'moderno', 'elegante', 'infantil', 'deportivo', 'vintage',
'minimalista', 'navideña', 'retro', 'serio', 'artesanal'
];
plantillas.forEach(tipo => {
const cont = document.getElementById(`grid-${tipo}`);
cont.innerHTML = '';
productos.filter(p => p.img).forEach(prod => {
const div = document.createElement('div');
div.className = 'producto';
div.innerHTML = `
${prod.nombre || 'Producto'}
${prod.detalle || ''}
$${prod.precio || '0'}
`;
cont.appendChild(div);
});
});
}
// Cambiar plantilla
document.getElementById('plantilla-select').addEventListener('change', function() {
document.querySelectorAll('.plantilla').forEach(p => p.classList.remove('active'));
document.getElementById(`plantilla-${this.value}`).classList.add('active');
});
// Descargar PDF
document.getElementById('descargar-catalogo').addEventListener('click', function() {
actualizarVistaPrevia();
const selected = document.getElementById('plantilla-select').value;
document.querySelectorAll('.plantilla').forEach(p => p.classList.remove('active'));
document.getElementById(`plantilla-${selected}`).classList.add('active');
setTimeout(() => {
html2canvas(document.getElementById('catalogo'), {
scale: 2,
useCORS: true,
backgroundColor: null
}).then(canvas => {
const { jsPDF } = window.jspdf;
const pdf = new jsPDF('p', 'mm', 'a4');
const imgData = canvas.toDataURL('image/jpeg', 0.9);
const width = pdf.internal.pageSize.getWidth();
const height = (canvas.height * width) / canvas.width;
pdf.addImage(imgData, 'JPEG', 0, 0, width, height);
pdf.save(`catalogo-subliseek-${selected}.pdf`);
}).catch(err => {
alert('Error al generar PDF: ' + err.message);
});
}, 500);
});
// Escuchar cambios
document.getElementById('nombre-negocio').addEventListener('input', actualizarVistaPrevia);
document.getElementById('contacto').addEventListener('input', actualizarVistaPrevia);
// Inicializar
actualizarVistaPrevia();