diff --git a/src/CallMediaHandler.js b/src/CallMediaHandler.js index cdc5c61921..2330f86b99 100644 --- a/src/CallMediaHandler.js +++ b/src/CallMediaHandler.js @@ -22,34 +22,44 @@ export default { // Only needed for Electron atm, though should work in modern browsers // once permission has been granted to the webapp return navigator.mediaDevices.enumerateDevices().then(function(devices) { - const audioIn = []; - const videoIn = []; + const audiooutput = []; + const audioinput = []; + const videoinput = []; if (devices.some((device) => !device.label)) return false; devices.forEach((device) => { switch (device.kind) { - case 'audioinput': audioIn.push(device); break; - case 'videoinput': videoIn.push(device); break; + case 'audiooutput': audiooutput.push(device); break; + case 'audioinput': audioinput.push(device); break; + case 'videoinput': videoinput.push(device); break; } }); // console.log("Loaded WebRTC Devices", mediaDevices); return { - audioinput: audioIn, - videoinput: videoIn, + audiooutput, + audioinput, + videoinput, }; }, (error) => { console.log('Unable to refresh WebRTC Devices: ', error); }); }, loadDevices: function() { + const audioOutDeviceId = SettingsStore.getValue("webrtc_audiooutput"); const audioDeviceId = SettingsStore.getValue("webrtc_audioinput"); const videoDeviceId = SettingsStore.getValue("webrtc_videoinput"); + Matrix.setMatrixCallAudioOutput(audioOutDeviceId); Matrix.setMatrixCallAudioInput(audioDeviceId); Matrix.setMatrixCallVideoInput(videoDeviceId); }, + setAudioOutput: function(deviceId) { + SettingsStore.setValue("webrtc_audiooutput", null, SettingLevel.DEVICE, deviceId); + Matrix.setMatrixCallAudioOutput(deviceId); + }, + setAudioInput: function(deviceId) { SettingsStore.setValue("webrtc_audioinput", null, SettingLevel.DEVICE, deviceId); Matrix.setMatrixCallAudioInput(deviceId); diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js index c8ce79905d..0561071fce 100644 --- a/src/components/structures/UserSettings.js +++ b/src/components/structures/UserSettings.js @@ -292,6 +292,7 @@ module.exports = React.createClass({ if (this._unmounted) return; this.setState({ mediaDevices, + activeAudioOutput: SettingsStore.getValueAt(SettingLevel.DEVICE, 'webrtc_audiooutput'), activeAudioInput: SettingsStore.getValueAt(SettingLevel.DEVICE, 'webrtc_audioinput'), activeVideoInput: SettingsStore.getValueAt(SettingLevel.DEVICE, 'webrtc_videoinput'), }); @@ -970,6 +971,11 @@ module.exports = React.createClass({ return devices.map((device) => { device.label }); }, + _setAudioOutput: function(deviceId) { + this.setState({activeAudioOutput: deviceId}); + CallMediaHandler.setAudioOutput(deviceId); + }, + _setAudioInput: function(deviceId) { this.setState({activeAudioInput: deviceId}); CallMediaHandler.setAudioInput(deviceId); @@ -1010,6 +1016,7 @@ module.exports = React.createClass({ const Dropdown = sdk.getComponent('elements.Dropdown'); + let speakerDropdown =
{ _t('No Audio Outputs detected') }
; let microphoneDropdown ={ _t('No Microphones detected') }
; let webcamDropdown ={ _t('No Webcams detected') }
; @@ -1018,6 +1025,26 @@ module.exports = React.createClass({ label: _t('Default Device'), }; + const audioOutputs = this.state.mediaDevices.audiooutput.slice(0); + if (audioOutputs.length > 0) { + let defaultOutput = ''; + if (!audioOutputs.some((input) => input.deviceId === 'default')) { + audioOutputs.unshift(defaultOption); + } else { + defaultOutput = 'default'; + } + + speakerDropdown =