Allow call and broadcast PiP at the same time (#9829)
This commit is contained in:
parent
d2763c329d
commit
c257e137aa
6 changed files with 79 additions and 33 deletions
|
@ -47,7 +47,7 @@ interface IChildrenOptions {
|
|||
|
||||
interface IProps {
|
||||
className?: string;
|
||||
children: CreatePipChildren;
|
||||
children: Array<CreatePipChildren>;
|
||||
draggable: boolean;
|
||||
onDoubleClick?: () => void;
|
||||
onMove?: () => void;
|
||||
|
@ -208,6 +208,13 @@ export default class PictureInPictureDragger extends React.Component<IProps> {
|
|||
transform: `translateX(${this.translationX}px) translateY(${this.translationY}px)`,
|
||||
};
|
||||
|
||||
const children = this.props.children.map((create: CreatePipChildren) => {
|
||||
return create({
|
||||
onStartMoving: this.onStartMoving,
|
||||
onResize: this.onResize,
|
||||
});
|
||||
});
|
||||
|
||||
return (
|
||||
<aside
|
||||
className={this.props.className}
|
||||
|
@ -215,10 +222,7 @@ export default class PictureInPictureDragger extends React.Component<IProps> {
|
|||
ref={this.callViewWrapper}
|
||||
onDoubleClick={this.props.onDoubleClick}
|
||||
>
|
||||
{this.props.children({
|
||||
onStartMoving: this.onStartMoving,
|
||||
onResize: this.onResize,
|
||||
})}
|
||||
{children}
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -373,24 +373,20 @@ class PipView extends React.Component<IProps, IState> {
|
|||
|
||||
public render() {
|
||||
const pipMode = true;
|
||||
let pipContent: CreatePipChildren | null = null;
|
||||
|
||||
if (this.props.voiceBroadcastPlayback) {
|
||||
pipContent = this.createVoiceBroadcastPlaybackPipContent(this.props.voiceBroadcastPlayback);
|
||||
}
|
||||
|
||||
if (this.props.voiceBroadcastPreRecording) {
|
||||
pipContent = this.createVoiceBroadcastPreRecordingPipContent(this.props.voiceBroadcastPreRecording);
|
||||
}
|
||||
let pipContent: Array<CreatePipChildren> = [];
|
||||
|
||||
if (this.props.voiceBroadcastRecording) {
|
||||
pipContent = this.createVoiceBroadcastRecordingPipContent(this.props.voiceBroadcastRecording);
|
||||
pipContent = [this.createVoiceBroadcastRecordingPipContent(this.props.voiceBroadcastRecording)];
|
||||
} else if (this.props.voiceBroadcastPreRecording) {
|
||||
pipContent = [this.createVoiceBroadcastPreRecordingPipContent(this.props.voiceBroadcastPreRecording)];
|
||||
} else if (this.props.voiceBroadcastPlayback) {
|
||||
pipContent = [this.createVoiceBroadcastPlaybackPipContent(this.props.voiceBroadcastPlayback)];
|
||||
}
|
||||
|
||||
if (this.state.primaryCall) {
|
||||
// get a ref to call inside the current scope
|
||||
const call = this.state.primaryCall;
|
||||
pipContent = ({ onStartMoving, onResize }) => (
|
||||
pipContent.push(({ onStartMoving, onResize }) => (
|
||||
<LegacyCallView
|
||||
onMouseDownOnHeader={onStartMoving}
|
||||
call={call}
|
||||
|
@ -398,7 +394,7 @@ class PipView extends React.Component<IProps, IState> {
|
|||
pipMode={pipMode}
|
||||
onResize={onResize}
|
||||
/>
|
||||
);
|
||||
));
|
||||
}
|
||||
|
||||
if (this.state.showWidgetInPip) {
|
||||
|
@ -412,7 +408,7 @@ class PipView extends React.Component<IProps, IState> {
|
|||
const viewingCallRoom = this.state.viewedRoomId === roomId;
|
||||
const isCall = CallStore.instance.getActiveCall(roomId) !== null;
|
||||
|
||||
pipContent = ({ onStartMoving }) => (
|
||||
pipContent.push(({ onStartMoving }) => (
|
||||
<div className={pipViewClasses}>
|
||||
<LegacyCallViewHeader
|
||||
onPipMouseDown={(event) => {
|
||||
|
@ -432,10 +428,10 @@ class PipView extends React.Component<IProps, IState> {
|
|||
movePersistedElement={this.movePersistedElement}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
));
|
||||
}
|
||||
|
||||
if (!!pipContent) {
|
||||
if (pipContent.length) {
|
||||
return (
|
||||
<PictureInPictureDragger
|
||||
className="mx_LegacyCallPreview"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue