Posted December 21, 2021 by Sean
A few people have commented to ask for help including a loading bar on this template in the past, so I've added a small bar to the canvas during the loading state which fills to white as it loads. The implementation looks like this:
function progressHandler(progress) {
var percent = progress * 100 + '%';
canvas.style.background = 'linear-gradient(to right, white, white ' + percent + ', transparent ' + percent + ', transparent) no-repeat center';
canvas.style.backgroundSize = '100% 1rem';
}
If you're familiar with HTML/CSS/JS, customizing this should be simple, and if you'd like to disable it, you can simply delete the contents of the progressHandler
function.
Note that this is only included in the 2020.2+ template: If you are using one of the legacy versions and need help adding a loading state, let me know and I can update them as well.