Add tooltips to participant list, fixes #299
parent
6ca73e190f
commit
3710c3b3ac
|
|
@ -6,6 +6,7 @@ import PropTypes from 'prop-types';
|
||||||
import * as appPropTypes from '../../appPropTypes';
|
import * as appPropTypes from '../../appPropTypes';
|
||||||
import { useIntl } from 'react-intl';
|
import { useIntl } from 'react-intl';
|
||||||
import IconButton from '@material-ui/core/IconButton';
|
import IconButton from '@material-ui/core/IconButton';
|
||||||
|
import Tooltip from '@material-ui/core/Tooltip';
|
||||||
import PanIcon from '@material-ui/icons/PanTool';
|
import PanIcon from '@material-ui/icons/PanTool';
|
||||||
import EmptyAvatar from '../../../images/avatar-empty.jpeg';
|
import EmptyAvatar from '../../../images/avatar-empty.jpeg';
|
||||||
|
|
||||||
|
|
@ -58,6 +59,13 @@ const ListMe = (props) =>
|
||||||
<div className={classes.peerInfo}>
|
<div className={classes.peerInfo}>
|
||||||
{settings.displayName}
|
{settings.displayName}
|
||||||
</div>
|
</div>
|
||||||
|
<Tooltip
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id : 'tooltip.raisedHand',
|
||||||
|
defaultMessage : 'Raise hand'
|
||||||
|
})}
|
||||||
|
placement='bottom'
|
||||||
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
aria-label={intl.formatMessage({
|
aria-label={intl.formatMessage({
|
||||||
id : 'tooltip.raisedHand',
|
id : 'tooltip.raisedHand',
|
||||||
|
|
@ -75,6 +83,7 @@ const ListMe = (props) =>
|
||||||
>
|
>
|
||||||
<PanIcon />
|
<PanIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,7 @@ import * as appPropTypes from '../../appPropTypes';
|
||||||
import { withRoomContext } from '../../../RoomContext';
|
import { withRoomContext } from '../../../RoomContext';
|
||||||
import { useIntl } from 'react-intl';
|
import { useIntl } from 'react-intl';
|
||||||
import IconButton from '@material-ui/core/IconButton';
|
import IconButton from '@material-ui/core/IconButton';
|
||||||
|
import Tooltip from '@material-ui/core/Tooltip';
|
||||||
import VideocamIcon from '@material-ui/icons/Videocam';
|
import VideocamIcon from '@material-ui/icons/Videocam';
|
||||||
import VideocamOffIcon from '@material-ui/icons/VideocamOff';
|
import VideocamOffIcon from '@material-ui/icons/VideocamOff';
|
||||||
import VolumeUpIcon from '@material-ui/icons/VolumeUp';
|
import VolumeUpIcon from '@material-ui/icons/VolumeUp';
|
||||||
|
|
@ -99,6 +100,13 @@ const ListPeer = (props) =>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
{ screenConsumer &&
|
{ screenConsumer &&
|
||||||
|
<Tooltip
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id : 'tooltip.muteScreenSharing',
|
||||||
|
defaultMessage : 'Mute participant share'
|
||||||
|
})}
|
||||||
|
placement='bottom'
|
||||||
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
aria-label={intl.formatMessage({
|
aria-label={intl.formatMessage({
|
||||||
id : 'tooltip.muteScreenSharing',
|
id : 'tooltip.muteScreenSharing',
|
||||||
|
|
@ -121,7 +129,15 @@ const ListPeer = (props) =>
|
||||||
<ScreenOffIcon />
|
<ScreenOffIcon />
|
||||||
}
|
}
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
}
|
}
|
||||||
|
<Tooltip
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id : 'tooltip.muteParticipantVideo',
|
||||||
|
defaultMessage : 'Mute participant video'
|
||||||
|
})}
|
||||||
|
placement='bottom'
|
||||||
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
aria-label={intl.formatMessage({
|
aria-label={intl.formatMessage({
|
||||||
id : 'tooltip.muteParticipantVideo',
|
id : 'tooltip.muteParticipantVideo',
|
||||||
|
|
@ -144,6 +160,14 @@ const ListPeer = (props) =>
|
||||||
<VideocamOffIcon />
|
<VideocamOffIcon />
|
||||||
}
|
}
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
|
<Tooltip
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id : 'tooltip.muteParticipant',
|
||||||
|
defaultMessage : 'Mute participant'
|
||||||
|
})}
|
||||||
|
placement='bottom'
|
||||||
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
aria-label={intl.formatMessage({
|
aria-label={intl.formatMessage({
|
||||||
id : 'tooltip.muteParticipant',
|
id : 'tooltip.muteParticipant',
|
||||||
|
|
@ -166,7 +190,15 @@ const ListPeer = (props) =>
|
||||||
<VolumeOffIcon />
|
<VolumeOffIcon />
|
||||||
}
|
}
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
{ isModerator &&
|
{ isModerator &&
|
||||||
|
<Tooltip
|
||||||
|
title={intl.formatMessage({
|
||||||
|
id : 'tooltip.kickParticipant',
|
||||||
|
defaultMessage : 'Kick out participant'
|
||||||
|
})}
|
||||||
|
placement='bottom'
|
||||||
|
>
|
||||||
<IconButton
|
<IconButton
|
||||||
aria-label={intl.formatMessage({
|
aria-label={intl.formatMessage({
|
||||||
id : 'tooltip.kickParticipant',
|
id : 'tooltip.kickParticipant',
|
||||||
|
|
@ -183,6 +215,7 @@ const ListPeer = (props) =>
|
||||||
>
|
>
|
||||||
<ExitIcon />
|
<ExitIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
}
|
}
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "房间名称",
|
"label.roomName": "房间名称",
|
||||||
"label.chooseRoomButton": "继续",
|
"label.chooseRoomButton": "继续",
|
||||||
|
|
|
||||||
|
|
@ -79,6 +79,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Jméno místnosti",
|
"label.roomName": "Jméno místnosti",
|
||||||
"label.chooseRoomButton": "Pokračovat",
|
"label.chooseRoomButton": "Pokračovat",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Name des Raums",
|
"label.roomName": "Name des Raums",
|
||||||
"label.chooseRoomButton": "Weiter",
|
"label.chooseRoomButton": "Weiter",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Værelsesnavn",
|
"label.roomName": "Værelsesnavn",
|
||||||
"label.chooseRoomButton": "Fortsæt",
|
"label.chooseRoomButton": "Fortsæt",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Όνομα δωματίου",
|
"label.roomName": "Όνομα δωματίου",
|
||||||
"label.chooseRoomButton": "Συνέχεια",
|
"label.chooseRoomButton": "Συνέχεια",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": "Mute participant",
|
"tooltip.muteParticipant": "Mute participant",
|
||||||
"tooltip.muteParticipantVideo": "Mute participant video",
|
"tooltip.muteParticipantVideo": "Mute participant video",
|
||||||
"tooltip.raisedHand": "Raise hand",
|
"tooltip.raisedHand": "Raise hand",
|
||||||
|
"tooltip.muteScreenSharing": "Mute participant share",
|
||||||
|
|
||||||
"label.roomName": "Room name",
|
"label.roomName": "Room name",
|
||||||
"label.chooseRoomButton": "Continue",
|
"label.chooseRoomButton": "Continue",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Nombre de la sala",
|
"label.roomName": "Nombre de la sala",
|
||||||
"label.chooseRoomButton": "Continuar",
|
"label.chooseRoomButton": "Continuar",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Nom de la salle",
|
"label.roomName": "Nom de la salle",
|
||||||
"label.chooseRoomButton": "Continuer",
|
"label.chooseRoomButton": "Continuer",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": "Utišaj sudionika",
|
"tooltip.muteParticipant": "Utišaj sudionika",
|
||||||
"tooltip.muteParticipantVideo": "Ne primaj video sudionika",
|
"tooltip.muteParticipantVideo": "Ne primaj video sudionika",
|
||||||
"tooltip.raisedHand": "Podigni ruku",
|
"tooltip.raisedHand": "Podigni ruku",
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Naziv sobe",
|
"label.roomName": "Naziv sobe",
|
||||||
"label.chooseRoomButton": "Nastavi",
|
"label.chooseRoomButton": "Nastavi",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": "Résztvevő némítása",
|
"tooltip.muteParticipant": "Résztvevő némítása",
|
||||||
"tooltip.muteParticipantVideo": "Résztvevő video némítása",
|
"tooltip.muteParticipantVideo": "Résztvevő video némítása",
|
||||||
"tooltip.raisedHand": "Jelentkezés",
|
"tooltip.raisedHand": "Jelentkezés",
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Konferencia",
|
"label.roomName": "Konferencia",
|
||||||
"label.chooseRoomButton": "Tovább",
|
"label.chooseRoomButton": "Tovább",
|
||||||
|
|
|
||||||
|
|
@ -79,6 +79,7 @@
|
||||||
"tooltip.muteParticipant": "Muta partecipante",
|
"tooltip.muteParticipant": "Muta partecipante",
|
||||||
"tooltip.muteParticipantVideo": "Ferma video partecipante",
|
"tooltip.muteParticipantVideo": "Ferma video partecipante",
|
||||||
"tooltip.raisedHand": "Mano alzata",
|
"tooltip.raisedHand": "Mano alzata",
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Nome della stanza",
|
"label.roomName": "Nome della stanza",
|
||||||
"label.chooseRoomButton": "Continua",
|
"label.chooseRoomButton": "Continua",
|
||||||
|
|
|
||||||
|
|
@ -79,6 +79,7 @@
|
||||||
"tooltip.muteParticipant": "Noklusināt dalībnieku",
|
"tooltip.muteParticipant": "Noklusināt dalībnieku",
|
||||||
"tooltip.muteParticipantVideo": "Atslēgt dalībnieka video",
|
"tooltip.muteParticipantVideo": "Atslēgt dalībnieka video",
|
||||||
"tooltip.raisedHand": "Pacelt roku",
|
"tooltip.raisedHand": "Pacelt roku",
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Sapulces telpas nosaukums (ID)",
|
"label.roomName": "Sapulces telpas nosaukums (ID)",
|
||||||
"label.chooseRoomButton": "Turpināt",
|
"label.chooseRoomButton": "Turpināt",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": "Demp deltaker",
|
"tooltip.muteParticipant": "Demp deltaker",
|
||||||
"tooltip.muteParticipantVideo": "Demp deltakervideo",
|
"tooltip.muteParticipantVideo": "Demp deltakervideo",
|
||||||
"tooltip.raisedHand": "Rekk opp hånden",
|
"tooltip.raisedHand": "Rekk opp hånden",
|
||||||
|
"tooltip.muteScreenSharing": "Demp deltaker skjermdeling",
|
||||||
|
|
||||||
"label.roomName": "Møtenavn",
|
"label.roomName": "Møtenavn",
|
||||||
"label.chooseRoomButton": "Fortsett",
|
"label.chooseRoomButton": "Fortsett",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Nazwa konferencji",
|
"label.roomName": "Nazwa konferencji",
|
||||||
"label.chooseRoomButton": "Kontynuuj",
|
"label.chooseRoomButton": "Kontynuuj",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Nome da sala",
|
"label.roomName": "Nome da sala",
|
||||||
"label.chooseRoomButton": "Continuar",
|
"label.chooseRoomButton": "Continuar",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Numele camerei",
|
"label.roomName": "Numele camerei",
|
||||||
"label.chooseRoomButton": "Continuare",
|
"label.chooseRoomButton": "Continuare",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Oda adı",
|
"label.roomName": "Oda adı",
|
||||||
"label.chooseRoomButton": "Devam",
|
"label.chooseRoomButton": "Devam",
|
||||||
|
|
|
||||||
|
|
@ -80,6 +80,7 @@
|
||||||
"tooltip.muteParticipant": null,
|
"tooltip.muteParticipant": null,
|
||||||
"tooltip.muteParticipantVideo": null,
|
"tooltip.muteParticipantVideo": null,
|
||||||
"tooltip.raisedHand": null,
|
"tooltip.raisedHand": null,
|
||||||
|
"tooltip.muteScreenSharing": null,
|
||||||
|
|
||||||
"label.roomName": "Назва кімнати",
|
"label.roomName": "Назва кімнати",
|
||||||
"label.chooseRoomButton": "Продовжити",
|
"label.chooseRoomButton": "Продовжити",
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue