Senti falta de uma funcionalidade para tirar uma nova foto, caso o usuário não gostasse da primeira, então implementei aqui.
Apenas modifiquei a função anônima do botaoIniciarCamera para ser uma função tirarFoto()
botaoIniciarCamera.addEventListener("click", tirarFoto)
async function tirarFoto() {
const iniciarVideo = await navigator.mediaDevices
.getUserMedia({video: true, audio: false})
botaoIniciarCamera.style.display = "none";
campoCamera.style.display = "block";
video.srcObject = iniciarVideo;Então incluí uma opção (bem simples) na mensagem de sucesso:
<p>Prontinho, imagem capturada!</p>
<p data-tirar-nova-foto style="padding: 5px; cursor: pointer;">Quer tirar uma nova foto?</p>E criei uma const para capturar esse elemento, e uma função simples para voltar à etapa inicial:
const novaFoto = document.querySelector("[data-tirar-nova-foto]");
novaFoto.addEventListener("click", () => {
mensagem.style.display = "none";
botaoIniciarCamera.style.display = "block";
tirarFoto;
})