import { Share } from "./share" ; import { UserManager } from "./UserManager" ; /**
 * this class handles the user list in the menu (GUI)
 */ export class UserListComponent { description private static readonly usersImageFileNames = [ '1F9D1-200D-1F384.svg' , '1F9D9.svg' , '1F9DA-200D-2640-FE0F.svg' , '1F9DD.svg' ] ; description public static updateGUIUsers ( ) { document . getElementById ( "userList" ) . innerHTML = "" ; for ( const userid in UserManager . users ) document . getElementById ( "userList" ) . appendChild ( UserListComponent . createUserHTMLElement ( userid ) ) ; UserListComponent . updateNumberOfUsers ( ) ; } description public static updateNumberOfUsers ( ) { if ( Share . isShared ( ) ) document . getElementById ( "numberOfUsers" ) . innerHTML = UserListComponent . getUserImage ( "u0" ) . outerHTML + " × " + UserManager . getNumberOfUsers ( ) ; } param userid description public static updateGUIUser ( userid ) { if ( UserListComponent . getUserHTMLElement ( userid ) ) document . getElementById ( "userList" ) . replaceChild ( UserListComponent . createUserHTMLElement ( userid ) , UserListComponent . getUserHTMLElement ( userid ) ) ; else UserListComponent . updateGUIUsers ( ) ; } param userid description public static add ( userid ) { document . getElementById ( "userList" ) . appendChild ( UserListComponent . createUserHTMLElement ( userid ) ) ; UserListComponent . updateNumberOfUsers ( ) ; } param userid description public static leave ( userid ) { UserListComponent . getUserHTMLElement ( userid ) . remove ( ) ; UserListComponent . updateNumberOfUsers ( ) ; } param userid returns public static getUserImage ( userid ) { const img = new Image ( ) ; let i = parseInt ( userid . substr ( 1 ) ) ; if ( isNaN ( i ) ) i = 0 ; img . src = "img/users/" + UserListComponent . usersImageFileNames [ i % UserListComponent . usersImageFileNames . length ] ; img . classList . add ( "userImage" ) ; return img ; } returns private static createRootImage ( ) { const img = new Image ( ) ; img . src = "img/users/1F451.svg" ; img . title = 'user with full privileges' ; img . style . width = "32px" ; return img ; } param userid return private static createCanWriteImage ( userid ) { const img = new Image ( ) ; img . src = UserManager . users [ userid ] . canWrite ? "img/users/270F.svg" : "img/users/1F6AB.svg" ; img . title = 'writing permission' ; img . style . width = "32px" ; if ( UserManager . me . isRoot && ( ! UserManager . users [ userid ] . isRoot || userid == UserManager . me . userID ) ) { img . style . cursor = "pointer" ; img . onclick = ( ) => { Share . execute ( "setUserCanWrite" , [ userid , ! UserManager . users [ userid ] . canWrite ] ) ; } ; } return img ; } param userID returns private static getUserHTMLElement ( userID ) { return document . getElementById ( "userElement" + userID ) ; } param userID description returns private static createUserHTMLElement ( userID ) { const userDOM = document . createElement ( "div" ) ; userDOM . id = "userElement" + userID ; userDOM . classList . add ( "user" ) ; userDOM . appendChild ( UserListComponent . getUserImage ( userID ) ) ; const userNameDOM = document . createElement ( "span" ) ; userNameDOM . innerHTML = UserManager . users [ userID ] . name ; userDOM . appendChild ( userNameDOM ) ; if ( UserManager . users [ userID ] . isRoot ) userDOM . appendChild ( UserListComponent . createRootImage ( ) ) ; userDOM . appendChild ( this . createCanWriteImage ( userID ) ) ; if ( userID == UserManager . me . userID ) userDOM . classList . add ( "me" ) ; return userDOM ; } }