http://recordrtc.org/#comment-3466763969

http://recordrtc.org/#comment-3466763969

HTML

<script src="https://cdn.webrtc-experiment.com/RecordRTC.js"></script>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>

<button id="btn-record" disabled>Start Recording</button><hr>
<video id="video" controls autoplay></video>

CSS

button[disabled] {
    background: transparent!important;
    color: #ec008c!important;
    border: 1px solid #ec008c!important;
    cursor: not-allowed!important;
}

video {
  max-width: 100%;
}

JavaScript

var recorder;

var btnRecord = document.getElementById('btn-record');
btnRecord.innerHTML = 'Requesting camera...';

var video = document.getElementById('video');

var hints = {audio: true, video: true};
navigator.mediaDevices.getUserMedia(hints).then(function(camera) {
    video.muted = true;
    video.src = URL.createObjectURL(camera);

    btnRecord.innerHTML = 'Initiating the recorder...';

    recorder = RecordRTC(camera, {
        type: 'video'
    });
    recorder.startRecording();

    var maximumSeconds = 10;
    var resumed = false;

    btnRecord.onclick = function() {
        btnRecord.disabled = true;
        resumed = true;
        maximumSeconds = 10;
        recorder.resumeRecording();
        looper();
    };

    function looper() {
        maximumSeconds--;

        if(maximumSeconds <= 0 && !resumed) {
            btnRecord.disabled = false;
            btnRecord.innerHTML = 'Continue';
            recorder.pauseRecording();
            return;
        }

        btnRecord.innerHTML = maximumSeconds + ' seconds remaining';
        if(maximumSeconds <= 0) {
            btnRecord.innerHTML = 'Recording Ended.';
            recorder.stopRecording(function() {
                var file = new File([recorder.getBlob()], 'video.webm', {
                    type: 'video/webm'
                });

                btnRecord.innerHTML = file.name + ' (' + bytesToSize(file.size) + ')';

                video.muted = false;
                video.src = URL.createObjectURL(file);
            });
            return;
        }

        setTimeout(looper, 1000);
    }
    
    looper();
});