Only handle autoplay when DOMEx is NotAlllowedError

Add check to prevent re-handling autoplay multiple times for cams

Screenshare viewer element muted by default
This commit is contained in:
prlanzarin 2019-08-05 17:28:36 +00:00
parent 9942dd0aa2
commit 01b53728f8
4 changed files with 31 additions and 20 deletions

View File

@ -73,13 +73,16 @@ export default class KurentoAudioBridge extends BaseAudioBridge {
.then(() => {
resolve(this.callback({ status: this.baseCallStates.started }));
})
.catch((e) => {
.catch((error) => {
// NotAllowedError equals autoplay issues, fire autoplay handling event
if (error.name === 'NotAllowedError') {
const tagFailedEvent = new CustomEvent('audioPlayFailed', { detail: { mediaElement: audioTag } });
window.dispatchEvent(tagFailedEvent);
}
logger.warn({
logCode: 'sfuaudiobridge_play_error',
extraInfo: { error: e },
}, 'Could not play audio tag, emit mediaTagPlayFailed event');
logCode: 'sfuaudiobridge_play_maybe_error',
extraInfo: { error },
}, `Listen only media play failed due to ${error.name}`);
resolve(this.callback({
status: this.baseCallStates.autoplayBlocked,
}));
@ -104,7 +107,7 @@ export default class KurentoAudioBridge extends BaseAudioBridge {
logger.error({
logCode: 'sfuaudiobridge_listen_only_error_reconnect',
extraInfo: { error },
}, `Listen only failed for an ongoing session, try to reconnect`);
}, 'Listen only failed for an ongoing session, try to reconnect');
window.kurentoExitAudio();
this.callback({ status: this.baseCallStates.reconnecting });
this.reconnectOngoing = true;

View File

@ -40,17 +40,20 @@ export default class KurentoScreenshareBridge {
if (webRtcPeer) {
const screenshareTag = document.getElementById(SCREENSHARE_VIDEO_TAG);
const stream = webRtcPeer.getRemoteStream();
screenshareTag.muted = true;
screenshareTag.pause();
screenshareTag.srcObject = stream;
screenshareTag.muted = false;
screenshareTag.play().catch((e) => {
screenshareTag.play().catch((error) => {
// NotAllowedError equals autoplay issues, fire autoplay handling event
if (error.name === 'NotAllowedError') {
const tagFailedEvent = new CustomEvent('screensharePlayFailed',
{ detail: { mediaElement: screenshareTag } });
window.dispatchEvent(tagFailedEvent);
}
logger.warn({
logCode: 'sfuscreenshareview_play_error',
extraInfo: { error: e },
}, 'Could not play screenshare viewer media tag, emit screensharePlayFailed');
logCode: 'sfuscreenshareview_play_maybe_error',
extraInfo: { error },
}, `Screenshare viewer media play failed due to ${error.name}`);
});
}
};

View File

@ -88,6 +88,7 @@ class VideoList extends Component {
this.setOptimalGrid = this.setOptimalGrid.bind(this);
this.handleAllowAutoplay = this.handleAllowAutoplay.bind(this);
this.handlePlayElementFailed = this.handlePlayElementFailed.bind(this);
this.autoplayWasHandled = false;
}
componentDidMount() {
@ -144,6 +145,7 @@ class VideoList extends Component {
handleAllowAutoplay() {
const { autoplayBlocked } = this.state;
this.autoplayWasHandled = true;
window.removeEventListener('videoPlayFailed', this.handlePlayElementFailed);
while (this.failedMediaElements.length) {
const mediaElement = this.failedMediaElements.shift();
@ -162,7 +164,7 @@ class VideoList extends Component {
e.stopPropagation();
this.failedMediaElements.push(mediaElement);
if (!autoplayBlocked) {
if (!autoplayBlocked && !this.autoplayWasHandled) {
this.setState({ autoplayBlocked: true });
}
}

View File

@ -65,12 +65,15 @@ class VideoListItem extends Component {
const playElement = (elem) => {
if (elem.paused) {
elem.play().catch((error) => {
// NotAllowedError equals autoplay issues, fire autoplay handling event
if (error.name === 'NotAllowedError') {
const tagFailedEvent = new CustomEvent('videoPlayFailed', { detail: { mediaTag: elem } });
window.dispatchEvent(tagFailedEvent);
}
logger.warn({
logCode: 'videolistitem_component_play_error',
logCode: 'videolistitem_component_play_maybe_error',
extraInfo: { error },
}, 'Could not play video tag, emit mediaTagPlayFailed event');
}, `Could not play video tag due to ${error.name}`);
});
}
};