Recently, I created my own version of the "10 PRINT" project to enhance my JavaScript skills.
As a finishing touch, I decided to incorporate sliders that would allow viewers to adjust various parameters and witness the impact it has on the project.
You can check out my creation here: 10PRINT, developed by Boguz, hosted on GitHub
One slider I attempted to include was meant to control the speed of the animation, but unfortunately, I encountered issues getting it to function properly.
To initiate the animation, I relied on a setInterval method like this:
setInterval(function(speed){
draw();
}, speed);
The speed variable is set when the document loads:
let speed = 50;
Subsequently, I attempted to update it (when a viewer interacts with the slider) using the following code:
const speedControl = document.querySelector("#speed-slider");
speedControl.oninput = function() {
let speedVal = speedControl.value;
speed = Number(speedVal);
resetDraw();
}
Upon logging the speed variable in the console, I noticed that it contained the correct values; however, it did not produce the desired outcome.
If more code inspection is required, please feel free to request it or visit the GitHub Repository.
Any assistance or guidance would be greatly appreciated. Thank you!