42 lines
1.7 KiB
JavaScript
42 lines
1.7 KiB
JavaScript
import { initEingabe } from './eingabe.js';
|
|
import { initPicker } from './picker.js';
|
|
import { initHarmonien } from './harmonien.js';
|
|
import { addFavorit, addColorToSchema, addToHistory, renderSammlung, exportCollection, importCollection, saveSchema } from './collection.js';
|
|
import { initSchemaModal } from './schema-modal.js';
|
|
|
|
// 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');
|
|
});
|
|
});
|
|
|
|
// Every color change goes into history
|
|
document.addEventListener('colorChanged', (e) => addToHistory(e.detail));
|
|
|
|
initEingabe(addFavorit, addColorToSchema);
|
|
initPicker(addFavorit, addColorToSchema);
|
|
initHarmonien(addFavorit, addColorToSchema);
|
|
|
|
document.getElementById('sammlung-export-btn').addEventListener('click', exportCollection);
|
|
document.getElementById('sammlung-import-btn').addEventListener('click', importCollection);
|
|
|
|
renderSammlung();
|
|
initSchemaModal(saveSchema);
|