javascriptblobrecordrtc

Referencing recorded video to see if it is playing or not (JS)


So I am using Muaz Khans RecordRTC to record Video and Audio for a website. I have been trying to write a script to see if the recorded video is being played or not. The problem I'm having is how to reference the video that has been created.

I have tried the following with no luck.

function vidplay() {
    var video = document.getElementById("videoURL");
    if (video.paused) {

        //DESIRED ACTION 

    } else {

        //DESIRED ACTION
    }
}

Any help would be appreciated.


Solution

  • Please check this demo: https://jsfiddle.net/ddxadv3y/

    Simply check for video.currentTime. It must update.

    Otherwise consider video is paused or ended.

    <h1></h1>
    <video controls muted style="width:20%;"></video>
    <script>
        var video = document.querySelector('video');
        var h1 = document.querySelector('h1');
    
        video.onloadedmetadata = function() {
            if(lastTime) return;
            checkForTimeChange();
        };
    
        var lastTime;
        function checkForTimeChange() {
            if(!lastTime) {
                lastTime = video.currentTime;
            }
    
            if(lastTime == video.currentTime) {
                h1.innerHTML = 'paused';
            }
            else {
                h1.innerHTML = 'playing';
            }
    
            lastTime = video.currentTime;
    
            setTimeout(checkForTimeChange, 500);
        }
    </script>
    
    <script>
        navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
        navigator.getUserMedia({video: true}, function(stream) {
            video.src = URL.createObjectURL(stream);
            video.play();
        }, function() {});
    </script>