the home site for me: also iteration 3 or 4 of my site
4
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: better autoscaling

+26 -5
+26 -5
templates/shortcodes/lensDiagram.html
··· 13 13 </div> 14 14 <div> 15 15 <label>Radius of Curvature:</label> 16 - <input type="number" id="radius" value="20" min="1" /> 16 + <input 17 + type="number" 18 + id="radius" 19 + value="20" 20 + min="0.2" 21 + step="0.2" 22 + /> 17 23 </div> 18 24 <div> 19 25 <label>Object Distance:</label> 20 - <input type="number" id="objectDist" value="30" min="1" /> 26 + <input 27 + type="number" 28 + id="objectDist" 29 + value="30" 30 + min="0.2" 31 + step="0.2" 32 + /> 21 33 </div> 22 34 </div> 23 35 <div style="display: flex; gap: 20px; align-items: center; width: 100%"> ··· 72 84 const objectDistInput = document.getElementById("objectDist"); 73 85 const objectHeightInput = document.getElementById("objectHeight"); 74 86 const zoomInput = document.getElementById("zoom"); 75 - 76 - objectHeightInput.value = Math.round(radiusInput.value / 3); 77 87 78 88 let offsetX = 0; 79 89 let offsetY = 0; ··· 583 593 drawRays(isConcave, R, objDist); 584 594 } 585 595 596 + function resetHeight() { 597 + objectHeightInput.value = Math.max( 598 + parseFloat(((radiusInput.value * 2) / 3).toFixed(2)), 599 + 0.1, 600 + ); 601 + } 602 + 586 603 mirrorType.addEventListener("change", update); 587 - radiusInput.addEventListener("input", update); 604 + radiusInput.addEventListener("input", () => { 605 + resetHeight(); 606 + update(); 607 + }); 588 608 objectDistInput.addEventListener("input", update); 589 609 objectHeightInput.addEventListener("input", update); 590 610 zoomInput.addEventListener("input", update); 591 611 window.addEventListener("resize", update); 592 612 613 + resetHeight(); 593 614 update(); 594 615 595 616 let isCanvasHovered = false;