I'm trying to detect whenever the default/selected microphone changes or gets disconnected in a web app using plain Javascript. The idea is to let the user know if the correct microphone is selected and working or not.
The best option I've found is MediaDevices.ondevicechange. But it seems to be behind the Experimental Web Platform features flag in Google Chrome:
It is behind the Experimental Web Platform features flag, and use call it with navigator.mediaDevices.ondevicechange = ...
Another answer on this topic echoes the same thing:
Browser Support It looks like it's pretty patchy as of writing this. See this related question: Audio devices plugin and plugout event on chrome browser for further discussion, but the short story is for Chrome you'll need to enable the "Experimental Web Platform features" flag.
My question is two-fold:
Is my understanding actually correct that I cannot use MediaDevices.ondevicechange on Chrome without the experimental features flag? (I cannot use this flag because of some other constraints).
Is there another way for me to detect an audio device change?
Related
In working to make a HTML5 browser game, I can't help but consider the fact that a game like that can't be competitive or valued based on the ease of editing the code of the game through dev console.
For example like this:
https://www.youtube.com/watch?v=lQaTW3vCqC0
The user changes around values of variables and then resumes the scripts causing the game to be directly effected.
I'm thinking of possible ways to avoid such manipulations:
Custom Browser (setup like Tor? custom routing used to detect unhampered browser with no console tools avialable)
detection if dev tools are open Find out whether Chrome console is open , How to detect Chrome Inspect Element is running or not? (but this is only Chrome, what about IE, FF, SF, O?
Any insight or additional thoughts would be great.
Being that JavaScript is a client side language, you'll be hard pressed to provide total security from having it manipulated.
I happen to be working on some changes to a proof-of-concept app I already have in the Chrome Web Store that are indeed awesome: the chrome.app.window.create() option that allows developers to bake Aura/Ash transparency into their windows (right now, there's actually a static image set as the app's background). Since the app is only really meant for Chrome OS users anyway, the fact that it depends on Ash to function is really no problem on my part.
However, there's a stumbling block. Thank God it doesn't actually require the experimental permission, as that would ban an update to the app from entering the CWS, but still, the only way the window will truly be transparent is with the Experimental APIs flag enabled. So, is it possible to check if the Experimental Extension APIs are enabled to fall back on the app's packed wallpaper in case they aren't?
This API is still being developed, and has not completely gone through our API approval process, so it might change. That's why it is listed as experimental :) You shouldn't ship an app relying on this API in its current state as it will likely break.
Having said that, part of the plan is to allow you to detect, via the API, whether the feature is available. This is so your app will be able to work on platforms like Windows XP that won't support transparency.
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 want to create a simple visualization tool that would allow to represent my playing a midi keyboard on the screen. I play a relatively novel instrument type, called the harmonic table:
http://en.wikipedia.org/wiki/Harmonic_table_note_layout
http://www.soundonsound.com/newspix/image/axis49.jpg
And want to build tools to ease their use and to teach others how to use them.
However, I can't find a good way to get get midi into javascript environment (or, for that matter, Flash, or Java without a large helping of jiggery-pokery slightly beyond my reach, and the use of code from what look to be rather stale and abandoned open source projects. Neither language I am too enthused to work in for this project in any case).
Is there a suitable library or application that I have missed, that will enable me to do this?
While searching around for another solution (Flash based, using the functions of the Red5 Open source flash server - really ugly, but I'm desperate at this point) I found someone who had done exactly what I needed using Java to interface with the hardware. They had started with a flash solution and recently ported to Javascript. Yay!
http://www.abumarkub.net/abublog/?p=505
Don't let the caveats about 'proof of concept' discourage you: the basic functionality appears solid, at least with everything I have been able to throw at it.
So now I'm on my way, and so is anyone else who want to build javascript based midi interfaces/synths/what have you.
I can manipulate real-time midi in javascript! This is much better than flying cars and jetboots.
I have made a NPAPI browser plugin that lets you communicate in Javascript with MIDI devices.
Currently it works on OSX in Chrome and Safari, and on Windows in Chrome.
I am working on support for other browsers (Firefox, Internet Explorer) and other operating systems (Linux, Android, iOs)
See: http://abumarkub.net/abublog/?p=754
EDIT:
I recently published this module https://github.com/hems/midi2funk it's a node.js module that listens to midi and broadcast it through socket.io so if you have the luxury of running a node.js service locally together with your client side you might get some fun out of it...
~~~~~
A few others handy links, i kinda ordered in what i think would be most important for you:
midibridge.js - A Javascript API for interacting with MIDI devices
midi.js sequencing in javascript
jasmid - A Javascript MIDI file reader and synthesiser
Second web midi api working draft published - 11/12/2012
Jazz Soft - MIDI IN / OUT PLUGIN FOR BROWSER
edit: just realised the thread is old, hopefully the links will help someone ( :
The Web MIDI API is now real in Google Chrome 43+. I even wrote a library to make it easier to work with it. If you are still interested and do not care that it currently only works in Chrome, check it out: https://github.com/cotejp/webmidi
Nowadays browsers supports MIDI listening. All you need is
navigator.requestMIDIAccess().then(requestMIDIAccessSuccess, requestMIDIAccessFailure);
and listen keys
function requestMIDIAccessSuccess(midi) {
var inputs = midi.inputs.values();
for (var input = inputs.next(); input && !input.done; input = inputs.next()) {
console.log('midi input', input);
input.value.onmidimessage = midiOnMIDImessage;
}
midi.onstatechange = midiOnStateChange;
}
See working example here
Most browsers don't allow access to any hardware except the keyboard and mouse - for obvious security reasons, so it's unlikely that you could access a midi device unless it's plugged in as one of those devices.
You could try finding a driver that would translate midi output to key presses, and then deal with those in the browser, but this would be a single-computer solution only.
I am really excited by the upcoming Web MIDI API. As far as I know, its only under discussion and hasn't made it into any browsers yet.
Combined with the Web Audio API which has started to be implemented in some browsers already, it will be possible to have complete software synthesis in the browser. Exciting times.
Since Web MIDI API is still a draft, there is no way of direct access to MIDI events in the browser.
A simple workaround could be to write a small server where you register MIDI events and communicate them to your javascript using a websocket. This could be done quite easily in Python.
I'm interested in writing javascript that will programmatically perform a screen capture of what is viewed in the browser, and save the file to the hard disk. I'd like to be able to type in a list of keywords, and use a search engine's api to programmatically view the page, and take a screen capture.
My first question is, does this sounds like something that would violate the terms of my browser, Firefox, or any or all search engine api's? All of my web development experience is Internet Explorer. I'm aware of the various free and open source applications available, but am not familiar with their licenses.
Is this something that could be done using javascript? I've noticed that there are screen capture add-ons available to install. Is it possible to execute an add-on programmaticaly through javascript?
Is their a Firefox / Mozilla equivalent to an ActiveX control?
Any information would be greatly appreciated.
Thanks
You can use flash/Active X to do it. Check out Kpoint.in, It records the entire desktop from within the browser(Works only for Windows though). I think they are using their own Firefox extension for the Audio.