Files
Pigmento/js/app.js

31 lines
1.2 KiB
JavaScript

import { initEingabe } from './eingabe.js';
// Globaler State — aktive Farbe als { h, s, l } (HSL, 0-360, 0-100, 0-100)
// state.color is read-only from outside — always use setColor() to update,
// so that the colorChanged event is dispatched to all listening modules.
export const state = {
color: { h: 200, s: 60, l: 50 },
setColor(hsl) {
if (!hsl || typeof hsl.h !== 'number' || typeof hsl.s !== 'number' || typeof hsl.l !== 'number') return;
this.color = hsl;
document.dispatchEvent(new CustomEvent('colorChanged', { detail: hsl }));
}
};
// Tab-Navigation
document.querySelectorAll('.tab-btn').forEach(btn => {
btn.addEventListener('click', () => {
const tab = btn.dataset.tab;
document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
document.querySelectorAll('.tab-content').forEach(s => s.classList.remove('active'));
btn.classList.add('active');
const section = document.getElementById('tab-' + tab);
if (section) section.classList.add('active');
});
});
function addFavorit(hsl) { console.log('addFavorit', hsl); }
function addColorToSchema(hsl) { console.log('addColorToSchema', hsl); }
initEingabe(addFavorit, addColorToSchema);