Re: Settings retrieval/application API Proposal (formerly: constraint modification API v3)

Hi Travis,

Thank you for drafting this proposal. I think it covers the functionality that we have previously discussed and greatly enhances the 'tip of the iceberg' of capabilites control that I had only alluded to in my own original proposal [*1].

I want to comment briefly on some things I thought we could optimise regarding the overall API structure here as it seems we have both been working on APIs with almost identical scope but slightly different wiring.

How would you feel about the following:

1. Rather than isolating devices from tracks could we allow .videoTracks and .audioTracks to return any of the following objects (depending on what any particular media stream track object is actually representing):

- a MediaStreamTrack (a generic interface for general purpose stream track behaviour). Identical to the interface currently defined in the getUserMedia specification (minus the 'kind' attribute). Not ever directly exposed via MediaStream.videoTracks or MediaStream.audioTracks.
- a VideoStreamTrack (an interface that implements the existing MediaStreamTrack interface + takePicture/onpicture). Used to represent non-camera video stream tracks (or read-only camera stream tracks such as those obtained from a remote peer) in MediaStream.videoTracks.
- a VideoDeviceTrack (an interface that implements both VideoStreamTrack interface above and your proposed VideoInfo dictionary from below). Used to represent (local) camera video stream tracks in MediaStream.videoTracks.
- an AudioStreamTrack (an interface that implements the existing MediaStreamTrack interface). Used to represent non-microphone audio streams (or read-only microphone stream tracks such as those obtained from a remote peer) in MediaStream.audioTracks.
- an AudioDeviceTrack (an interface that implements both the AudioStreamTrack interface above and your proposed AudioInfo dictionary from below). Used to represent (local) microphone streams in MediaStream.audioTracks.
- Other tracks as required (e.g. DataTracks)

2. Allow developers to utilise duck typing (or object type checking if they wish) to check for, and set, capabilities against an object provided in either MediaStream.videoTracks or MediaStream.audioTracks. If an object supports certain properties then it can be assumed to be able to apply those settings to the object it is representing (i.e. if it looks like a duck and it acts like a duck then treat it like a duck).

What we end up with is really similar to what you propose but we can use fewer interfaces than you introduced below :) 

Here is a rewrite of one of your examples (applying resolution constraints) based only on the two principles described above.

function gotMedia(localStream) {

  for(var i = 0; i < localStream.videoTracks.length; i++) {
    var s = localStream.videoTracks[i];

    // If s looks like a VideoDeviceTrack and it acts like a 
    // VideoDeviceTrack then it's a VideoDeviceTrack :)
    if(s.maxWidth >= 1920 && s.maxHeight >= 1080) {
      // See if I need to change the current settings...
      if (s.width != 1920 && s.height != 1080) {
        s.width = 1920;
        s.height = 1080;
        if (s.width != 1920 && s.height != 1080)
          console.error("Device doesn't support at least 1080p");
      }
    }
  }
}

Here's the example for taking a picture also re-written based on the above:

function gotMedia(localStream) {
  // If a video track looks like it can take a picture, then it
  // can take a picture :)
  if(localStream.videoTracks[0].takePicture) {
    localStream.videoTracks[0].onpicture = showPicture;
    // attempt to set flash
    // or let it fail silently if flash is not supported or
    // flash cannot be changed
    localStream.videoTracks[0].flashMode = 'on';
    localStream.videoTracks[0].takePicture();
  }
}

function showPicture(e) {
  var ctx = document.querySelector("canvas").getContext("2d");
  // e.data is the ImageData property of the PictureEvent interface.
  ctx.canvas.width = e.data.width;
  ctx.canvas.height = e.data.height;
  ctx.putImageData(e.data);
  // TODO: can get this picture as an encoded Blob via:
  // ctx.canvas.toBlob(callbackFunction, "image/jpeg");
}

I think I will leave the rewriting of e.g. the zoom example included below as an exercise for the reader at this point (Spoiler alert: all the examples below are supported equally well in either approach).

What I guess the upshot here is is that I am suggesting that we don't hide these object capabilities behind changeSettings and getSettings API methods. Although we discussed recently that a smaller surface area could be an I prove meant the main reasons why we probably don't want to have those kinds of constructs is perhaps best described here: http://robert.ocallahan.org/2012/05/canvas-getcontext-mistake.html

