mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-04 22:00:42 +03:00
Add silencing
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
parent
c678211a42
commit
b08b36c14f
1 changed files with 24 additions and 1 deletions
|
@ -21,17 +21,20 @@ import {MatrixClientPeg} from '../../../MatrixClientPeg';
|
||||||
import dis from '../../../dispatcher/dispatcher';
|
import dis from '../../../dispatcher/dispatcher';
|
||||||
import { _t } from '../../../languageHandler';
|
import { _t } from '../../../languageHandler';
|
||||||
import { ActionPayload } from '../../../dispatcher/payloads';
|
import { ActionPayload } from '../../../dispatcher/payloads';
|
||||||
import CallHandler from '../../../CallHandler';
|
import CallHandler, { AudioID } from '../../../CallHandler';
|
||||||
import RoomAvatar from '../avatars/RoomAvatar';
|
import RoomAvatar from '../avatars/RoomAvatar';
|
||||||
import FormButton from '../elements/FormButton';
|
import FormButton from '../elements/FormButton';
|
||||||
import { CallState } from 'matrix-js-sdk/src/webrtc/call';
|
import { CallState } from 'matrix-js-sdk/src/webrtc/call';
|
||||||
import {replaceableComponent} from "../../../utils/replaceableComponent";
|
import {replaceableComponent} from "../../../utils/replaceableComponent";
|
||||||
|
import AccessibleTooltipButton from '../elements/AccessibleTooltipButton';
|
||||||
|
import classNames from 'classnames';
|
||||||
|
|
||||||
interface IProps {
|
interface IProps {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface IState {
|
interface IState {
|
||||||
incomingCall: any;
|
incomingCall: any;
|
||||||
|
silenced: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
@replaceableComponent("views.voip.IncomingCallBox")
|
@replaceableComponent("views.voip.IncomingCallBox")
|
||||||
|
@ -44,6 +47,7 @@ export default class IncomingCallBox extends React.Component<IProps, IState> {
|
||||||
this.dispatcherRef = dis.register(this.onAction);
|
this.dispatcherRef = dis.register(this.onAction);
|
||||||
this.state = {
|
this.state = {
|
||||||
incomingCall: null,
|
incomingCall: null,
|
||||||
|
silenced: false,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -58,6 +62,7 @@ export default class IncomingCallBox extends React.Component<IProps, IState> {
|
||||||
if (call && call.state === CallState.Ringing) {
|
if (call && call.state === CallState.Ringing) {
|
||||||
this.setState({
|
this.setState({
|
||||||
incomingCall: call,
|
incomingCall: call,
|
||||||
|
silenced: false, // Reset silenced state for new call
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
this.setState({
|
this.setState({
|
||||||
|
@ -84,6 +89,13 @@ export default class IncomingCallBox extends React.Component<IProps, IState> {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
private onSilenceClick: React.MouseEventHandler = (e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
const newState = !this.state.silenced
|
||||||
|
this.setState({silenced: newState});
|
||||||
|
newState ? CallHandler.sharedInstance().pause(AudioID.Ring) : CallHandler.sharedInstance().play(AudioID.Ring);
|
||||||
|
}
|
||||||
|
|
||||||
public render() {
|
public render() {
|
||||||
if (!this.state.incomingCall) {
|
if (!this.state.incomingCall) {
|
||||||
return null;
|
return null;
|
||||||
|
@ -107,6 +119,12 @@ export default class IncomingCallBox extends React.Component<IProps, IState> {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const silenceClass = classNames({
|
||||||
|
"mx_IncomingCallBox_iconButton": true,
|
||||||
|
"mx_IncomingCallBox_unSilence": this.state.silenced,
|
||||||
|
"mx_IncomingCallBox_silence": !this.state.silenced,
|
||||||
|
});
|
||||||
|
|
||||||
return <div className="mx_IncomingCallBox">
|
return <div className="mx_IncomingCallBox">
|
||||||
<div className="mx_IncomingCallBox_CallerInfo">
|
<div className="mx_IncomingCallBox_CallerInfo">
|
||||||
<RoomAvatar
|
<RoomAvatar
|
||||||
|
@ -118,6 +136,11 @@ export default class IncomingCallBox extends React.Component<IProps, IState> {
|
||||||
<h1>{caller}</h1>
|
<h1>{caller}</h1>
|
||||||
<p>{incomingCallText}</p>
|
<p>{incomingCallText}</p>
|
||||||
</div>
|
</div>
|
||||||
|
<AccessibleTooltipButton
|
||||||
|
className={silenceClass}
|
||||||
|
onClick={this.onSilenceClick}
|
||||||
|
title={this.state.silenced ? _t("Sound on"): _t("Silence call")}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="mx_IncomingCallBox_buttons">
|
<div className="mx_IncomingCallBox_buttons">
|
||||||
<FormButton
|
<FormButton
|
||||||
|
|
Loading…
Reference in a new issue