diff options
Diffstat (limited to 'src/renderer/gameserver/onlineCount.ts')
-rw-r--r-- | src/renderer/gameserver/onlineCount.ts | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/src/renderer/gameserver/onlineCount.ts b/src/renderer/gameserver/onlineCount.ts new file mode 100644 index 0000000..af8a7b6 --- /dev/null +++ b/src/renderer/gameserver/onlineCount.ts @@ -0,0 +1,51 @@ +import GameServer from './server'; + +const MAX_SHOWN_NAMES = 3; + +export function makeOnlineCounterList(server:GameServer):HTMLElement{ + + const playerList = [ + 'LawnCable', + 'Saulc GM', + 'Crazyfefe', + 'Jesus Saves', + 'DUSTMAN' + ]; + + return generateHTML(playerList); +} + + +function generateHTML(onlinePlayers:string[]):HTMLElement{ + const OnlineCounterContainer = document.createElement('span'); + OnlineCounterContainer.classList.add("onlineCounter"); + OnlineCounterContainer.innerHTML = `<i class="fas fa-users fa-xs"></i>${onlinePlayers.length} Players online<br>`; + + const PlayerList = document.createElement('span'); + PlayerList.classList.add("playerList"); + + let displayed_players = + MAX_SHOWN_NAMES < onlinePlayers.length ? + onlinePlayers.slice(0, MAX_SHOWN_NAMES):onlinePlayers; + + displayed_players.forEach(playername => { + const PlayerItem = document.createElement('span'); + PlayerItem.classList.add("playerItem"); + PlayerItem.innerHTML=`<i class="fas fa-circle fa-xs" data-fa-transform="shrink-8 left-2"></i>${playername}`; + PlayerList.appendChild(PlayerItem); + }); + + + if(MAX_SHOWN_NAMES < onlinePlayers.length){ + const hiddenPlayers = onlinePlayers.filter(playername => displayed_players.indexOf(playername) == -1); + const MorePlayers = document.createElement('span'); + MorePlayers.classList.add("morePlayers"); + MorePlayers.innerText = ` and ${onlinePlayers.length-MAX_SHOWN_NAMES} more..`; + MorePlayers.title = hiddenPlayers.join('\n'); + + PlayerList.appendChild(MorePlayers); + } + + OnlineCounterContainer.appendChild(PlayerList); + return OnlineCounterContainer; +} |