ferdi2go/Pigmento
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Farbschemata nachträglich bearbeiten

Browse Source 
Neuer Button 'Schema bearbeiten' neben 'Schema löschen'. Öffnet das
bestehende Modal mit vorausgefüllten Daten (Name, Farben, Vorschaubild).
Umbenennen wird korrekt behandelt (altes Schema wird ersetzt).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Ferdinand
2026-04-02 15:04:54 +02:00
parent 405f1f25d7
commit 8a31d5336e
4 changed files with 60 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
js/schema-modal.js
View File

@@ -82,9 +82,11 @@ function extractDominantColors(dataUrl, callback) {
}
// Aktuell gesammelter Zustand des Modals
let farben = []; // Array von HSL-Objekten
let aktuelleHex = ''; // Hex-Wert des aktuellen Eingabefelds
let vorschaubild = null; // Base64-String des Thumbnails oder null
let farben = []; // Array von HSL-Objekten
let aktuelleHex = ''; // Hex-Wert des aktuellen Eingabefelds
let vorschaubild = null; // Base64-String des Thumbnails oder null
let editOriginalName = null; // Name des zu bearbeitenden Schemas (null = neu)
let savedOnSave = null; // onSave-Callback aus initSchemaModal
function compressToThumbnail(file) {
return new Promise((resolve) => {
@@ -120,6 +122,8 @@ function resetModal() {
document.getElementById('schema-vorschlag').style.display = 'none';
document.getElementById('schema-farbe-eingabe').style.display = 'none';
document.getElementById('schema-abschliessen-btn').disabled = true;
editOriginalName = null;
document.getElementById('schema-modal-title').textContent = 'Neues Farbschema';
const preview = document.getElementById('schema-bild-preview');
preview.style.backgroundImage = '';
preview.classList.remove('hat-bild');
@@ -223,7 +227,36 @@ function setAktuelleHex(hex) {
document.getElementById('schema-hex-preview').style.background = hex;
}
export function openForEdit(schema) {
resetModal();
editOriginalName = schema.name;
document.getElementById('schema-modal-title').textContent = 'Schema bearbeiten';
document.getElementById('schema-name-input').value = schema.name;
if (schema.bild) {
vorschaubild = schema.bild;
const preview = document.getElementById('schema-bild-preview');
preview.style.backgroundImage = 'url(' + schema.bild + ')';
preview.classList.add('hat-bild');
document.getElementById('schema-bild-entfernen-btn').style.display = 'inline-block';
}
farben = schema.farben.map(hsl => ({ ...hsl }));
renderFarbenPreview();
document.getElementById('schema-abschliessen-btn').disabled = false;
if (farben.length < MAX_FARBEN) {
updateFarbeLabel();
document.getElementById('schema-farbe-eingabe').style.display = 'block';
}
document.getElementById('schema-modal-overlay').style.display = 'flex';
document.getElementById('schema-name-input').focus();
}
export function initSchemaModal(onSave) {
savedOnSave = onSave;
// Button öffnet Modal
document.getElementById('schema-erstellen-btn').addEventListener('click', () => {
resetModal();
@@ -314,7 +347,7 @@ export function initSchemaModal(onSave) {
}
if (farben.length === 0) return;
onSave(name, farben, vorschaubild);
savedOnSave(name, farben, vorschaubild, editOriginalName);
document.getElementById('schema-modal-overlay').style.display = 'none';
});