haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(screenSharing): Add support for audio screen sharing on electron

This commit is contained in:
Andrei Gavrilescu 2020-04-02 16:18:10 +03:00 committed by GitHub
parent 08be68cda4
commit 9d6a93119b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 93 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lang/main.json
View File

@ -244,6 +244,7 @@
"reservationError": "Reservation system error",
"reservationErrorMsg": "Error code: {{code}}, message: {{msg}}",
"retry": "Retry",
"screenSharingAudio": "Share audio",
"screenSharingFailedToInstall": "Oops! Your screen sharing extension failed to install.",
"screenSharingFailedToInstallTitle": "Screen sharing extension failed to install",
"screenSharingFirefoxPermissionDeniedError": "Something went wrong while we were trying to share your screen. Please make sure that you have given us permission to do so. ",

4
package-lock.json generated
View File

@ -10883,8 +10883,8 @@
}
},
"lib-jitsi-meet": {
"version": "github:jitsi/lib-jitsi-meet#4a2abb179672aebecf9d780f796fcca531bb2398",
"from": "github:jitsi/lib-jitsi-meet#4a2abb179672aebecf9d780f796fcca531bb2398",
"version": "github:jitsi/lib-jitsi-meet#960eea3c5087ce07e9135fad70268c7d338e0de5",
"from": "github:jitsi/lib-jitsi-meet#960eea3c5087ce07e9135fad70268c7d338e0de5",
"requires": {
"@jitsi/sdp-interop": "0.1.14",
"@jitsi/sdp-simulcast": "0.2.2",

2
package.json
View File

@ -56,7 +56,7 @@
"js-utils": "github:jitsi/js-utils#0b2cef90613a74777fefd98d4ee3eda3879809ab",
"jsrsasign": "8.0.12",
"jwt-decode": "2.2.0",
"lib-jitsi-meet": "github:jitsi/lib-jitsi-meet#4a2abb179672aebecf9d780f796fcca531bb2398",
"lib-jitsi-meet": "github:jitsi/lib-jitsi-meet#960eea3c5087ce07e9135fad70268c7d338e0de5",
"libflacjs": "github:mmig/libflac.js#93d37e7f811f01cf7d8b6a603e38bd3c3810907d",
"lodash": "4.17.13",
"moment": "2.19.4",

39
react/features/desktop-picker/components/DesktopPicker.js
View File

@ -74,6 +74,11 @@ type Props = {
*/
type State = {
/**
* The state of the audio screen share checkbox.
*/
screenShareAudio: boolean,
/**
* The currently higlighted DesktopCapturerSource.
*/
@ -128,6 +133,7 @@ class DesktopPicker extends PureComponent<Props, State> {
_poller = null;
state = {
screenShareAudio: false,
selectedSource: {},
selectedTab: 0,
sources: {},
@ -153,6 +159,7 @@ class DesktopPicker extends PureComponent<Props, State> {
// Bind event handlers so they are only bound once per instance.
this._onCloseModal = this._onCloseModal.bind(this);
this._onPreviewClick = this._onPreviewClick.bind(this);
this._onShareAudioChecked = this._onShareAudioChecked.bind(this);
this._onSubmit = this._onSubmit.bind(this);
this._onTabSelected = this._onTabSelected.bind(this);
this._updateSources = this._updateSources.bind(this);
@ -241,7 +248,7 @@ class DesktopPicker extends PureComponent<Props, State> {
return selectedSource;
}
_onCloseModal: (?string, string) => void;
_onCloseModal: (?string, string, ?boolean) => void;
/**
* Dispatches an action to hide the DesktopPicker and invokes the passed in
@ -251,10 +258,12 @@ class DesktopPicker extends PureComponent<Props, State> {
* the onSourceChoose callback.
* @param {string} type - The type of the DesktopCapturerSource to pass into
* the onSourceChoose callback.
* @param {boolean} screenShareAudio - Whether or not to add system audio to
* screen sharing session.
* @returns {void}
*/
_onCloseModal(id = '', type) {
this.props.onSourceChoose(id, type);
_onCloseModal(id = '', type, screenShareAudio = false) {
this.props.onSourceChoose(id, type, screenShareAudio);
this.props.dispatch(hideDialog());
}
@ -285,9 +294,9 @@ class DesktopPicker extends PureComponent<Props, State> {
* @returns {void}
*/
_onSubmit() {
const { id, type } = this.state.selectedSource;
const { selectedSource: { id, type }, screenShareAudio } = this.state;
this._onCloseModal(id, type);
this._onCloseModal(id, type, screenShareAudio);
}
_onTabSelected: () => void;
@ -306,12 +315,29 @@ class DesktopPicker extends PureComponent<Props, State> {
const { types, sources } = this.state;
this._selectedTabType = types[tabIndex];
// When we change tabs also reset the screenShareAudio state so we don't
// use the option from one tab when sharing from another.
this.setState({
screenShareAudio: false,
selectedSource: this._getSelectedSource(sources),
selectedTab: tabIndex
});
}
_onShareAudioChecked: (boolean) => void;
/**
* Set the screenSharingAudio state indicating whether or not to also share
* system audio.
*
* @param {boolean} checked - Share audio or not.
* @returns {void}
*/
_onShareAudioChecked(checked) {
this.setState({ screenShareAudio: checked });
}
/**
* Configures and renders the tabs for display.
*
@ -328,7 +354,8 @@ class DesktopPicker extends PureComponent<Props, State> {
content: <DesktopPickerPane
key = { type }
onClick = { this._onPreviewClick }
onDoubleClick = { this._onCloseModal }
onDoubleClick = { this._onSubmit }
onShareAudioChecked = { this._onShareAudioChecked }
selectedSourceId = { selectedSource.id }
sources = { sources[type] }
type = { type } />,

59
react/features/desktop-picker/components/DesktopPickerPane.js
View File

@ -1,8 +1,12 @@
/* @flow */
import { Checkbox } from '@atlaskit/checkbox';
import Spinner from '@atlaskit/spinner';
import React, { Component } from 'react';
import { Platform } from '../../base/react';
import { translate } from '../../base/i18n';
import DesktopSourcePreview from './DesktopSourcePreview';
/**
@ -20,6 +24,11 @@ type Props = {
*/
onDoubleClick: Function,
/**
* The handler to be invoked if the users checks the audio screen sharing checkbox.
*/
onShareAudioChecked: Function,
/**
* The id of the DesktopCapturerSource that is currently selected.
*/
@ -33,7 +42,12 @@ type Props = {
/**
* The source type of the DesktopCapturerSources to display.
*/
type: string
type: string,
/**
* Used to obtain translations.
*/
t: Function
};
/**
@ -42,6 +56,31 @@ type Props = {
* @extends Component
*/
class DesktopPickerPane extends Component<Props> {
/**
* Initializes a new DesktopPickerPane instance.
*
* @param {Object} props - The read-only properties with which the new
* instance is to be initialized.
*/
constructor(props: Props) {
super(props);
this._onShareAudioCheck = this._onShareAudioCheck.bind(this);
}
_onShareAudioCheck: (Object) => void;
/**
* Function to be called when the Checkbox is used.
*
* @param {boolean} checked - Checkbox status (checked or not).
* @returns {void}
*/
_onShareAudioCheck({ target: { checked } }) {
this.props.onShareAudioChecked(checked);
}
/**
* Implements React's {@link Component#render()}.
*
@ -54,7 +93,8 @@ class DesktopPickerPane extends Component<Props> {
onDoubleClick,
selectedSourceId,
sources,
type
type,
t
} = this.props;
const classNames
@ -77,12 +117,25 @@ class DesktopPickerPane extends Component<Props> {
</div>
);
let checkBox;
// Only display the share audio checkbox if we're on windows and on
// desktop sharing tab.
// App window and Mac OS screen sharing doesn't work with system audio.
if (type === 'screen' && Platform.OS === 'windows') {
checkBox = (<Checkbox
label = { t('dialog.screenSharingAudio') }
name = 'share-system-audio'
onChange = { this._onShareAudioCheck } />);
}
return (
<div className = { classNames }>
{ previews }
{ checkBox }
</div>
);
}
}
export default DesktopPickerPane;
export default translate(DesktopPickerPane);