feat: use participant id for avatar color

android/app/.classpath

+<?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>

android/app/.settings/org.eclipse.buildship.core.prefs

+connection.project.dir=..
+eclipse.preferences.version=1

android/sdk/.classpath

+<?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>

android/sdk/.settings/org.eclipse.buildship.core.prefs

+connection.project.dir=..
+eclipse.preferences.version=1

react/features/always-on-top/AlwaysOnTop.js

 // We need to reference these files directly to avoid loading things that are not available
 // in this environment (e.g. JitsiMeetJS or interfaceConfig)
 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';
 
     displayName: string,
     formattedDisplayName: string,
     isVideoDisplayed: boolean,
+    userID: string,
     visible: boolean
 };
 
             displayName: '',
             formattedDisplayName: '',
             isVideoDisplayed: true,
+            userID: '',
             visible: true
         };
 
             avatarURL,
             displayName,
             formattedDisplayName,
-            isVideoDisplayed
+            isVideoDisplayed,
+            userID
         });
     }
 
      * @returns {ReactElement}
      */
     _renderVideoNotAvailableScreen() {
-        const { avatarURL, displayName, formattedDisplayName, isVideoDisplayed } = this.state;
+        const { avatarURL, displayName, formattedDisplayName, isVideoDisplayed, userID } = this.state;
 
         if (isVideoDisplayed) {
             return null;
             <div id = 'videoNotAvailableScreen'>
                 <div id = 'avatarContainer'>
                     <StatelessAvatar
+                        color = { getAvatarColor(userID) }
                         id = 'avatar'
                         initials = { getInitials(displayName) }
                         url = { avatarURL } />)

react/features/base/avatar/components/Avatar.js

  * @returns {Props}
  */
 export function _mapStateToProps(state: Object, ownProps: Props) {
-    const { displayName, participantId } = ownProps;
+    const { colorBase, displayName, participantId } = ownProps;
     const _participant = participantId && getParticipantById(state, participantId);
     const _initialsBase = (_participant && _participant.name) || displayName;
 
     return {
         _initialsBase,
-        _loadableAvatarUrl: _participant && _participant.loadableAvatarUrl
+        _loadableAvatarUrl: _participant && _participant.loadableAvatarUrl,
+        colorBase: !colorBase && _participant ? _participant.id : colorBase
     };
 }