From d9779f8bf48a8c2093e2a451decd5bf44a234bad Mon Sep 17 00:00:00 2001 From: Vivek Singh Date: Fri, 29 Jan 2021 18:09:05 +0530 Subject: [PATCH] stopped processing when camera access is not given and fixed the working of close button (#1797) Co-authored-by: Jeffrey Warren --- src/ui/SetInputStep.js | 37 ++++++++++++++++++++++++++++++++----- 1 file changed, 32 insertions(+), 5 deletions(-) diff --git a/src/ui/SetInputStep.js b/src/ui/SetInputStep.js index dc4551eb..7d0b0742 100644 --- a/src/ui/SetInputStep.js +++ b/src/ui/SetInputStep.js @@ -51,21 +51,48 @@ function setInputStepInit() { video.onloadedmetadata = function(e) { video.play(); }; + + document.getElementById('capture').addEventListener('click', function(stream){ + context.drawImage(video, 0, 0, 400, 300); + options.onTakePhoto(canvas.toDataURL()); + }); + document.getElementById('close').addEventListener('click', function () { stopStream(stream); }); } function handleError(error) { console.log('navigator.getUserMedia error: ', error); + + // when user dismissed the camera access (includes closing of prompt which requests for camera access) + if(error.message == 'Permission denied' || error.message == 'NotAllowedError' || error.message == 'PermissionDismissedError'){ + document.getElementById('capture').addEventListener('click', function(e) { + alert('Enable camera access in order to take picture'); + }); + } + + // when user don't have webcam to use. + if(error.message == 'NotFoundError' || error.message == 'DevicesNotFoundError'){ + alert('You do not have appropriate devices to use this Functionality'); + } + + // when webcam is already used by some other application + if(error.message == 'NotReadableError' || error.message == 'TrackStartError' || error.message == 'Concurrent mic process limit'){ + alert('Your webcam is already in use by some other application'); + } + + // when some of the requested constraints can't be satisfied like high frame rate or high resolution + if(error.message == 'OverconstrainedError' || error.message == 'ConstraintNotSatisfiedError'){ + console.log('Requested Constraints can not be satisfied ', error); + } } navigator.mediaDevices.getUserMedia(constraints).then(handleSuccess).catch(handleError); - - - document.getElementById('capture').addEventListener('click', function(stream){ - context.drawImage(video, 0, 0, 400, 300); - options.onTakePhoto(canvas.toDataURL()); + + document.getElementById('close').addEventListener('click', function() { + video.style.display = 'none'; }); + function stopStream(stream) { stream.getVideoTracks().forEach(function (track) { track.stop();