Highlight invariant rooms across solver options with subtle border

This commit is contained in:
Ian Gulliver
2026-02-16 11:25:28 -08:00
parent 02165837c5
commit 17a79b7a48
2 changed files with 12 additions and 4 deletions

View File

@@ -70,6 +70,7 @@
#solver { margin-bottom: 0.75rem; }
#solver-results { margin-top: 0.5rem; }
.room-card { margin-bottom: 0.3rem; }
.room-locked::part(base) { border: 1px solid rgba(128, 128, 128, 0.2); }
.room-label { font-weight: bold; font-size: 0.8rem; margin-bottom: 0.2rem; }
.solver-score { font-size: 0.8rem; margin-top: 0.3rem; color: var(--wa-color-neutral-500); }
.divider { border: none; border-top: 1px solid #909090; margin: 0.75rem 0; }

View File

@@ -423,10 +423,11 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
const container = document.getElementById('solver-results');
container.innerHTML = '';
const renderSolution = (sol, parent) => {
const renderSolution = (sol, parent, lockedRooms) => {
for (let i = 0; i < sol.rooms.length; i++) {
const key = sol.rooms[i].map(m => m.id).sort((a, b) => a - b).join(',');
const card = document.createElement('wa-card');
card.className = 'room-card';
card.className = 'room-card' + (lockedRooms.has(key) ? ' room-locked' : '');
const label = document.createElement('div');
label.className = 'room-label';
label.textContent = 'Room ' + (i + 1);
@@ -478,8 +479,14 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
};
const solutions = result.solutions;
let lockedRooms = new Set();
if (solutions.length > 1) {
const roomKey = (room) => room.map(m => m.id).sort((a, b) => a - b).join(',');
const sets = solutions.map(sol => new Set(sol.rooms.map(roomKey)));
lockedRooms = new Set([...sets[0]].filter(k => sets.every(s => s.has(k))));
}
if (solutions.length === 1) {
renderSolution(solutions[0], container);
renderSolution(solutions[0], container, lockedRooms);
} else if (solutions.length > 1) {
const optionLabel = (i) => {
const a = 'A'.charCodeAt(0);
@@ -496,7 +503,7 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
for (let si = 0; si < solutions.length; si++) {
const panel = document.createElement('wa-tab-panel');
panel.name = 'sol-' + si;
renderSolution(solutions[si], panel);
renderSolution(solutions[si], panel, lockedRooms);
tabGroup.appendChild(panel);
}
container.appendChild(tabGroup);