Small fix to tooltips error.

master
Håvar Aambø Fosstveit 2019-06-05 08:38:23 +02:00
parent c47dc5a3e4
commit 8a51f3c966
1 changed files with 76 additions and 70 deletions

View File

@ -143,84 +143,90 @@ const Sidebar = (props) =>
} }
> >
<Tooltip title={micTip} placement={smallScreen ? 'top' : 'right'}> <Tooltip title={micTip} placement={smallScreen ? 'top' : 'right'}>
<Fab <div>
aria-label='Mute mic' <Fab
className={classes.fab} aria-label='Mute mic'
disabled={!me.canSendMic || me.audioInProgress} className={classes.fab}
color={micState === 'on' ? 'default' : 'secondary'} disabled={!me.canSendMic || me.audioInProgress}
size={smallScreen ? 'large' : 'medium'} color={micState === 'on' ? 'default' : 'secondary'}
onClick={() => size={smallScreen ? 'large' : 'medium'}
{ onClick={() =>
micState === 'on' ? {
roomClient.disableMic() : micState === 'on' ?
roomClient.enableMic(); roomClient.disableMic() :
}} roomClient.enableMic();
> }}
{ micState === 'on' ? >
<MicIcon /> { micState === 'on' ?
: <MicIcon />
<MicOffIcon /> :
} <MicOffIcon />
</Fab> }
</Fab>
</div>
</Tooltip> </Tooltip>
<Tooltip title={webcamTip} placement={smallScreen ? 'top' : 'right'}> <Tooltip title={webcamTip} placement={smallScreen ? 'top' : 'right'}>
<Fab <div>
aria-label='Mute video' <Fab
className={classes.fab} aria-label='Mute video'
disabled={!me.canSendWebcam || me.webcamInProgress} className={classes.fab}
color={webcamState === 'on' ? 'default' : 'secondary'} disabled={!me.canSendWebcam || me.webcamInProgress}
size={smallScreen ? 'large' : 'medium'} color={webcamState === 'on' ? 'default' : 'secondary'}
onClick={() => size={smallScreen ? 'large' : 'medium'}
{ onClick={() =>
webcamState === 'on' ? {
roomClient.disableWebcam() : webcamState === 'on' ?
roomClient.enableWebcam(); roomClient.disableWebcam() :
}} roomClient.enableWebcam();
> }}
{ webcamState === 'on' ? >
<VideoIcon /> { webcamState === 'on' ?
: <VideoIcon />
<VideoOffIcon /> :
} <VideoOffIcon />
</Fab> }
</Fab>
</div>
</Tooltip> </Tooltip>
<Tooltip title={screenTip} placement={smallScreen ? 'top' : 'right'}> <Tooltip title={screenTip} placement={smallScreen ? 'top' : 'right'}>
<Fab <div>
aria-label='Share screen' <Fab
className={classes.fab} aria-label='Share screen'
disabled={!me.canShareScreen || me.screenShareInProgress} className={classes.fab}
color={screenState === 'on' ? 'primary' : 'default'} disabled={!me.canShareScreen || me.screenShareInProgress}
size={smallScreen ? 'large' : 'medium'} color={screenState === 'on' ? 'primary' : 'default'}
onClick={() => size={smallScreen ? 'large' : 'medium'}
{ onClick={() =>
switch (screenState)
{ {
case 'on': switch (screenState)
{ {
roomClient.disableScreenSharing(); case 'on':
break; {
} roomClient.disableScreenSharing();
case 'off': break;
{ }
roomClient.enableScreenSharing(); case 'off':
break; {
} roomClient.enableScreenSharing();
default: break;
{ }
break; default:
{
break;
}
} }
}}
>
{ screenState === 'on' || screenState === 'unsupported' ?
<ScreenOffIcon/>
:null
} }
}} { screenState === 'off' ?
> <ScreenIcon/>
{ screenState === 'on' || screenState === 'unsupported' ? :null
<ScreenOffIcon/> }
:null </Fab>
} </div>
{ screenState === 'off' ?
<ScreenIcon/>
:null
}
</Fab>
</Tooltip> </Tooltip>
<Tooltip <Tooltip