• Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.

    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript Not show the time/seconds until 'record' starts on html5 player


Bronze Coder
This code allows the page vistor to click a 'display' button to show the camera view on the page, but not start the video recording (they can select a seperate 'record' button to start recording). However, the timer/seconds start upon selecting 'display' the camera view. I'd like help with having the time/seconds not start until 'record' button is clicked. Any help/guidance is appreciated. Here's the code:

let blobs = [];
let stream, mediaRecorder, blob;

let video = document.getElementById("video");
var displaying = false;
var recording = false;
async function display() {
  stream = await navigator.mediaDevices.getUserMedia({
    audio: true,
    video: true,
  video.srcObject = stream;
  displaying = true;
function startRecording() {
    mediaRecorder = new MediaRecorder(stream);
    mediaRecorder.ondataavailable = (event) => {
    // Let's append blobs for now, we could also upload them to the network.
      if (event.data) {
    mediaRecorder.onstop = doPreview;
    // Let's receive 1 second blobs
    recording = true;

function endRecording() {
    // Let's stop capture and recording
    stream.getTracks().forEach((track) => track.stop());
    recording = false;

function doPreview() {
  if (!blobs.length) {
  // Let's concatenate blobs to preview the recorded content
  blob = new Blob(blobs, { type: mediaRecorder.mimeType });
  video.srcObject = null;
  video.src = URL.createObjectURL(
@chrisj I do not see anything to call any function nor do I see any code or function the starts a timer. So I asume that the timer is a function of the display and has nothing to do with your JS. Take a look at the documents for the video player.

New Threads

Buy us a coffee!

Top Bottom