AudioPeers and Fixes

app/src/components/PeerAudio/AudioPeers.js

@@ -3,11 +3,13 @@ import { connect } from 'react-redux';
 import { micConsumerSelector } from '../Selectors';
 import PropTypes from 'prop-types';
 import PeerAudio from './PeerAudio';
+import settings from '../../reducers/settings';
 
 const AudioPeers = (props) =>
 {
 	const {
-		micConsumers
+		micConsumers,
+		audioOutputDevice
 	} = props;
 
 	return (
@@ -19,6 +21,7 @@ const AudioPeers = (props) =>
 						<PeerAudio
 							key={micConsumer.id}
 							audioTrack={micConsumer.track}
+							audioOutputDevice={audioOutputDevice}			
 						/>
 					);
 				})
@@ -34,7 +37,8 @@ AudioPeers.propTypes =
 
 const mapStateToProps = (state) =>
 	({
-		micConsumers : micConsumerSelector(state)
+		micConsumers : micConsumerSelector(state),
+		audioOutputDevice : settings.selectedAudioOutputDevice
 	});
 
 const AudioPeersContainer = connect(

app/src/components/PeerAudio/PeerAudio.js

@@ -10,6 +10,7 @@ export default class PeerAudio extends React.PureComponent
 		// Latest received audio track.
 		// @type {MediaStreamTrack}
 		this._audioTrack = null;
+		this._audioOutputDevice = null;
 	}
 
 	render()
@@ -24,9 +25,10 @@ export default class PeerAudio extends React.PureComponent
 
 	componentDidMount()
 	{
-		const { audioTrack } = this.props;
+		const { audioTrack, audioOutputDevice } = this.props;
 
 		this._setTrack(audioTrack);
+		this._setOutputDevice(audioOutputDevice);
 	}
 
 	// eslint-disable-next-line camelcase
@@ -60,6 +62,20 @@ export default class PeerAudio extends React.PureComponent
 			audio.srcObject = null;
 		}
 	}
+
+	_setOutputDevice(audioOutputDevice){
+		if(this._audioOutputDevice === audioOutputDevice)
+			return;
+		
+		this._audioOutputDevice = audioOutputDevice;
+
+		const { audio } = this.refs;
+
+		if (audioOutputDevice && typeof audio.setSinkId === 'function')
+		{
+			audio.setSinkId(audioOutputDevice);
+		}
+	}
 }
 
 PeerAudio.propTypes =