I've been searching for it for a very long time and can't seem to find any relevant items (I know about the VLC plugin and I don't think it supports sound effects for video games). I need something similar like FMOD or Bass (or an NPAPI wrapper for these two) or a DirectSound NPAPI plugin, or just anything as long as it can support loading .wav, .ogg, .mp3, .m4a, etc. and can play those sounds in multiple instances.
EDIT: The reason I'm trying the NPAPI route is because the Web Audio API isn't really ready for primetime yet. I already tried Chrome's implementation and it has a bit of latency when playing the sounds (and multiple instances of sounds). It's even hard (or maybe impossible) to pause-play sounds with the current API spec. I also tried Flash (via SoundManager 2) and it also suffers from latency. It's fine for games but not good for making music applications such as a drum sampler. I hope this clarifies. (Sorry for my English, it's not my first language)
I don't know of any existing plugins that will do what you want, but if you have some good c++ experience you could build a plugin to do that with FireBreath. The sound playback functionality you'd have to implement yourself, though.
Keep in mind that Chrome has announced plans to stop supporting plugins by the end of 2014 and Firefox will be blocking them by default starting in firefox 26, requiring users to specifically enable any plugins used on a page before they will work. You also have the "fun" install issue.
In short, if you can do something without a plugin you should absolutely not be using a plugin.
Related
There are a number of JavaScript libraries available for HTML5 audio, to either make a developer's life easier, ensure cross-browser compatibility or support Flash fallback for older browsers.
I haven't found much in terms of comparatives, except maybe for this article, on a small scale.
Which of the following libraries come recommended and for what purposes? What can I expect in terms of documentation and support (eg: is that library likely here to stay?)
Audio5JS
Buzz
HowlerJS
jPlayer
MediaElementJS
SoundJS
SoundManager2
I don't need UI features for my needs and would rather keep things small and simple. That would seem to make Audio5JS a candidate of choice. However I'm wondering if that's a smart choice simply because it doesn't seem to have as big a community as, say, jPlayer.
EDIT: I simply need to play an audio file (in full and/or parts of it) based on user input and the ability to loop that for a given file (ie: loop the file itself or loop a part of it.)
General guidelines on how to pick a JS library to get a job done will also be welcome.
I mainly wanna save myself the need to try out all those libraries (and more) to figureout their pro's and con's.
Thank you.
You may have already selected a library, but as the developer of howler.js, I thought I'd leave a note. From your description, I'd say howler.js is exactly what you are looking for if you don't need less than IE9 support. howler.js has now been under development/refinement for nearly a year and has a large community around it. It is great for both simple and complex tasks, and leaves any UI needs up to the developer. howler.js is currently the only library that I'm aware of that lets you seamlessly use both Web Audio API and HTML5 Audio with a single, simple API.
My recommendation would be SoundJS, but I may be biased because I work on it.
It allows you to get audio up and running with minimal code that will work across all modern browsers. Looping and playing from an offset both work smoothly. As far as I know, looping only a slice of a larger audio file smoothly can only be done with pure web audio, which currently is only supported in Chrome and Safari. SoundJS doesn't support that functionality directly, but does allow you access the web audio nodes directly so you can set it up manually.
Hope that helps.
You can also check out http://musquitojs.com/. It provides a simple API to create and play sounds.
For example, to play a sound all you've to do is.
import $buzz from 'musquito';
$buzz.play('gunfire.mp3');
The library also supports Audio Sprites.
I'm working on HTML5 app that lets several users to work on one document. I need to add a possibility for users (editing the same document) to talk to each other. And I just don't know how to start with that. Here are my questions
Is there an HTML5 lib allowing to transfer sound from microphone between clients?
What about streaming video from camera?
What is an easiest server-side solution for that?
Any thoughts are strongly appreciated! So don't be shy! :)
UPD: please note that I need an abbility for more then two users to talk.
For this you can use WebRTC.
However, this is a very young and unfinished technology that as already stated is currently available only in Chrome stable and Firefox beta. This means there will probably come changes to the current spec, something to be aware of in case of early implementation. But it allow you to use video and audio communication directly in the browser.
Quick-start here:
http://www.html5rocks.com/en/tutorials/webrtc/basics/
Other options are Flash based plugins such as flash-videoio. This is an open source plugin but will naturally require Adobe Flash installed. This may or may not be a problem depending on the company's security policy.
For technical details on implementation please see examples on the provided links.
For many-to-many you can use either:
"Mesh" - everybody connects to everybody. This however is costly on CPU and mobiles are often left out.
"Star" - everybody goes through the most capable device. However, with many connections this will soon run slow for the device handling all connections.
MCU. Specialized server to handle all connections. If mixes audio and video and handles drop-outs as well without affecting the other callers.
Examples of MCU's:
http://sourceforge.net/projects/mcumediaserver/ (open source)
http://www.medooze.com/products/mcu.aspx (commercial)
you are searching for navigator.getUserMedia()
that allows the various users to share video audio and data.
the support is very low... only chrome and the latest verions of opera and firefox support it.
and totally no support on mobile devices... maybe in the next android chrome... dunno
as there is much to talk about and i have no clue on how u wanna setup everything i suggest u read a little more about that on the urls...
http://caniuse.com/stream
http://www.html5rocks.com/en/tutorials/getusermedia/intro/
http://dev.w3.org/2011/webrtc/editor/getusermedia.html
https://developer.mozilla.org/en-US/docs/WebRTC/navigator.getUserMedia
http://my.opera.com/core/blog/2011/03/23/webcam-orientation-preview
http://simpl.info/getusermedia/
and SERVERSIDE solution nahh... thats not a good solution
clientside is the way to go.
Not sure if you're required to do it yourself from scratch or are able to use third party libraries/tools.
In which case I would recommend using Tokbox which has support for WebRTC and SDK for iOS.
Their API is simple and easy to use.
I understand that the best bet when streaming a video as a source in an HTML5 tag would be .mp4. But let's say that I have a source that only outputs fragmented to an ism/manifest.
Is there any way at all, whether through other libraries or messy hacks, that I can bring this video into something rendered as a tag onscreen? The closest I have found is Walkthrough: Building Your First HTML5 Smooth Streaming Player because it allows this to be done - but I neither have Windows 8, or want to have this running a server capable of .NET. I was hoping there was something, messy or not, that I could achieve this with entirely within javascript and executable locally without a deploy.
Thanks
Firstly, W3C does not provide a standard for adaptive bitrate streaming, yet. So for the time being most browsers only support simple progressive download playback.
Hence, there is no JS implementation of a Smooth Streaming player and Microsoft is not working on one, as far as I know.
The example you provide uses the "Microsoft Smooth Streaming Client SDK Beta 2 for Windows 8" which is a C++ library and is only available for Windows Store Apps development. It has nothing to do with browsers.
So, unfortunately this is not yet possible. Even more, I doubt that this will ever happen, because everybody is waiting for MPEG DASH to be finalized.
UPDATE.
Please, notice that you always can use Siverlight application for playing SmoothStreaming. The referenced HTML5 Player framework is capable of falling back to Silverlight.
no luck for Microsoft Smooth Streaming, but regarding MPEG-DASH which is similar (see http://blog.johndeutscher.com/2013/06/10/mpeg-dash-preview-from-windows-azure-media-services):
"Dash.js is permissively licensed (under the BSD license) and can therefore be studied and reused by anyone seeking to provide their own DASH-AVC/264 compliant player. The goal is to make it easier for third-parties to build adaptive streaming video players."
http://msopentech.com/blog/2013/06/20/ms-open-tech-contributes-to-open-source-adaptive-streaming-video-player/
also see:
https://dvcs.w3.org/hg/html-media/raw-file/tip/media-source/media-source.html
which is required for Dash.js
Is JavaScript capable of doing the same what Flash does? And if it is the case, can it be a good idea to switch from Adobe Flash to JavaScript?
No, JavaScript cannot do what Flash does.
Maybe HTML5 w/ canvas,JavaScript w/ JQuery,CSS3, some Webkits and some SVG/JPG to handle pictures and animations can make an attempt at what Flash was 5-10 years ago.
Video
JavaScript - There is only one implementation I know that slice the video into JPEGs then dram it onto the canvas. No clue what happens if one wanted to stream a file.
<video> tag - Best thing to come along. I would not lie. But this is not JavaScript.
Audio
JavaScript - I remember once it could be used for MIDI files but then it needed compatibility checks based on the browser
<audio> tag - Same reasoning as <video> tag, it is not JavaScript
Animation
These are three places I know making the cream of the crop that can be made with JavaScript.
Mr.Doob's Playground
Spiderman Animation
SmokeScreen Flash to JavaScript
Note well.
Do not talk about Apple Demos ... that is a joke and all marketing. They have only optimized for their browser (Safari)
Also do not talk about what Steve did or did not say. He is a pro at marketing. The other steve (Steve Wozniak) is the engineer.
(1) I highly respect because Mr.Doob really pushed that <canvas> and JS . (2) Was great animation that could be accomplished by a teenager in Flash IDE 5 years ago ... way too much effort to make something so simple. (3) Is really good yet you start with the Flash File ^.^
Lines Of Code
In many cases ActionScript, better yet the Flash IDE make animation a breeze with half the lines of codes (or maybe even simple drag and drop on timelines) than JavaScript. Libraries such as JQuery were brought in to try to shorten the amount of code. Even then in most cases less code/implementation was needed in ActionScript.
Accessibility and Performance
This is in the hands of the developer and has nothing to do with the language. Flash is capable of providing deep linking with SWFAddress (Ajax), page resizing (Stage Scale) and so forth. People constantly talk about performance with Flash, yes this is true but this is poor design on the developer for memory management.
Updates
JavaScript will be limited by the <canvas> and other elements to achieve what Flash can do.How ? If issues started to occur in HTML5, what would you do ? Send in a bug request ? No ... you will wait a next 3-5 years for HTML6 specification.
Suggestion
I suggest looking through Mr.Doob's work, Webby Awards and google the best of Flash Websites. Look at them carefully see if you can bring up case studies. Like this one : Creating marketing platforms with Adobe Flex Website under study : http://www.bombaysapphire.com/
And a word to a wise , one of your favorite websites - YouTube, would not have survived if it was not for Flash :D
Hell you can use javascript to "do" flash!! Check this out! Smokescreen
On a serious note, flash has its own advantages. Like e.g. games and some very specialized apps like audio video editing etc. Maybe javascript and HTML5 is not there yet, but its getting close!
Is JavaScript capable of doing the same what Flash does?
No, definitely not. While both share some capabilities, like animations and interactive interfaces, JavaScript's and Flash's design philosophies differ fundamentally, and in terms of features in those fields, Flash is certainly way, way ahead.
And if it is the case, can it be a good idea to switch from Adobe Flash to JavaScript?
It might, depending on what exactly you are doing in Flash. If you outline that in more detail, you will certainly get more concrete answers.
Here's a response to Apple's recent trumpeting of HTML5 - Jump back in time with HTML5. There's still plenty of reasons to use Flash!
The Apple HTML5 demos (left parts)
only work with Safari (4.7% of all
users on all devices). Some HTML5
features work, others won't work on
other browsers. As a matter of fact,
HTML5 is not really a standard at all.
The Flash TODAY demos (right parts)
show how 97% of all websurfers can
experience Flash the way it is
supposed to be today & tomorrow: fresh
& innovative. By the way, these
Flash-examples are extremely hard or
simply impossible to build with
HTML5
Depends on what functionality you are looking for. While javascript has much evolved recently and many frameworks were introduced it cannot be compared to Flash in terms of creating rich web interfaces. I think though that progressively new concepts will be introduced like HTML5, usage of the GPU and HTML + javascript might one day fill the gap.
Javascript is vast. But it cannot replace Flash.! The biggest Advantage of using flash is hiding the source code.. Which in Javascript is nt applicable always.!
Flash is Used in Animation of Cartoons and 3D web sites etc.. Of course u cannot create a front end competing to Flash..
One good solution would be => If you want ur site to hav good programming properties den go for javascript..
If U want ur site to be good in Front end design den go for Flash!!
Although flash has its scripting language [Actionscript] its not dat much flexible as javascript!!!!
As a Flash and Flex developer it is a little disheartening to see the strides in HTML5. Don't get me wrong I have nothing against progress, for me it is just that currently it is easier to write an app in Flash vs AJAX. I love writing in Flash and Flex and think ActionScript is a really great language. But, it appears the strides made in ActionScript or making their way to JavaScript and that video in HTML 5 may make Flash/Flex a thing of the past.
So when do you think (if ever) that HTML will or is a competitor to Flash/Flex for RIA or will browser incompatibility stop this from ever happening?
The reason I am asking is because I don't know if continuing in Flash/Flex is a good idea career wise if HTML 5 can do more. Just looking for some answers from other developers using the technologies.
There are four things that hold the "modern browser" back from where flash is today.
1) Tools. Animating et al with Flash is obviously much easier to do. Plus JS/SVG don't have the "direct" animation support that Flash does right now. It can be done, but it's manual.
2) Performance. JS/SVG/Canvas can not perform as fast, and certainly not as consistently across browsers, as Flash can. Not every application needs the performance, and JS et al are catching up. But at the moment, they still lag behind in total overall performance.
3) Browser adoption. Ye Olde browser wars. Different implementations, different speeds, legacy browers, etc. All the issues the afflict the portable web are in place for the modern browser technologies. So, it's more work to make a portable artifact, and even then it simply may not work, especially on older browsers.
4) Content protection. Flash is hardly the bastion of content safety in terms of IP control etc, but it's night and day over JS, HTML, SVG, etc. where it's all pretty much free for the taking. This will especially confound things like video which right now is mostly bastioned behind Flash players vs simply streaming mp4s to the client.
We've already seen some of the more clever "Javascript ads" (those annoying, floating animated panels for example). I'm waiting for more of those, just as simply animated mini ad apps vs flash. The primary reason most users who disable Flash do so, is to disable applications. JS mini ads won't have that problem.
However, the primary creator of those ads are the creative folks specifically targeted by Flash. It's easy to use for them without being "real technical". Until you can do that with Javascript and the rest, Flash will have a large market for it.
I think the original poster is asking where do cutting edge open web technologies (draft standards) stand versus Flash/Flex. Ignoring questions of browser support and developer tools, look just at features (as you'll see, I know the web side much better):
Vector Graphics
Flash: Yep.
Web: SVG.
Raster Graphics
Flash: Yep.
Web: Canvas.
Audio
Flash: Yep, with ADPCM, MP3, HE-AAC (MPEG-4 Part 3).
Web: HTML5 audio tag with MP3, Ogg Theora, Ogg Vorbis, WAV.
Video
Flash: Yep, with On2 VP6, Sorenson Spark, Screen video, Screen video 2, H.264. The Windows version of Flash 10.1 has hardware-accelerated H.264 decoding.
Web: HTML video tag with Ogg Theora, H.264.
Animation
Flash: Yep.
Web: Yep, via some Javascript DOM commands and via CSS3 properties for animations, 2D transforms, 3D transforms. Some browsers (e.g. Mobile Safari) hardware accelerate some of properties.
I think the big differences currently (given the caveats mentioned above) are performance and implementing all these features. While Javascript is very good in many ways, the programming experience isn't nearly as integrated as in Flash/Flex's ActionScript (note that many of the animation features that are done in CSS). If you want to learn more about where open web standards are going, check out HTML5 Doctor.
HTML/CSS/Javascript together solve a different problem than Flash does.
HTML and CSS are about the appearance of your page, and are the 'universal' language of the internet. Really it's the only language the browser natively understands. Javascript is natively supported in most browsers, but was a glue language never intended to allow the flexibility of Flash.
Flash/Flex are about creating a portable (albeit proprietary) application framework. However, without HTML, Flash and Flex don't exist.
A developer can never stop learning. If it's not HTML5, it'll be something else. I would continue programming what you love, but start playing with HTML5 and see what it can do. It will expand your horizons and help you to think about things in a new way. But you don't have to give up what you're doing now, especially as HTML5 still isn't ready for the mass market yet.