From d0b95b7d3da5d6d44ab069d9f78c4673fb477b1e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 1 Sep 2021 18:03:15 +0200 Subject: [PATCH 1/5] Don't use a callback in setScreensharingEnabled() MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/voip/CallView.tsx | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/views/voip/CallView.tsx b/src/components/views/voip/CallView.tsx index 9d82291286..cec67499ae 100644 --- a/src/components/views/voip/CallView.tsx +++ b/src/components/views/voip/CallView.tsx @@ -273,14 +273,14 @@ export default class CallView extends React.Component { }; private onScreenshareClick = async (): Promise => { - const isScreensharing = await this.props.call.setScreensharingEnabled( - !this.state.screensharing, - async (): Promise => { - const { finished } = Modal.createDialog(DesktopCapturerSourcePicker); - const [source] = await finished; - return source; - }, - ); + let isScreensharing; + if (this.state.screensharing) { + isScreensharing = await this.props.call.setScreensharingEnabled(false); + } else { + const { finished } = Modal.createDialog(DesktopCapturerSourcePicker); + const [source] = await finished; + isScreensharing = await this.props.call.setScreensharingEnabled(true, source); + } this.setState({ sidebarShown: true, From 4777da4da77053111606f8c3aa17a67c272b7a60 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 1 Sep 2021 18:15:02 +0200 Subject: [PATCH 2/5] Don't declare DesktopCapturerSource since we have a definition in the js-sdk MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- .../views/elements/DesktopCapturerSourcePicker.tsx | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/components/views/elements/DesktopCapturerSourcePicker.tsx b/src/components/views/elements/DesktopCapturerSourcePicker.tsx index 1f00353aeb..f650244aea 100644 --- a/src/components/views/elements/DesktopCapturerSourcePicker.tsx +++ b/src/components/views/elements/DesktopCapturerSourcePicker.tsx @@ -24,12 +24,6 @@ import { getDesktopCapturerSources } from "matrix-js-sdk/src/webrtc/call"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import TabbedView, { Tab, TabLocation } from '../../structures/TabbedView'; -export interface DesktopCapturerSource { - id: string; - name: string; - thumbnailURL; -} - export enum Tabs { Screens = "screen", Windows = "window", From 7ae9f3d1ae2d53d47eb13cfbd399205b5c87fc39 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 1 Sep 2021 18:17:52 +0200 Subject: [PATCH 3/5] Remove Element-specifc screen-sharing code out of the js-sdk MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/@types/global.d.ts | 15 +++++++++++++++ .../elements/DesktopCapturerSourcePicker.tsx | 15 ++++++++++++++- 2 files changed, 29 insertions(+), 1 deletion(-) diff --git a/src/@types/global.d.ts b/src/@types/global.d.ts index 9d6bc2c6fb..cc6985eb66 100644 --- a/src/@types/global.d.ts +++ b/src/@types/global.d.ts @@ -49,6 +49,7 @@ import PerformanceMonitor from "../performance"; import UIStore from "../stores/UIStore"; import { SetupEncryptionStore } from "../stores/SetupEncryptionStore"; import { RoomScrollStateStore } from "../stores/RoomScrollStateStore"; +import { DesktopCapturerSource } from "matrix-js-sdk/src/webrtc/call"; /* eslint-disable @typescript-eslint/naming-convention */ @@ -93,6 +94,20 @@ declare global { mxSetupEncryptionStore?: SetupEncryptionStore; mxRoomScrollStateStore?: RoomScrollStateStore; mxOnRecaptchaLoaded?: () => void; + electron?: Electron; + } + + interface GetSourcesOptions { + types: Array; + thumbnailSize?: { + height: number; + width: number; + }; + fetchWindowIcons?: boolean; + } + + interface Electron { + getDesktopCapturerSources(options: GetSourcesOptions): Promise>; } interface Document { diff --git a/src/components/views/elements/DesktopCapturerSourcePicker.tsx b/src/components/views/elements/DesktopCapturerSourcePicker.tsx index f650244aea..3886b824a2 100644 --- a/src/components/views/elements/DesktopCapturerSourcePicker.tsx +++ b/src/components/views/elements/DesktopCapturerSourcePicker.tsx @@ -20,10 +20,23 @@ import BaseDialog from "..//dialogs/BaseDialog"; import DialogButtons from "./DialogButtons"; import classNames from 'classnames'; import AccessibleButton from './AccessibleButton'; -import { getDesktopCapturerSources } from "matrix-js-sdk/src/webrtc/call"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import TabbedView, { Tab, TabLocation } from '../../structures/TabbedView'; +export function getDesktopCapturerSources(): Promise> { + const options: GetSourcesOptions = { + thumbnailSize: { + height: 176, + width: 312, + }, + types: [ + "screen", + "window", + ], + }; + return window.electron.getDesktopCapturerSources(options); +} + export enum Tabs { Screens = "screen", Windows = "window", From 5ed4f3f54fd8cb241edb7e10a8aa52eb4cbbdd14 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 1 Sep 2021 18:22:07 +0200 Subject: [PATCH 4/5] Move DesktopCapturerSource out of global.d.ts MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/elements/DesktopCapturerSourcePicker.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/views/elements/DesktopCapturerSourcePicker.tsx b/src/components/views/elements/DesktopCapturerSourcePicker.tsx index 3886b824a2..f014f0e3b8 100644 --- a/src/components/views/elements/DesktopCapturerSourcePicker.tsx +++ b/src/components/views/elements/DesktopCapturerSourcePicker.tsx @@ -22,6 +22,7 @@ import classNames from 'classnames'; import AccessibleButton from './AccessibleButton'; import { replaceableComponent } from "../../../utils/replaceableComponent"; import TabbedView, { Tab, TabLocation } from '../../structures/TabbedView'; +import { DesktopCapturerSource } from "matrix-js-sdk/src/webrtc/call"; export function getDesktopCapturerSources(): Promise> { const options: GetSourcesOptions = { From 2f1ee610d9d7a8ca7ce6f7e3a4cd3a4d8d4759b9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Thu, 2 Sep 2021 14:10:28 +0200 Subject: [PATCH 5/5] Use source id directly MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/@types/global.d.ts | 7 ++++++- .../views/elements/DesktopCapturerSourcePicker.tsx | 5 ++--- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/src/@types/global.d.ts b/src/@types/global.d.ts index cc6985eb66..8ad93fa960 100644 --- a/src/@types/global.d.ts +++ b/src/@types/global.d.ts @@ -49,7 +49,6 @@ import PerformanceMonitor from "../performance"; import UIStore from "../stores/UIStore"; import { SetupEncryptionStore } from "../stores/SetupEncryptionStore"; import { RoomScrollStateStore } from "../stores/RoomScrollStateStore"; -import { DesktopCapturerSource } from "matrix-js-sdk/src/webrtc/call"; /* eslint-disable @typescript-eslint/naming-convention */ @@ -97,6 +96,12 @@ declare global { electron?: Electron; } + interface DesktopCapturerSource { + id: string; + name: string; + thumbnailURL: string; + } + interface GetSourcesOptions { types: Array; thumbnailSize?: { diff --git a/src/components/views/elements/DesktopCapturerSourcePicker.tsx b/src/components/views/elements/DesktopCapturerSourcePicker.tsx index f014f0e3b8..034fc3d49c 100644 --- a/src/components/views/elements/DesktopCapturerSourcePicker.tsx +++ b/src/components/views/elements/DesktopCapturerSourcePicker.tsx @@ -22,7 +22,6 @@ import classNames from 'classnames'; import AccessibleButton from './AccessibleButton'; import { replaceableComponent } from "../../../utils/replaceableComponent"; import TabbedView, { Tab, TabLocation } from '../../structures/TabbedView'; -import { DesktopCapturerSource } from "matrix-js-sdk/src/webrtc/call"; export function getDesktopCapturerSources(): Promise> { const options: GetSourcesOptions = { @@ -86,7 +85,7 @@ export interface PickerIState { selectedSource: DesktopCapturerSource | null; } export interface PickerIProps { - onFinished(source: DesktopCapturerSource): void; + onFinished(sourceId: string): void; } @replaceableComponent("views.elements.DesktopCapturerSourcePicker") @@ -131,7 +130,7 @@ export default class DesktopCapturerSourcePicker extends React.Component< }; private onShare = (): void => { - this.props.onFinished(this.state.selectedSource); + this.props.onFinished(this.state.selectedSource.id); }; private onTabChange = (): void => {