I am not too sound in javascript, i am doing this assignment, using html5 getUserMedia() api.
so far its working fine as i can take snaps of the frame and draw it on a canvas.
the problem i cant seem to solve now is, to display a preloader at the center of the video when a click on the capture button. i already wrote a delay funtion, which will delay for 2 seconds before capturing the image
i have a function snap
function snapshot(){
//this function is the one that draws the frame from video to the canvas
}
function preloader(){
//i want the preloader gif image displaying for the 2 seconds on the video
setTimeout(snapshot, 2000);
}
then i have my event listener as
document.querySelector("#click").addEventListener('click',preloader);
i have the gif file (preloader in my image files)