Hope this helps and thanks again for putting such a detailed proposal like this together.

- Rich

[*1] http://lists.w3.org/Archives/Public/public-media-capture/2012Aug/0032.html

On Aug 27, 2012, at 11:46 PM, Travis Leithead <travis.leithead@microsoft.com> wrote:

> Based on the latest round of feedback on the prior proposal [1], I've further adjusted the constraint modification proposal. High-level changes are:
> 
> 1. LocalMediaStream allows more direct access to device settings (now optimizing around the 1-video/1-audio track per gUM request)
> 2. Track objects isolated from device objects for clarity and separation of APIs
> 3. Specific settings proposed
> 4. Usage examples provided
> 
> 
> As mentioned in the previous proposal [1], the LocalMediaStream's changeable audio/videoTracks collections as currently derived from MediaStream make it challenging to keep track of the tracks that are supplied by a local device over time. In the prior proposal, I factored the local-device-supplying tracks into separate track lists for isolation. In this proposal, I take a slightly more aggressive approach to modifying the definition of a LocalMediaStream which further diverges it from its current definition, but which (I believe) aligns it more closely with the devices that are supplying its tracks. This approach was largely borrowed from Adam's comments [2].
> 
> Despite these changes to the structure of LocalMediaStream, I still want it to behave semantically similar to MediaStream when used with URL.createObjectURL or when assigned to a video/audio element using a TBD property (see example #2 at the end of the proposal). To continue to have it work for this purpose, a new interface: AbstractMediaStream is introduced:
> 
> // +++New base class--this is what createObjectURL and other 
> // APIs now accept to be inclusive of LocalMediaStreams as well 
> // as other MediaStreams
> interface AbstractMediaStream {
>   readonly attribute DOMString label;
>   readonly attribute boolean ended;
>   attribute EventHandler onended;
> };
> 
> // +++MediaStream now derives from the base class, adding 
> // mutable track lists and an onstarted event (since these 
> // objects have go from no tracks->one-or-more tracks)
> [Constructor (optional (MediaStream? or MediaStreamTrackList or MediaStreamTrack[]) trackContainers)]
> interface MediaStream : AbstractMediaStream {
>   readonly attribute MediaStreamTrackList audioTracks;
>   readonly attribute MediaStreamTrackList videoTracks; 
>   //+++ added for symmetry and for mutable track lists.
>   attribute EventHandler onstarted;
> };
> 
> // +++Modified to include device-specific interfaces
> interface LocalMediaStream : AbstractMediaStream {
>   readonly attribute VideoDevice? videoDevice;
>   readonly attribute AudioDevice? audioDevice;
>   void stop();
> };
> 
> A LocalMediaStream now has an active (or null) videoDevice, audioDevice or both, depending on what was requested from getUserMedia.
> 
> All Video/AudioDevice objects link to their associated track:
> 
> // +++Settings for all device types
> interface MediaDevice {
>   // +++ the track object that this device is producing
>   readonly attribute MediaStreamTrack track;
> };
> 
> And have a 'local' stop API and associated state (to stop just one of the devices):
> 
> interface MediaDevice : EventListener {
>   readonly attribute MediaStreamTrack track;
>   // +++ stop only this device:
>   void stop();
>   // +++ get the on/off state of the device
>   readonly attribute boolean ended;
> };
> 
> All devices support being able to inspect and change their settings. Application of settings is asynchronous, but inspection of settings can be synchronous (for convenience). The specific settings returned depend on whether the caller is a VideoDevice instance or an AudioDevice instance. Events related to the changing of settings are provided as well.
> 
> interface MediaDevice : EventListener {
>   readonly attribute MediaStreamTrack track;
>   void stop();
>   readonly attribute boolean ended;
> 
>   // +++ get device settings
>   (VideoInfo or AudioInfo) getSettings();
> 
>   //+++ settings application
>   void changeSettings(MediaTrackConstraints settings);
> 
>   //+++ Async results notification from settings application
>   attribute EventHandler onsettingschanged;
>   attribute EventHandler onsettingserror;
> };
> 
> Video devices, in particular, have the ability to [possibly] switch into "photo mode" to capture still images. The following are specific to VideoDevice objects and extend the API that Rich proposed. Since "photo mode" is often a distinct set of settings from regular video mode in a camera, there are separate settings and application of those settings just for taking pictures.
> 
> //+++ New: audio Device interface (basically just a MediaDevice)
> interface AudioDevice : MediaDevice {
> };
> 
> //+++ New: video device
> interface VideoDevice : MediaDevice {
>   //+++ Getting settings (possibly different from the video stream) for pictures from this device
>   PictureInfo getPictureSettings();
> 
>   //+++ Taking snapshots
>   void takePicture(optional PictureInfo pictureSettings);
> 
>   //+++ Picture results
>   attribute EventHandler onpicture;
> };
> 
> The proposed initial set of settings are below. The proposed settings are a combination of features proposed by Rich based on his customer's requests, as well as a set of functionality already supported by Microsoft WinRT Camera API [3] (based on our own research and common cameras used in PCs).
> 
> In the proposed view of the settings, where the setting is in a range (not an enum), there are no "isSupported" values. The expectation is that if one of these values that is exposed as a range is not supported, then the value is assigned a default value (e.g., 0), and the min and max range values are set to that same value. This is the same thing as saying that the feature is supported, but that the value cannot be changed (which is basically saying that the feature is unavailable).
> 
> //+++Video device settings
> dictionary PictureInfo : MediaTrackConstraintSet {
>   // Resolution:
>   unsigned long width;
>   unsigned long minWidth;
>   unsigned long maxWidth;
>   unsigned long height;
>   unsigned long minHeight;
>   unsigned long maxHeight;
>   // Aspect Ratio:
>   float horizontalAspectRatio;
>   float minHorizontalAspectRatio;
>   float maxHorizontalAspectRatio;
>   float verticalAspectRatio;
>   float minVerticalAspectRatio;
>   float maxVerticalAspectRatio;
>   // Rotation:
>   float rotation;
>   float minRotation; // if not supported, then min == max == current rotation value
>   float maxRotation;
>   // Zoom:
>   unsigned long zoom;  // if not supported, then min == max == current rotation value
>   unsigned long minZoom; // e.g., lens supports 55 (mm) - 250 (mm) zoom
>   unsigned long maxZoom;
>   // Exposure:
>   unsigned long exposure;
>   unsigned long minExposure;
>   unsigned long maxExposure;
>   // Direction:
>   VideoFacingEnum facing;
>   // Focus:
>   VideoFocusModeEnum focusMode;
>   // Flash:
>   VideoFlashModeEnum flashMode;
> };
> 
> //+++ Additional settings for video (extends picture)
> dictionary VideoInfo : PictureInfo {
>   // FPS:
>   float framesPerSecond;
>   float minFramesPerSecond;
>   float maxFramesPerSecond;
> };
> 
> //+++Audio device settings
> dictionary AudioInfo : MediaTrackConstraintSet {
>   // Levels
>   unsigned long level;
>   unsigned long minLevel;
>   unsigned long maxLevel;
>   // Tone (bass/treble)
>   float bassTone;
>   float minBassTone;
>   float maxBassTone;
>   float trebleTone;
>   float minTrebleTone;
>   float maxTrebleTone;
> };
> 
> The related enums are defined as:
> 
> enum VideoFacingEnum = { "unknown", "user", "environment" };
> enum VideoFocusModeEnum = { "nofocus", "fixed", "auto", "continuous", "edof", "infinity", "macro" };
> enum VideoFlashModeEnum = { "noflash", "auto", "off", "on", "red-eye", "torch" };
> 
> The new Event types that support the "settingschanged" and "settingserror" events, as well as the "picture" event are defined below:
> 
> //+++ New event for "settingschanged/settingserror"
> [Constructor(DOMString type, optional EventInit eventInitDict)]
> interface MediaSettingsEvent : Event {
>   sequence<DOMString> getRelatedSettings(); // Returns an array of setting names that apply to this event.   
> };
> 
> //+++ New event for getting the picture results from 'takePicture' (returns raw bytes/non-encoded)
> [Constructor(DOMString type, optional PictureEventInit eventInitDict)]
> interface PictureEvent : Event {
>   readonly attribute ImageData data; // See Canvas spec for definition of ImageData
> };
> 
> dictionary PictureEventInit : EventInit {
>   ImageData data;
> };
> 
> ////////////////////
> 
> Some examples follow that illustrate how these changes will impact coding patterns:
> 
> 1. Getting access to a video and/or audio device (if available) -- scenario is unchanged:
> 
> navigator.getUserMedia({audio: true, video: true}, gotMedia, failedToGetMedia);
> 
> function gotMedia(localStream) {
> }
> 
> 2. Previewing the local video/audio in HTML5 video tag -- scenario is unchanged:
> 
> function gotMedia(localStream) {
>   // objectURL technique
>   document.querySelector("video").src = URL.createObjectURL(localStream, { autoRevoke: true });
>   // direct-assign technique
>   document.querySelector("video").streamSrc = localStream; // "streamSrc" is hypothetical and TBD at this time
> }
> 
> 3. Applying resolution constraints
> 
> function gotMedia(localStream) {
>   var settings = localStream.videoDevice.getSettings();
>   // Check for 1080p+ support
>   if ((settings.maxWidth >= 1920) && (settings.maxHeight >= 1080)) {
>      // See if I need to change the current settings...
>      if ((settings.width != 1920) && (settings.height != 1080)) {
>         settings.width = 1920;
>         settings.height = 1080;
>         localStream.videoDevice.onsettingserror = failureToComply;
>         localStream.videoDevice.changeSettings(settings);
>      }
>   }
>   else
>      failureToComply();
> }
> 
> function failureToComply(e) {
>   if (e)
>      console.error("Device failed to change " + e.getRelatedSettings());
>   else
>      console.error("Device doesn't support at least 1080p");
> }
> 
> 4. Changing zoom in response to user input:
> 
> function gotMedia(localStream) {
>   setupRange( localStream.videoDevice );
> }
> 
> function setupRange(videoDevice) {
>   var cameraSettings = videoDevice.getSettings();
>   // Set HTML5 range control to min/max values of zoom
>   var zoomControl = document.querySelector("input[type=range]");
>   zoomControl.min = cameraSettings.minZoom;
>   zoomControl.max = cameraSettings.maxZoom;
>   zoomControl.device = videoDevice; // Store the device ref for later
>   zoomControl.onchange = applySettingChanges;
> }
> 
> function applySettingChanges(e) {
>   e.target.device.changeSettings({ zoom: e.target.value });
> }
> 
> 5. Adding the local media tracks into a new media stream
> 
> function gotMedia(localStream) {
>   return new MediaStream( [ localStream.videoDevice.track, localStream.audioDevice.track ]);
> }
> 
> 6. Take a picture, show the picture in a canvas.
> 
> function gotMedia(localStream) {
>   localStream.videoDevice.onpicture = showPicture;
>   // Turn on flash only for the snapshot...if available
>   var picSettings = localStream.videoDevice.getPictureSettings();
>   if (picSettings.flashMode != "noflash")
>      localStream.videoDevice.takePicture({ flashMode: "on"});
>   else {
>      console.info("Flash not available");
>      localStream.videoDevice.takePicture();
>   }
> }
> 
> function showPicture(e) {
>   var ctx = document.querySelector("canvas").getContext("2d");
>   // e.data is the ImageData property of the PictureEvent interface.
>   ctx.canvas.width = e.data.width;
>   ctx.canvas.height = e.data.height;
>   ctx.putImageData(e.data);
>   // TODO: can get this picture as an encoded Blob via:
>   // ctx.canvas.toBlob(callbackFunction, "image/jpeg");
> }
> 
> [1] http://lists.w3.org/Archives/Public/public-media-capture/2012Aug/0066.html
> [2] http://lists.w3.org/Archives/Public/public-media-capture/2012Aug/0095.html
> [3] http://msdn.microsoft.com/en-us/library/windows/apps/windows.media.devices.videodevicecontroller.aspx
> 
>

Received on Monday, 27 August 2012 23:48:14 UTC