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:
parent
a4b2bacc7e
commit
09d0ab7df5
3 changed files with 40 additions and 18 deletions
|
@ -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;
|
||||
|
|
|
@ -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);
|
||||
},
|
||||
|
|
|
@ -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');
|
||||
|
||||
|
|
Loading…
Reference in a new issue