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

Persist various things in localstorage.

Browse Source
This commit is contained in:
Håvar Aambø Fosstveit
2019-04-05 21:47:16 +02:00
parent e5026284fa
commit 67b3427485
17 changed files with 127 additions and 278 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/components/Containers/Me.js
+5
View File
@@ -47,6 +47,7 @@ const Me = (props) =>
const {
roomClient,
me,
settings,
activeSpeaker,
style,
advancedMode,
@@ -83,6 +84,7 @@ const Me = (props) =>
isMe
advancedMode={advancedMode}
peer={me}
displayName={settings.displayName}
showPeerInfo
videoTrack={webcamProducer ? webcamProducer.track : null}
videoVisible={videoVisible}
@@ -121,6 +123,7 @@ Me.propTypes =
roomClient : PropTypes.any.isRequired,
advancedMode : PropTypes.bool,
me : appPropTypes.Me.isRequired,
settings : PropTypes.object,
activeSpeaker : PropTypes.bool,
micProducer : appPropTypes.Producer,
webcamProducer : appPropTypes.Producer,
@@ -134,6 +137,7 @@ const mapStateToProps = (state) =>
return {
me : state.me,
...meProducersSelector(state),
settings : state.settings,
activeSpeaker : state.me.name === state.room.activeSpeakerName
};
};
@@ -148,6 +152,7 @@ export default withRoomContext(connect(
return (
prev.me === next.me &&
prev.producers === next.producers &&
prev.settings === next.settings &&
prev.room.activeSpeakerName === next.room.activeSpeakerName
);
}
app/src/components/Containers/Peer.js
+1
View File
@@ -287,6 +287,7 @@ const Peer = (props) =>
<VideoView
advancedMode={advancedMode}
peer={peer}
displayName={peer.displayName}
showPeerInfo
videoTrack={webcamConsumer ? webcamConsumer.track : null}
videoVisible={videoVisible}
app/src/components/MeetingDrawer/Chat/ChatInput.js
+4 -4
View File
@@ -122,8 +122,8 @@ ChatInput.propTypes =
const mapStateToProps = (state) =>
({
displayName : state.me.displayName,
picture : state.me.picture
displayName : state.settings.displayName,
picture : state.settings.picture
});
export default withRoomContext(
@@ -135,8 +135,8 @@ export default withRoomContext(
areStatesEqual : (next, prev) =>
{
return (
prev.me.displayName === next.me.displayName &&
prev.me.picture === next.me.picture
prev.settings.displayName === next.settings.displayName &&
prev.settings.picture === next.settings.picture
);
}
}
app/src/components/MeetingDrawer/ParticipantList/ListMe.js
+10 -6
View File
@@ -75,10 +75,11 @@ const ListMe = (props) =>
{
const {
me,
settings,
classes
} = props;
const picture = me.picture || EmptyAvatar;
const picture = settings.picture || EmptyAvatar;
return (
<li className={classes.root}>
@@ -86,7 +87,7 @@ const ListMe = (props) =>
<img alt='My avatar' className={classes.avatar} src={picture} />
<div className={classes.peerInfo}>
{me.displayName}
{settings.displayName}
</div>
<div className={classes.indicators}>
@@ -102,12 +103,14 @@ const ListMe = (props) =>
ListMe.propTypes =
{
me : appPropTypes.Me.isRequired,
classes : PropTypes.object.isRequired
me : appPropTypes.Me.isRequired,
settings : PropTypes.object.isRequired,
classes : PropTypes.object.isRequired
};
const mapStateToProps = (state) => ({
me : state.me
me : state.me,
settings : state.settings
});
export default connect(
@@ -118,7 +121,8 @@ export default connect(
areStatesEqual : (next, prev) =>
{
return (
prev.me === next.me
prev.me === next.me &&
prev.settings === next.settings
);
}
}
app/src/components/Room.js
+12 -4
View File
@@ -176,6 +176,10 @@ class Room extends React.PureComponent
componentDidMount()
{
const { roomClient } = this.props;
roomClient.join();
if (this.fullscreen.fullscreenEnabled)
{
this.fullscreen.addEventListener('fullscreenchange', this.handleFullscreenChange);
@@ -220,6 +224,7 @@ class Room extends React.PureComponent
const {
roomClient,
room,
advancedMode,
myPicture,
loggedIn,
loginEnabled,
@@ -277,9 +282,9 @@ class Room extends React.PureComponent
This website uses cookies to enhance the user experience.
</CookieConsent>
<FullScreenView advancedMode={room.advancedMode} />
<FullScreenView advancedMode={advancedMode} />
<VideoWindow advancedMode={room.advancedMode} />
<VideoWindow advancedMode={advancedMode} />
<AudioPeers />
@@ -377,7 +382,7 @@ class Room extends React.PureComponent
</Hidden>
</nav>
<View advancedMode={room.advancedMode} />
<View advancedMode={advancedMode} />
<Sidebar />
@@ -392,6 +397,7 @@ Room.propTypes =
{
roomClient : PropTypes.object.isRequired,
room : appPropTypes.Room.isRequired,
advancedMode : PropTypes.bool.isRequired,
myPicture : PropTypes.string,
loggedIn : PropTypes.bool.isRequired,
loginEnabled : PropTypes.bool.isRequired,
@@ -407,6 +413,7 @@ Room.propTypes =
const mapStateToProps = (state) =>
({
room : state.room,
advancedMode : state.settings.advancedMode,
loggedIn : state.me.loggedIn,
loginEnabled : state.me.loginEnabled,
myPicture : state.me.picture,
@@ -445,7 +452,8 @@ export default withRoomContext(connect(
prev.me.picture === next.me.picture &&
prev.toolarea.toolAreaOpen === next.toolarea.toolAreaOpen &&
prev.toolarea.unreadMessages === next.toolarea.unreadMessages &&
prev.toolarea.unreadFiles === next.toolarea.unreadFiles
prev.toolarea.unreadFiles === next.toolarea.unreadFiles &&
prev.settings.advancedMode === next.settings.advancedMode
);
}
}
app/src/components/Settings/Settings.js
+10 -6
View File
@@ -63,6 +63,7 @@ const Settings = ({
roomClient,
room,
me,
settings,
onToggleAdvancedMode,
// handleChangeMode,
handleCloseSettings,
@@ -96,7 +97,7 @@ const Settings = ({
<form className={classes.setting} autoComplete='off'>
<FormControl className={classes.formControl}>
<Select
value={me.selectedWebcam || ''}
value={settings.selectedWebcam || ''}
onChange={(event) =>
{
if (event.target.value)
@@ -127,7 +128,7 @@ const Settings = ({
<form className={classes.setting} autoComplete='off'>
<FormControl className={classes.formControl}>
<Select
value={me.selectedAudioDevice || ''}
value={settings.selectedAudioDevice || ''}
onChange={(event) =>
{
if (event.target.value)
@@ -157,7 +158,7 @@ const Settings = ({
</form>
<FormControlLabel
className={classes.setting}
control={<Checkbox checked={room.advancedMode} onChange={onToggleAdvancedMode} value='advancedMode' />}
control={<Checkbox checked={settings.advancedMode} onChange={onToggleAdvancedMode} value='advancedMode' />}
label='Advanced mode'
/>
{ /* <form className={classes.setting} autoComplete='off'>
@@ -195,6 +196,7 @@ Settings.propTypes =
roomClient : PropTypes.any.isRequired,
me : appPropTypes.Me.isRequired,
room : appPropTypes.Room.isRequired,
settings : PropTypes.object.isRequired,
onToggleAdvancedMode : PropTypes.func.isRequired,
handleChangeMode : PropTypes.func.isRequired,
handleCloseSettings : PropTypes.func.isRequired,
@@ -204,8 +206,9 @@ Settings.propTypes =
const mapStateToProps = (state) =>
{
return {
me : state.me,
room : state.room
me : state.me,
room : state.room,
settings : state.settings
};
};
@@ -224,7 +227,8 @@ export default withRoomContext(connect(
{
return (
prev.me === next.me &&
prev.room === next.room
prev.room === next.room &&
prev.settings === next.settings
);
}
}
app/src/components/VideoContainers/VideoView.js
+6 -4
View File
@@ -160,6 +160,7 @@ class VideoView extends React.PureComponent
const {
isMe,
peer,
displayName,
showPeerInfo,
videoContain,
advancedMode,
@@ -206,8 +207,8 @@ class VideoView extends React.PureComponent
<div className={classes.peer}>
{ isMe ?
<EditableInput
value={peer.displayName}
propName='displayName'
value={displayName}
propName='newDisplayName'
className={classnames(classes.displayNameEdit, 'display-name')}
classLoading='loading'
classInvalid='invalid'
@@ -217,11 +218,11 @@ class VideoView extends React.PureComponent
autoCorrect : false,
spellCheck : false
}}
onChange={({ displayName }) => onChangeDisplayName(displayName)}
onChange={({ newDisplayName }) => onChangeDisplayName(newDisplayName)}
/>
:
<span className={classes.displayNameStatic}>
{peer.displayName}
{displayName}
</span>
}
@@ -336,6 +337,7 @@ VideoView.propTypes =
isMe : PropTypes.bool,
peer : PropTypes.oneOfType(
[ appPropTypes.Me, appPropTypes.Peer ]),
displayName : PropTypes.string,
showPeerInfo : PropTypes.bool,
videoContain : PropTypes.bool,
advancedMode : PropTypes.bool,
app/src/components/appPropTypes.js
+5 -10
View File
@@ -17,16 +17,11 @@ export const Device = PropTypes.shape(
export const Me = PropTypes.shape(
{
name : PropTypes.string.isRequired,
displayName : PropTypes.string,
displayNameSet : PropTypes.bool.isRequired,
device : Device.isRequired,
canSendMic : PropTypes.bool.isRequired,
canSendWebcam : PropTypes.bool.isRequired,
webcamInProgress : PropTypes.bool.isRequired,
audioOnly : PropTypes.bool.isRequired,
audioOnlyInProgress : PropTypes.bool.isRequired,
restartIceInProgress : PropTypes.bool.isRequired
name : PropTypes.string.isRequired,
device : Device.isRequired,
canSendMic : PropTypes.bool.isRequired,
canSendWebcam : PropTypes.bool.isRequired,
webcamInProgress : PropTypes.bool.isRequired
});
export const Producer = PropTypes.shape(