diff --git a/app/src/components/Containers/Peer.js b/app/src/components/Containers/Peer.js index 428747e..9def7e9 100644 --- a/app/src/components/Containers/Peer.js +++ b/app/src/components/Containers/Peer.js @@ -73,7 +73,7 @@ const styles = (theme) => justifyContent : 'center', alignItems : 'flex-end', padding : '0.4vmin', - zIndex : 20, + zIndex : 21, opacity : 0, transition : 'opacity 0.3s', touchAction : 'none', @@ -92,7 +92,7 @@ const styles = (theme) => justifyContent : 'center', alignItems : 'center', padding : '0.4vmin', - zIndex : 21, + zIndex : 20, '& p' : { padding : '6px 12px', @@ -209,79 +209,77 @@ const Peer = (props) => :null } - { videoVisible ? -
setWebcamHover(true)} - onMouseOut={() => setWebcamHover(false)} - onTouchStart={() => +
setWebcamHover(true)} + onMouseOut={() => setWebcamHover(false)} + onTouchStart={() => + { + if (touchWebcamTimeout) + clearTimeout(touchWebcamTimeout); + + setWebcamHover(true); + }} + onTouchEnd={() => + { + if (touchWebcamTimeout) + clearTimeout(touchWebcamTimeout); + + touchWebcamTimeout = setTimeout(() => { - if (touchWebcamTimeout) - clearTimeout(touchWebcamTimeout); - - setWebcamHover(true); - }} - onTouchEnd={() => + setWebcamHover(false); + }, 2000); + }} + > + { - if (touchWebcamTimeout) - clearTimeout(touchWebcamTimeout); - - touchWebcamTimeout = setTimeout(() => - { - setWebcamHover(false); - }, 2000); + micEnabled ? + roomClient.modifyPeerConsumer(peer.id, 'mic', true) : + roomClient.modifyPeerConsumer(peer.id, 'mic', false); }} > - - { - micEnabled ? - roomClient.modifyPeerConsumer(peer.id, 'mic', true) : - roomClient.modifyPeerConsumer(peer.id, 'mic', false); - }} - > - { micEnabled ? - - : - - } - - - { !smallScreen ? - - { - toggleConsumerWindow(webcamConsumer); - }} - > - - - :null + { micEnabled ? + + : + } + + { !smallScreen ? { - toggleConsumerFullscreen(webcamConsumer); + toggleConsumerWindow(webcamConsumer); }} > - + -
- :null - } + :null + } + + + { + toggleConsumerFullscreen(webcamConsumer); + }} + > + + +