From abd51697be6ca4580c15929ccb2569a1e984ef88 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sat, 29 Sep 2018 21:51:02 +0200 Subject: Did some code splitting and added Server Listing Split code into different modules Added method to fetch server list from remote server, and to populate this into the server list of the UI --- .../NodeJSServer/src/modules/ui/server-listing.js | 42 ++++++++++++++++++++++ 1 file changed, 42 insertions(+) create mode 100644 WebInterface/NodeJSServer/src/modules/ui/server-listing.js (limited to 'WebInterface/NodeJSServer/src/modules/ui/server-listing.js') diff --git a/WebInterface/NodeJSServer/src/modules/ui/server-listing.js b/WebInterface/NodeJSServer/src/modules/ui/server-listing.js new file mode 100644 index 0000000..be66573 --- /dev/null +++ b/WebInterface/NodeJSServer/src/modules/ui/server-listing.js @@ -0,0 +1,42 @@ +export default class ServerListing { + constructor(serverListId) { + this.serverListing = document.getElementById(serverListId); + } + + flushElements() { + this.serverListing.innerHTML = ''; + } + + addElements(array) { + for (let server of array) { + const name = server['name']; + const playerList = server['users']; + const playerAmount = playerList.length; + + let serverDiv = document.createElement('div'); + let nameSpan = document.createElement('span'); + let onlineDot = document.createElement('div'); + let playerCountSpan = document.createElement('span'); + let playerCountStaticSpan = document.createElement('span'); + let joinButton = document.createElement('button'); + serverDiv.className = 'server'; + nameSpan.className = 'server-name'; + onlineDot.className = 'player-count-dot'; + playerCountSpan.className = 'player-count'; + playerCountStaticSpan.className = 'player-count-static'; + joinButton.className = 'btn join-btn'; + joinButton.id = 'join'; + nameSpan.textContent = name; + playerCountSpan.textContent = playerAmount; + playerCountStaticSpan.textContent = 'Spieler online'; + joinButton.textContent = 'Beitreten'; + + serverDiv.appendChild(nameSpan); + serverDiv.appendChild(onlineDot); + serverDiv.appendChild(playerCountSpan); + serverDiv.appendChild(playerCountStaticSpan); + serverDiv.appendChild(joinButton); + this.serverListing.appendChild(serverDiv); + } + } +} -- cgit v1.2.3-54-g00ecf