attempt to make media selector work everywhere (TM)

loadDevices not only in electron

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2017-05-25 01:01:40 +01:00
parent a4b2bacc7e
commit 09d0ab7df5
3 changed files with 40 additions and 18 deletions

View file

@ -26,6 +26,8 @@ export default {
const audioIn = {};
const videoIn = {};
if (devices.some((device) => !device.label)) return false;
devices.forEach((device) => {
switch (device.kind) {
case 'audioinput': audioIn[device.deviceId] = device.label; break;

View file

@ -72,9 +72,7 @@ export default React.createClass({
// RoomView.getScrollState()
this._scrollStateMap = {};
// Only run these in electron, at least until a better mechanism for perms exists
// https://w3c.github.io/permissions/#dom-permissionname-device-info
if (window && window.process && window.process.type) CallMediaHandler.loadDevices();
CallMediaHandler.loadDevices();
document.addEventListener('keydown', this._onKeyDown);
},

View file

@ -178,17 +178,7 @@ module.exports = React.createClass({
});
}
q().then(() => {
return CallMediaHandler.getDevices();
}).then((mediaDevices) => {
console.log("got mediaDevices", mediaDevices, this._unmounted);
if (this._unmounted) return;
this.setState({
mediaDevices,
activeAudioInput: this._localSettings['webrtc_audioinput'] || 'default',
activeVideoInput: this._localSettings['webrtc_videoinput'] || 'default',
});
});
this._refreshMediaDevices();
// Bulk rejecting invites:
// /sync won't have had time to return when UserSettings re-renders from state changes, so getRooms()
@ -210,8 +200,6 @@ module.exports = React.createClass({
this._syncedSettings = syncedSettings;
this._localSettings = UserSettingsStore.getLocalSettings();
this._setAudioInput = this._setAudioInput.bind(this);
this._setVideoInput = this._setVideoInput.bind(this);
},
componentDidMount: function() {
@ -233,6 +221,20 @@ module.exports = React.createClass({
}
},
_refreshMediaDevices: function() {
q().then(() => {
return CallMediaHandler.getDevices();
}).then((mediaDevices) => {
// console.log("got mediaDevices", mediaDevices, this._unmounted);
if (this._unmounted) return;
this.setState({
mediaDevices,
activeAudioInput: this._localSettings['webrtc_audioinput'] || 'default',
activeVideoInput: this._localSettings['webrtc_videoinput'] || 'default',
});
});
},
_refreshFromServer: function() {
const self = this;
q.all([
@ -818,9 +820,29 @@ module.exports = React.createClass({
CallMediaHandler.setVideoInput(deviceId);
},
_requestMediaPermissions: function() {
console.log("Request media perms");
const getUserMedia = (
window.navigator.getUserMedia || window.navigator.webkitGetUserMedia || window.navigator.mozGetUserMedia
);
if (getUserMedia) {
return getUserMedia.apply(window.navigator, [
{ video: true, audio: true },
this._refreshMediaDevices,
function() {},
]);
}
},
_renderWebRtcSettings: function() {
if (!(window && window.process && window.process.type)
|| !this.state.mediaDevices) return;
if (this.state.mediaDevices === false) {
return <div>
<h3>WebRTC</h3>
<div className="mx_UserSettings_section">
<h5 onClick={this._requestMediaPermissions}>Missing Media Permissions, click to request.</h5>
</div>
</div>;
} else if (!this.state.mediaDevices) return;
const Dropdown = sdk.getComponent('elements.Dropdown');