Highlight invariant rooms across solver options with subtle border
This commit is contained in:
@@ -70,6 +70,7 @@
|
|||||||
#solver { margin-bottom: 0.75rem; }
|
#solver { margin-bottom: 0.75rem; }
|
||||||
#solver-results { margin-top: 0.5rem; }
|
#solver-results { margin-top: 0.5rem; }
|
||||||
.room-card { margin-bottom: 0.3rem; }
|
.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; }
|
.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); }
|
.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; }
|
.divider { border: none; border-top: 1px solid #909090; margin: 0.75rem 0; }
|
||||||
|
|||||||
@@ -423,10 +423,11 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
|
|||||||
const container = document.getElementById('solver-results');
|
const container = document.getElementById('solver-results');
|
||||||
container.innerHTML = '';
|
container.innerHTML = '';
|
||||||
|
|
||||||
const renderSolution = (sol, parent) => {
|
const renderSolution = (sol, parent, lockedRooms) => {
|
||||||
for (let i = 0; i < sol.rooms.length; i++) {
|
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');
|
const card = document.createElement('wa-card');
|
||||||
card.className = 'room-card';
|
card.className = 'room-card' + (lockedRooms.has(key) ? ' room-locked' : '');
|
||||||
const label = document.createElement('div');
|
const label = document.createElement('div');
|
||||||
label.className = 'room-label';
|
label.className = 'room-label';
|
||||||
label.textContent = 'Room ' + (i + 1);
|
label.textContent = 'Room ' + (i + 1);
|
||||||
@@ -478,8 +479,14 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const solutions = result.solutions;
|
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) {
|
if (solutions.length === 1) {
|
||||||
renderSolution(solutions[0], container);
|
renderSolution(solutions[0], container, lockedRooms);
|
||||||
} else if (solutions.length > 1) {
|
} else if (solutions.length > 1) {
|
||||||
const optionLabel = (i) => {
|
const optionLabel = (i) => {
|
||||||
const a = 'A'.charCodeAt(0);
|
const a = 'A'.charCodeAt(0);
|
||||||
@@ -496,7 +503,7 @@ document.getElementById('solve-btn').addEventListener('click', async () => {
|
|||||||
for (let si = 0; si < solutions.length; si++) {
|
for (let si = 0; si < solutions.length; si++) {
|
||||||
const panel = document.createElement('wa-tab-panel');
|
const panel = document.createElement('wa-tab-panel');
|
||||||
panel.name = 'sol-' + si;
|
panel.name = 'sol-' + si;
|
||||||
renderSolution(solutions[si], panel);
|
renderSolution(solutions[si], panel, lockedRooms);
|
||||||
tabGroup.appendChild(panel);
|
tabGroup.appendChild(panel);
|
||||||
}
|
}
|
||||||
container.appendChild(tabGroup);
|
container.appendChild(tabGroup);
|
||||||
|
|||||||
Reference in New Issue
Block a user