commit 8ae585daede644e6f5d4e81db34119c8568d85aa · dunkirk.sh/aoc-2025

+73 -12

vis/10/generate.ts

···

       358
        
       			justify-content: center;

     

       359
        
       			margin: 20px 0;

     

       360
        
       			flex-wrap: wrap;

     

       0
        
       
     

       361
        
       		}

     

       362
        
       		.light {

     

       363
        
       			width: 50px;

     
···

       374
        
       			text-align: center;

     

       375
        
       			padding: 3px;

     

       376
        
       			line-height: 1.1;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       377
        
       		}

     

       378
        
       		.light.off {

     

       379
       -
       			background: #1e1e2e;

     

       380
        
       			color: #6c7086;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       381
        
       		}

     

       382
        
       		.light.on {

     

       383
       -
       			background: #a6e3a1;

     

       384
        
       			color: #1e1e2e;

     

       385
       -
       			box-shadow: 0 0 10px #a6e3a1;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       386
        
       		}

     

       387
        
       		.light.target {

     

       388
        
       			border-color: #f9e2af;

     
···

       517
        
       				// Part 1: Indicator lights

     

       518
        
       				machine.target.forEach((target, i) => {

     

       519
        
       					const light = document.createElement('div');

     

       520
       -
       					light.className = \`light \${currentState[i] ? 'on' : 'off'} \${target ? 'target' : ''}\`;

     

       521
       -
       					light.textContent = i;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       522
        
       					lightsDiv.appendChild(light);

     

       523
        
       				});

     

       524
        
       			} else {

     

       525
       -
       				// Part 2: Joltage counters

     

       526
        
       				machine.joltages.forEach((target, i) => {

     

       527
        
       					const counter = document.createElement('div');

     

       528
        
       					const current = currentState[i] || 0;

     

       529
       -
       					const isTarget = current === target;

     

       0
        
       
     

       0
        
       
     

       530
        
       					counter.className = \`light \${isTarget ? 'on' : 'off'} \${true ? 'target' : ''}\`;

     

       531
       -
       					counter.innerHTML = \`<div style="font-size: 7px; opacity: 0.7;">[\${i}]</div><div style="font-size: 10px; font-weight: bold;">\${current}/<span style="color: #f9e2af;">\${target}</span></div>\`;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       532
        
       					lightsDiv.appendChild(counter);

     

       533
        
       				});

     

       534
        
       			}

     
···

       871
        
       					updateStats();

     

       872
        
       				}

     

       873
        
       				

     

       874
       -
       				// Current machine done, move to next immediately

     

       875
        
       				if (currentMachineIndex < machines.length - 1) {

     

       876
        
       					if (isPlaying) {

     

       877
       -
       						currentMachineIndex++;

     

       878
       -
       						initMachine();

     

       879
       -
       						setTimeout(animateSolution, animationSpeed);

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       880
        
       					}

     

       881
        
       				} else {

     

       882
        
       					// All done

···

       358
        
       			justify-content: center;

     

       359
        
       			margin: 20px 0;

     

       360
        
       			flex-wrap: wrap;

     

       361
       +
       			padding: 10px;

     

       362
        
       		}

     

       363
        
       		.light {

     

       364
        
       			width: 50px;

     
···

       375
        
       			text-align: center;

     

       376
        
       			padding: 3px;

     

       377
        
       			line-height: 1.1;

     

       378
       +
       			position: relative;

     

       379
       +
       			background: #1e1e2e;

     

       380
       +
       		}

     

       381
       +
       		.light-inner {

     

       382
       +
       			position: absolute;

     

       383
       +
       			inset: 0;

     

       384
       +
       			border-radius: 50%;

     

       385
       +
       			overflow: hidden;

     

       386
       +
       			clip-path: circle(50% at 50% 50%);

     

       387
       +
       		}

     

       388
       +
       		.light::before {

     

       389
       +
       			content: '';

     

       390
       +
       			position: absolute;

     

       391
       +
       			bottom: 0;

     

       392
       +
       			left: -10%;

     

       393
       +
       			right: -10%;

     

       394
       +
       			width: 120%;

     

       395
       +
       			background: linear-gradient(to top, #a6e3a1, #a6e3a1cc);

     

       396
       +
       			height: var(--fill-height, 0%);

     

       397
       +
       			transition: height 0.3s ease;

     

       398
       +
       			z-index: 0;

     

       399
       +
       			border-radius: 0 0 50% 50%;

     

       400
       +
       		}

     

       401
       +
       		.light > div {

     

       402
       +
       			position: relative;

     

       403
       +
       			z-index: 1;

     

       404
        
       		}

     

       405
        
       		.light.off {

     

       0
        
       
     

       406
        
       			color: #6c7086;

     

       407
       +
       			box-shadow: none;

     

       408
       +
       		}

     

       409
       +
       		.light.off::before {

     

       410
       +
       			left: -10%;

     

       411
       +
       			right: -10%;

     

       412
       +
       			width: 120%;

     

       413
       +
       			border-radius: 0 0 50% 50%;

     

       414
        
       		}

     

       415
        
       		.light.on {

     

       0
        
       
     

       416
        
       			color: #1e1e2e;

     

       417
       +
       			box-shadow: 0 0 20px #a6e3a1, 0 0 30px #a6e3a180 !important;

     

       418
       +
       			overflow: visible;

     

       419
       +
       		}

     

       420
       +
       		.light.on::before {

     

       421
       +
       			left: 0;

     

       422
       +
       			right: 0;

     

       423
       +
       			width: 100%;

     

       424
       +
       			border-radius: 50%;

     

       425
        
       		}

     

       426
        
       		.light.target {

     

       427
        
       			border-color: #f9e2af;

     
···

       556
        
       				// Part 1: Indicator lights

     

       557
        
       				machine.target.forEach((target, i) => {

     

       558
        
       					const light = document.createElement('div');

     

       559
       +
       					const isOn = currentState[i];

     

       560
       +
       					light.className = \`light \${isOn ? 'on' : 'off'} \${target ? 'target' : ''}\`;

     

       561
       +
       					light.style.setProperty('--fill-height', isOn ? '100%' : '0%');

     

       562
       +
       					const label = document.createElement('div');

     

       563
       +
       					label.textContent = i;

     

       564
       +
       					light.appendChild(label);

     

       565
        
       					lightsDiv.appendChild(light);

     

       566
        
       				});

     

       567
        
       			} else {

     

       568
       +
       				// Part 2: Joltage counters with fill animation

     

       569
        
       				machine.joltages.forEach((target, i) => {

     

       570
        
       					const counter = document.createElement('div');

     

       571
        
       					const current = currentState[i] || 0;

     

       572
       +
       					const isTarget = current >= target;

     

       573
       +
       					const fillPercent = target > 0 ? Math.min(100, (current / target) * 100) : 0;

     

       574
       +
       					

     

       575
        
       					counter.className = \`light \${isTarget ? 'on' : 'off'} \${true ? 'target' : ''}\`;

     

       576
       +
       					counter.style.setProperty('--fill-height', \`\${fillPercent}%\`);

     

       577
       +
       					

     

       578
       +
       					const indexLabel = document.createElement('div');

     

       579
       +
       					indexLabel.style.fontSize = '7px';

     

       580
       +
       					indexLabel.style.opacity = '0.7';

     

       581
       +
       					indexLabel.textContent = \`[\${i}]\`;

     

       582
       +
       					

     

       583
       +
       					const valueLabel = document.createElement('div');

     

       584
       +
       					valueLabel.style.fontSize = '10px';

     

       585
       +
       					valueLabel.style.fontWeight = 'bold';

     

       586
       +
       					valueLabel.innerHTML = \`\${current}/<span style="color: #f9e2af;">\${target}</span>\`;

     

       587
       +
       					

     

       588
       +
       					counter.appendChild(indexLabel);

     

       589
       +
       					counter.appendChild(valueLabel);

     

       590
        
       					lightsDiv.appendChild(counter);

     

       591
        
       				});

     

       592
        
       			}

     
···

       929
        
       					updateStats();

     

       930
        
       				}

     

       931
        
       				

     

       932
       +
       				// Current machine done, move to next with a brief pause

     

       933
        
       				if (currentMachineIndex < machines.length - 1) {

     

       934
        
       					if (isPlaying) {

     

       935
       +
       						// Add delay between machines (3x the normal animation speed)

     

       936
       +
       						setTimeout(() => {

     

       937
       +
       							currentMachineIndex++;

     

       938
       +
       							initMachine();

     

       939
       +
       							setTimeout(animateSolution, animationSpeed);

     

       940
       +
       						}, animationSpeed * 3);

     

       941
        
       					}

     

       942
        
       				} else {

     

       943
        
       					// All done

+73 -12

vis/10/index.html

···

       113
        
       			justify-content: center;

     

       114
        
       			margin: 20px 0;

     

       115
        
       			flex-wrap: wrap;

     

       0
        
       
     

       116
        
       		}

     

       117
        
       		.light {

     

       118
        
       			width: 50px;

     
···

       129
        
       			text-align: center;

     

       130
        
       			padding: 3px;

     

       131
        
       			line-height: 1.1;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       132
        
       		}

     

       133
        
       		.light.off {

     

       134
       -
       			background: #1e1e2e;

     

       135
        
       			color: #6c7086;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       136
        
       		}

     

       137
        
       		.light.on {

     

       138
       -
       			background: #a6e3a1;

     

       139
        
       			color: #1e1e2e;

     

       140
       -
       			box-shadow: 0 0 10px #a6e3a1;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       141
        
       		}

     

       142
        
       		.light.target {

     

       143
        
       			border-color: #f9e2af;

     
···

       272
        
       				// Part 1: Indicator lights

     

       273
        
       				machine.target.forEach((target, i) => {

     

       274
        
       					const light = document.createElement('div');

     

       275
       -
       					light.className = `light ${currentState[i] ? 'on' : 'off'} ${target ? 'target' : ''}`;

     

       276
       -
       					light.textContent = i;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       277
        
       					lightsDiv.appendChild(light);

     

       278
        
       				});

     

       279
        
       			} else {

     

       280
       -
       				// Part 2: Joltage counters

     

       281
        
       				machine.joltages.forEach((target, i) => {

     

       282
        
       					const counter = document.createElement('div');

     

       283
        
       					const current = currentState[i] || 0;

     

       284
       -
       					const isTarget = current === target;

     

       0
        
       
     

       0
        
       
     

       285
        
       					counter.className = `light ${isTarget ? 'on' : 'off'} ${true ? 'target' : ''}`;

     

       286
       -
       					counter.innerHTML = `<div style="font-size: 7px; opacity: 0.7;">[${i}]</div><div style="font-size: 10px; font-weight: bold;">${current}/<span style="color: #f9e2af;">${target}</span></div>`;

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       287
        
       					lightsDiv.appendChild(counter);

     

       288
        
       				});

     

       289
        
       			}

     
···

       626
        
       					updateStats();

     

       627
        
       				}

     

       628
        
       				

     

       629
       -
       				// Current machine done, move to next immediately

     

       630
        
       				if (currentMachineIndex < machines.length - 1) {

     

       631
        
       					if (isPlaying) {

     

       632
       -
       						currentMachineIndex++;

     

       633
       -
       						initMachine();

     

       634
       -
       						setTimeout(animateSolution, animationSpeed);

     

       0
        
       
     

       0
        
       
     

       0
        
       
     

       635
        
       					}

     

       636
        
       				} else {

     

       637
        
       					// All done

···

       113
        
       			justify-content: center;

     

       114
        
       			margin: 20px 0;

     

       115
        
       			flex-wrap: wrap;

     

       116
       +
       			padding: 10px;

     

       117
        
       		}

     

       118
        
       		.light {

     

       119
        
       			width: 50px;

     
···

       130
        
       			text-align: center;

     

       131
        
       			padding: 3px;

     

       132
        
       			line-height: 1.1;

     

       133
       +
       			position: relative;

     

       134
       +
       			background: #1e1e2e;

     

       135
       +
       		}

     

       136
       +
       		.light-inner {

     

       137
       +
       			position: absolute;

     

       138
       +
       			inset: 0;

     

       139
       +
       			border-radius: 50%;

     

       140
       +
       			overflow: hidden;

     

       141
       +
       			clip-path: circle(50% at 50% 50%);

     

       142
       +
       		}

     

       143
       +
       		.light::before {

     

       144
       +
       			content: '';

     

       145
       +
       			position: absolute;

     

       146
       +
       			bottom: 0;

     

       147
       +
       			left: -10%;

     

       148
       +
       			right: -10%;

     

       149
       +
       			width: 120%;

     

       150
       +
       			background: linear-gradient(to top, #a6e3a1, #a6e3a1cc);

     

       151
       +
       			height: var(--fill-height, 0%);

     

       152
       +
       			transition: height 0.3s ease;

     

       153
       +
       			z-index: 0;

     

       154
       +
       			border-radius: 0 0 50% 50%;

     

       155
       +
       		}

     

       156
       +
       		.light > div {

     

       157
       +
       			position: relative;

     

       158
       +
       			z-index: 1;

     

       159
        
       		}

     

       160
        
       		.light.off {

     

       0
        
       
     

       161
        
       			color: #6c7086;

     

       162
       +
       			box-shadow: none;

     

       163
       +
       		}

     

       164
       +
       		.light.off::before {

     

       165
       +
       			left: -10%;

     

       166
       +
       			right: -10%;

     

       167
       +
       			width: 120%;

     

       168
       +
       			border-radius: 0 0 50% 50%;

     

       169
        
       		}

     

       170
        
       		.light.on {

     

       0
        
       
     

       171
        
       			color: #1e1e2e;

     

       172
       +
       			box-shadow: 0 0 20px #a6e3a1, 0 0 30px #a6e3a180 !important;

     

       173
       +
       			overflow: visible;

     

       174
       +
       		}

     

       175
       +
       		.light.on::before {

     

       176
       +
       			left: 0;

     

       177
       +
       			right: 0;

     

       178
       +
       			width: 100%;

     

       179
       +
       			border-radius: 50%;

     

       180
        
       		}

     

       181
        
       		.light.target {

     

       182
        
       			border-color: #f9e2af;

     
···

       311
        
       				// Part 1: Indicator lights

     

       312
        
       				machine.target.forEach((target, i) => {

     

       313
        
       					const light = document.createElement('div');

     

       314
       +
       					const isOn = currentState[i];

     

       315
       +
       					light.className = `light ${isOn ? 'on' : 'off'} ${target ? 'target' : ''}`;

     

       316
       +
       					light.style.setProperty('--fill-height', isOn ? '100%' : '0%');

     

       317
       +
       					const label = document.createElement('div');

     

       318
       +
       					label.textContent = i;

     

       319
       +
       					light.appendChild(label);

     

       320
        
       					lightsDiv.appendChild(light);

     

       321
        
       				});

     

       322
        
       			} else {

     

       323
       +
       				// Part 2: Joltage counters with fill animation

     

       324
        
       				machine.joltages.forEach((target, i) => {

     

       325
        
       					const counter = document.createElement('div');

     

       326
        
       					const current = currentState[i] || 0;

     

       327
       +
       					const isTarget = current >= target;

     

       328
       +
       					const fillPercent = target > 0 ? Math.min(100, (current / target) * 100) : 0;

     

       329
       +
       					

     

       330
        
       					counter.className = `light ${isTarget ? 'on' : 'off'} ${true ? 'target' : ''}`;

     

       331
       +
       					counter.style.setProperty('--fill-height', `${fillPercent}%`);

     

       332
       +
       					

     

       333
       +
       					const indexLabel = document.createElement('div');

     

       334
       +
       					indexLabel.style.fontSize = '7px';

     

       335
       +
       					indexLabel.style.opacity = '0.7';

     

       336
       +
       					indexLabel.textContent = `[${i}]`;

     

       337
       +
       					

     

       338
       +
       					const valueLabel = document.createElement('div');

     

       339
       +
       					valueLabel.style.fontSize = '10px';

     

       340
       +
       					valueLabel.style.fontWeight = 'bold';

     

       341
       +
       					valueLabel.innerHTML = `${current}/<span style="color: #f9e2af;">${target}</span>`;

     

       342
       +
       					

     

       343
       +
       					counter.appendChild(indexLabel);

     

       344
       +
       					counter.appendChild(valueLabel);

     

       345
        
       					lightsDiv.appendChild(counter);

     

       346
        
       				});

     

       347
        
       			}

     
···

       684
        
       					updateStats();

     

       685
        
       				}

     

       686
        
       				

     

       687
       +
       				// Current machine done, move to next with a brief pause

     

       688
        
       				if (currentMachineIndex < machines.length - 1) {

     

       689
        
       					if (isPlaying) {

     

       690
       +
       						// Add delay between machines (3x the normal animation speed)

     

       691
       +
       						setTimeout(() => {

     

       692
       +
       							currentMachineIndex++;

     

       693
       +
       							initMachine();

     

       694
       +
       							setTimeout(animateSolution, animationSpeed);

     

       695
       +
       						}, animationSpeed * 3);

     

       696
        
       					}

     

       697
        
       				} else {

     

       698
        
       					// All done