[whatwg] Microphone Device API

Sebastian Herrlinger sebastian at formzoo.com
Thu Feb 17 15:37:56 PST 2011

I would love to see some action on the device spec.

The only way to really access a device and do anything with it and its data
would be JS,
so I question the device element completely (but providing an alternative)
as in:
I add a video to the page with a "video" element and a "src",
so the video is loaded from the given source and rendered to the screen.
Then I add a device to the page and tell it to be a webcam. Now what?
This is not ment to be markup,
which gets more obvious when we start talking about the file system or a usb
Why would I add a usb device to the page?

My suggestion:
//JS only handling
var device = new Device();

//As the microphone and a webcam would be one of the most used cases I
concentrate on that
var codec = new AudioCodec("whatever");
var microphone = device.getMicrophone(codec);
/* ! Now a dialog is displayed which asks the user to allow access to the
decision can be remembered for this site ! */

//if the user does not allow access or the device is just not availible
getMicrophone() returns null
  //Now we can do with the device whatever we want, like:
  audioElement.src = microphone.url;

  //Or send to server (or Peer!) for recording, replication or whatever:

  microphone.addEventListener(DeviceEvent.STATE, function(state){
    if(state == Microphone.MUTE){
      alert("mic muted");
    } elseif(state == Microphone.STOP){
      alert("no access to mic anymore");
    } else {
      //Other state

  microphone.addEventListener(DeviceEvent.ERROR, function(error){

  //Or (executed before anything else):
  microphone.addEventListener(DeviceEvent.INPUT, function(stream){

} else {
  alert("You need a microphone to use our service");

This could be similar to Video, here my short approach on any other device:

var deviceList = Device.getList();
//could return a list with descriptive objects

foreach(k in deviceList){

var device = Device.getFromList(0); //First device from list
//Ask user for access to device, otherwise null


  device.addEventListener(DeviceEvent.INPUT, function(stream){
    //Depends on what device was selected

  /* Send something to the device to leverage functionality,
  like start scanning, connect to bluetooth device, let a joystick vibrate
  or tell a cellphone to send its contacts */
} else {
  alert("no access to device");

Depending on the level of access this would mean full access to almost any
which could end up in writing drivers for devices,
but if it would be too restrictive the specification will have to provide
standard interfaces for most common devices.
But if the user allows access to the device, he should trust the site.

Just a quick suggestion :)
Happy to discuss!



(All code is not ment to be actual code, but pseudo code)

More information about the whatwg mailing list