nikrozman/element-web
1
0
Fork 0
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Update UI for two calls in the PiP view

Browse Source 
and also merge hold_ui changes
This commit is contained in:
David Baker
2020-12-07 17:56:36 +00:00
parent ab71547c4c 747d743bd0
commit 8a58c9dea0
3 changed files with 56 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/views/voip/CallView.tsx
View File

@@ -463,7 +463,7 @@ export default class CallView extends React.Component<IProps, IState> {
{callControls}
</div>;
} else {
const avatarSize = this.props.pipMode ? 75 : 200;
const avatarSize = this.props.pipMode ? 76 : 160;
const classes = classNames({
mx_CallView_voice: true,
mx_CallView_voice_hold: isOnHold,
@@ -515,22 +515,14 @@ export default class CallView extends React.Component<IProps, IState> {
let secondaryCallInfo;
if (this.props.secondaryCall) {
const secCallRoom = client.getRoom(this.props.secondaryCall.roomId);
secondaryCallInfo = <div className="mx_CallView_header_secondaryCallInfo">
<div className="mx_CallView_header_secondaryCallInfo_avatarContainer">
<AccessibleButton onClick={this.onSecondaryRoomAvatarClick}>
<RoomAvatar room={secCallRoom} height={32} width={32} />
</AccessibleButton>
</div>
<div>
<div className="mx_CallView_header_roomName">{secCallRoom.name}</div>
<AccessibleButton kind="link" onClick={this.onSecondaryCallResumeClick}>
{_t("Resume")}
</AccessibleButton>
</div>
</div>;
} else {
// keeps it present but empty because it has the margin-left: auto to make the alignment correct
secondaryCallInfo = <div className="mx_CallView_header_secondaryCallInfo" />;
secondaryCallInfo = <span className="mx_CallView_header_secondaryCallInfo">
<AccessibleButton element='span' onClick={this.onSecondaryRoomAvatarClick}>
<RoomAvatar room={secCallRoom} height={16} width={16} />
<span className="mx_CallView_secondaryCall_roomName">
{_t("%(name)s paused", { name: secCallRoom.name })}
</span>
</AccessibleButton>
</span>;
}
header = <div className="mx_CallView_header">
@@ -539,9 +531,11 @@ export default class CallView extends React.Component<IProps, IState> {
</AccessibleButton>
<div className="mx_CallView_header_callInfo">
<div className="mx_CallView_header_roomName">{callRoom.name}</div>
<div className="mx_CallView_header_callTypeSmall">{callTypeText}</div>
<div className="mx_CallView_header_callTypeSmall">
{callTypeText}
{secondaryCallInfo}
</div>
</div>
{secondaryCallInfo}
{headerControls}
</div>;
myClassName = 'mx_CallView_pip';

3
src/i18n/strings/en_EN.json
View File

@@ -850,7 +850,7 @@
"Voice Call": "Voice Call",
"Fill Screen": "Fill Screen",
"Return to call": "Return to call",
"Resume": "Resume",
"%(name)s paused": "%(name)s paused",
"Unknown caller": "Unknown caller",
"Incoming voice call": "Incoming voice call",
"Incoming video call": "Incoming video call",
@@ -2260,6 +2260,7 @@
"<b>Warning</b>: You should only set up key backup from a trusted computer.": "<b>Warning</b>: You should only set up key backup from a trusted computer.",
"Access your secure message history and set up secure messaging by entering your recovery key.": "Access your secure message history and set up secure messaging by entering your recovery key.",
"If you've forgotten your recovery key you can <button>set up new recovery options</button>": "If you've forgotten your recovery key you can <button>set up new recovery options</button>",
"Resume": "Resume",
"Hold": "Hold",
"Reject invitation": "Reject invitation",
"Are you sure you want to reject the invitation?": "Are you sure you want to reject the invitation?",