I've put in a lot of effort to make sure my code for the DECAY shapes is correct up to this point. The click event I implemented makes the shapes gradually start being affected, just as I intended. However, once I release the mouse or finger, it instantly jumps back to the original frame. Is there a way to make it smoothly transition back to its original state, mirroring how it starts? This would create a more fluid animation from beginning to end.
Below is my Click event code:
decaybackup = config.shader.decay;
world.resize()
});
let interval='';
let myshape = document.getElementById('shapeId');
myshape.addEventListener('pointerdown', function(event) {
interval = setInterval(()=>{
config.shader.decay += .001;
},1)
});
myshape.addEventListener('pointerup', function(event) {
config.shader.decay = decaybackup;
clearInterval(interval)
interval = '';
});If you need a visual reference and want to see any additional code I've included, here's a read-only link to my site:
Click here to view the site
Thank you in advance for any assistance!