Is this possible in jQuery or javascript, without using libraries to record sound for X seconds and save to an audio file. I looked at getUserMedia, I see that it can extract audio and video from a webcam. I am currently using a webcam with a different library: Clmtracker , and for this reason I would like to try and do it without any external libraries.
I want to save the recorded audio in a div. I am currently taking a picture and giving it a unique name, so I am wondering how I can capture a short section of audio and save it in the same div created.
Question: How can I get audio in 5 seconds from a webcam? Sub-Question: How can I save this in an element in a div?
My code to capture Img and data on my page
function capturePage() { var now = new Date(); if (nextAllowedCapture <= now) { // Do capture logic audioElement.play(); counting++ console.log("Capturing..."); $(".capturing").show().delay(500).fadeOut(3000); var innerDiv = document.createElement('div'), innerDivImg = document.createElement('canvas'), image = document.createElement('img'), ul = document.createElement('ul'); innerDiv.className = 'divCreate'; innerDiv.id = 'img' + counting; innerDivImg.height = 450; innerDivImg.width = 600; innerDivImg.getContext('2d').drawImage(vid, 0, 0); image.id = 'image' + counting; image.src = innerDivImg.toDataURL(); image.className = 'divCreateImg'; innerDiv.appendChild(image); innerDiv.appendChild(ul); document.getElementById('galleryWrapper').appendChild(innerDiv); $('#measurements h4').each(function () { $("#" + innerDiv.id + " " + 'ul').append('<li>' + $(this).text() + ': ' + $(this).next().text()); }); nextAllowedCapture = new Date(); nextAllowedCapture.setSeconds(nextAllowedCapture.getSeconds() + coolDownSeconds); } else { nextCapTime = (nextAllowedCapture.getTime() - now.getTime()) / 1000; console.log("Can't capture again yet. This function can be executed again in " + (nextAllowedCapture.getTime() - now.getTime()) / 1000 + " seconds."); } }
Dan w source share