Add active color chip pickers
This commit is contained in:
parent
a5016b4fa7
commit
54024d6bcd
26
organic.js
26
organic.js
@ -1106,6 +1106,7 @@
|
||||
if (mode === 'garland') requestDraw();
|
||||
persist();
|
||||
});
|
||||
bindActiveChipPicker();
|
||||
|
||||
// ====== UI Rendering (Palettes) ======
|
||||
function renderAllowedPalette() {
|
||||
@ -1196,6 +1197,31 @@
|
||||
updateChip('mobile-active-color-chip', null, { showLabel: false });
|
||||
}
|
||||
|
||||
function bindActiveChipPicker() {
|
||||
const chips = ['current-color-chip', 'mobile-active-color-chip'];
|
||||
chips.forEach(id => {
|
||||
const el = document.getElementById(id);
|
||||
if (!el) return;
|
||||
el.style.cursor = 'pointer';
|
||||
el.addEventListener('click', () => {
|
||||
if (!window.openColorPicker) return;
|
||||
window.openColorPicker({
|
||||
title: 'Choose active color',
|
||||
subtitle: 'Applies to drawing and path tools',
|
||||
items: (FLAT_COLORS || []).map((c, idx) => ({ label: c.name || c.hex, metaText: c.family || '', idx })),
|
||||
onSelect: (item) => {
|
||||
if (!Number.isInteger(item.idx)) return;
|
||||
selectedColorIdx = item.idx;
|
||||
renderAllowedPalette();
|
||||
renderUsedPalette();
|
||||
updateCurrentColorChip();
|
||||
persist();
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
window.organic = {
|
||||
getColor: () => selectedColorIdx,
|
||||
updateCurrentColorChip,
|
||||
|
||||
18
wall.js
18
wall.js
@ -1074,6 +1074,24 @@
|
||||
else selectedColorIdx = defaultActiveColorIdx();
|
||||
setActiveColor(selectedColorIdx);
|
||||
setWallToolMode('paint');
|
||||
// Allow picking active wall color by clicking the chip.
|
||||
if (wallActiveChip && window.openColorPicker) {
|
||||
wallActiveChip.style.cursor = 'pointer';
|
||||
wallActiveChip.addEventListener('click', () => {
|
||||
window.openColorPicker({
|
||||
title: 'Choose wall color',
|
||||
subtitle: 'Sets the active wall color',
|
||||
items: (FLAT_COLORS || []).map((c, idx) => ({ label: c.name || c.hex, metaText: c.family || '', idx })),
|
||||
onSelect: (item) => {
|
||||
if (!Number.isInteger(item.idx)) return;
|
||||
setActiveColor(item.idx);
|
||||
renderWallPalette();
|
||||
renderWallUsedPalette();
|
||||
renderWall();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
loadPatternState(patternKey());
|
||||
ensureWallGridSize(wallState.rows, wallState.cols);
|
||||
syncWallInputs();
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user