diff options
Diffstat (limited to 'WebInterface/NodeJSServer/src/js/src_old')
5 files changed, 0 insertions, 454 deletions
diff --git a/WebInterface/NodeJSServer/src/js/src_old/modules/playModule.js b/WebInterface/NodeJSServer/src/js/src_old/modules/playModule.js deleted file mode 100644 index 931f598..0000000 --- a/WebInterface/NodeJSServer/src/js/src_old/modules/playModule.js +++ /dev/null @@ -1,46 +0,0 @@ -// TODO: Handle disconnect - -/** - * Handles ingame networking; - */ -export default class GameClient { - /** - * Defines basic attributes - * @param {string} user The username of the player - * @param {HubConnection} connection Already established connection to the - * server - */ - constructor(user, connection) { - this.user = user; - this.connection = connection; - } - - /** - * Registers chat html component - * @param {string} chatId Id of chat component - */ - registerChat(chatId) { - this.chat = document.getElementById(chatId); - this.messageList = this.chat.querySelector('#message-list'); - this.messageInput = this.chat.querySelector('#input-message'); - this.messageSend = this.chat.querySelector('#send-message'); - - this.connection.on('ReceiveMessage', (user, message) => { - let msg = message.replace(/&/g, '&') - .replace(/</g, '<') - .replace(/>/g, '>'); - let encodedMsg = user + ' sagt: ' + msg; - - let messageP = document.createElement('p'); - messageP.class = 'message'; - messageP.textContent = encodedMsg; - - this.messageList.appendChild(messageP); - }); - - this.messageSend.addEventListener('click', () => { - let message = this.messageInput.value; - this.connection.invoke('SendMessage', this.user, message); - }); - } -} diff --git a/WebInterface/NodeJSServer/src/js/src_old/modules/server-client.js b/WebInterface/NodeJSServer/src/js/src_old/modules/server-client.js deleted file mode 100644 index 2f712b5..0000000 --- a/WebInterface/NodeJSServer/src/js/src_old/modules/server-client.js +++ /dev/null @@ -1,93 +0,0 @@ -import * as signalR from '@aspnet/signalr'; -import ServerListing from './ui/server-listing.js'; - -/** - * Class for communication to server - */ -export default class ServerClient { - /** - * Creates new connection - * @param {string} url URL of server running signalR - * @param {string} serverListingId HTML ID of server-listing element, - * to populate with available games - * @param {BannerController} notifications Notification Manager - * @param {array} ui UI Elements to reload on login - * @param {boolean} [debug=false] Enable debug output? - */ - constructor(url, serverListingId, notifications, ui, debug = false) { - this.ui = ui; - const connectionBuilder = new signalR.HubConnectionBuilder() - .withUrl(url); - - if (debug) { - connectionBuilder.configureLogging(signalR.LogLevel.Debug); - } else { - connectionBuilder.configureLogging(signalR.LogLevel.Error); - } - - this.connection = connectionBuilder.build(); - this.connection.start() - .then(() => this.loadServers()) // Load games list, once connected - .catch((err) => console.error(err.toString())); - - // Initialize refreshing (blocks new refreshes if true) - this.refreshing = false; - - this.serverListing = new ServerListing(serverListingId, notifications); - } - - /** - * Requests list of avalable games on the server - */ - loadServers() { - if (this.refreshing) return; // If already refreshing, no new request - - this.connection.on('ListGroups', (groups) => { - // Populate server listing - this.serverListing.flushElements(); - this.serverListing.addElements(groups, this, this.ui); - this.connection.off('ListGroups'); - - this.refreshing = false; - }); - - this.connection.invoke('GetGroups') - .catch((err) => { - this.refreshing = false; - console.error(err.toString()); - }); - this.refreshing = true; - } - - /** - * Sends a game creating request to the server - * @param {string} name Name of the new game - * @param {string} password Password - */ - createServer(name, password) { - // TODO: Create - } - - /** - * Sends a login request - * @param {string} group Group name to join - * @param {string} password Password to send as SHA-256 Base64 String - * @param {string} username Display name to use - * @param {ServerClient~loginCallback} callback Callback function to use - */ - sendLogin(group, password, username, callback) { - this.connection.on('LoginResponse', (result) => { - callback(result, this.connection); - this.connection.off('LoginResponse'); - }); - this.connection.invoke('Login', group, username, password); - } -} - -/** - * Callback to call with response to login request - * @callback ServerClient~loginCallback - * @param {number} result 0: Success, 1: PasswordError, 2:UsernameTaken, - * 3:Unknown Error - * @param {ConnectionHub} connection Connection to the server - */ diff --git a/WebInterface/NodeJSServer/src/js/src_old/modules/ui/login-modal.js b/WebInterface/NodeJSServer/src/js/src_old/modules/ui/login-modal.js deleted file mode 100644 index 13de78e..0000000 --- a/WebInterface/NodeJSServer/src/js/src_old/modules/ui/login-modal.js +++ /dev/null @@ -1,181 +0,0 @@ -import Modal from './modal.js'; -import '../hash.js'; - -/** - * Class to implement a login modal from the parent modal class - */ -export default class LoginModal extends Modal { - /** - * Creates necessary elements for login modal - * @param {string} serverName Name of the server, used for login and displayed - * in title - * @param {ServerClient} serverClient Server client object used to send the - * login - * @param {BannerController} notificationManager Object controlling the main - * notification banners - * @param {array} ui UI elements to call refresh method on after login - */ - constructor(serverName, serverClient, notificationManager, ui) { - super(serverName); - this.serverName = serverName; - this.serverClient = serverClient; - this.notificationManager = notificationManager; - this.pageUI = ui; - - let passBox = document.createElement('div'); - let nameBox = document.createElement('div'); - let sendBox = document.createElement('div'); - - let passwordLabel = document.createElement('label'); - let passwordInput = document.createElement('input'); - let passwordInvalid = document.createElement('span'); - passwordLabel.setAttribute('for', 'password-input'); - passwordLabel.textContent = 'Passwort:'; - passwordLabel.title = 'Das Passwort des Spiels'; - passwordInput.id = 'password-input'; - passwordInput.type = 'password'; - passwordInput.placeholder = 'Passwort'; - passwordInput.title = 'Das Passwort des Spiels'; - passwordInvalid.className = 'invalid hidden'; - passwordInvalid.textContent = 'Das eingegebene Passwort ist falsch.'; - - let nameLabel = document.createElement('label'); - let nameInput = document.createElement('input'); - let nameInvalid = document.createElement('span'); - nameLabel.setAttribute('for', 'name-input'); - nameLabel.textContent = 'Benutzername:'; - nameLabel.title = 'Dein Anzeigename'; - nameInput.id = 'name-input'; - nameInput.type = 'text'; - nameInput.autocomplete = 'on'; - nameInput.placeholder = 'Name'; - nameInput.title = 'Dein Anzeigename'; - nameInvalid.className = 'invalid hidden'; - nameInvalid.textContent = - 'Der eingegebene Nutzername ist bereits vergeben.'; - - let sendButton = document.createElement('button'); - sendButton.className = 'btn'; - sendButton.textContent = 'Login'; - sendButton.id = 'login-button'; - - passBox.appendChild(passwordLabel); - passBox.appendChild(passwordInput); - passBox.appendChild(passwordInvalid); - nameBox.appendChild(nameLabel); - nameBox.appendChild(nameInput); - nameBox.appendChild(nameInvalid); - sendBox.appendChild(sendButton); - - this.body.appendChild(passBox); - this.body.appendChild(nameBox); - this.body.appendChild(sendBox); - - this.nameInput = nameInput; - this.passwordInput = passwordInput; - this.loginButton = sendButton; - - this.passwordInvalid = passwordInvalid; - this.nameInvalid = nameInvalid; - - this.registerLoginBtn(); - } - - /** - * Registers event to send login, on button press - */ - registerLoginBtn() { - let eventListener; - let loginCallBack = (result, connection) => { - console.log(result); - if (result == 0) { - this.redirectToPlay(connection); - this.close(); - } else if (result == 1) { - this.invalid('Name'); - this.loginButton.addEventListener('click', eventListener); - } else if (result == 2) { - this.invalid('Pass'); - this.loginButton.addEventListener('click', eventListener); - } else { - this.notificationManager.show('unknownLoginErr', - 'Ein unbekannter Fehler ist aufgetreten'); - this.close(); - } - }; - - eventListener = () => { - this.invalid(); // Remove 'invalid' messages - this.loginButton.removeEventListener('click', eventListener); - this.userName = this.nameInput.value; - this.passwordInput.value.getHash() - .then((result) => { - this.serverClient.sendLogin(this.serverName, result, - this.userName, loginCallBack); - }); - }; - this.loginButton.addEventListener('click', eventListener); - } - - /** - * Displays text under invalid password / username - * @param {string} inv Which field to display under (Pass / Name) - * Blank inv will hide both - */ - invalid(inv) { - this.body.classList.remove('frst-warning'); - this.body.classList.remove('scnd-warning'); - - this.passwordInvalid.classList.add('hidden'); - this.nameInvalid.classList.add('hidden'); - - this.passwordInput.style.borderColor = 'none'; - this.nameInput.style.borderColor = 'none'; - - if (inv == 'Pass') { - this.body.classList.add('frst-warning'); - this.passwordInvalid.classList.remove('hidden'); - this.passwordInput.style.borderColor = '#ef5350'; - } else if (inv == 'Name') { - this.body.classList.add('scnd-warning'); - this.nameInvalid.classList.remove('hidden'); - this.nameInput.style.borderColor = '#ef5350'; - } - } - - /** - * Loads play site - * @param {HubConnection} connection Connection to the server - */ - redirectToPlay(connection) { - window.history.pushState('object or string', 'Game Page', - 'play#game=' + this.serverName); - fetch('play').then((response) => { - response.text().then((htmlString) => { - // Replace all references, since we're starting one level farther up - htmlString = htmlString.replace(/\.\.\//g, './'); - htmlString = /<body>((.)|(\n))*<\/body>/g.exec(htmlString)[0]; - htmlString = htmlString.replace(/<script src=".*"><\/script>/, ''); - htmlString = htmlString.replace( - /<remove_if_redirected>((.)|\n)*?<\/remove_if_redirected>/g, ''); - document.body.innerHTML = htmlString; - - let stylesheet = document.createElement('link'); - stylesheet.rel = 'stylesheet'; - stylesheet.type = 'text/css'; - stylesheet.href = './style/play.css'; - document.head.appendChild(stylesheet); - - for (let ui of this.pageUI) { - ui.refresh(); - } - - import(/* webpackChunkName: "/playModule" */ '../playModule') - .then(({default: GameClient}) => { - let gameClient = new GameClient(this.userName, connection); - gameClient.registerChat('chat'); - }); - }); - }); - } -} diff --git a/WebInterface/NodeJSServer/src/js/src_old/modules/ui/modal.js b/WebInterface/NodeJSServer/src/js/src_old/modules/ui/modal.js deleted file mode 100644 index 10a1be5..0000000 --- a/WebInterface/NodeJSServer/src/js/src_old/modules/ui/modal.js +++ /dev/null @@ -1,67 +0,0 @@ -/** - * Parent class to create Modals on the screen - * Contains no content, as that is implemented by child classes - */ -export default class Modal { - /** - * Creates a new modal with a title and empty content - * @param {string} titleString Title to show at the top of the modal - */ - constructor(titleString) { - let modalBackground = document.createElement('div'); - let modal = document.createElement('div'); - let title = document.createElement('h1'); - let body = document.createElement('div'); - - modalBackground.className = 'modal-container'; - modal.className = 'modal'; - title.className = 'modal-title'; - body.className = 'modal-body'; - - title.textContent = titleString; - - modal.appendChild(title); - modal.appendChild(body); - modalBackground.appendChild(modal); - document.body.appendChild(modalBackground); - - this.bg = modalBackground; - this.modal = modal; - this.title = title; - this.body = body; - - this.registerEvents(); - } - - /** - * Register event to close if clicked outside of modal - * Clicking on the modal itself should not close it though - */ - registerEvents() { - this.modal.addEventListener('click', (e) => { - e.stopPropagation(); - }); - - this.bg.addEventListener('click', () => { - this.close(); - }); - } - - /** - * Fades modal out and removes it from the flow of the document - */ - close() { - this.bg.classList.add('hidden'); - this.bg.addEventListener('transitionend', () => { - document.body.removeChild(this.bg); - }); - } - - /** - * Puts text in the body - * @param {string} text Text to put into the body - */ - setBodyText(text) { - this.body.textContent = text; - } -} diff --git a/WebInterface/NodeJSServer/src/js/src_old/modules/ui/server-listing.js b/WebInterface/NodeJSServer/src/js/src_old/modules/ui/server-listing.js deleted file mode 100644 index 78ca323..0000000 --- a/WebInterface/NodeJSServer/src/js/src_old/modules/ui/server-listing.js +++ /dev/null @@ -1,67 +0,0 @@ -import LoginModal from './login-modal.js'; - -/** - * Class for handling the server list - */ -export default class ServerListing { - /** - * Creates reference to container - * @param {string} serverListId ID of the server list div - * @param {BannerController} notifications Notification Manager - */ - constructor(serverListId, notifications) { - this.serverListing = document.getElementById(serverListId); - this.notifications = notifications; - } - - /** - * Removes all elements currently in the server listing - */ - flushElements() { - this.serverListing.innerHTML = ''; - } - - /** - * Populates servers from a given array of games - * @param {array} array Array of available games - * @param {ServerClient} serverClient Server Client to handle login - * @param {array} ui UI Elements to reload after login - */ - addElements(array, serverClient, ui) { - for (let server of array) { - const name = server['name']; - const playerAmount = server['userCount']; - - let serverDiv = document.createElement('div'); - let nameSpan = document.createElement('span'); - let rightAlignDiv = document.createElement('div'); - 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'; - rightAlignDiv.className = 'right-aligned-items'; - 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'; - joinButton.addEventListener('click', () => { - new LoginModal(name, serverClient, this.notifications, ui); - }); - - rightAlignDiv.appendChild(onlineDot); - rightAlignDiv.appendChild(playerCountSpan); - rightAlignDiv.appendChild(playerCountStaticSpan); - rightAlignDiv.appendChild(joinButton); - serverDiv.appendChild(nameSpan); - serverDiv.appendChild(rightAlignDiv); - this.serverListing.appendChild(serverDiv); - } - } -} |