Briq/multiparty-meeting
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Major cleanup

Browse Source
This commit is contained in:
Håvar Aambø Fosstveit
2018-12-12 22:28:33 +01:00
parent fa91d9b9e2
commit 60fb9c735e
32 changed files with 506 additions and 16543 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/lib/components/ParticipantList/ListPeer.jsx
+21 -60
View File
@@ -3,18 +3,15 @@ import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import * as appPropTypes from '../appPropTypes';
import * as requestActions from '../../redux/requestActions';
import { withRoomContext } from '../../RoomContext';
const ListPeer = (props) =>
{
const {
roomClient,
peer,
micConsumer,
screenConsumer,
onMuteMic,
onUnmuteMic,
onDisableScreen,
onEnableScreen
screenConsumer
} = props;
const micEnabled = (
@@ -39,7 +36,7 @@ const ListPeer = (props) =>
{peer.displayName}
</div>
<div className='indicators'>
{peer.raiseHandState ?
<If condition={peer.raiseHandState}>
<div className={
classnames(
'icon', 'raise-hand', {
@@ -49,14 +46,13 @@ const ListPeer = (props) =>
)
}
/>
:null
}
</If>
</div>
<div className='volume-container'>
<div className={classnames('bar', `level${micEnabled && micConsumer ? micConsumer.volume:0}`)} />
</div>
<div className='controls'>
{ screenConsumer ?
<If condition={screenConsumer}>
<div
className={classnames('button', 'screen', {
on : screenVisible,
@@ -67,11 +63,11 @@ const ListPeer = (props) =>
{
e.stopPropagation();
screenVisible ?
onDisableScreen(peer.name) : onEnableScreen(peer.name);
roomClient.pausePeerScreen(peer.name) :
roomClient.resumePeerScreen(peer.name);
}}
/>
:null
}
</If>
<div
className={classnames('button', 'mic', {
on : micEnabled,
@@ -81,7 +77,9 @@ const ListPeer = (props) =>
onClick={(e) =>
{
e.stopPropagation();
micEnabled ? onMuteMic(peer.name) : onUnmuteMic(peer.name);
micEnabled ?
roomClient.mutePeerAudio(peer.name) :
roomClient.unmutePeerAudio(peer.name);
}}
/>
</div>
@@ -91,17 +89,12 @@ const ListPeer = (props) =>
ListPeer.propTypes =
{
advancedMode : PropTypes.bool,
peer : appPropTypes.Peer.isRequired,
micConsumer : appPropTypes.Consumer,
webcamConsumer : appPropTypes.Consumer,
screenConsumer : appPropTypes.Consumer,
onMuteMic : PropTypes.func.isRequired,
onUnmuteMic : PropTypes.func.isRequired,
onEnableWebcam : PropTypes.func.isRequired,
onDisableWebcam : PropTypes.func.isRequired,
onEnableScreen : PropTypes.func.isRequired,
onDisableScreen : PropTypes.func.isRequired
roomClient : PropTypes.any.isRequired,
advancedMode : PropTypes.bool,
peer : appPropTypes.Peer.isRequired,
micConsumer : appPropTypes.Consumer,
webcamConsumer : appPropTypes.Consumer,
screenConsumer : appPropTypes.Consumer
};
const mapStateToProps = (state, { name }) =>
@@ -124,40 +117,8 @@ const mapStateToProps = (state, { name }) =>
};
};
const mapDispatchToProps = (dispatch) =>
{
return {
onMuteMic : (peerName) =>
{
dispatch(requestActions.mutePeerAudio(peerName));
},
onUnmuteMic : (peerName) =>
{
dispatch(requestActions.unmutePeerAudio(peerName));
},
onEnableWebcam : (peerName) =>
{
dispatch(requestActions.resumePeerVideo(peerName));
},
onDisableWebcam : (peerName) =>
{
dispatch(requestActions.pausePeerVideo(peerName));
},
onEnableScreen : (peerName) =>
{
dispatch(requestActions.resumePeerScreen(peerName));
},
onDisableScreen : (peerName) =>
{
dispatch(requestActions.pausePeerScreen(peerName));
}
};
};
const ListPeerContainer = connect(
mapStateToProps,
mapDispatchToProps
)(ListPeer);
const ListPeerContainer = withRoomContext(connect(
mapStateToProps
)(ListPeer));
export default ListPeerContainer;
app/lib/components/ParticipantList/ParticipantList.jsx
+8 -13
View File
@@ -2,16 +2,16 @@ import React from 'react';
import { connect } from 'react-redux';
import classNames from 'classnames';
import * as appPropTypes from '../appPropTypes';
import * as requestActions from '../../redux/requestActions';
import { withRoomContext } from '../../RoomContext';
import PropTypes from 'prop-types';
import ListPeer from './ListPeer';
import ListMe from './ListMe';
const ParticipantList =
({
roomClient,
advancedMode,
peers,
setSelectedPeer,
selectedPeerName,
spotlights
}) => (
@@ -33,7 +33,7 @@ const ParticipantList =
className={classNames('list-item', {
selected : peer.name === selectedPeerName
})}
onClick={() => setSelectedPeer(peer.name)}
onClick={() => roomClient.setSelectedPeer(peer.name)}
>
<ListPeer name={peer.name} advancedMode={advancedMode} />
</li>
@@ -52,7 +52,7 @@ const ParticipantList =
className={classNames('list-item', {
selected : peer.name === selectedPeerName
})}
onClick={() => setSelectedPeer(peer.name)}
onClick={() => roomClient.setSelectedPeer(peer.name)}
>
<ListPeer name={peer.name} advancedMode={advancedMode} />
</li>
@@ -64,9 +64,9 @@ const ParticipantList =
ParticipantList.propTypes =
{
roomClient : PropTypes.any.isRequired,
advancedMode : PropTypes.bool,
peers : PropTypes.arrayOf(appPropTypes.Peer).isRequired,
setSelectedPeer : PropTypes.func.isRequired,
selectedPeerName : PropTypes.string,
spotlights : PropTypes.array.isRequired
};
@@ -82,13 +82,8 @@ const mapStateToProps = (state) =>
};
};
const mapDispatchToProps = {
setSelectedPeer : requestActions.setSelectedPeer
};
const ParticipantListContainer = connect(
mapStateToProps,
mapDispatchToProps
)(ParticipantList);
const ParticipantListContainer = withRoomContext(connect(
mapStateToProps
)(ParticipantList));
export default ParticipantListContainer;