Switch local audio and video track when list of available devices changes

JitsiMediaDevices.js

@@ -1,6 +1,7 @@
 var EventEmitter = require("events");
 var RTCEvents = require('./service/RTC/RTCEvents');
 var RTC = require("./modules/RTC/RTC");
+var MediaType = require('./service/RTC/MediaType');
 var JitsiMediaDevicesEvents = require('./JitsiMediaDevicesEvents');
 
 var eventEmitter = new EventEmitter();
@@ -28,7 +29,7 @@ var JitsiMediaDevices = {
     /**
      * Returns true if changing the input (camera / microphone) or output
      * (audio) device is supported and false if not.
-     * @params {string} [deviceType] - type of device to change. Default is
+     * @param {string} [deviceType] - type of device to change. Default is
      *      undefined or 'input', 'output' - for audio output device change.
      * @returns {boolean} true if available, false otherwise.
      */
@@ -36,8 +37,26 @@ var JitsiMediaDevices = {
         return RTC.isDeviceChangeAvailable(deviceType);
     },
     /**
-     * Returns currently used audio output device id, '' stands for default
-     * device
+     * Returns true if user granted permission to media devices.
+     * @param {'audio'|'video'} [type] - type of devices to check,
+     *      undefined stands for both 'audio' and 'video' together
+     * @returns {boolean}
+     */
+    isDevicePermissionGranted: function (type) {
+        var permissions = RTC.getDeviceAvailability();
+
+        switch(type) {
+            case MediaType.VIDEO:
+                return permissions.video === true;
+            case MediaType.AUDIO:
+                return permissions.audio === true;
+            default:
+                return permissions.video === true && permissions.audio === true;
+        }
+    },
+    /**
+     * Returns currently used audio output device id, 'default' stands
+     * for default device
      * @returns {string}
      */
     getAudioOutputDevice: function () {
@@ -46,7 +65,8 @@ var JitsiMediaDevices = {
     /**
      * Sets current audio output device.
      * @param {string} deviceId - id of 'audiooutput' device from
-     *      navigator.mediaDevices.enumerateDevices(), '' is for default device
+     *      navigator.mediaDevices.enumerateDevices(), 'default' is for
+     *      default device
      * @returns {Promise} - resolves when audio output is changed, is rejected
      *      otherwise
      */

doc/API.md

@@ -81,6 +81,7 @@ JitsiMeetJS.setLogLevel(JitsiMeetJS.logLevels.ERROR);
         - groupId - group identifier, two devices have the same group identifier if they belong to the same physical device; for example a monitor with both a built-in camera and microphone
     - ```setAudioOutputDevice(deviceId)``` - sets current audio output device. ```deviceId``` - id of 'audiooutput' device from ```JitsiMeetJS.enumerateDevices()```, '' is for default device.
     - ```getAudioOutputDevice()``` - returns currently used audio output device id, '' stands for default device.
+    - ```isDevicePermissionGranted(type)``` - returns true if user granted permission to media devices. ```type``` - 'audio', 'video' or ```undefined```. In case of ```undefined``` will check if both audio and video permissions were granted.
     - ```addEventListener(event, handler)``` - attaches an event handler.
     - ```removeEventListener(event, handler)``` - removes an event handler.
 
@@ -355,6 +356,10 @@ We have the following methods for controling the tracks:
    
 10. setAudioOutput(audioOutputDeviceId) - sets new audio output device for track's DOM elements. Video tracks are ignored.
 
+11. getDeviceId() - returns device ID associated with track (for local tracks only)
+
+12. isEnded() - returns true if track is ended
+
 
 Getting Started
 ==============

modules/RTC/JitsiLocalTrack.js

@@ -4,6 +4,7 @@ var JitsiTrack = require("./JitsiTrack");
 var RTCBrowserType = require("./RTCBrowserType");
 var JitsiTrackEvents = require('../../JitsiTrackEvents');
 var JitsiTrackErrors = require("../../JitsiTrackErrors");
+var RTCEvents = require("../../service/RTC/RTCEvents");
 var RTCUtils = require("./RTCUtils");
 var VideoType = require('../../service/RTC/VideoType');
 
@@ -20,6 +21,8 @@ var VideoType = require('../../service/RTC/VideoType');
  */
 function JitsiLocalTrack(stream, track, mediaType, videoType, resolution,
                          deviceId) {
+    var self = this;
+
     JitsiTrack.call(this,
         null /* RTC */, stream, track,
         function () {
@@ -33,16 +36,72 @@ function JitsiLocalTrack(stream, track, mediaType, videoType, resolution,
     this.resolution = resolution;
     this.deviceId = deviceId;
     this.startMuted = false;
-    this.disposed = false;
     //FIXME: This dependacy is not necessary.
     this.conference = null;
     this.initialMSID = this.getMSID();
     this.inMuteOrUnmuteProgress = false;
+
+    // Currently there is no way to know the MediaStreamTrack ended due to to
+    // device disconnect in Firefox through e.g. "readyState" property. Instead
+    // we will compare current track's label with device labels from
+    // enumerateDevices() list.
+    this._trackEnded = false;
+
+    // Currently there is no way to determine with what device track was
+    // created (until getConstraints() support), however we can associate tracks
+    // with real devices obtained from enumerateDevices() call as soon as it's
+    // called.
+    this._realDeviceId = this.deviceId === '' ? undefined : this.deviceId;
+
+    this._onDeviceListChanged = function (devices) {
+        self._setRealDeviceIdFromDeviceList(devices);
+
+        // Mark track as ended for those browsers that do not support
+        // "readyState" property. We do not touch tracks created with default
+        // device ID "".
+        if (typeof self.getTrack().readyState === 'undefined'
+            && typeof self._realDeviceId !== 'undefined'
+            && !devices.find(function (d) {
+                return d.deviceId === self._realDeviceId;
+            })) {
+            self._trackEnded = true;
+        }
+    };
+
+
+    RTCUtils.addListener(RTCEvents.DEVICE_LIST_CHANGED,
+        this._onDeviceListChanged);
 }
 
 JitsiLocalTrack.prototype = Object.create(JitsiTrack.prototype);
 JitsiLocalTrack.prototype.constructor = JitsiLocalTrack;
 
+/**
+ * Returns if associated MediaStreamTrack is in the 'ended' state
+ * @returns {boolean}
+ */
+JitsiLocalTrack.prototype.isEnded = function () {
+    return  this.getTrack().readyState === 'ended' || this._trackEnded;
+};
+
+/**
+ * Sets real device ID by comparing track information with device information.
+ * This is temporary solution until getConstraints() method will be implemented
+ * in browsers.
+ * @param {MediaDeviceInfo[]} devices - list of devices obtained from
+ *  enumerateDevices() call
+ */
+JitsiLocalTrack.prototype._setRealDeviceIdFromDeviceList = function (devices) {
+    var track = this.getTrack(),
+        device = devices.find(function (d) {
+            return d.kind === track.kind + 'input' && d.label === track.label;
+        });
+
+    if (device) {
+        this._realDeviceId = device.deviceId;
+    }
+};
+
 /**
  * Mutes the track. Will reject the Promise if there is mute/unmute operation
  * in progress.
@@ -150,9 +209,9 @@ JitsiLocalTrack.prototype._setMute = function (mute, resolve, reject) {
                 resolution: self.resolution
             };
             if (isAudio) {
-                streamOptions['micDeviceId'] = self.deviceId;
+                streamOptions['micDeviceId'] = self.getDeviceId();
             } else if(self.videoType === VideoType.CAMERA) {
-                streamOptions['cameraDeviceId'] = self.deviceId;
+                streamOptions['cameraDeviceId'] = self.getDeviceId();
             }
             RTCUtils.obtainAudioAndVideoPermissions(streamOptions)
                 .then(function (streamsInfo) {
@@ -222,7 +281,11 @@ JitsiLocalTrack.prototype.dispose = function () {
         RTCUtils.stopMediaStream(this.stream);
         this.detach();
     }
-    this.disposed = true;
+
+    JitsiTrack.prototype.dispose.call(this);
+
+    RTCUtils.removeListener(RTCEvents.DEVICE_LIST_CHANGED,
+        this._onDeviceListChanged);
 
     return promise;
 };
@@ -302,4 +365,12 @@ JitsiLocalTrack.prototype.isLocal = function () {
     return true;
 };
 
+/**
+ * Returns device id associated with track.
+ * @returns {string}
+ */
+JitsiLocalTrack.prototype.getDeviceId = function () {
+    return this._realDeviceId || this.deviceId;
+};
+
 module.exports = JitsiLocalTrack;

modules/RTC/JitsiRemoteTrack.js

@@ -14,7 +14,7 @@ var JitsiTrackEvents = require("../../JitsiTrackEvents");
  * @constructor
  */
 function JitsiRemoteTrack(RTC, ownerJid, stream, track, mediaType, videoType,
-                          ssrc, muted) {    
+                          ssrc, muted) {
     JitsiTrack.call(
         this, RTC, stream, track, function () {}, mediaType, videoType, ssrc);
     this.rtc = RTC;
@@ -84,6 +84,4 @@ JitsiRemoteTrack.prototype._setVideoType = function (type) {
     this.eventEmitter.emit(JitsiTrackEvents.TRACK_VIDEOTYPE_CHANGED, type);
 };
 
-delete JitsiRemoteTrack.prototype.dispose;
-
 module.exports = JitsiRemoteTrack;

modules/RTC/JitsiTrack.js

@@ -70,6 +70,8 @@ function JitsiTrack(rtc, stream, track, streamInactiveHandler, trackMediaType,
     this.type = trackMediaType;
     this.track = track;
     this.videoType = videoType;
+    this.disposed = false;
+
     if(stream) {
         if (RTCBrowserType.isFirefox()) {
             implementOnEndedHandling(this);
@@ -77,7 +79,12 @@ function JitsiTrack(rtc, stream, track, streamInactiveHandler, trackMediaType,
         addMediaStreamInactiveHandler(stream, streamInactiveHandler);
     }
 
-    RTCUtils.addListener(RTCEvents.AUDIO_OUTPUT_DEVICE_CHANGED, this.setAudioOutput.bind(this));
+    this._onAudioOutputDeviceChanged = this.setAudioOutput.bind(this);
+
+    if (this.isAudioTrack()) {
+        RTCUtils.addListener(RTCEvents.AUDIO_OUTPUT_DEVICE_CHANGED,
+            this._onAudioOutputDeviceChanged);
+    }
 }
 
 /**
@@ -218,9 +225,12 @@ JitsiTrack.prototype.detach = function (container) {
 
 /**
  * Dispose sending the media track. And removes it from the HTML.
- * NOTE: Works for local tracks only.
  */
 JitsiTrack.prototype.dispose = function () {
+    RTCUtils.removeListener(RTCEvents.AUDIO_OUTPUT_DEVICE_CHANGED,
+        this._onAudioOutputDeviceChanged);
+
+    this.disposed = true;
 };
 
 /**

modules/RTC/RTC.js

@@ -277,7 +277,11 @@ RTC.prototype.createRemoteTrack = function (event) {
  * @returns {JitsiRemoteTrack|null}
  */
 RTC.prototype.removeRemoteTracks = function (resource) {
-    if(this.remoteTracks[resource]) {
+    var remoteTracks = this.remoteTracks[resource];
+
+    if(remoteTracks) {
+        remoteTracks['audio'] && remoteTracks['audio'].dispose();
+        remoteTracks['video'] && remoteTracks['video'].dispose();
         delete this.remoteTracks[resource];
     }
 };

modules/RTC/RTCUtils.js

@@ -22,11 +22,13 @@ var eventEmitter = new EventEmitter();
 var AVAILABLE_DEVICES_POLL_INTERVAL_TIME = 3000; // ms
 
 var devices = {
-    audio: true,
-    video: true
+    audio: false,
+    video: false
 };
 
-var audioOuputDeviceId = ''; // default device
+// Currently audio output device change is supported only in Chrome and
+// default output always has 'default' device ID
+var audioOutputDeviceId = 'default'; // default device
 
 var featureDetectionAudioEl = document.createElement('audio');
 var isAudioOutputDeviceChangeAvailable =
@@ -34,6 +36,21 @@ var isAudioOutputDeviceChangeAvailable =
 
 var currentlyAvailableMediaDevices = [];
 
+var rawEnumerateDevicesWithCallback = navigator.mediaDevices
+    && navigator.mediaDevices.enumerateDevices
+        ? function(callback) {
+            navigator.mediaDevices.enumerateDevices().then(callback, function () {
+                callback([]);
+            });
+        }
+        : (MediaStreamTrack && MediaStreamTrack.getSources)
+            ? function (callback) {
+                MediaStreamTrack.getSources(function (sources) {
+                    callback(sources.map(convertMediaStreamTrackSource));
+                });
+            }
+            : undefined;
+
 // TODO: currently no browser supports 'devicechange' event even in nightly
 // builds so no feature/browser detection is used at all. However in future this
 // should be changed to some expression. Progress on 'devicechange' event
@@ -262,14 +279,20 @@ function compareAvailableMediaDevices(newDevices) {
  * will be supported by browsers.
  */
 function pollForAvailableMediaDevices() {
-    RTCUtils.enumerateDevices(function (devices) {
-        if (compareAvailableMediaDevices(devices)) {
-            onMediaDevicesListChanged(devices);
-        }
+    // Here we use plain navigator.mediaDevices.enumerateDevices instead of
+    // wrapped because we just need to know the fact the devices changed, labels
+    // do not matter. This fixes situation when we have no devices initially,
+    // and then plug in a new one.
+    if (rawEnumerateDevicesWithCallback) {
+        rawEnumerateDevicesWithCallback(function (devices) {
+            if (compareAvailableMediaDevices(devices)) {
+                onMediaDevicesListChanged(devices);
+            }
 
-        window.setTimeout(pollForAvailableMediaDevices,
-            AVAILABLE_DEVICES_POLL_INTERVAL_TIME);
-    });
+            window.setTimeout(pollForAvailableMediaDevices,
+                AVAILABLE_DEVICES_POLL_INTERVAL_TIME);
+        });
+    }
 }
 
 /**
@@ -278,9 +301,35 @@ function pollForAvailableMediaDevices() {
  * @emits RTCEvents.DEVICE_LIST_CHANGED
  */
 function onMediaDevicesListChanged(devices) {
-    currentlyAvailableMediaDevices = devices;
+    currentlyAvailableMediaDevices = devices.slice(0);
+    logger.info('list of media devices has changed:', currentlyAvailableMediaDevices);
+
+    var videoInputDevices = currentlyAvailableMediaDevices.filter(function (d) {
+            return d.kind === 'videoinput';
+        }),
+        audioInputDevices = currentlyAvailableMediaDevices.filter(function (d) {
+            return d.kind === 'audioinput';
+        }),
+        videoInputDevicesWithEmptyLabels = videoInputDevices.filter(
+            function (d) {
+                return d.label === '';
+            }),
+        audioInputDevicesWithEmptyLabels = audioInputDevices.filter(
+            function (d) {
+                return d.label === '';
+            });
+
+    if (videoInputDevices.length &&
+        videoInputDevices.length === videoInputDevicesWithEmptyLabels.length) {
+        setAvailableDevices(['video'], false);
+    }
+
+    if (audioInputDevices.length &&
+        audioInputDevices.length === audioInputDevicesWithEmptyLabels.length) {
+        setAvailableDevices(['audio'], false);
+    }
+
     eventEmitter.emit(RTCEvents.DEVICE_LIST_CHANGED, devices);
-    logger.info('list of media devices has changed:', devices);
 }
 
 // In case of IE we continue from 'onReady' callback
@@ -340,22 +389,6 @@ function wrapGetUserMedia(getUserMedia) {
   };
 }
 
-/**
- * Create stub device which equals to auto selected device.
- * @param {string} kind if that should be `audio` or `video` device
- * @returns {Object} stub device description in `enumerateDevices` format
- */
-function createAutoDeviceInfo(kind) {
-    return {
-        facing: null,
-        label: 'Auto',
-        kind: kind,
-        deviceId: '',
-        groupId: ''
-    };
-}
-
-
 /**
  * Execute function after getUserMedia was executed at least once.
  * @param {Function} callback function to execute after getUserMedia
@@ -379,24 +412,10 @@ function wrapEnumerateDevices(enumerateDevices) {
         // enumerate devices only after initial getUserMedia
         afterUserMediaInitialized(function () {
 
-            enumerateDevices().then(function (devices) {
-                //add auto devices
-                devices.unshift(
-                    createAutoDeviceInfo('audioinput'),
-                    createAutoDeviceInfo('videoinput'),
-                    createAutoDeviceInfo('audiooutput')
-                );
-
-                callback(devices);
-            }, function (err) {
+            enumerateDevices().then(callback, function (err) {
                 console.error('cannot enumerate devices: ', err);
 
-                // return only auto devices
-                callback([
-                    createAutoDeviceInfo('audioinput'),
-                    createAutoDeviceInfo('videoinput'),
-                    createAutoDeviceInfo('audiooutput')
-                ]);
+                callback([]);
             });
         });
     };
@@ -409,32 +428,31 @@ function wrapEnumerateDevices(enumerateDevices) {
  */
 function enumerateDevicesThroughMediaStreamTrack (callback) {
     MediaStreamTrack.getSources(function (sources) {
-        var devices = sources.map(function (source) {
-            var kind = (source.kind || '').toLowerCase();
-            return {
-                facing: source.facing || null,
-                label: source.label,
-                // theoretically deprecated MediaStreamTrack.getSources should
-                // not return 'audiooutput' devices but let's handle it in any
-                // case
-                kind: kind
-                    ? (kind === 'audiooutput' ? kind : kind + 'input')
-                    : null,
-                deviceId: source.id,
-                groupId: source.groupId || null
-            };
-        });
-
-        //add auto devices
-        devices.unshift(
-            createAutoDeviceInfo('audioinput'),
-            createAutoDeviceInfo('videoinput'),
-            createAutoDeviceInfo('audiooutput')
-        );
-        callback(devices);
+        callback(sources.map(convertMediaStreamTrackSource));
     });
 }
 
+/**
+ * Converts MediaStreamTrack Source to enumerateDevices format.
+ * @param {Object} source
+ */
+function convertMediaStreamTrackSource(source) {
+    var kind = (source.kind || '').toLowerCase();
+
+    return {
+        facing: source.facing || null,
+        label: source.label,
+        // theoretically deprecated MediaStreamTrack.getSources should
+        // not return 'audiooutput' devices but let's handle it in any
+        // case
+        kind: kind
+            ? (kind === 'audiooutput' ? kind : kind + 'input')
+            : null,
+        deviceId: source.id,
+        groupId: source.groupId || null
+    };
+}
+
 function obtainDevices(options) {
     if(!options.devices || options.devices.length === 0) {
         return options.successCallback(options.streams || {});
@@ -975,7 +993,8 @@ var RTCUtils = {
     /**
      * Sets current audio output device.
      * @param {string} deviceId - id of 'audiooutput' device from
-     *      navigator.mediaDevices.enumerateDevices(), '' for default device
+     *      navigator.mediaDevices.enumerateDevices(), 'default' for default
+     *      device
      * @returns {Promise} - resolves when audio output is changed, is rejected
      *      otherwise
      */
@@ -987,7 +1006,7 @@ var RTCUtils = {
 
         return featureDetectionAudioEl.setSinkId(deviceId)
             .then(function() {
-                audioOuputDeviceId = deviceId;
+                audioOutputDeviceId = deviceId;
 
                 logger.log('Audio output device set to ' + deviceId);
 
@@ -1001,7 +1020,7 @@ var RTCUtils = {
      * @returns {string}
      */
     getAudioOutputDevice: function () {
-        return audioOuputDeviceId;
+        return audioOutputDeviceId;
     }
 };