feat(virtual-background): Desktop share as virtual background

This commit is contained in:
tudordan7 2021-05-24 15:30:45 +03:00 committed by Jaya Allamsetty
parent f5dd848daf
commit 748a84eeef
2 changed files with 36 additions and 3 deletions

View File

@ -220,12 +220,18 @@
} }
.video-background-preview-entry{ .video-background-preview-entry{
margin-left:5px; margin-left: -10px;
height: 250px; height: 250px;
width: 94%; max-width: 95.4%;
margin-bottom: 8px; margin-bottom: 8px;
position: absolute; position: absolute;
z-index: 2; z-index: 2;
@media (min-width: 432px) and (max-width: 632px) {
max-width: 336;
}
@media (max-width: 432px){
max-width: 336;
}
} }
.virtual-background-preview-video{ .virtual-background-preview-video{

View File

@ -74,6 +74,7 @@ import {
VideoQualityDialog VideoQualityDialog
} from '../../../video-quality'; } from '../../../video-quality';
import { VideoBackgroundButton } from '../../../virtual-background'; import { VideoBackgroundButton } from '../../../virtual-background';
import { toggleBackgroundEffect } from '../../../virtual-background/actions';
import { checkBlurSupport } from '../../../virtual-background/functions'; import { checkBlurSupport } from '../../../virtual-background/functions';
import { import {
setFullScreen, setFullScreen,
@ -183,6 +184,11 @@ type Props = {
*/ */
_locked: boolean, _locked: boolean,
/**
* The JitsiLocalTrack to display.
*/
_localVideo: Object,
/** /**
* Whether or not the overflow menu is visible. * Whether or not the overflow menu is visible.
*/ */
@ -223,6 +229,11 @@ type Props = {
*/ */
_shouldShowButton: Function, _shouldShowButton: Function,
/**
* Returns the selected virtual source object.
*/
_virtualSource: Object,
/** /**
* Invoked to active other features of the app. * Invoked to active other features of the app.
*/ */
@ -896,7 +907,21 @@ class Toolbox extends Component<Props> {
* @returns {void} * @returns {void}
*/ */
_onToolbarToggleScreenshare() { _onToolbarToggleScreenshare() {
if (!this.props._desktopSharingEnabled || this.props._backgroundType === 'desktop-share') { if (this.props._backgroundType === 'desktop-share') {
const noneOptions = {
enabled: false,
backgroundType: 'none',
selectedThumbnail: 'none',
backgroundEffectEnabled: false
};
this.props._virtualSource.dispose();
this.props.dispatch(toggleBackgroundEffect(noneOptions, this.props._localVideo));
return;
}
if (!this.props._desktopSharingEnabled) {
return; return;
} }
@ -1377,6 +1402,7 @@ function _mapStateToProps(state) {
_conference: conference, _conference: conference,
_desktopSharingEnabled: desktopSharingEnabled, _desktopSharingEnabled: desktopSharingEnabled,
_backgroundType: state['features/virtual-background'].backgroundType, _backgroundType: state['features/virtual-background'].backgroundType,
_virtualSource: state['features/virtual-background'].virtualSource,
_desktopSharingDisabledTooltipKey: desktopSharingDisabledTooltipKey, _desktopSharingDisabledTooltipKey: desktopSharingDisabledTooltipKey,
_dialog: Boolean(state['features/base/dialog'].component), _dialog: Boolean(state['features/base/dialog'].component),
_feedbackConfigured: Boolean(callStatsID), _feedbackConfigured: Boolean(callStatsID),
@ -1386,6 +1412,7 @@ function _mapStateToProps(state) {
_fullScreen: fullScreen, _fullScreen: fullScreen,
_tileViewEnabled: shouldDisplayTileView(state), _tileViewEnabled: shouldDisplayTileView(state),
_localParticipantID: localParticipant.id, _localParticipantID: localParticipant.id,
_localVideo: localVideo,
_localRecState: localRecordingStates, _localRecState: localRecordingStates,
_locked: locked, _locked: locked,
_overflowMenuVisible: overflowMenuVisible, _overflowMenuVisible: overflowMenuVisible,