feat: use participant id for avatar color
This commit is contained in:
parent
88e4850c4d
commit
74d0013acc
|
@ -0,0 +1,6 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<classpath>
|
||||||
|
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.8/"/>
|
||||||
|
<classpathentry kind="con" path="org.eclipse.buildship.core.gradleclasspathcontainer"/>
|
||||||
|
<classpathentry kind="output" path="bin/default"/>
|
||||||
|
</classpath>
|
|
@ -0,0 +1,2 @@
|
||||||
|
connection.project.dir=..
|
||||||
|
eclipse.preferences.version=1
|
|
@ -0,0 +1,6 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<classpath>
|
||||||
|
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.8/"/>
|
||||||
|
<classpathentry kind="con" path="org.eclipse.buildship.core.gradleclasspathcontainer"/>
|
||||||
|
<classpathentry kind="output" path="bin/default"/>
|
||||||
|
</classpath>
|
|
@ -0,0 +1,2 @@
|
||||||
|
connection.project.dir=..
|
||||||
|
eclipse.preferences.version=1
|
|
@ -5,7 +5,7 @@ import React, { Component } from 'react';
|
||||||
// We need to reference these files directly to avoid loading things that are not available
|
// We need to reference these files directly to avoid loading things that are not available
|
||||||
// in this environment (e.g. JitsiMeetJS or interfaceConfig)
|
// in this environment (e.g. JitsiMeetJS or interfaceConfig)
|
||||||
import StatelessAvatar from '../base/avatar/components/web/StatelessAvatar';
|
import StatelessAvatar from '../base/avatar/components/web/StatelessAvatar';
|
||||||
import { getInitials } from '../base/avatar/functions';
|
import { getAvatarColor, getInitials } from '../base/avatar/functions';
|
||||||
|
|
||||||
import Toolbar from './Toolbar';
|
import Toolbar from './Toolbar';
|
||||||
|
|
||||||
|
@ -24,6 +24,7 @@ type State = {
|
||||||
displayName: string,
|
displayName: string,
|
||||||
formattedDisplayName: string,
|
formattedDisplayName: string,
|
||||||
isVideoDisplayed: boolean,
|
isVideoDisplayed: boolean,
|
||||||
|
userID: string,
|
||||||
visible: boolean
|
visible: boolean
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -50,6 +51,7 @@ export default class AlwaysOnTop extends Component<*, State> {
|
||||||
displayName: '',
|
displayName: '',
|
||||||
formattedDisplayName: '',
|
formattedDisplayName: '',
|
||||||
isVideoDisplayed: true,
|
isVideoDisplayed: true,
|
||||||
|
userID: '',
|
||||||
visible: true
|
visible: true
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -132,7 +134,8 @@ export default class AlwaysOnTop extends Component<*, State> {
|
||||||
avatarURL,
|
avatarURL,
|
||||||
displayName,
|
displayName,
|
||||||
formattedDisplayName,
|
formattedDisplayName,
|
||||||
isVideoDisplayed
|
isVideoDisplayed,
|
||||||
|
userID
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -175,7 +178,7 @@ export default class AlwaysOnTop extends Component<*, State> {
|
||||||
* @returns {ReactElement}
|
* @returns {ReactElement}
|
||||||
*/
|
*/
|
||||||
_renderVideoNotAvailableScreen() {
|
_renderVideoNotAvailableScreen() {
|
||||||
const { avatarURL, displayName, formattedDisplayName, isVideoDisplayed } = this.state;
|
const { avatarURL, displayName, formattedDisplayName, isVideoDisplayed, userID } = this.state;
|
||||||
|
|
||||||
if (isVideoDisplayed) {
|
if (isVideoDisplayed) {
|
||||||
return null;
|
return null;
|
||||||
|
@ -185,6 +188,7 @@ export default class AlwaysOnTop extends Component<*, State> {
|
||||||
<div id = 'videoNotAvailableScreen'>
|
<div id = 'videoNotAvailableScreen'>
|
||||||
<div id = 'avatarContainer'>
|
<div id = 'avatarContainer'>
|
||||||
<StatelessAvatar
|
<StatelessAvatar
|
||||||
|
color = { getAvatarColor(userID) }
|
||||||
id = 'avatar'
|
id = 'avatar'
|
||||||
initials = { getInitials(displayName) }
|
initials = { getInitials(displayName) }
|
||||||
url = { avatarURL } />)
|
url = { avatarURL } />)
|
||||||
|
|
|
@ -175,13 +175,14 @@ class Avatar<P: Props> extends PureComponent<P, State> {
|
||||||
* @returns {Props}
|
* @returns {Props}
|
||||||
*/
|
*/
|
||||||
export function _mapStateToProps(state: Object, ownProps: Props) {
|
export function _mapStateToProps(state: Object, ownProps: Props) {
|
||||||
const { displayName, participantId } = ownProps;
|
const { colorBase, displayName, participantId } = ownProps;
|
||||||
const _participant = participantId && getParticipantById(state, participantId);
|
const _participant = participantId && getParticipantById(state, participantId);
|
||||||
const _initialsBase = (_participant && _participant.name) || displayName;
|
const _initialsBase = (_participant && _participant.name) || displayName;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
_initialsBase,
|
_initialsBase,
|
||||||
_loadableAvatarUrl: _participant && _participant.loadableAvatarUrl
|
_loadableAvatarUrl: _participant && _participant.loadableAvatarUrl,
|
||||||
|
colorBase: !colorBase && _participant ? _participant.id : colorBase
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue