summaryrefslogtreecommitdiffstats
path: root/webapp/components/webrtc/components/webrtc_notification.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/components/webrtc/components/webrtc_notification.jsx')
-rw-r--r--webapp/components/webrtc/components/webrtc_notification.jsx319
1 files changed, 0 insertions, 319 deletions
diff --git a/webapp/components/webrtc/components/webrtc_notification.jsx b/webapp/components/webrtc/components/webrtc_notification.jsx
deleted file mode 100644
index efa6ee637..000000000
--- a/webapp/components/webrtc/components/webrtc_notification.jsx
+++ /dev/null
@@ -1,319 +0,0 @@
-// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
-// See License.txt for license information.
-
-import WebSocketClient from 'client/web_websocket_client.jsx';
-
-import UserStore from 'stores/user_store.jsx';
-import WebrtcStore from 'stores/webrtc_store.jsx';
-
-import * as GlobalActions from 'actions/global_actions.jsx';
-import * as WebrtcActions from 'actions/webrtc_actions.jsx';
-import * as Utils from 'utils/utils.jsx';
-import {Constants, WebrtcActionTypes} from 'utils/constants.jsx';
-
-import React from 'react';
-
-import {FormattedMessage} from 'react-intl';
-
-import ring from 'images/ring.mp3';
-
-const PreReleaseFeatures = Constants.PRE_RELEASE_FEATURES;
-
-export default class WebrtcNotification extends React.Component {
- constructor() {
- super();
-
- this.mounted = false;
-
- this.closeNotification = this.closeNotification.bind(this);
- this.onIncomingCall = this.onIncomingCall.bind(this);
- this.onCancelCall = this.onCancelCall.bind(this);
- this.onRhs = this.onRhs.bind(this);
- this.handleClose = this.handleClose.bind(this);
- this.handleAnswer = this.handleAnswer.bind(this);
- this.handleTimeout = this.handleTimeout.bind(this);
- this.stopRinging = this.stopRinging.bind(this);
- this.closeRightHandSide = this.closeRightHandSide.bind(this);
-
- this.state = {
- userCalling: null,
- rhsOpened: false
- };
- }
-
- componentDidMount() {
- WebrtcStore.addNotifyListener(this.onIncomingCall);
- WebrtcStore.addChangedListener(this.onCancelCall);
- WebrtcStore.addRhsChangedListener(this.onRhs);
- this.mounted = true;
- }
-
- componentWillUnmount() {
- WebrtcStore.removeNotifyListener(this.onIncomingCall);
- WebrtcStore.removeChangedListener(this.onCancelCall);
- WebrtcStore.removeRhsChangedListener(this.onRhs);
- if (this.refs.ring) {
- this.refs.ring.removeListener('ended', this.handleTimeout);
- }
- this.mounted = false;
- }
-
- componentDidUpdate() {
- if (this.state.userCalling) {
- this.refs.ring.addEventListener('ended', this.handleTimeout);
- }
- }
-
- closeNotification() {
- this.setState({
- userCalling: null
- });
- }
-
- stopRinging() {
- if (this.refs.ring) {
- this.refs.ring.pause();
- this.refs.ring.currentTime = 0;
- }
- this.setState({userCalling: null});
- }
-
- closeRightHandSide(e) {
- e.preventDefault();
- GlobalActions.emitCloseRightHandSide();
- }
-
- onIncomingCall(incoming) {
- if (this.mounted) {
- const userId = incoming.from_user_id;
- const userMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
- const featureEnabled = Utils.isFeatureEnabled(PreReleaseFeatures.WEBRTC_PREVIEW);
-
- if (featureEnabled) {
- if (WebrtcStore.isBusy()) {
- WebSocketClient.sendMessage('webrtc', {
- action: WebrtcActionTypes.BUSY,
- from_user_id: UserStore.getCurrentId(),
- to_user_id: userId
- });
- this.stopRinging();
- } else if (userMedia) {
- WebrtcStore.setVideoCallWith(userId);
- this.setState({
- userCalling: UserStore.getProfile(userId)
- });
- } else {
- WebSocketClient.sendMessage('webrtc', {
- action: WebrtcActionTypes.UNSUPPORTED,
- from_user_id: UserStore.getCurrentId(),
- to_user_id: userId
- });
- this.stopRinging();
- }
- } else {
- WebSocketClient.sendMessage('webrtc', {
- action: WebrtcActionTypes.DISABLED,
- from_user_id: UserStore.getCurrentId(),
- to_user_id: userId
- });
- this.stopRinging();
- }
- }
- }
-
- onCancelCall(message) {
- if (message && message.action !== WebrtcActionTypes.CANCEL) {
- return;
- } else if (message && message.action === WebrtcActionTypes.CANCEL && this.state.userCalling && message.from_user_id !== this.state.userCalling.id) {
- return;
- }
-
- WebrtcStore.setVideoCallWith(null);
- this.closeNotification();
- }
-
- onRhs(rhsOpened) {
- this.setState({rhsOpened});
- }
-
- handleTimeout() {
- WebSocketClient.sendMessage('webrtc', {
- action: WebrtcActionTypes.NO_ANSWER,
- from_user_id: UserStore.getCurrentId(),
- to_user_id: this.state.userCalling.id
- });
-
- this.onCancelCall();
- }
-
- handleAnswer(e) {
- if (e) {
- e.preventDefault();
- }
-
- const caller = this.state.userCalling;
- if (caller) {
- const callerId = caller.id;
- const currentUserId = UserStore.getCurrentId();
- const message = {
- action: WebrtcActionTypes.ANSWER,
- from_user_id: currentUserId,
- to_user_id: callerId
- };
-
- GlobalActions.emitCloseRightHandSide();
- WebrtcActions.initWebrtc(callerId, false);
- WebSocketClient.sendMessage('webrtc', message);
-
- // delay till next tick (this will give time to listen for events
- setTimeout(() => {
- //we switch from and to user to handle the event locally
- message.from_user_id = callerId;
- message.to_user_id = currentUserId;
- WebrtcActions.handle(message);
- }, 0);
-
- this.closeNotification();
- }
- }
-
- handleClose(e) {
- if (e) {
- e.preventDefault();
- }
- if (this.state.userCalling) {
- WebSocketClient.sendMessage('webrtc', {
- action: WebrtcActionTypes.DECLINE,
- from_user_id: UserStore.getCurrentId(),
- to_user_id: this.state.userCalling.id
- });
- }
-
- this.onCancelCall();
- }
-
- render() {
- const user = this.state.userCalling;
- if (user) {
- const username = Utils.displayUsername(user.id);
- const profileImgSrc = Utils.imageURLForUser(user);
- const profileImg = (
- <img
- className='user-popover__image'
- src={profileImgSrc}
- height='128'
- width='128'
- key='user-popover-image'
- />
- );
- const answerBtn = (
- <svg
- className='webrtc-icons__pickup'
- xmlns='http://www.w3.org/2000/svg'
- width='48'
- height='48'
- viewBox='-10 -10 68 68'
- onClick={this.handleAnswer}
- >
- <circle
- cx='24'
- cy='24'
- r='34'
- >
- <title>
- <FormattedMessage
- id='webrtc.notification.answer'
- defaultMessage='Answer'
- />
- </title>
- </circle>
- <path
- transform='translate(-10,-10)'
- fill='#fff'
- d='M29.854,37.627c1.723,1.904 3.679,3.468 5.793,4.684l3.683,-3.334c0.469,-0.424 1.119,-0.517 1.669,-0.302c1.628,0.63 3.331,1.021 5.056,1.174c0.401,0.026 0.795,0.199 1.09,0.525c0.295,0.326 0.433,0.741 0.407,1.153l-0.279,5.593c-0.02,0.418 -0.199,0.817 -0.525,1.112c-0.326,0.296 -0.741,0.434 -1.159,0.413c-6.704,-0.504 -13.238,-3.491 -18.108,-8.87c-4.869,-5.38 -7.192,-12.179 -7.028,-18.899c0.015,-0.413 0.199,-0.817 0.526,-1.113c0.326,-0.295 0.74,-0.433 1.153,-0.407l5.593,0.279c0.407,0.02 0.812,0.193 1.107,0.519c0.29,0.32 0.428,0.735 0.413,1.137c-0.018,1.732 0.202,3.464 0.667,5.147c0.159,0.569 0.003,1.207 -0.466,1.631l-3.683,3.334c1.005,2.219 2.368,4.32 4.091,6.224Z'
- />
- </svg>
- );
-
- const rejectBtn = (
- <svg
- className='webrtc-icons__cancel'
- xmlns='http://www.w3.org/2000/svg'
- width='48'
- height='48'
- viewBox='-10 -10 68 68'
- onClick={this.handleClose}
- >
- <circle
- cx='24'
- cy='24'
- r='34'
- >
- <title>
- <FormattedMessage
- id='webrtc.notification.decline'
- defaultMessage='Decline'
- />
- </title>
- </circle>
- <path
- transform='scale(0.7), translate(11,10)'
- d='M24 18c-3.21 0-6.3.5-9.2 1.44v6.21c0 .79-.46 1.47-1.12 1.8-1.95.98-3.74 2.23-5.33 3.7-.36.35-.85.57-1.4.57-.55 0-1.05-.22-1.41-.59L.59 26.18c-.37-.37-.59-.87-.59-1.42 0-.55.22-1.05.59-1.42C6.68 17.55 14.93 14 24 14s17.32 3.55 23.41 9.34c.37.36.59.87.59 1.42 0 .55-.22 1.05-.59 1.41l-4.95 4.95c-.36.36-.86.59-1.41.59-.54 0-1.04-.22-1.4-.57-1.59-1.47-3.38-2.72-5.33-3.7-.66-.33-1.12-1.01-1.12-1.8v-6.21C30.3 18.5 27.21 18 24 18z'
- fill='white'
- />
- </svg>
- );
-
- const msg = (
- <div>
- <FormattedMessage
- id='webrtc.notification.incoming_call'
- defaultMessage='{username} is calling you.'
- values={{
- username
- }}
- />
- <div
- className='webrtc-buttons webrtc-icons active'
- style={{marginTop: '5px'}}
- >
- {answerBtn}
- {rejectBtn}
- </div>
- </div>
- );
-
- return (
- <div className='webrtc-notification'>
- <audio
- ref='ring'
- src={ring}
- autoPlay={true}
- />
- <div>
- {profileImg}
- </div>
- {msg}
- </div>
- );
- } else if (this.state.rhsOpened && WebrtcStore.isBusy()) {
- return (
- <div
- className='webrtc__notification--rhs'
- onClick={this.closeRightHandSide}
- >
- <i className='fa fa-phone'/>
- <FormattedMessage
- id='webrtc.notification.returnToCall'
- defaultMessage='Return to ongoing call with {username}'
- values={{
- username: Utils.displayUsername(WebrtcStore.getVideoCallWith())
- }}
- />
- </div>
- );
- }
-
- return <div/>;
- }
-}
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-05-20 03:20:16 +0000