I'm writing a page for a musician and am excited about using the HTML5 <audio> tag to create a custom player. I'd also like to experiment with some kind of visual feedback from the music being played. Are there any JavaScript experiments/libraries/APIs that exploit this idea? Is it even possible?
EDIT: It's indeed possible. Here is an impressive list of apps using the Chrome Web Audio API. I'd still love to see what you've got.
I know it's possible in Firefox
Spectrum Visualization:
http://ajaxian.com/archives/spectrum-visualization-with-the-html5-audio-data-api
Mozilla Audio API:
https://wiki.mozilla.org/Audio_Data_API
But I'm not sure about other browsers... I couldn't find much else on the topic.
Related
I'm searching a good webbrowser for my project but I can't find one.
I need html5 video streaming (doesn't work in CefSharp) and
I need javascript injecting (doesn't really work in the normal webbrowser)
Thanks for help
CefSharp is able to play html5 video and audio. And here's the list with all the supported audio and video codecs.
Just because CefSharp doesn't include proprietary Audio and Video codecs, doesn't mean it can't. Due to licensing reasons mentioned here, CefSharp is not including them. You can however build cef and embed your own codecs in it.
You can always grab the code from their GitHub Repository and experiment your self considering this great answer on stackoverflow
Or you can use GeckoFx as suggested on another answer posted on similar question on stackoverflow. Which is isn't really a WPF Control, but you can use it with a WindowsFormsHost.
Im trying to develop an javascript based audio editor. It should be possible to record, play and edit an audio file with. Its especially important to visualize the recording audio (realtime) and the selected/uploaded audio file (both of them).
I red alot about the Web-Audio-API and saw a few examples as well, but there are some problems - it only works in chrome/safari so far, it should be run on firefox as well, but it doesnt. So what Im looking for is an crossbrowser API or javascript/jquery libary which provides the called features.
Here are some examples to show u what I mean:
http://plucked.de/ (great tool, but there are many bugs as well)
http://www.stud.fit.vutbr.cz/~xmyler00/audiee/ (as u can see web audio API doesnt work on firefox)
The Web-Audio-API is a fairly new standard and is steadily being adopted by the major browsers with varying levels of support. Currently Chrome and Safari have the best support and Firefox support is in it's draft stage. For the sort of application, with cross browser support, that you're wanting you will need to go to third party plugins/extensions/addons for the support you're after.
Welcome to the bleeding edge. :)
We need to capture voice in a web portal. Our contractor developed the whole web portal without using Java Applications, only client-side code, and claims there is no way to capture voice using JavaScript today.
I'm not a Java guy, so I don't have the skills to discuss this, but I'll appreciate any help our folks here in SO can give: if you guys say it can not be done with today technology, so be it...
PS: the solution MUST attend IE, Chrome, Firefox and Safari, for end users, so Canary is out of question for now.
Currently there's no way reliable way to record audio using only HTML5 and JavaScript across browsers.
The only cross browser solution for non Flash recording on desktop browsers in the foreseeable future is the Media Recorder API. It's a recent standard proposal for a JS API who's purpose is to make audio and video recording in the browser very simple. Today it works only in Firefox 27 and only for audio. This article covers the standard in more detail.
If audio recording is important for you today I recommend you check out proven flash solutions like FLVAR or Audior. They work on all browsers, they are reliable and supported. Flash just works and major sites like YouTube and Netflix continue to use it.
The javascript's getUserMedia (getUserMedia on MDN) is a simple way to do this. I suggest you addyosmani's polyfill that has a flash fallback in case the browser doesn't yet support it.
I own a site which offers a Flash based music shopping cart which steams music using RTMP. Mobile devices are getting more and more popular and the exclusion of Flash means they don't support my Flash application. I was wondering if it's possible to create the same kind of Flash widget I have on my site in HTML5 or maybe even JavaScript alone? Is HTML5 developed enough for this kind of system? If possible, would users be able to embed an HTML5 version of our players? Can you stream music via RTMP using anything but Flash?
Thanks for your help
To answer your question YES HTML5 is documented and developed enough but the question that you should be asking is "Is HTML5 supported enough?"
HTML5 is markup AND JavaScript and its not supported in every browser. This is mitigated though by many great JavaScript libraries that will gracefully degrade depending on what browser/device is viewing it.
If you just want to learn more and make a decision for yourself I would suggest reading Dive into HTML5 to figure out what HTML5 is all about and what it offers.
No, you cannot stream music using RTMP in HTML5. However, you can offer music in mp3 and ogg formats. (You'll need to offer both to cover all browsers)
After looking at your site, I would recommend you continue to use flash because HTML5 does not support streaming audio, only audio available to download. While the shopping cart and everything else can mostly be done in HTML5, your users will still need Flash unless you want to allow users to download the music easily.
I just came across a Nintendo emulator written entirely in JavaScript on the interwebs, but it doesn't have sound. It got me thinking: Is there any way to synthesize sound in the browser using JavaScript and then play it? If it's not possible in general, then are there any Safari/Opera/FireFox/IE/Etc. extensions that would make it possible?
I am not asking about techniques for synthesizing sound, just techniques for playing sounds that have been synthesized by code running in the browser.
I would imagine your best bet is to have Javascript talk to Flash using ExternalInterface (http://www.adobe.com/devnet/flash/articles/external_interface.html). Flash now has a way of transfering data between the sound buffers and a general purpose ByteArray classs.
http://www.adobe.com/devnet/flash/articles/dynamic_sound_generation/
You can develop Flash for free using the Flex SDK http://www.adobe.com/products/flex/.
Most developers use SoundManager 2 when they want to add sound to their application with JavaScript. It has hooks so JavaScript can interact with Flash 8 and 9 features. I am not sure if it has exposed the ability to work with Byte Data which I guess you are after, I never had to deal with that.
It turns out the author of the NES emulator has found a dynamic audio library:
https://github.com/bfirsh/dynamicaudio.js
I haven't tried it, but the docs look promising:
var dynamicaudio = new DynamicAudio({'swf':
'/static/dynamicaudio.swf'})
write(samples); // Plays an array of floating point audio samples in the range -1.0 to
1.0.
In theory it should be possible to synthesize the sounds and then get the browser to play them using a data URL.
In practice, Steven Wittens has actually produced a demo of this technique. The encodeAudio8bit and encodeAudio16bit functions are where the magic happens.