Changing html5’s source “src” attribute takes no effect wtih angularjs

Here is a couple of angular approaches : 1) Use ng-src= instead of src= The angular docs explain why this works : http://docs.angularjs.org/api/ng.directive:ngSrc During compilation stage, angular will expand the element to include the correct src= attribute. This will change the src attrib of the HTML5 audio element, but unfortunately that is NOT enough to … Read more

How can I add predefined length to audio recorded from MediaRecorder in Chrome?

This is a chrome bug. FF does expose the duration of the recorded media, and if you do set the currentTimeof the recorded media to more than its actual duration, then the property is available in chrome… function exportAudio(blob) { const aud = document.getElementById(“aud”); aud.src = URL.createObjectURL(blob); aud.addEventListener(“loadedmetadata”, () => { // It should have … Read more

What does the FFT data in the Web Audio API correspond to?

yes,getByteFrequencyData results in a normalized array of values between 0 and 255. (it copies the data to the array it gets passed-in). the frequency bands are split equally, so each element N of your array corresponds to: N * samplerate/fftSize so, the first bin is 0. and, assuming a samplerate of 44100 and a <analyzerNode>.fftSize … Read more

How to detect HTML5 audio MP3 support?

You could either check the User-Agent and see what browser is being used or you could test support with Javascript. var a = document.createElement(‘audio’); return !!(a.canPlayType && a.canPlayType(‘audio/mpeg;’).replace(/no/, ”)); I got the above code from this page. return !!(a.canPlayType) is better because (some recent versions of)Firefox not supports mp3 and a.canPlayType(‘audio/mpeg;’) will be false

Html 5 audio tag custom controls?

You create your elements like so… <audio id=”yourAudio” preload=’none’> <source src=”https://stackoverflow.com/questions/7638754/the url to the audio” type=”audio/wav” /> </audio> <a href=”#” id=”audioControl”>play!</a> And add some functionality: var yourAudio = document.getElementById(‘yourAudio’), ctrl = document.getElementById(‘audioControl’); ctrl.onclick = function () { // Update the Button var pause = ctrl.innerHTML === ‘pause!’; ctrl.innerHTML = pause ? ‘play!’ : ‘pause!’; // … Read more

How can I add multiple sources to an HTML5 audio tag, programmatically?

Why add multiple files with JavaScript when you can just detect the types supported? I would suggest instead detecting the best type then just setting the src. var source= document.createElement(‘source’); if (audio.canPlayType(‘audio/mpeg;’)) { source.type=”audio/mpeg”; source.src=”https://stackoverflow.com/questions/4053262/audio/song.mp3″; } else { source.type=”audio/ogg”; source.src=”https://stackoverflow.com/questions/4053262/audio/song.ogg”; } audio.appendChild(source); Add as many checks as you have file types.

html 5 audio tag width

Set it the same way you’d set the width of any other HTML element, with CSS: audio { width: 200px; } Note that audio is an inline element by default in Firefox, so you might also want to set it to display: block. Here’s an example.