From c0a4272fcc15da322b3b63fb0a3e211e786504e0 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 16:04:18 +0200 Subject: Split up SASS into multiple files This will make adding pages much more easy, as some elements can be reused. --- WebInterface/NodeJSServer/dist/chat.js | 34 -- WebInterface/NodeJSServer/dist/index.css | 1 - WebInterface/NodeJSServer/dist/index.html | 8 +- WebInterface/NodeJSServer/dist/index.js | 16 - WebInterface/NodeJSServer/dist/script/index.js | 16 + WebInterface/NodeJSServer/dist/style/index.css | 1 + WebInterface/NodeJSServer/src/style/index.scss | 435 +-------------------- .../NodeJSServer/src/style/partials/_base.scss | 18 + .../NodeJSServer/src/style/partials/_btn.scss | 73 ++++ .../src/style/partials/backdrop/_base.scss | 56 +++ .../src/style/partials/backdrop/_menu.scss | 41 ++ .../src/style/partials/front-layer/_base.scss | 23 ++ .../src/style/partials/front-layer/_copyright.scss | 10 + .../style/partials/front-layer/_notifications.scss | 64 +++ .../partials/front-layer/_server-listing.scss | 113 ++++++ .../src/style/partials/modal/_base.scss | 31 ++ 16 files changed, 460 insertions(+), 480 deletions(-) delete mode 100644 WebInterface/NodeJSServer/dist/chat.js delete mode 100644 WebInterface/NodeJSServer/dist/index.css delete mode 100644 WebInterface/NodeJSServer/dist/index.js create mode 100644 WebInterface/NodeJSServer/dist/script/index.js create mode 100644 WebInterface/NodeJSServer/dist/style/index.css create mode 100644 WebInterface/NodeJSServer/src/style/partials/_base.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/_btn.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss create mode 100644 WebInterface/NodeJSServer/src/style/partials/modal/_base.scss diff --git a/WebInterface/NodeJSServer/dist/chat.js b/WebInterface/NodeJSServer/dist/chat.js deleted file mode 100644 index e9baff1..0000000 --- a/WebInterface/NodeJSServer/dist/chat.js +++ /dev/null @@ -1,34 +0,0 @@ -"use strict"; - -var connection = new signalR.HubConnectionBuilder().withUrl("https://192.168.2.58:5001/chatHub").build(); - -connection.on("ReceiveMessage", function (user, message) { - var msg = message.replace(/&/g, "&").replace(//g, ">"); - var encodedMsg = user + " says " + msg; - var li = document.createElement("li"); - li.textContent = encodedMsg; - document.getElementById("messagesList").appendChild(li); -}); - -connection.start().catch(function (err) { - return console.error(err.toString()); -}); - -document.getElementById("loginButton").addEventListener("click", function (event) { - var group = document.getElementById("userInput").value; - var password = document.getElementById("messageInput").value; - connection.invoke("Login", group, password).catch(function (err) { - return console.error(err.toString()); - }); - event.preventDefault(); -}); - -document.getElementById("sendButton").addEventListener("click", function (event) { - var user = document.getElementById("userInput").value; - var message = document.getElementById("messageInput").value; - var group = "TheCrew"; - connection.invoke("SendMessage", user, message).catch(function (err) { - return console.error(err.toString()); - }); - event.preventDefault(); -}); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/index.css b/WebInterface/NodeJSServer/dist/index.css deleted file mode 100644 index 21b5801..0000000 --- a/WebInterface/NodeJSServer/dist/index.css +++ /dev/null @@ -1 +0,0 @@ -html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.btn{border:none;border-radius:4px;padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;background-color:#546e7a;color:#fff;text-transform:uppercase;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);cursor:pointer;letter-spacing:0.25rem;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.btn:hover{background:#29434e radial-gradient(circle, transparent 1%, #29434e 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12);box-shadow:0 1px 3px rgba(0,0,0,0.12);-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.btn:disabled{color:#ffffff61;background:#546e7a61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.text-btn{padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;color:#fff;background-color:rgba(0,0,0,0);text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.text-btn:hover{background:#29434e61 radial-gradient(circle, transparent 1%, #29434e61 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.text-btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.text-btn:disabled{background:rgba(0,0,0,0);color:#ffffff61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("./ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("./ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.container{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.container .banner{z-index:1;background-color:white;border:none;border-radius:16px 16px 0 0;display:-webkit-box;display:-ms-flexbox;display:flex;margin:0;margin-bottom:1rem;padding-top:1rem;max-height:10rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-transform-origin:top;transform-origin:top;-webkit-transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;min-height:3.5rem;justify-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (max-height: 550px){.container .banner{position:absolute;width:100%;-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}}.container .banner.hidden{-webkit-transform:scaleY(0);transform:scaleY(0);visibility:hidden;max-height:0;-webkit-transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;min-height:0;margin-bottom:0}.container .banner .banner-text{-ms-flex-item-align:left;-ms-grid-row-align:left;align-self:left;margin:1rem;-webkit-box-flex:100;-ms-flex-positive:100;flex-grow:100}.container .banner .btn-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.container .banner .btn-container .banner-button{color:#29434e;padding:8px 16px;margin:0;margin-right:1rem;letter-spacing:0.125rem}.container .banner hr{width:100%}@media (max-height: 550px){.container .banner hr{margin-bottom:0}}.container .server-listing{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#212121;color:#fff;min-height:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-style:none;border-radius:8px;margin:1rem;margin-bottom:2rem;padding:0.5rem;padding-top:0.25rem;-webkit-box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2)}.container .server-listing h1{text-align:center}@media (max-height: 550px){.container .server-listing h1{display:none}}.container .server-listing hr{width:100%}@media (max-height: 550px){.container .server-listing hr{display:none}}@media (max-height: 450px){.container .server-listing{padding-bottom:0.125rem}}.container .server-listing .server-entries{overflow-y:auto;min-height:0}.container .server-listing .server-entries .server{font-size:1.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#484848;padding:0.5rem;margin-bottom:0.25rem;border-style:none;border-radius:8px}@media (max-width: 1000px){.container .server-listing .server-entries .server{-ms-flex-wrap:wrap;flex-wrap:wrap}}.container .server-listing .server-entries .server .server-name{font-weight:bold;letter-spacing:0.125rem;white-space:nowrap;overflow:hidden;margin:0.5rem 0}.container .server-listing .server-entries .server .player-count{font-family:'Roboto Condensed', sans-serif}.container .server-listing .server-entries .server .player-count-static{white-space:nowrap;margin-left:0.25rem;letter-spacing:0;font-family:'Roboto Condensed', sans-serif}@media (max-width: 1000px){.container .server-listing .server-entries .server .player-count-static{display:none}}.container .server-listing .server-entries .server .player-count-dot{background-color:#393;border-radius:50%;min-width:1rem;min-height:1rem;width:1rem;height:1rem;margin-left:auto;margin-right:0.25rem}.container .server-listing .server-entries .server .join-btn{margin-left:0.5rem;min-width:12rem}.container .server-listing .button-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:1rem;margin-right:0.25rem;min-height:2.5rem}@media (max-height: 450px){.container .server-listing .button-container{margin-top:0.125rem;min-height:2rem}}.container .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}.modal-container{position:absolute;top:0;width:100vw;height:100vh;background-color:#000000AA;display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease}.modal-container.hidden{opacity:0}.modal-container .modal{background-color:#546e7a;margin:auto;padding:1rem;border-style:none;border-radius:8px;-webkit-box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22);box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22)}.modal-container .modal-title{margin:1rem}.modal-container .modal-body{margin:0.25rem} diff --git a/WebInterface/NodeJSServer/dist/index.html b/WebInterface/NodeJSServer/dist/index.html index b2a32c3..b8d758e 100644 --- a/WebInterface/NodeJSServer/dist/index.html +++ b/WebInterface/NodeJSServer/dist/index.html @@ -9,7 +9,7 @@ Helden Online - + @@ -22,10 +22,10 @@ -
+
- + diff --git a/WebInterface/NodeJSServer/dist/index.js b/WebInterface/NodeJSServer/dist/index.js deleted file mode 100644 index 67f33c0..0000000 --- a/WebInterface/NodeJSServer/dist/index.js +++ /dev/null @@ -1,16 +0,0 @@ -!function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";n.r(e); -/*! ***************************************************************************** -Copyright (c) Microsoft Corporation. All rights reserved. -Licensed under the Apache License, Version 2.0 (the "License"); you may not use -this file except in compliance with the License. You may obtain a copy of the -License at http://www.apache.org/licenses/LICENSE-2.0 - -THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED -WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, -MERCHANTABLITY OR NON-INFRINGEMENT. - -See the Apache Version 2.0 License for specific language governing permissions -and limitations under the License. -***************************************************************************** */ -var o=function(t,e){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function r(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var s=function(){return(s=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new p(r.status,r.statusText,r.response||r.responseText)):o(new u(r.statusText,r.status))},r.onerror=function(){e.logger.log(c.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new u(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(c.Warning,"Timeout from HTTP request."),o(new l)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(s({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(s({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(s({},e,{method:"DELETE",url:t}))},t}()),d=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),f=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return d.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(d.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(d.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=d.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(h||(h={}));var v=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),m=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function b(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function y(t,e,n,o,r,s,u){return i(this,void 0,void 0,function(){var i,l,h,p;return a(this,function(a){switch(a.label){case 0:return[4,r()];case 1:return(l=a.sent())&&((p={}).Authorization="Bearer "+l,i=p),t.log(c.Trace,"("+e+" transport) sending data. "+b(s,u)+"."),[4,n.post(o,{content:s,headers:i})];case 2:return h=a.sent(),t.log(c.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var w,S,E=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),k=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case c.Critical:case c.Error:console.error(c[t]+": "+e);break;case c.Warning:console.warn(c[t]+": "+e);break;case c.Information:console.info(c[t]+": "+e);break;default:console.log(c[t]+": "+e)}},t}(),T=3e4,I=function(){function t(t,e,n){var o=this;m.isRequired(t,"connection"),m.isRequired(e,"logger"),m.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=T,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new f,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return i(this,void 0,void 0,function(){var t;return a(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(c.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(c.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(c.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(c.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(c.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.running?[2,y(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return i(this,void 0,void 0,function(){var t,e,n=this;return a(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(c.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(c.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(c.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),M=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return i(this,void 0,void 0,function(){var n,o=this;return a(this,function(r){switch(r.label){case 0:if(m.isRequired(t,"url"),m.isRequired(e,"transferFormat"),m.isIn(e,S,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(c.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==S.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(c.Trace,"(SSE transport) data received. "+b(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(c.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.eventSource?[2,y(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),R=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return i(this,void 0,void 0,function(){var n,o=this;return a(this,function(r){switch(r.label){case 0:if(m.isRequired(t,"url"),m.isRequired(e,"transferFormat"),m.isIn(e,S,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(c.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===S.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(c.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(c.Trace,"(WebSockets transport) data received. "+b(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(c.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(c.Trace,"(WebSockets transport) sending data. "+b(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),O=function(){function t(t,e){void 0===e&&(e={}),this.features={},m.isRequired(t,"url"),this.logger=function(t){return void 0===t?new k(c.Information):null===t?v.instance:t.log?t:new k(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new g(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||S.Binary,m.isIn(t,S,"transferFormat"),this.logger.log(c.Debug,"Starting connection with transfer format '"+S[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return i(this,void 0,void 0,function(){var e,n,o,r,s,i,u,l=this;return a(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==w.WebSockets?[3,3]:(this.transport=this.constructTransport(w.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return a(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof x&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw u=h.sent(),this.logger.log(c.Error,"Failed to start the connection: "+u),this.connectionState=2,this.transport=null,u;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return i(this,void 0,void 0,function(){var e,n,o,r,s,i;return a(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(c.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(c.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return i(this,void 0,void 0,function(){var r,s,i,u,l,h,p;return a(this,function(a){switch(a.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(c.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return a.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,u=s,a.label=3;case 3:return i=0){if(!(o===w.WebSockets&&"undefined"==typeof WebSocket||o===w.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(c.Debug,"Selecting transport '"+w[o]+"'"),o;this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it is not supported in your environment.'")}else this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it does not support the requested transfer format '"+S[n]+"'.");else this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(c.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(c.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(c.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var N="json",F=function(){function t(){this.name=N,this.version=1,this.transferFormat=S.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=v.instance);for(var n=[],o=0,r=d.parse(t);o{this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})})}setBodyText(t){this.body.textContent=t}}new class{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let j=new class{constructor(t,e,n=!1){const o=(new q).withUrl(t);n?o.configureLogging(c.Debug):o.configureLogging(c.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new B(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.117.197:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",j.loadServers.bind(j)),new H("Test Titel")}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/script/index.js b/WebInterface/NodeJSServer/dist/script/index.js new file mode 100644 index 0000000..67f33c0 --- /dev/null +++ b/WebInterface/NodeJSServer/dist/script/index.js @@ -0,0 +1,16 @@ +!function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";n.r(e); +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. All rights reserved. +Licensed under the Apache License, Version 2.0 (the "License"); you may not use +this file except in compliance with the License. You may obtain a copy of the +License at http://www.apache.org/licenses/LICENSE-2.0 + +THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED +WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, +MERCHANTABLITY OR NON-INFRINGEMENT. + +See the Apache Version 2.0 License for specific language governing permissions +and limitations under the License. +***************************************************************************** */ +var o=function(t,e){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function r(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var s=function(){return(s=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new p(r.status,r.statusText,r.response||r.responseText)):o(new u(r.statusText,r.status))},r.onerror=function(){e.logger.log(c.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new u(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(c.Warning,"Timeout from HTTP request."),o(new l)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(s({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(s({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(s({},e,{method:"DELETE",url:t}))},t}()),d=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),f=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return d.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(d.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(d.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=d.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(h||(h={}));var v=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),m=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function b(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function y(t,e,n,o,r,s,u){return i(this,void 0,void 0,function(){var i,l,h,p;return a(this,function(a){switch(a.label){case 0:return[4,r()];case 1:return(l=a.sent())&&((p={}).Authorization="Bearer "+l,i=p),t.log(c.Trace,"("+e+" transport) sending data. "+b(s,u)+"."),[4,n.post(o,{content:s,headers:i})];case 2:return h=a.sent(),t.log(c.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var w,S,E=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),k=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case c.Critical:case c.Error:console.error(c[t]+": "+e);break;case c.Warning:console.warn(c[t]+": "+e);break;case c.Information:console.info(c[t]+": "+e);break;default:console.log(c[t]+": "+e)}},t}(),T=3e4,I=function(){function t(t,e,n){var o=this;m.isRequired(t,"connection"),m.isRequired(e,"logger"),m.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=T,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new f,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return i(this,void 0,void 0,function(){var t;return a(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(c.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(c.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(c.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(c.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(c.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.running?[2,y(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return i(this,void 0,void 0,function(){var t,e,n=this;return a(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(c.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(c.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(c.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),M=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return i(this,void 0,void 0,function(){var n,o=this;return a(this,function(r){switch(r.label){case 0:if(m.isRequired(t,"url"),m.isRequired(e,"transferFormat"),m.isIn(e,S,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(c.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==S.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(c.Trace,"(SSE transport) data received. "+b(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(c.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.eventSource?[2,y(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),R=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return i(this,void 0,void 0,function(){var n,o=this;return a(this,function(r){switch(r.label){case 0:if(m.isRequired(t,"url"),m.isRequired(e,"transferFormat"),m.isIn(e,S,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(c.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===S.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(c.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(c.Trace,"(WebSockets transport) data received. "+b(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(c.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(c.Trace,"(WebSockets transport) sending data. "+b(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),O=function(){function t(t,e){void 0===e&&(e={}),this.features={},m.isRequired(t,"url"),this.logger=function(t){return void 0===t?new k(c.Information):null===t?v.instance:t.log?t:new k(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new g(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||S.Binary,m.isIn(t,S,"transferFormat"),this.logger.log(c.Debug,"Starting connection with transfer format '"+S[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return i(this,void 0,void 0,function(){var e,n,o,r,s,i,u,l=this;return a(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==w.WebSockets?[3,3]:(this.transport=this.constructTransport(w.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return a(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof x&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw u=h.sent(),this.logger.log(c.Error,"Failed to start the connection: "+u),this.connectionState=2,this.transport=null,u;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return i(this,void 0,void 0,function(){var e,n,o,r,s,i;return a(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(c.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(c.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return i(this,void 0,void 0,function(){var r,s,i,u,l,h,p;return a(this,function(a){switch(a.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(c.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return a.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,u=s,a.label=3;case 3:return i=0){if(!(o===w.WebSockets&&"undefined"==typeof WebSocket||o===w.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(c.Debug,"Selecting transport '"+w[o]+"'"),o;this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it is not supported in your environment.'")}else this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it does not support the requested transfer format '"+S[n]+"'.");else this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(c.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(c.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(c.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var N="json",F=function(){function t(){this.name=N,this.version=1,this.transferFormat=S.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=v.instance);for(var n=[],o=0,r=d.parse(t);o{this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})})}setBodyText(t){this.body.textContent=t}}new class{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let j=new class{constructor(t,e,n=!1){const o=(new q).withUrl(t);n?o.configureLogging(c.Debug):o.configureLogging(c.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new B(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.117.197:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",j.loadServers.bind(j)),new H("Test Titel")}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/style/index.css b/WebInterface/NodeJSServer/dist/style/index.css new file mode 100644 index 0000000..5e74a1b --- /dev/null +++ b/WebInterface/NodeJSServer/dist/style/index.css @@ -0,0 +1 @@ +html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.btn{border:none;border-radius:4px;padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;background-color:#546e7a;color:#fff;text-transform:uppercase;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);cursor:pointer;letter-spacing:0.25rem;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.btn:hover{background:#29434e radial-gradient(circle, transparent 1%, #29434e 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12);box-shadow:0 1px 3px rgba(0,0,0,0.12);-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.btn:disabled{color:#ffffff61;background:#546e7a61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.text-btn{padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;color:#fff;background-color:rgba(0,0,0,0);text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.text-btn:hover{background:#29434e61 radial-gradient(circle, transparent 1%, #29434e61 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.text-btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.text-btn:disabled{background:rgba(0,0,0,0);color:#ffffff61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .banner{z-index:1;background-color:white;border:none;border-radius:16px 16px 0 0;display:-webkit-box;display:-ms-flexbox;display:flex;margin:0;margin-bottom:1rem;padding-top:1rem;max-height:10rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-transform-origin:top;transform-origin:top;-webkit-transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;min-height:3.5rem;justify-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (max-height: 550px){.front-layer .banner{position:absolute;width:100%;-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}}.front-layer .banner.hidden{-webkit-transform:scaleY(0);transform:scaleY(0);visibility:hidden;max-height:0;-webkit-transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;min-height:0;margin-bottom:0}.front-layer .banner .banner-text{-ms-flex-item-align:left;-ms-grid-row-align:left;align-self:left;margin:1rem;-webkit-box-flex:100;-ms-flex-positive:100;flex-grow:100}.front-layer .banner .btn-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.front-layer .banner .btn-container .banner-button{color:#29434e;padding:8px 16px;margin:0;margin-right:1rem;letter-spacing:0.125rem}.front-layer .banner hr{width:100%}@media (max-height: 550px){.front-layer .banner hr{margin-bottom:0}}.front-layer .server-listing{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#212121;color:#fff;min-height:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-style:none;border-radius:8px;margin:1rem;margin-bottom:2rem;padding:0.5rem;padding-top:0.25rem;-webkit-box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2)}.front-layer .server-listing h1{text-align:center}@media (max-height: 550px){.front-layer .server-listing h1{display:none}}.front-layer .server-listing hr{width:100%}@media (max-height: 550px){.front-layer .server-listing hr{display:none}}@media (max-height: 450px){.front-layer .server-listing{padding-bottom:0.125rem}}.front-layer .server-listing .server-entries{overflow-y:auto;min-height:0}.front-layer .server-listing .server-entries .server{font-size:1.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#484848;padding:0.5rem;margin-bottom:0.25rem;border-style:none;border-radius:8px}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server{-ms-flex-wrap:wrap;flex-wrap:wrap}}.front-layer .server-listing .server-entries .server .server-name{font-weight:bold;letter-spacing:0.125rem;white-space:nowrap;overflow:hidden;margin:0.5rem 0}.front-layer .server-listing .server-entries .server .player-count{font-family:'Roboto Condensed', sans-serif}.front-layer .server-listing .server-entries .server .player-count-static{white-space:nowrap;margin-left:0.25rem;letter-spacing:0;font-family:'Roboto Condensed', sans-serif}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server .player-count-static{display:none}}.front-layer .server-listing .server-entries .server .player-count-dot{background-color:#393;border-radius:50%;min-width:1rem;min-height:1rem;width:1rem;height:1rem;margin-left:auto;margin-right:0.25rem}.front-layer .server-listing .server-entries .server .join-btn{margin-left:0.5rem;min-width:12rem}.front-layer .server-listing .button-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:1rem;margin-right:0.25rem;min-height:2.5rem}@media (max-height: 450px){.front-layer .server-listing .button-container{margin-top:0.125rem;min-height:2rem}}@media (max-width: 450px){.front-layer .server-listing .button-container .btn{letter-spacing:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}.modal-container{position:absolute;top:0;width:100vw;height:100vh;background-color:#000000AA;display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease}.modal-container.hidden{opacity:0}.modal-container .modal{background-color:#546e7a;margin:auto;padding:1rem;border-style:none;border-radius:8px;-webkit-box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22);box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22)}.modal-container .modal-title{margin:1rem}.modal-container .modal-body{margin:0.25rem} diff --git a/WebInterface/NodeJSServer/src/style/index.scss b/WebInterface/NodeJSServer/src/style/index.scss index b5ca607..da347cb 100644 --- a/WebInterface/NodeJSServer/src/style/index.scss +++ b/WebInterface/NodeJSServer/src/style/index.scss @@ -1,425 +1,10 @@ -@import 'partials/_colors.scss'; - -html,body { - height: 100vh; - margin: 0; - padding: 0; - font-family: 'Roboto', sans-serif; - font-display: swap; - overflow: hidden; - background-color: $primary; - color: $primary-text; - user-select: none; -} - -body { - display: flex; - flex-direction: column; - background-color: $secondary; - position: relative; -} - -.btn { - border: none; - border-radius: 4px; - padding: 8px; - margin: 0; - font-size: 1rem; - font-family: 'Roboto Condensed', sans-serif; - font-weight: bold; - display: inline-block; - background-color: $secondary; - color: $secondary-text; - text-transform: uppercase; - box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); - cursor: pointer; - letter-spacing: 0.25rem; - - background-position: center; - transition: background 800ms ease, box-shadow 100ms ease, color 200ms ease; - - &:hover { - background: $secondary-dark radial-gradient(circle, transparent 1%, $secondary-dark 1%) center/15000%; - box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); - } - - &:active { - background-color: $secondary-light; - background-size: 100%; - box-shadow: 0 1px 3px rgba(0,0,0,0.12); - transition: background 0s, box-shadow 0s; - } - - &:disabled { - color: $secondary-text-disabled; - background: $secondary-disabled; - box-shadow: none; - transition: background 200ms ease, box-shadow 200ms ease, color 200ms ease; - } -} - -.text-btn { - padding: 8px; - margin: 0; - font-size: 1rem; - font-family: 'Roboto Condensed', sans-serif; - font-weight: bold; - display: inline-block; - color: $secondary-text; - background-color: rgba(0, 0, 0, 0); - text-transform: uppercase; - box-shadow: none; - - background-position: center; - transition: background 800ms ease, box-shadow 100ms ease, color 200ms ease; - - &:hover { - background: $secondary-dark-transparent radial-gradient(circle, transparent 1%, $secondary-dark-transparent 1%) center/15000%; - box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); - } - - &:active { - background-color: $secondary-light; - background-size: 100%; - box-shadow: none; - transition: background 0s, box-shadow 0s; - } - - &:disabled { - background: rgba(0,0,0,0); - color: $secondary-text-disabled; - box-shadow: none; - transition: background 200ms ease, box-shadow 200ms ease, color 200ms ease; - } -} - -.backdrop { - background-color: $secondary; - color: $secondary-text; - font-size: 1rem; - - .header-bar { - display: flex; - align-items: center; - - @media (max-height: 550px) { - margin-top: 0.125rem; - } - - .menu-icon { - background-image: url("./ressources/menu.png"); - background-position: center; - background-repeat: no-repeat; - width: 36px; - height: 36px; - padding: 4px; - margin: 1rem; - display: inline-block; - border: none; - border-radius: 32px; - transition: background-color 100ms ease; - - @media (max-height: 550px) { - padding: 0; - margin: 0.125rem; - } - - &:hover { - background-color: $secondary-dark; - } - - &.open { - background-image: url("./ressources/menu_close.png"); - } - } - - .header { - margin: 0; - padding: 16px; - text-align: center; - flex-grow: 1; - - @media (min-width: 450px) { - margin-right: 56px; - } - - @media (max-height: 550px) { - padding: 0; - } - } - } - - .menu-actions { - box-sizing: border-box; - transition: max-height 200ms ease, color 200ms ease, background-color 100ms ease;; - position: relative; - max-height: 16rem; - margin: 0 1rem; - - .menu-option { - color: $primary-text; - text-decoration: none; - box-sizing: border-box; - display: inline-block; - font-size: 1.5rem; - width: 100%; - text-align: center; - padding: 1rem; - border: none; - border-radius: 8px; - cursor: pointer; - - &:hover { - background-color: $secondary-half-dark; - } - - &.active { - background-color: $secondary-dark; - } - } - - &.hidden { - max-height: 0; - color: rgba(0,0,0,0); - - .menu-option { - color: rgba(0,0,0,0); - background-color: rgba(0,0,0,0) !important; - } - } - } -} - -.container { - @keyframes start { - from {top: 100vh;} - to {top: 0;} - } - - position: relative; - border: none; - border-radius: 16px 16px 0 0; - min-height: 0; - height: 100%; - - box-sizing: border-box; - background-color: white; - margin-top: 8px; - animation-name: start; - animation-duration: 1s; - animation-timing-function: ease; - color: black; - - display: flex; - flex-direction: column; - - .banner { - z-index: 1; - background-color: white; - border: none; - border-radius: 16px 16px 0 0; - display: flex; - margin: 0; - margin-bottom: 1rem; - padding-top: 1rem; - max-height: 10rem; - flex-direction: row; - flex-wrap: wrap; - transform-origin: top; - transition: max-height 200ms ease, transform 200ms ease, visibility 200ms step-start; - min-height: 3.5rem; - justify-items: center; - justify-content: center; - - @media (max-height: 550px) { - position: absolute; - width: 100%; - box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); - } - - &.hidden { - transform: scaleY(0); - visibility: hidden; - max-height: 0; - transition: max-height 200ms ease, transform 200ms ease, visibility 200ms step-end; - min-height: 0; - margin-bottom: 0; - } - - .banner-text { - align-self: left; - margin: 1rem; - flex-grow: 100; - } - - .btn-container{ - display: flex; - flex-grow: 1; - text-align: right; - - - .banner-button { - color: $secondary-dark; - padding: 8px 16px; - margin: 0; - margin-right: 1rem; - letter-spacing: 0.125rem; - } - } - - hr { - width: 100%; - - @media (max-height: 550px) { - margin-bottom: 0; - } - } - } - - .server-listing { - box-sizing: border-box; - background-color: $primary; - color: $primary-text; - min-height: 0; - display: flex; - flex-direction: column; - border-style: none; - border-radius: 8px; - margin: 1rem; - margin-bottom: 2rem; - padding: 0.5rem; - padding-top: 0.25rem; - box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2); - h1 { - text-align: center; - @media (max-height: 550px) { - display: none; - } - } - hr { - width: 100%; - @media (max-height: 550px) { - display: none; - } - } - - @media (max-height: 450px) { - padding-bottom: 0.125rem - } - - .server-entries { - overflow-y: auto; - min-height: 0; - - .server { - font-size: 1.25rem; - display: flex; - flex-direction: row; - - @media (max-width: 1000px) { - flex-wrap: wrap; - } - - align-items: center; - background-color: $primary-light; - padding: 0.5rem; - margin-bottom: 0.25rem; - border-style: none; - border-radius: 8px; - - .server-name { - font-weight: bold; - letter-spacing: 0.125rem; - white-space: nowrap; - overflow: hidden; - margin: 0.5rem 0; - } - - .player-count { - font-family: 'Roboto Condensed', sans-serif; - } - - .player-count-static { - @media (max-width: 1000px) { - display: none; - } - - white-space: nowrap; - margin-left: 0.25rem; - letter-spacing: 0; - font-family: 'Roboto Condensed', sans-serif; - } - - .player-count-dot { - background-color: $online-green; - border-radius: 50%; - min-width: 1rem; - min-height: 1rem; - width: 1rem; - height: 1rem; - margin-left: auto; - margin-right: 0.25rem; - } - - .join-btn { - margin-left: 0.5rem; - min-width: 12rem; - } - } - } - - .button-container { - display: flex; - flex-direction: row-reverse; - margin-top: 1rem; - margin-right: 0.25rem; - min-height: 2.5rem; - - @media (max-height: 450px) { - margin-top: 0.125rem; - min-height: 2rem; - } - } - } - - .copyright-container { - box-sizing: border-box; - position: absolute; - width: 100%; - margin: 4px; - bottom: 0; - text-align: center; - } -} - -.modal-container { - position:absolute; - top: 0; - width: 100vw; - height: 100vh; - background-color: #000000AA; - display: flex; - opacity: 1; - transition: opacity 200ms ease; - - &.hidden { - opacity: 0; - } - - .modal { - background-color: #546e7a; - margin: auto; - padding: 1rem; - border-style: none; - border-radius: 8px; - box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22); - } - - .modal-title { - margin: 1rem; - } - - .modal-body { - margin: 0.25rem; - } -} +@import 'partials/colors'; +@import 'partials/base'; +@import 'partials/btn'; +@import 'partials/backdrop/base'; +@import 'partials/backdrop/menu'; +@import 'partials/front-layer/base'; +@import 'partials/front-layer/notifications'; +@import 'partials/front-layer/server-listing'; +@import 'partials/front-layer/copyright'; +@import 'partials/modal/base'; diff --git a/WebInterface/NodeJSServer/src/style/partials/_base.scss b/WebInterface/NodeJSServer/src/style/partials/_base.scss new file mode 100644 index 0000000..77d5bdd --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/_base.scss @@ -0,0 +1,18 @@ +html,body { + height: 100vh; + margin: 0; + padding: 0; + font-family: 'Roboto', sans-serif; + font-display: swap; + overflow: hidden; + background-color: $primary; + color: $primary-text; + user-select: none; +} + +body { + display: flex; + flex-direction: column; + background-color: $secondary; + position: relative; +} diff --git a/WebInterface/NodeJSServer/src/style/partials/_btn.scss b/WebInterface/NodeJSServer/src/style/partials/_btn.scss new file mode 100644 index 0000000..6c41b1f --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/_btn.scss @@ -0,0 +1,73 @@ +.btn { + border: none; + border-radius: 4px; + padding: 8px; + margin: 0; + font-size: 1rem; + font-family: 'Roboto Condensed', sans-serif; + font-weight: bold; + display: inline-block; + background-color: $secondary; + color: $secondary-text; + text-transform: uppercase; + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); + cursor: pointer; + letter-spacing: 0.25rem; + + background-position: center; + transition: background 800ms ease, box-shadow 100ms ease, color 200ms ease; + + &:hover { + background: $secondary-dark radial-gradient(circle, transparent 1%, $secondary-dark 1%) center/15000%; + box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); + } + + &:active { + background-color: $secondary-light; + background-size: 100%; + box-shadow: 0 1px 3px rgba(0,0,0,0.12); + transition: background 0s, box-shadow 0s; + } + + &:disabled { + color: $secondary-text-disabled; + background: $secondary-disabled; + box-shadow: none; + transition: background 200ms ease, box-shadow 200ms ease, color 200ms ease; + } +} + +.text-btn { + padding: 8px; + margin: 0; + font-size: 1rem; + font-family: 'Roboto Condensed', sans-serif; + font-weight: bold; + display: inline-block; + color: $secondary-text; + background-color: rgba(0, 0, 0, 0); + text-transform: uppercase; + box-shadow: none; + + background-position: center; + transition: background 800ms ease, box-shadow 100ms ease, color 200ms ease; + + &:hover { + background: $secondary-dark-transparent radial-gradient(circle, transparent 1%, $secondary-dark-transparent 1%) center/15000%; + box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); + } + + &:active { + background-color: $secondary-light; + background-size: 100%; + box-shadow: none; + transition: background 0s, box-shadow 0s; + } + + &:disabled { + background: rgba(0,0,0,0); + color: $secondary-text-disabled; + box-shadow: none; + transition: background 200ms ease, box-shadow 200ms ease, color 200ms ease; + } +} diff --git a/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss b/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss new file mode 100644 index 0000000..b283c0b --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss @@ -0,0 +1,56 @@ +.backdrop { + background-color: $secondary; + color: $secondary-text; + font-size: 1rem; + + .header-bar { + display: flex; + align-items: center; + + @media (max-height: 550px) { + margin-top: 0.125rem; + } + + .menu-icon { + background-image: url("../ressources/menu.png"); + background-position: center; + background-repeat: no-repeat; + width: 36px; + height: 36px; + padding: 4px; + margin: 1rem; + display: inline-block; + border: none; + border-radius: 32px; + transition: background-color 100ms ease; + + @media (max-height: 550px) { + padding: 0; + margin: 0.125rem; + } + + &:hover { + background-color: $secondary-dark; + } + + &.open { + background-image: url("../ressources/menu_close.png"); + } + } + + .header { + margin: 0; + padding: 16px; + text-align: center; + flex-grow: 1; + + @media (min-width: 450px) { + margin-right: 56px; + } + + @media (max-height: 550px) { + padding: 0; + } + } + } +} diff --git a/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss b/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss new file mode 100644 index 0000000..e98c798 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss @@ -0,0 +1,41 @@ +.backdrop { + .menu-actions { + box-sizing: border-box; + transition: max-height 200ms ease, color 200ms ease, background-color 100ms ease;; + position: relative; + max-height: 16rem; + margin: 0 1rem; + + .menu-option { + color: $primary-text; + text-decoration: none; + box-sizing: border-box; + display: inline-block; + font-size: 1.5rem; + width: 100%; + text-align: center; + padding: 1rem; + border: none; + border-radius: 8px; + cursor: pointer; + + &:hover { + background-color: $secondary-half-dark; + } + + &.active { + background-color: $secondary-dark; + } + } + + &.hidden { + max-height: 0; + color: rgba(0,0,0,0); + + .menu-option { + color: rgba(0,0,0,0); + background-color: rgba(0,0,0,0) !important; + } + } + } +} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss new file mode 100644 index 0000000..6a2aa9a --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_base.scss @@ -0,0 +1,23 @@ +.front-layer { + @keyframes start { + from {top: 100vh;} + to {top: 0;} + } + + position: relative; + border: none; + border-radius: 16px 16px 0 0; + min-height: 0; + height: 100%; + + box-sizing: border-box; + background-color: white; + margin-top: 8px; + animation-name: start; + animation-duration: 1s; + animation-timing-function: ease; + color: black; + + display: flex; + flex-direction: column; +} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss new file mode 100644 index 0000000..31ac614 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_copyright.scss @@ -0,0 +1,10 @@ +.front-layer{ + .copyright-container { + box-sizing: border-box; + position: absolute; + width: 100%; + margin: 4px; + bottom: 0; + text-align: center; + } +} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss new file mode 100644 index 0000000..1465b77 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss @@ -0,0 +1,64 @@ +.front-layer { + .banner { + z-index: 1; + background-color: white; + border: none; + border-radius: 16px 16px 0 0; + display: flex; + margin: 0; + margin-bottom: 1rem; + padding-top: 1rem; + max-height: 10rem; + flex-direction: row; + flex-wrap: wrap; + transform-origin: top; + transition: max-height 200ms ease, transform 200ms ease, visibility 200ms step-start; + min-height: 3.5rem; + justify-items: center; + justify-content: center; + + @media (max-height: 550px) { + position: absolute; + width: 100%; + box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); + } + + &.hidden { + transform: scaleY(0); + visibility: hidden; + max-height: 0; + transition: max-height 200ms ease, transform 200ms ease, visibility 200ms step-end; + min-height: 0; + margin-bottom: 0; + } + + .banner-text { + align-self: left; + margin: 1rem; + flex-grow: 100; + } + + .btn-container{ + display: flex; + flex-grow: 1; + text-align: right; + + + .banner-button { + color: $secondary-dark; + padding: 8px 16px; + margin: 0; + margin-right: 1rem; + letter-spacing: 0.125rem; + } + } + + hr { + width: 100%; + + @media (max-height: 550px) { + margin-bottom: 0; + } + } + } +} diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss new file mode 100644 index 0000000..2921e22 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss @@ -0,0 +1,113 @@ +.front-layer { + .server-listing { + box-sizing: border-box; + background-color: $primary; + color: $primary-text; + min-height: 0; + display: flex; + flex-direction: column; + border-style: none; + border-radius: 8px; + margin: 1rem; + margin-bottom: 2rem; + padding: 0.5rem; + padding-top: 0.25rem; + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2); + h1 { + text-align: center; + @media (max-height: 550px) { + display: none; + } + } + hr { + width: 100%; + @media (max-height: 550px) { + display: none; + } + } + + @media (max-height: 450px) { + padding-bottom: 0.125rem + } + + .server-entries { + overflow-y: auto; + min-height: 0; + + .server { + font-size: 1.25rem; + display: flex; + flex-direction: row; + + @media (max-width: 1000px) { + flex-wrap: wrap; + } + + align-items: center; + background-color: $primary-light; + padding: 0.5rem; + margin-bottom: 0.25rem; + border-style: none; + border-radius: 8px; + + .server-name { + font-weight: bold; + letter-spacing: 0.125rem; + white-space: nowrap; + overflow: hidden; + margin: 0.5rem 0; + } + + .player-count { + font-family: 'Roboto Condensed', sans-serif; + } + + .player-count-static { + @media (max-width: 1000px) { + display: none; + } + + white-space: nowrap; + margin-left: 0.25rem; + letter-spacing: 0; + font-family: 'Roboto Condensed', sans-serif; + } + + .player-count-dot { + background-color: $online-green; + border-radius: 50%; + min-width: 1rem; + min-height: 1rem; + width: 1rem; + height: 1rem; + margin-left: auto; + margin-right: 0.25rem; + } + + .join-btn { + margin-left: 0.5rem; + min-width: 12rem; + } + } + } + + .button-container { + display: flex; + flex-direction: row-reverse; + margin-top: 1rem; + margin-right: 0.25rem; + min-height: 2.5rem; + + @media (max-height: 450px) { + margin-top: 0.125rem; + min-height: 2rem; + } + + .btn { + @media (max-width: 450px) { + letter-spacing: 0; + } + } + } + } +} diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss new file mode 100644 index 0000000..c8705e4 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss @@ -0,0 +1,31 @@ +.modal-container { + position:absolute; + top: 0; + width: 100vw; + height: 100vh; + background-color: #000000AA; + display: flex; + opacity: 1; + transition: opacity 200ms ease; + + &.hidden { + opacity: 0; + } + + .modal { + background-color: #546e7a; + margin: auto; + padding: 1rem; + border-style: none; + border-radius: 8px; + box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22); + } + + .modal-title { + margin: 1rem; + } + + .modal-body { + margin: 0.25rem; + } +} -- cgit v1.2.3-54-g00ecf From 63233700cdbe55b440f6651baa2a515d8e33e6aa Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 16:05:22 +0200 Subject: Added about and play pages Play Page will be where the games will take place --- WebInterface/NodeJSServer/dist/about/index.html | 39 +++++++++++++++++++++++++ WebInterface/NodeJSServer/dist/play/index.html | 0 WebInterface/NodeJSServer/webpack.config.js | 6 ++-- 3 files changed, 43 insertions(+), 2 deletions(-) create mode 100644 WebInterface/NodeJSServer/dist/about/index.html create mode 100644 WebInterface/NodeJSServer/dist/play/index.html diff --git a/WebInterface/NodeJSServer/dist/about/index.html b/WebInterface/NodeJSServer/dist/about/index.html new file mode 100644 index 0000000..0caefb2 --- /dev/null +++ b/WebInterface/NodeJSServer/dist/about/index.html @@ -0,0 +1,39 @@ + + + + + + + + + + Helden Online + + + + + + +
+
+ +

Helden Online

+
+ +
+
+ + + +
+

Front-End © 2018 Timon Scholz

+

Back-End © 2018 Dennis Kobert

+
+
+ + + diff --git a/WebInterface/NodeJSServer/dist/play/index.html b/WebInterface/NodeJSServer/dist/play/index.html new file mode 100644 index 0000000..e69de29 diff --git a/WebInterface/NodeJSServer/webpack.config.js b/WebInterface/NodeJSServer/webpack.config.js index c587000..f3635f7 100644 --- a/WebInterface/NodeJSServer/webpack.config.js +++ b/WebInterface/NodeJSServer/webpack.config.js @@ -4,10 +4,12 @@ const nodeExternals = require('webpack-node-externals'); module.exports = { mode: 'production', entry: { - index: './src/index.js' + index: './src/index.js', + about: './src/about.js', + play: './src/play.js' }, output: { filename: '[name].js', - path: path.resolve(__dirname, './dist') + path: path.resolve(__dirname, './dist/script') } }; -- cgit v1.2.3-54-g00ecf From fe1356caa9a3739c338ff7d7b1e4e7a4b45c0b72 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 16:15:38 +0200 Subject: Moved color import to the modules requiring it --- WebInterface/NodeJSServer/src/style/index.scss | 1 - WebInterface/NodeJSServer/src/style/partials/_base.scss | 2 ++ WebInterface/NodeJSServer/src/style/partials/_btn.scss | 2 ++ WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss | 2 ++ WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss | 2 ++ .../NodeJSServer/src/style/partials/front-layer/_notifications.scss | 2 ++ .../NodeJSServer/src/style/partials/front-layer/_server-listing.scss | 2 ++ WebInterface/NodeJSServer/src/style/partials/modal/_base.scss | 4 +++- 8 files changed, 15 insertions(+), 2 deletions(-) diff --git a/WebInterface/NodeJSServer/src/style/index.scss b/WebInterface/NodeJSServer/src/style/index.scss index da347cb..285a47b 100644 --- a/WebInterface/NodeJSServer/src/style/index.scss +++ b/WebInterface/NodeJSServer/src/style/index.scss @@ -1,4 +1,3 @@ -@import 'partials/colors'; @import 'partials/base'; @import 'partials/btn'; @import 'partials/backdrop/base'; diff --git a/WebInterface/NodeJSServer/src/style/partials/_base.scss b/WebInterface/NodeJSServer/src/style/partials/_base.scss index 77d5bdd..5f300fd 100644 --- a/WebInterface/NodeJSServer/src/style/partials/_base.scss +++ b/WebInterface/NodeJSServer/src/style/partials/_base.scss @@ -1,3 +1,5 @@ +@import 'colors'; + html,body { height: 100vh; margin: 0; diff --git a/WebInterface/NodeJSServer/src/style/partials/_btn.scss b/WebInterface/NodeJSServer/src/style/partials/_btn.scss index 6c41b1f..cf5ee33 100644 --- a/WebInterface/NodeJSServer/src/style/partials/_btn.scss +++ b/WebInterface/NodeJSServer/src/style/partials/_btn.scss @@ -1,3 +1,5 @@ +@import 'colors'; + .btn { border: none; border-radius: 4px; diff --git a/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss b/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss index b283c0b..1b7a924 100644 --- a/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss +++ b/WebInterface/NodeJSServer/src/style/partials/backdrop/_base.scss @@ -1,3 +1,5 @@ +@import '../colors'; + .backdrop { background-color: $secondary; color: $secondary-text; diff --git a/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss b/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss index e98c798..26833d5 100644 --- a/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss +++ b/WebInterface/NodeJSServer/src/style/partials/backdrop/_menu.scss @@ -1,3 +1,5 @@ +@import '../colors'; + .backdrop { .menu-actions { box-sizing: border-box; diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss index 1465b77..4dd7361 100644 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_notifications.scss @@ -1,3 +1,5 @@ +@import '../colors'; + .front-layer { .banner { z-index: 1; diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss index 2921e22..2efb73b 100644 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss @@ -1,3 +1,5 @@ +@import '../colors'; + .front-layer { .server-listing { box-sizing: border-box; diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss index c8705e4..1e7742e 100644 --- a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss +++ b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss @@ -1,3 +1,5 @@ +@import '../colors'; + .modal-container { position:absolute; top: 0; @@ -13,7 +15,7 @@ } .modal { - background-color: #546e7a; + background-color: $secondary; margin: auto; padding: 1rem; border-style: none; -- cgit v1.2.3-54-g00ecf From f97ce4fce7e0cfa5150ca680d0fa87d0e96a0763 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 16:15:47 +0200 Subject: Added styling to about page --- WebInterface/NodeJSServer/dist/about/index.html | 2 +- WebInterface/NodeJSServer/dist/style/about.css | 1 + WebInterface/NodeJSServer/src/style/about.scss | 5 +++++ 3 files changed, 7 insertions(+), 1 deletion(-) create mode 100644 WebInterface/NodeJSServer/dist/style/about.css create mode 100644 WebInterface/NodeJSServer/src/style/about.scss diff --git a/WebInterface/NodeJSServer/dist/about/index.html b/WebInterface/NodeJSServer/dist/about/index.html index 0caefb2..80fe31e 100644 --- a/WebInterface/NodeJSServer/dist/about/index.html +++ b/WebInterface/NodeJSServer/dist/about/index.html @@ -25,7 +25,7 @@ About
-
+
diff --git a/WebInterface/NodeJSServer/dist/style/about.css b/WebInterface/NodeJSServer/dist/style/about.css new file mode 100644 index 0000000..2a7aaab --- /dev/null +++ b/WebInterface/NodeJSServer/dist/style/about.css @@ -0,0 +1 @@ +html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center} diff --git a/WebInterface/NodeJSServer/src/style/about.scss b/WebInterface/NodeJSServer/src/style/about.scss new file mode 100644 index 0000000..9d8ad50 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/about.scss @@ -0,0 +1,5 @@ +@import 'partials/base'; +@import 'partials/backdrop/base'; +@import 'partials/backdrop/menu'; +@import 'partials/front-layer/base'; +@import 'partials/front-layer/copyright'; -- cgit v1.2.3-54-g00ecf From 3a67ec1e4530f6b413228c2dc19dd90977ac381c Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 16:26:39 +0200 Subject: Finished about page functionality Only text needs to be added. --- WebInterface/NodeJSServer/dist/about/index.html | 4 ++-- WebInterface/NodeJSServer/dist/index.html | 2 +- WebInterface/NodeJSServer/dist/script/about.js | 1 + WebInterface/NodeJSServer/dist/script/index.js | 4 ++-- WebInterface/NodeJSServer/dist/script/play.js | 1 + WebInterface/NodeJSServer/src/about.js | 4 ++++ WebInterface/NodeJSServer/src/index.js | 2 +- WebInterface/NodeJSServer/src/play.js | 0 8 files changed, 12 insertions(+), 6 deletions(-) create mode 100644 WebInterface/NodeJSServer/dist/script/about.js create mode 100644 WebInterface/NodeJSServer/dist/script/play.js create mode 100644 WebInterface/NodeJSServer/src/about.js create mode 100644 WebInterface/NodeJSServer/src/play.js diff --git a/WebInterface/NodeJSServer/dist/about/index.html b/WebInterface/NodeJSServer/dist/about/index.html index 80fe31e..2ea6fe6 100644 --- a/WebInterface/NodeJSServer/dist/about/index.html +++ b/WebInterface/NodeJSServer/dist/about/index.html @@ -20,9 +20,9 @@

Helden Online

diff --git a/WebInterface/NodeJSServer/dist/index.html b/WebInterface/NodeJSServer/dist/index.html index b8d758e..601fda4 100644 --- a/WebInterface/NodeJSServer/dist/index.html +++ b/WebInterface/NodeJSServer/dist/index.html @@ -51,7 +51,7 @@
- © 2018 Timon Scholz + © 2018 Dennis Kobert & Timon Scholz
diff --git a/WebInterface/NodeJSServer/dist/script/about.js b/WebInterface/NodeJSServer/dist/script/about.js new file mode 100644 index 0000000..fa30f89 --- /dev/null +++ b/WebInterface/NodeJSServer/dist/script/about.js @@ -0,0 +1 @@ +!function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){"use strict";n.d(e,"a",function(){return r});class r{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},function(t,e,n){"use strict";n.r(e),new(n(0).a)("menu","front-layer","show-menu").register()}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/script/index.js b/WebInterface/NodeJSServer/dist/script/index.js index 67f33c0..41ecd8b 100644 --- a/WebInterface/NodeJSServer/dist/script/index.js +++ b/WebInterface/NodeJSServer/dist/script/index.js @@ -1,4 +1,4 @@ -!function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";n.r(e); +!function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=3)}([function(t,e,n){"use strict";n.d(e,"a",function(){return o});class o{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},,,function(t,e,n){"use strict";n.r(e);var o=n(0); /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use @@ -13,4 +13,4 @@ MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */ -var o=function(t,e){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function r(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var s=function(){return(s=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new p(r.status,r.statusText,r.response||r.responseText)):o(new u(r.statusText,r.status))},r.onerror=function(){e.logger.log(c.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new u(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(c.Warning,"Timeout from HTTP request."),o(new l)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(s({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(s({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(s({},e,{method:"DELETE",url:t}))},t}()),d=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),f=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return d.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(d.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(d.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=d.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(h||(h={}));var v=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),m=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function b(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function y(t,e,n,o,r,s,u){return i(this,void 0,void 0,function(){var i,l,h,p;return a(this,function(a){switch(a.label){case 0:return[4,r()];case 1:return(l=a.sent())&&((p={}).Authorization="Bearer "+l,i=p),t.log(c.Trace,"("+e+" transport) sending data. "+b(s,u)+"."),[4,n.post(o,{content:s,headers:i})];case 2:return h=a.sent(),t.log(c.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var w,S,E=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),k=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case c.Critical:case c.Error:console.error(c[t]+": "+e);break;case c.Warning:console.warn(c[t]+": "+e);break;case c.Information:console.info(c[t]+": "+e);break;default:console.log(c[t]+": "+e)}},t}(),T=3e4,I=function(){function t(t,e,n){var o=this;m.isRequired(t,"connection"),m.isRequired(e,"logger"),m.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=T,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new f,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return i(this,void 0,void 0,function(){var t;return a(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(c.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(c.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(c.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(c.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(c.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.running?[2,y(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return i(this,void 0,void 0,function(){var t,e,n=this;return a(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(c.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(c.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(c.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),M=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return i(this,void 0,void 0,function(){var n,o=this;return a(this,function(r){switch(r.label){case 0:if(m.isRequired(t,"url"),m.isRequired(e,"transferFormat"),m.isIn(e,S,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(c.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==S.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(c.Trace,"(SSE transport) data received. "+b(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(c.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.eventSource?[2,y(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),R=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return i(this,void 0,void 0,function(){var n,o=this;return a(this,function(r){switch(r.label){case 0:if(m.isRequired(t,"url"),m.isRequired(e,"transferFormat"),m.isIn(e,S,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(c.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===S.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(c.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(c.Trace,"(WebSockets transport) data received. "+b(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(c.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(c.Trace,"(WebSockets transport) sending data. "+b(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),O=function(){function t(t,e){void 0===e&&(e={}),this.features={},m.isRequired(t,"url"),this.logger=function(t){return void 0===t?new k(c.Information):null===t?v.instance:t.log?t:new k(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new g(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||S.Binary,m.isIn(t,S,"transferFormat"),this.logger.log(c.Debug,"Starting connection with transfer format '"+S[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return i(this,void 0,void 0,function(){var e,n,o,r,s,i,u,l=this;return a(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==w.WebSockets?[3,3]:(this.transport=this.constructTransport(w.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return a(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof x&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw u=h.sent(),this.logger.log(c.Error,"Failed to start the connection: "+u),this.connectionState=2,this.transport=null,u;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return i(this,void 0,void 0,function(){var e,n,o,r,s,i;return a(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(c.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(c.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return i(this,void 0,void 0,function(){var r,s,i,u,l,h,p;return a(this,function(a){switch(a.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(c.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return a.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,u=s,a.label=3;case 3:return i=0){if(!(o===w.WebSockets&&"undefined"==typeof WebSocket||o===w.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(c.Debug,"Selecting transport '"+w[o]+"'"),o;this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it is not supported in your environment.'")}else this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it does not support the requested transfer format '"+S[n]+"'.");else this.logger.log(c.Debug,"Skipping transport '"+w[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return i(this,void 0,void 0,function(){return a(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(c.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(c.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(c.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var N="json",F=function(){function t(){this.name=N,this.version=1,this.transferFormat=S.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=v.instance);for(var n=[],o=0,r=d.parse(t);o{this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})})}setBodyText(t){this.body.textContent=t}}new class{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let j=new class{constructor(t,e,n=!1){const o=(new q).withUrl(t);n?o.configureLogging(c.Debug):o.configureLogging(c.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new B(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.117.197:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",j.loadServers.bind(j)),new H("Test Titel")}]); \ No newline at end of file +var r=function(t,e){return(r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function s(t,e){function n(){this.constructor=t}r(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var i=function(){return(i=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new g(r.status,r.statusText,r.response||r.responseText)):o(new l(r.statusText,r.status))},r.onerror=function(){e.logger.log(u.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new l(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(u.Warning,"Timeout from HTTP request."),o(new h)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),v=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var m=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,o,r,s,i){return a(this,void 0,void 0,function(){var a,l,h,p;return c(this,function(c){switch(c.label){case 0:return[4,r()];case 1:return(l=c.sent())&&((p={}).Authorization="Bearer "+l,a=p),t.log(u.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(o,{content:s,headers:a})];case 2:return h=c.sent(),t.log(u.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,E,C=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case u.Critical:case u.Error:console.error(u[t]+": "+e);break;case u.Warning:console.warn(u[t]+": "+e);break;case u.Information:console.info(u[t]+": "+e);break;default:console.log(u[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var o=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new v,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(u.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(u.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(u.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(u.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(u.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(u.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(u.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(u.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,E,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(u.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==E.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(u.Trace,"(SSE transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(u.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),O=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,E,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(u.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===E.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(u.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(u.Trace,"(WebSockets transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(u.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(u.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),N=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(u.Information):null===t?m.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new d(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||E.Binary,b.isIn(t,E,"transferFormat"),this.logger.log(u.Debug,"Starting connection with transfer format '"+E[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i,a,l=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return c(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(u.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(u.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(u.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return a(this,void 0,void 0,function(){var r,s,i,a,l,h,p;return c(this,function(c){switch(c.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(u.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(o===S.WebSockets&&"undefined"==typeof WebSocket||o===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(u.Debug,"Selecting transport '"+S[o]+"'"),o;this.logger.log(u.Debug,"Skipping transport '"+S[o]+"' because it is not supported in your environment.'")}else this.logger.log(u.Debug,"Skipping transport '"+S[o]+"' because it does not support the requested transfer format '"+E[n]+"'.");else this.logger.log(u.Debug,"Skipping transport '"+S[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(u.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(u.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(u.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var F="json",q=function(){function t(){this.name=F,this.version=1,this.transferFormat=E.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=m.instance);for(var n=[],o=0,r=f.parse(t);o{this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})})}setBodyText(t){this.body.textContent=t}}new o.a("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let W=new class{constructor(t,e,n=!1){const o=(new B).withUrl(t);n?o.configureLogging(u.Debug):o.configureLogging(u.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new H(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.117.197:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",W.loadServers.bind(W)),new j("Test Titel")}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/script/play.js b/WebInterface/NodeJSServer/dist/script/play.js new file mode 100644 index 0000000..8c436f9 --- /dev/null +++ b/WebInterface/NodeJSServer/dist/script/play.js @@ -0,0 +1 @@ +!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=2)}({2:function(e,t){}}); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/src/about.js b/WebInterface/NodeJSServer/src/about.js new file mode 100644 index 0000000..1561a2f --- /dev/null +++ b/WebInterface/NodeJSServer/src/about.js @@ -0,0 +1,4 @@ +import Backdrop from './modules/ui/backdrop.js'; + +let backdrop = new Backdrop('menu', 'front-layer', 'show-menu'); +backdrop.register(); diff --git a/WebInterface/NodeJSServer/src/index.js b/WebInterface/NodeJSServer/src/index.js index 01a9ba1..8e615f2 100644 --- a/WebInterface/NodeJSServer/src/index.js +++ b/WebInterface/NodeJSServer/src/index.js @@ -10,7 +10,7 @@ let notifications = new BannerController('notifications', 'banner-info', 'dismiss-banner'); notifications.register(); -let client = new ServerClient('http://89.183.117.197:5000/chatHub', 'server-list', true); +let client = new ServerClient('http://89.183.8.51:5000/chatHub', 'server-list', true); document.getElementById('refresh-button') .addEventListener('click', client.loadServers.bind(client)); diff --git a/WebInterface/NodeJSServer/src/play.js b/WebInterface/NodeJSServer/src/play.js new file mode 100644 index 0000000..e69de29 -- cgit v1.2.3-54-g00ecf From 67af10e2e629c131c1aa0655a57c6c15073c48bd Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 20:21:22 +0200 Subject: Fixed an issue where the join button would separate from the player count This caused alignment problems and didn't look great. Now they're in a non-breaking container. --- WebInterface/NodeJSServer/dist/script/about.js | 2 +- WebInterface/NodeJSServer/dist/script/index.js | 4 +- WebInterface/NodeJSServer/dist/script/play.js | 2 +- WebInterface/NodeJSServer/dist/style/index.css | 2 +- .../NodeJSServer/src/modules/server-client.js | 3 +- .../NodeJSServer/src/modules/ui/server-creator.js | 7 --- .../NodeJSServer/src/modules/ui/server-listing.js | 11 +++-- .../partials/front-layer/_server-listing.scss | 54 ++++++++++++---------- 8 files changed, 43 insertions(+), 42 deletions(-) delete mode 100644 WebInterface/NodeJSServer/src/modules/ui/server-creator.js diff --git a/WebInterface/NodeJSServer/dist/script/about.js b/WebInterface/NodeJSServer/dist/script/about.js index fa30f89..8924b95 100644 --- a/WebInterface/NodeJSServer/dist/script/about.js +++ b/WebInterface/NodeJSServer/dist/script/about.js @@ -1 +1 @@ -!function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){"use strict";n.d(e,"a",function(){return r});class r{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},function(t,e,n){"use strict";n.r(e),new(n(0).a)("menu","front-layer","show-menu").register()}]); \ No newline at end of file +!function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(t,e,n){"use strict";n.d(e,"a",function(){return r});class r{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},,function(t,e,n){"use strict";n.r(e),new(n(0).a)("menu","front-layer","show-menu").register()}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/script/index.js b/WebInterface/NodeJSServer/dist/script/index.js index 41ecd8b..1f0a23d 100644 --- a/WebInterface/NodeJSServer/dist/script/index.js +++ b/WebInterface/NodeJSServer/dist/script/index.js @@ -1,4 +1,4 @@ -!function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:o})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(o,r,function(e){return t[e]}.bind(null,r));return o},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=3)}([function(t,e,n){"use strict";n.d(e,"a",function(){return o});class o{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},,,function(t,e,n){"use strict";n.r(e);var o=n(0); +!function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=4)}([function(t,e,n){"use strict";n.d(e,"a",function(){return r});class r{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},function(t,e){String.prototype.getHash=async function(){let t=new ArrayBuffer(2*this.length),e=new Uint16Array(t);for(let t=0;t0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new g(r.status,r.statusText,r.response||r.responseText)):o(new l(r.statusText,r.status))},r.onerror=function(){e.logger.log(u.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new l(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(u.Warning,"Timeout from HTTP request."),o(new h)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),v=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var m=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,o,r,s,i){return a(this,void 0,void 0,function(){var a,l,h,p;return c(this,function(c){switch(c.label){case 0:return[4,r()];case 1:return(l=c.sent())&&((p={}).Authorization="Bearer "+l,a=p),t.log(u.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(o,{content:s,headers:a})];case 2:return h=c.sent(),t.log(u.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,E,C=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case u.Critical:case u.Error:console.error(u[t]+": "+e);break;case u.Warning:console.warn(u[t]+": "+e);break;case u.Information:console.info(u[t]+": "+e);break;default:console.log(u[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var o=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new v,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(u.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(u.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(u.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(u.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(u.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(u.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(u.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(u.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,E,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(u.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==E.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(u.Trace,"(SSE transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(u.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),O=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,E,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(u.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===E.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(u.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(u.Trace,"(WebSockets transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(u.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(u.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),N=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(u.Information):null===t?m.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new d(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||E.Binary,b.isIn(t,E,"transferFormat"),this.logger.log(u.Debug,"Starting connection with transfer format '"+E[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i,a,l=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return c(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(u.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(u.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(u.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return a(this,void 0,void 0,function(){var r,s,i,a,l,h,p;return c(this,function(c){switch(c.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(u.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(o===S.WebSockets&&"undefined"==typeof WebSocket||o===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(u.Debug,"Selecting transport '"+S[o]+"'"),o;this.logger.log(u.Debug,"Skipping transport '"+S[o]+"' because it is not supported in your environment.'")}else this.logger.log(u.Debug,"Skipping transport '"+S[o]+"' because it does not support the requested transfer format '"+E[n]+"'.");else this.logger.log(u.Debug,"Skipping transport '"+S[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(u.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(u.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(u.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var F="json",q=function(){function t(){this.name=F,this.version=1,this.transferFormat=E.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=m.instance);for(var n=[],o=0,r=f.parse(t);o{this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})})}setBodyText(t){this.body.textContent=t}}new o.a("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let W=new class{constructor(t,e,n=!1){const o=(new B).withUrl(t);n?o.configureLogging(u.Debug):o.configureLogging(u.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new H(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.117.197:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",W.loadServers.bind(W)),new j("Test Titel")}]); \ No newline at end of file +var o=function(t,e){return(o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function s(t,e){function n(){this.constructor=t}o(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var i=function(){return(i=Object.assign||function(t){for(var e,n=1,r=arguments.length;n0&&o[o.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!o||s[1]>o[0]&&s[1]=200&&o.status<300?n(new g(o.status,o.statusText,o.response||o.responseText)):r(new l(o.statusText,o.status))},o.onerror=function(){e.logger.log(u.Warning,"Error from HTTP request. "+o.status+": "+o.statusText),r(new l(o.statusText,o.status))},o.ontimeout=function(){e.logger.log(u.Warning,"Timeout from HTTP request."),r(new h)},o.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),v=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var r=new Uint8Array(t);if(-1===(s=r.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var o=s+1;e=String.fromCharCode.apply(null,r.slice(0,o)),n=r.byteLength>o?r.slice(o).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");o=s+1;e=i.substring(0,o),n=i.length>o?i.substring(o):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var m=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,r,o,s,i){return a(this,void 0,void 0,function(){var a,l,h,p;return c(this,function(c){switch(c.label){case 0:return[4,o()];case 1:return(l=c.sent())&&((p={}).Authorization="Bearer "+l,a=p),t.log(u.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(r,{content:s,headers:a})];case 2:return h=c.sent(),t.log(u.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,k,C=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case u.Critical:case u.Error:console.error(u[t]+": "+e);break;case u.Warning:console.warn(u[t]+": "+e);break;case u.Information:console.info(u[t]+": "+e);break;default:console.log(u[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var r=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new v,this.connection.onreceive=function(t){return r.processIncomingData(t)},this.connection.onclose=function(t){return r.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,r){return new t(e,n,r)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(u.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(u.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(u.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(u.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],r=1;r")),this.onclose(n)),this.logger.log(u.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(r){switch(r.label){case 0:return r.trys.push([0,,3,4]),this.running=!1,this.logger.log(u.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=r.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return r.sent(),this.logger.log(u.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(u.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,r){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=r}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,r=this;return c(this,function(o){switch(o.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,k,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(u.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=o.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,o){var s=!1;e!==k.Text&&o(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(r.onreceive)try{r.logger.log(u.Trace,"(SSE transport) data received. "+y(t.data,r.logMessageContent)+"."),r.onreceive(t.data)}catch(t){return void(r.onclose&&r.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?r.close(e):o(e)},i.onopen=function(){r.logger.log(u.Information,"SSE connected to "+r.url),r.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),O=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,r=this;return c(this,function(o){switch(o.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,k,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(u.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=o.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,o){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===k.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){r.logger.log(u.Information,"WebSocket connected to "+t),r.webSocket=s,n()},s.onerror=function(t){o(t.error)},s.onmessage=function(t){r.logger.log(u.Trace,"(WebSockets transport) data received. "+y(t.data,r.logMessageContent)+"."),r.onreceive&&r.onreceive(t.data)},s.onclose=function(t){r.logger.log(u.Trace,"(WebSockets transport) socket closed."),r.onclose&&(!1===t.wasClean||1e3!==t.code?r.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):r.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(u.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),F=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(u.Information):null===t?m.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new d(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||k.Binary,b.isIn(t,k,"transferFormat"),this.logger.log(u.Debug,"Starting connection with transfer format '"+k[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,r,o,s,i,a,l=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,r=0,o=function(){var t;return c(this,function(o){switch(o.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=o.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),r++,[2])}})},s=this,h.label=6;case 6:return[5,o()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&r<100)return[3,6];h.label=9;case 9:if(100===r&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(u.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,r,o,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),r=this.resolveNegotiateUrl(t),this.logger.log(u.Debug,"Sending negotiation request: "+r),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(r,{content:"",headers:n})];case 3:if(200!==(o=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+o.statusCode);return[2,JSON.parse(o.content)];case 4:throw s=a.sent(),this.logger.log(u.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,r){return a(this,void 0,void 0,function(){var o,s,i,a,l,h,p;return c(this,function(c){switch(c.label){case 0:return o=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(u.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(o,r)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(r===S.WebSockets&&"undefined"==typeof WebSocket||r===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(u.Debug,"Selecting transport '"+S[r]+"'"),r;this.logger.log(u.Debug,"Skipping transport '"+S[r]+"' because it is not supported in your environment.'")}else this.logger.log(u.Debug,"Skipping transport '"+S[r]+"' because it does not support the requested transfer format '"+k[n]+"'.");else this.logger.log(u.Debug,"Skipping transport '"+S[r]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(u.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(u.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(u.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var H="json",q=function(){function t(){this.name=H,this.version=1,this.transferFormat=k.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=m.instance);for(var n=[],r=0,o=f.parse(t);r{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let j=new class{constructor(t,e,n=!1){const r=(new N).withUrl(t);n?r.configureLogging(u.Debug):r.configureLogging(u.Error),this.connection=r.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new B(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.8.51:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",j.loadServers.bind(j))}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/script/play.js b/WebInterface/NodeJSServer/dist/script/play.js index 8c436f9..f6ff154 100644 --- a/WebInterface/NodeJSServer/dist/script/play.js +++ b/WebInterface/NodeJSServer/dist/script/play.js @@ -1 +1 @@ -!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=2)}({2:function(e,t){}}); \ No newline at end of file +!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=3)}({3:function(e,t){}}); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/style/index.css b/WebInterface/NodeJSServer/dist/style/index.css index 5e74a1b..f53e9a0 100644 --- a/WebInterface/NodeJSServer/dist/style/index.css +++ b/WebInterface/NodeJSServer/dist/style/index.css @@ -1 +1 @@ -html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.btn{border:none;border-radius:4px;padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;background-color:#546e7a;color:#fff;text-transform:uppercase;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);cursor:pointer;letter-spacing:0.25rem;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.btn:hover{background:#29434e radial-gradient(circle, transparent 1%, #29434e 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12);box-shadow:0 1px 3px rgba(0,0,0,0.12);-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.btn:disabled{color:#ffffff61;background:#546e7a61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.text-btn{padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;color:#fff;background-color:rgba(0,0,0,0);text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.text-btn:hover{background:#29434e61 radial-gradient(circle, transparent 1%, #29434e61 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.text-btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.text-btn:disabled{background:rgba(0,0,0,0);color:#ffffff61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .banner{z-index:1;background-color:white;border:none;border-radius:16px 16px 0 0;display:-webkit-box;display:-ms-flexbox;display:flex;margin:0;margin-bottom:1rem;padding-top:1rem;max-height:10rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-transform-origin:top;transform-origin:top;-webkit-transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;min-height:3.5rem;justify-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (max-height: 550px){.front-layer .banner{position:absolute;width:100%;-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}}.front-layer .banner.hidden{-webkit-transform:scaleY(0);transform:scaleY(0);visibility:hidden;max-height:0;-webkit-transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;min-height:0;margin-bottom:0}.front-layer .banner .banner-text{-ms-flex-item-align:left;-ms-grid-row-align:left;align-self:left;margin:1rem;-webkit-box-flex:100;-ms-flex-positive:100;flex-grow:100}.front-layer .banner .btn-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.front-layer .banner .btn-container .banner-button{color:#29434e;padding:8px 16px;margin:0;margin-right:1rem;letter-spacing:0.125rem}.front-layer .banner hr{width:100%}@media (max-height: 550px){.front-layer .banner hr{margin-bottom:0}}.front-layer .server-listing{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#212121;color:#fff;min-height:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-style:none;border-radius:8px;margin:1rem;margin-bottom:2rem;padding:0.5rem;padding-top:0.25rem;-webkit-box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2)}.front-layer .server-listing h1{text-align:center}@media (max-height: 550px){.front-layer .server-listing h1{display:none}}.front-layer .server-listing hr{width:100%}@media (max-height: 550px){.front-layer .server-listing hr{display:none}}@media (max-height: 450px){.front-layer .server-listing{padding-bottom:0.125rem}}.front-layer .server-listing .server-entries{overflow-y:auto;min-height:0}.front-layer .server-listing .server-entries .server{font-size:1.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#484848;padding:0.5rem;margin-bottom:0.25rem;border-style:none;border-radius:8px}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server{-ms-flex-wrap:wrap;flex-wrap:wrap}}.front-layer .server-listing .server-entries .server .server-name{font-weight:bold;letter-spacing:0.125rem;white-space:nowrap;overflow:hidden;margin:0.5rem 0}.front-layer .server-listing .server-entries .server .player-count{font-family:'Roboto Condensed', sans-serif}.front-layer .server-listing .server-entries .server .player-count-static{white-space:nowrap;margin-left:0.25rem;letter-spacing:0;font-family:'Roboto Condensed', sans-serif}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server .player-count-static{display:none}}.front-layer .server-listing .server-entries .server .player-count-dot{background-color:#393;border-radius:50%;min-width:1rem;min-height:1rem;width:1rem;height:1rem;margin-left:auto;margin-right:0.25rem}.front-layer .server-listing .server-entries .server .join-btn{margin-left:0.5rem;min-width:12rem}.front-layer .server-listing .button-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:1rem;margin-right:0.25rem;min-height:2.5rem}@media (max-height: 450px){.front-layer .server-listing .button-container{margin-top:0.125rem;min-height:2rem}}@media (max-width: 450px){.front-layer .server-listing .button-container .btn{letter-spacing:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}.modal-container{position:absolute;top:0;width:100vw;height:100vh;background-color:#000000AA;display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease}.modal-container.hidden{opacity:0}.modal-container .modal{background-color:#546e7a;margin:auto;padding:1rem;border-style:none;border-radius:8px;-webkit-box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22);box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22)}.modal-container .modal-title{margin:1rem}.modal-container .modal-body{margin:0.25rem} +html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.btn{border:none;border-radius:4px;padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;background-color:#546e7a;color:#fff;text-transform:uppercase;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);cursor:pointer;letter-spacing:0.25rem;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.btn:hover{background:#29434e radial-gradient(circle, transparent 1%, #29434e 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12);box-shadow:0 1px 3px rgba(0,0,0,0.12);-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.btn:disabled{color:#ffffff61;background:#546e7a61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.text-btn{padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;color:#fff;background-color:rgba(0,0,0,0);text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.text-btn:hover{background:#29434e61 radial-gradient(circle, transparent 1%, #29434e61 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.text-btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.text-btn:disabled{background:rgba(0,0,0,0);color:#ffffff61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .banner{z-index:1;background-color:white;border:none;border-radius:16px 16px 0 0;display:-webkit-box;display:-ms-flexbox;display:flex;margin:0;margin-bottom:1rem;padding-top:1rem;max-height:10rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-transform-origin:top;transform-origin:top;-webkit-transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;min-height:3.5rem;justify-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (max-height: 550px){.front-layer .banner{position:absolute;width:100%;-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}}.front-layer .banner.hidden{-webkit-transform:scaleY(0);transform:scaleY(0);visibility:hidden;max-height:0;-webkit-transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;min-height:0;margin-bottom:0}.front-layer .banner .banner-text{-ms-flex-item-align:left;-ms-grid-row-align:left;align-self:left;margin:1rem;-webkit-box-flex:100;-ms-flex-positive:100;flex-grow:100}.front-layer .banner .btn-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.front-layer .banner .btn-container .banner-button{color:#29434e;padding:8px 16px;margin:0;margin-right:1rem;letter-spacing:0.125rem}.front-layer .banner hr{width:100%}@media (max-height: 550px){.front-layer .banner hr{margin-bottom:0}}.front-layer .server-listing{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#212121;color:#fff;min-height:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-style:none;border-radius:8px;margin:1rem;margin-bottom:2rem;padding:0.5rem;padding-top:0.25rem;-webkit-box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2)}.front-layer .server-listing h1{text-align:center}@media (max-height: 550px){.front-layer .server-listing h1{display:none}}.front-layer .server-listing hr{width:100%}@media (max-height: 550px){.front-layer .server-listing hr{display:none}}@media (max-height: 450px){.front-layer .server-listing{padding-bottom:0.125rem}}.front-layer .server-listing .server-entries{overflow-y:auto;min-height:0}.front-layer .server-listing .server-entries .server{font-size:1.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#484848;padding:0.5rem;margin-bottom:0.25rem;border-style:none;border-radius:8px}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server{-ms-flex-wrap:wrap;flex-wrap:wrap}}.front-layer .server-listing .server-entries .server .server-name{font-weight:bold;letter-spacing:0.125rem;white-space:nowrap;overflow:hidden;margin:0.5rem 0}.front-layer .server-listing .server-entries .server .right-aligned-items{margin-left:auto;white-space:nowrap;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-dot{background-color:#393;border-radius:50%;min-width:1rem;min-height:1rem;width:1rem;height:1rem;margin-right:0.25rem}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count{font-family:'Roboto Condensed', sans-serif}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-static{white-space:nowrap;margin-left:0.25rem;letter-spacing:0;font-family:'Roboto Condensed', sans-serif}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-static{display:none}}.front-layer .server-listing .server-entries .server .right-aligned-items .join-btn{margin-left:0.5rem;min-width:12rem}.front-layer .server-listing .button-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:1rem;margin-right:0.25rem;min-height:2.5rem}@media (max-height: 450px){.front-layer .server-listing .button-container{margin-top:0.125rem;min-height:2rem}}@media (max-width: 450px){.front-layer .server-listing .button-container .btn{letter-spacing:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}.modal-container{position:absolute;top:0;width:100vw;height:100vh;background-color:#000000AA;display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease}.modal-container.hidden{opacity:0}.modal-container .modal{background-color:#546e7a;margin:auto;padding:1rem;border-style:none;border-radius:8px;-webkit-box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22);box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22)}.modal-container .modal-title{max-width:85vw;margin:1rem;text-align:center}.modal-container .modal-body{margin:0.25rem}.modal .modal-title{white-space:nowrap;overflow:hidden}.modal .modal-body{display:-ms-grid;display:grid;-ms-grid-columns:10em 1fr;grid-template-columns:10em 1fr;-ms-grid-rows:1fr 1fr;grid-template-rows:1fr 1fr;grid-row-gap:0.5rem}.modal .modal-body div{display:contents;font-size:1.25rem}.modal .modal-body div label{-ms-flex-preferred-size:30%;flex-basis:30%;margin-right:2rem;grid-column:1 2}.modal .modal-body div input{-ms-flex-preferred-size:calc(70% - 2rem);flex-basis:calc(70% - 2rem);grid-column:2 3} diff --git a/WebInterface/NodeJSServer/src/modules/server-client.js b/WebInterface/NodeJSServer/src/modules/server-client.js index e550bb7..86ea336 100644 --- a/WebInterface/NodeJSServer/src/modules/server-client.js +++ b/WebInterface/NodeJSServer/src/modules/server-client.js @@ -1,6 +1,5 @@ import * as signalR from '@aspnet/signalr'; import ServerListing from './ui/server-listing.js'; -import ServerCreator from './ui/server-creator.js'; export default class ServerClient { constructor(url, serverListingId, debug = false) { @@ -43,7 +42,7 @@ export default class ServerClient { } createServer(){ - + // TODO: Create } messageHandling(){ diff --git a/WebInterface/NodeJSServer/src/modules/ui/server-creator.js b/WebInterface/NodeJSServer/src/modules/ui/server-creator.js deleted file mode 100644 index 4203dfe..0000000 --- a/WebInterface/NodeJSServer/src/modules/ui/server-creator.js +++ /dev/null @@ -1,7 +0,0 @@ -import Modal from './modal.js'; - -export default class ServerCreator extends Modal { - constructor() { - super('Neues Spiel') - } -} diff --git a/WebInterface/NodeJSServer/src/modules/ui/server-listing.js b/WebInterface/NodeJSServer/src/modules/ui/server-listing.js index be66573..2c501fd 100644 --- a/WebInterface/NodeJSServer/src/modules/ui/server-listing.js +++ b/WebInterface/NodeJSServer/src/modules/ui/server-listing.js @@ -15,12 +15,14 @@ export default class ServerListing { 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'; @@ -31,11 +33,12 @@ export default class ServerListing { playerCountStaticSpan.textContent = 'Spieler online'; joinButton.textContent = 'Beitreten'; + rightAlignDiv.appendChild(onlineDot); + rightAlignDiv.appendChild(playerCountSpan); + rightAlignDiv.appendChild(playerCountStaticSpan); + rightAlignDiv.appendChild(joinButton); serverDiv.appendChild(nameSpan); - serverDiv.appendChild(onlineDot); - serverDiv.appendChild(playerCountSpan); - serverDiv.appendChild(playerCountStaticSpan); - serverDiv.appendChild(joinButton); + serverDiv.appendChild(rightAlignDiv) this.serverListing.appendChild(serverDiv); } } diff --git a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss index 2efb73b..7e67178 100644 --- a/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss +++ b/WebInterface/NodeJSServer/src/style/partials/front-layer/_server-listing.scss @@ -60,35 +60,41 @@ margin: 0.5rem 0; } - .player-count { - font-family: 'Roboto Condensed', sans-serif; - } + .right-aligned-items { + margin-left: auto; + white-space: nowrap; + display: flex; + align-items: center; - .player-count-static { - @media (max-width: 1000px) { - display: none; + .player-count-dot { + background-color: $online-green; + border-radius: 50%; + min-width: 1rem; + min-height: 1rem; + width: 1rem; + height: 1rem; + margin-right: 0.25rem; } - white-space: nowrap; - margin-left: 0.25rem; - letter-spacing: 0; - font-family: 'Roboto Condensed', sans-serif; - } + .player-count { + font-family: 'Roboto Condensed', sans-serif; + } - .player-count-dot { - background-color: $online-green; - border-radius: 50%; - min-width: 1rem; - min-height: 1rem; - width: 1rem; - height: 1rem; - margin-left: auto; - margin-right: 0.25rem; - } + .player-count-static { + @media (max-width: 1000px) { + display: none; + } - .join-btn { - margin-left: 0.5rem; - min-width: 12rem; + white-space: nowrap; + margin-left: 0.25rem; + letter-spacing: 0; + font-family: 'Roboto Condensed', sans-serif; + } + + .join-btn { + margin-left: 0.5rem; + min-width: 12rem; + } } } } -- cgit v1.2.3-54-g00ecf From ef9a3da0528c659cc0ea430ba2729044fdcc8747 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 20:27:17 +0200 Subject: Added basic layout for login modal Shows form for inputting password and name. --- WebInterface/NodeJSServer/src/index.js | 5 +-- .../NodeJSServer/src/modules/ui/login-modal.js | 38 ++++++++++++++++++++++ WebInterface/NodeJSServer/src/modules/ui/modal.js | 5 +++ WebInterface/NodeJSServer/src/style/index.scss | 1 + .../src/style/partials/modal/_base.scss | 2 ++ .../src/style/partials/modal/_login.scss | 30 +++++++++++++++++ 6 files changed, 79 insertions(+), 2 deletions(-) create mode 100644 WebInterface/NodeJSServer/src/modules/ui/login-modal.js create mode 100644 WebInterface/NodeJSServer/src/style/partials/modal/_login.scss diff --git a/WebInterface/NodeJSServer/src/index.js b/WebInterface/NodeJSServer/src/index.js index 8e615f2..0377a75 100644 --- a/WebInterface/NodeJSServer/src/index.js +++ b/WebInterface/NodeJSServer/src/index.js @@ -1,7 +1,8 @@ import Backdrop from './modules/ui/backdrop.js'; import BannerController from './modules/ui/notification-banner.js'; import ServerClient from './modules/server-client.js' -import Modal from './modules/ui/modal.js'; // TODO: DEBUGGING +import LoginModal from './modules/ui/login-modal.js'; // TODO: JUST FOR DEBUGGING +import './modules/hash.js'; let backdrop = new Backdrop('menu', 'front-layer', 'show-menu'); backdrop.register(); @@ -14,4 +15,4 @@ let client = new ServerClient('http://89.183.8.51:5000/chatHub', 'server-list', document.getElementById('refresh-button') .addEventListener('click', client.loadServers.bind(client)); -new Modal('Test Titel'); +// new LoginModal('The Crew'); diff --git a/WebInterface/NodeJSServer/src/modules/ui/login-modal.js b/WebInterface/NodeJSServer/src/modules/ui/login-modal.js new file mode 100644 index 0000000..eeb98cb --- /dev/null +++ b/WebInterface/NodeJSServer/src/modules/ui/login-modal.js @@ -0,0 +1,38 @@ +import Modal from './modal.js'; + +export default class LoginModal extends Modal { + constructor(serverName) { + super('Login: ' + serverName); + + let passBox = document.createElement('div'); + let nameBox = document.createElement('div'); + + let passwordLabel = document.createElement('label'); + let passwordInput = document.createElement('input'); + passwordLabel.setAttribute('for', 'password-input'); + passwordLabel.textContent = 'Passwort:'; + passwordLabel.title = 'Das Passwort des Spiels' + passwordInput.id = 'password-input'; + passwordInput.type = 'password'; + passwordInput.placeholder = 'Passwort'; + + let nameLabel = document.createElement('label'); + let nameInput = document.createElement('input'); + 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'; + + + passBox.appendChild(passwordLabel); + passBox.appendChild(passwordInput); + nameBox.appendChild(nameLabel); + nameBox.appendChild(nameInput); + + this.body.appendChild(passBox); + this.body.appendChild(nameBox); + } +} diff --git a/WebInterface/NodeJSServer/src/modules/ui/modal.js b/WebInterface/NodeJSServer/src/modules/ui/modal.js index e1aa8a2..31e6397 100644 --- a/WebInterface/NodeJSServer/src/modules/ui/modal.js +++ b/WebInterface/NodeJSServer/src/modules/ui/modal.js @@ -13,6 +13,7 @@ export default class Modal { title.textContent = titleString; modal.appendChild(title); + modal.appendChild(body); modalBackground.appendChild(modal); document.body.appendChild(modalBackground); @@ -25,6 +26,10 @@ export default class Modal { } registerEvents() { + this.modal.addEventListener('click', (e) => { + e.stopPropagation(); + }); + this.bg.addEventListener('click', () => { this.bg.classList.add('hidden'); this.bg.addEventListener('transitionend', () => { diff --git a/WebInterface/NodeJSServer/src/style/index.scss b/WebInterface/NodeJSServer/src/style/index.scss index 285a47b..04c896a 100644 --- a/WebInterface/NodeJSServer/src/style/index.scss +++ b/WebInterface/NodeJSServer/src/style/index.scss @@ -7,3 +7,4 @@ @import 'partials/front-layer/server-listing'; @import 'partials/front-layer/copyright'; @import 'partials/modal/base'; +@import 'partials/modal/login'; diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss index 1e7742e..1665003 100644 --- a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss +++ b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss @@ -24,7 +24,9 @@ } .modal-title { + max-width: 85vw; margin: 1rem; + text-align: center; } .modal-body { diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss new file mode 100644 index 0000000..7aa1bf8 --- /dev/null +++ b/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss @@ -0,0 +1,30 @@ +.modal { + .modal-title { + white-space: nowrap; + overflow: hidden; + } + + .modal-body { + display: grid; + grid-template-columns: 10em 1fr; + grid-template-rows: 1fr 1fr; + grid-row-gap: 0.5rem; + + div { + display: contents; + font-size: 1.25rem; + + label { + flex-basis: 30%; + margin-right: 2rem; + + grid-column: 1 2; + } + + input { + flex-basis: calc(70% - 2rem); + grid-column: 2 3; + } + } + } +} -- cgit v1.2.3-54-g00ecf From 7026897c34d17a40f73efe599286138528806185 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 20:27:29 +0200 Subject: Added hash function to string prototype --- WebInterface/NodeJSServer/src/modules/hash.js | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 WebInterface/NodeJSServer/src/modules/hash.js diff --git a/WebInterface/NodeJSServer/src/modules/hash.js b/WebInterface/NodeJSServer/src/modules/hash.js new file mode 100644 index 0000000..29be0af --- /dev/null +++ b/WebInterface/NodeJSServer/src/modules/hash.js @@ -0,0 +1,9 @@ +String.prototype.getHash = async function() { + let data = new ArrayBuffer(this.length * 2); + let bufferView = new Uint16Array(data); + for (let i = 0; i < this.length; i++) { + bufferView[i] = this.charCodeAt(i); + } + + return await crypto.subtle.digest('SHA-256', bufferView); +} -- cgit v1.2.3-54-g00ecf From 66ffaf22fa0451d0f07652233d4b9d3ae933a68e Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 21:48:00 +0200 Subject: Added functionality to login modal --- WebInterface/NodeJSServer/dist/script/index.js | 4 +-- WebInterface/NodeJSServer/dist/style/index.css | 2 +- WebInterface/NodeJSServer/src/index.js | 3 +- WebInterface/NodeJSServer/src/modules/hash.js | 10 ++++++- .../NodeJSServer/src/modules/server-client.js | 4 +++ .../NodeJSServer/src/modules/ui/login-modal.js | 33 ++++++++++++++++++++-- WebInterface/NodeJSServer/src/modules/ui/modal.js | 12 +++++--- .../src/style/partials/modal/_base.scss | 2 +- .../src/style/partials/modal/_login.scss | 6 +++- 9 files changed, 62 insertions(+), 14 deletions(-) diff --git a/WebInterface/NodeJSServer/dist/script/index.js b/WebInterface/NodeJSServer/dist/script/index.js index 1f0a23d..1f5dd72 100644 --- a/WebInterface/NodeJSServer/dist/script/index.js +++ b/WebInterface/NodeJSServer/dist/script/index.js @@ -1,4 +1,4 @@ -!function(t){var e={};function n(r){if(e[r])return e[r].exports;var o=e[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(r,o,function(e){return t[e]}.bind(null,o));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=4)}([function(t,e,n){"use strict";n.d(e,"a",function(){return r});class r{constructor(t,e,n){this.backdrop=document.getElementById(t),this.frontLayer=document.getElementById(e),this.menuButton=document.getElementById(n)}register(){this.registerButtonEvent(),this.registerFrontLayerEvent()}registerButtonEvent(){this.menuButton.addEventListener("click",()=>{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},function(t,e){String.prototype.getHash=async function(){let t=new ArrayBuffer(2*this.length),e=new Uint16Array(t);for(let t=0;t{this.backdrop.classList.contains("hidden")?this.backdrop.classList.remove("hidden"):this.backdrop.classList.add("hidden"),this.menuButton.classList.contains("open")?this.menuButton.classList.remove("open"):this.menuButton.classList.add("open")})}registerFrontLayerEvent(){this.frontLayer.addEventListener("click",()=>{this.backdrop.classList.add("hidden"),this.menuButton.classList.remove("open")})}}},function(t,e){String.prototype.getHash=async function(){let t=new ArrayBuffer(2*this.length),e=new Uint16Array(t);for(let t=0;t0&&o[o.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!o||s[1]>o[0]&&s[1]=200&&o.status<300?n(new g(o.status,o.statusText,o.response||o.responseText)):r(new l(o.statusText,o.status))},o.onerror=function(){e.logger.log(u.Warning,"Error from HTTP request. "+o.status+": "+o.statusText),r(new l(o.statusText,o.status))},o.ontimeout=function(){e.logger.log(u.Warning,"Timeout from HTTP request."),r(new h)},o.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),v=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var r=new Uint8Array(t);if(-1===(s=r.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var o=s+1;e=String.fromCharCode.apply(null,r.slice(0,o)),n=r.byteLength>o?r.slice(o).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");o=s+1;e=i.substring(0,o),n=i.length>o?i.substring(o):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var m=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,r,o,s,i){return a(this,void 0,void 0,function(){var a,l,h,p;return c(this,function(c){switch(c.label){case 0:return[4,o()];case 1:return(l=c.sent())&&((p={}).Authorization="Bearer "+l,a=p),t.log(u.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(r,{content:s,headers:a})];case 2:return h=c.sent(),t.log(u.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,k,C=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case u.Critical:case u.Error:console.error(u[t]+": "+e);break;case u.Warning:console.warn(u[t]+": "+e);break;case u.Information:console.info(u[t]+": "+e);break;default:console.log(u[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var r=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new v,this.connection.onreceive=function(t){return r.processIncomingData(t)},this.connection.onclose=function(t){return r.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,r){return new t(e,n,r)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(u.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(u.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(u.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(u.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],r=1;r")),this.onclose(n)),this.logger.log(u.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(r){switch(r.label){case 0:return r.trys.push([0,,3,4]),this.running=!1,this.logger.log(u.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=r.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return r.sent(),this.logger.log(u.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(u.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,r){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=r}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,r=this;return c(this,function(o){switch(o.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,k,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(u.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=o.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,o){var s=!1;e!==k.Text&&o(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(r.onreceive)try{r.logger.log(u.Trace,"(SSE transport) data received. "+y(t.data,r.logMessageContent)+"."),r.onreceive(t.data)}catch(t){return void(r.onclose&&r.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?r.close(e):o(e)},i.onopen=function(){r.logger.log(u.Information,"SSE connected to "+r.url),r.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),O=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,r=this;return c(this,function(o){switch(o.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,k,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(u.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=o.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,o){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===k.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){r.logger.log(u.Information,"WebSocket connected to "+t),r.webSocket=s,n()},s.onerror=function(t){o(t.error)},s.onmessage=function(t){r.logger.log(u.Trace,"(WebSockets transport) data received. "+y(t.data,r.logMessageContent)+"."),r.onreceive&&r.onreceive(t.data)},s.onclose=function(t){r.logger.log(u.Trace,"(WebSockets transport) socket closed."),r.onclose&&(!1===t.wasClean||1e3!==t.code?r.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):r.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(u.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),F=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(u.Information):null===t?m.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new d(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||k.Binary,b.isIn(t,k,"transferFormat"),this.logger.log(u.Debug,"Starting connection with transfer format '"+k[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,r,o,s,i,a,l=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,r=0,o=function(){var t;return c(this,function(o){switch(o.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=o.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),r++,[2])}})},s=this,h.label=6;case 6:return[5,o()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&r<100)return[3,6];h.label=9;case 9:if(100===r&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return l.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(u.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,r,o,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),r=this.resolveNegotiateUrl(t),this.logger.log(u.Debug,"Sending negotiation request: "+r),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(r,{content:"",headers:n})];case 3:if(200!==(o=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+o.statusCode);return[2,JSON.parse(o.content)];case 4:throw s=a.sent(),this.logger.log(u.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,r){return a(this,void 0,void 0,function(){var o,s,i,a,l,h,p;return c(this,function(c){switch(c.label){case 0:return o=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(u.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(o,r)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(r===S.WebSockets&&"undefined"==typeof WebSocket||r===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(u.Debug,"Selecting transport '"+S[r]+"'"),r;this.logger.log(u.Debug,"Skipping transport '"+S[r]+"' because it is not supported in your environment.'")}else this.logger.log(u.Debug,"Skipping transport '"+S[r]+"' because it does not support the requested transfer format '"+k[n]+"'.");else this.logger.log(u.Debug,"Skipping transport '"+S[r]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(u.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(u.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(u.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var H="json",q=function(){function t(){this.name=H,this.version=1,this.transferFormat=k.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=m.instance);for(var n=[],r=0,o=f.parse(t);r{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let j=new class{constructor(t,e,n=!1){const r=(new N).withUrl(t);n?r.configureLogging(u.Debug):r.configureLogging(u.Error),this.connection=r.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new B(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.8.51:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",j.loadServers.bind(j))}]); \ No newline at end of file +var r=function(t,e){return(r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function s(t,e){function n(){this.constructor=t}r(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var i=function(){return(i=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new d(r.status,r.statusText,r.response||r.responseText)):o(new u(r.statusText,r.status))},r.onerror=function(){e.logger.log(l.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new u(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(l.Warning,"Timeout from HTTP request."),o(new h)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),m=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var v=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,o,r,s,i){return a(this,void 0,void 0,function(){var a,u,h,p;return c(this,function(c){switch(c.label){case 0:return[4,r()];case 1:return(u=c.sent())&&((p={}).Authorization="Bearer "+u,a=p),t.log(l.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(o,{content:s,headers:a})];case 2:return h=c.sent(),t.log(l.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,C,E=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case l.Critical:case l.Error:console.error(l[t]+": "+e);break;case l.Warning:console.warn(l[t]+": "+e);break;case l.Information:console.info(l[t]+": "+e);break;default:console.log(l[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var o=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new m,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(l.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(l.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(l.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(l.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(l.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(l.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(l.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(l.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,C,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(l.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==C.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(l.Trace,"(SSE transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(l.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),N=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,C,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(l.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===C.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(l.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(l.Trace,"(WebSockets transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(l.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(l.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),O=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(l.Information):null===t?v.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new g(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||C.Binary,b.isIn(t,C,"transferFormat"),this.logger.log(l.Debug,"Starting connection with transfer format '"+C[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i,a,u=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return c(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return u.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(l.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(l.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(l.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return a(this,void 0,void 0,function(){var r,s,i,a,u,h,p;return c(this,function(c){switch(c.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(l.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(o===S.WebSockets&&"undefined"==typeof WebSocket||o===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(l.Debug,"Selecting transport '"+S[o]+"'"),o;this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it is not supported in your environment.'")}else this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it does not support the requested transfer format '"+C[n]+"'.");else this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(l.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(l.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(l.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var B="json",F=function(){function t(){this.name=B,this.version=1,this.transferFormat=C.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=v.instance);for(var n=[],o=0,r=f.parse(t);o{t.stopPropagation()}),this.bg.addEventListener("click",()=>{this.close()})}close(){this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})}setBodyText(t){this.body.textContent=t}}n(1);new o.a("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let A=new class{constructor(t,e,n=!1){const o=(new H).withUrl(t);n?o.configureLogging(l.Debug):o.configureLogging(l.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new q(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}sendLogin(t,e,n){this.connection.invoke("Login",t,n,e)}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.8.51:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",A.loadServers.bind(A)),new class extends j{constructor(t,e){super(t),this.serverName=t,this.serverClient=e;let n=document.createElement("div"),o=document.createElement("div"),r=document.createElement("div"),s=document.createElement("label"),i=document.createElement("input");s.setAttribute("for","password-input"),s.textContent="Passwort:",s.title="Das Passwort des Spiels",i.id="password-input",i.type="password",i.placeholder="Passwort";let a=document.createElement("label"),c=document.createElement("input");a.setAttribute("for","name-input"),a.textContent="Benutzername:",a.title="Dein Anzeigename",c.id="name-input",c.type="text",c.autocomplete="on",c.placeholder="Name";let l=document.createElement("button");l.className="btn",l.textContent="Login",l.id="login-button",n.appendChild(s),n.appendChild(i),o.appendChild(a),o.appendChild(c),r.appendChild(l),this.body.appendChild(n),this.body.appendChild(o),this.body.appendChild(r),this.nameInput=c,this.passwordInput=i,this.loginButton=l,this.registerLoginBtn()}registerLoginBtn(){this.loginButton.addEventListener("click",()=>{console.log("button pressed");let t=this.nameInput.value;this.passwordInput.value.getHash().then(e=>{this.serverClient.sendLogin(this.serverName,e,t),this.close()})})}}("The Crew",A)}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/dist/style/index.css b/WebInterface/NodeJSServer/dist/style/index.css index f53e9a0..d61d3f2 100644 --- a/WebInterface/NodeJSServer/dist/style/index.css +++ b/WebInterface/NodeJSServer/dist/style/index.css @@ -1 +1 @@ -html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.btn{border:none;border-radius:4px;padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;background-color:#546e7a;color:#fff;text-transform:uppercase;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);cursor:pointer;letter-spacing:0.25rem;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.btn:hover{background:#29434e radial-gradient(circle, transparent 1%, #29434e 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12);box-shadow:0 1px 3px rgba(0,0,0,0.12);-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.btn:disabled{color:#ffffff61;background:#546e7a61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.text-btn{padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;color:#fff;background-color:rgba(0,0,0,0);text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.text-btn:hover{background:#29434e61 radial-gradient(circle, transparent 1%, #29434e61 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.text-btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.text-btn:disabled{background:rgba(0,0,0,0);color:#ffffff61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .banner{z-index:1;background-color:white;border:none;border-radius:16px 16px 0 0;display:-webkit-box;display:-ms-flexbox;display:flex;margin:0;margin-bottom:1rem;padding-top:1rem;max-height:10rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-transform-origin:top;transform-origin:top;-webkit-transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;min-height:3.5rem;justify-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (max-height: 550px){.front-layer .banner{position:absolute;width:100%;-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}}.front-layer .banner.hidden{-webkit-transform:scaleY(0);transform:scaleY(0);visibility:hidden;max-height:0;-webkit-transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;min-height:0;margin-bottom:0}.front-layer .banner .banner-text{-ms-flex-item-align:left;-ms-grid-row-align:left;align-self:left;margin:1rem;-webkit-box-flex:100;-ms-flex-positive:100;flex-grow:100}.front-layer .banner .btn-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.front-layer .banner .btn-container .banner-button{color:#29434e;padding:8px 16px;margin:0;margin-right:1rem;letter-spacing:0.125rem}.front-layer .banner hr{width:100%}@media (max-height: 550px){.front-layer .banner hr{margin-bottom:0}}.front-layer .server-listing{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#212121;color:#fff;min-height:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-style:none;border-radius:8px;margin:1rem;margin-bottom:2rem;padding:0.5rem;padding-top:0.25rem;-webkit-box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2)}.front-layer .server-listing h1{text-align:center}@media (max-height: 550px){.front-layer .server-listing h1{display:none}}.front-layer .server-listing hr{width:100%}@media (max-height: 550px){.front-layer .server-listing hr{display:none}}@media (max-height: 450px){.front-layer .server-listing{padding-bottom:0.125rem}}.front-layer .server-listing .server-entries{overflow-y:auto;min-height:0}.front-layer .server-listing .server-entries .server{font-size:1.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#484848;padding:0.5rem;margin-bottom:0.25rem;border-style:none;border-radius:8px}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server{-ms-flex-wrap:wrap;flex-wrap:wrap}}.front-layer .server-listing .server-entries .server .server-name{font-weight:bold;letter-spacing:0.125rem;white-space:nowrap;overflow:hidden;margin:0.5rem 0}.front-layer .server-listing .server-entries .server .right-aligned-items{margin-left:auto;white-space:nowrap;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-dot{background-color:#393;border-radius:50%;min-width:1rem;min-height:1rem;width:1rem;height:1rem;margin-right:0.25rem}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count{font-family:'Roboto Condensed', sans-serif}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-static{white-space:nowrap;margin-left:0.25rem;letter-spacing:0;font-family:'Roboto Condensed', sans-serif}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-static{display:none}}.front-layer .server-listing .server-entries .server .right-aligned-items .join-btn{margin-left:0.5rem;min-width:12rem}.front-layer .server-listing .button-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:1rem;margin-right:0.25rem;min-height:2.5rem}@media (max-height: 450px){.front-layer .server-listing .button-container{margin-top:0.125rem;min-height:2rem}}@media (max-width: 450px){.front-layer .server-listing .button-container .btn{letter-spacing:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}.modal-container{position:absolute;top:0;width:100vw;height:100vh;background-color:#000000AA;display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease}.modal-container.hidden{opacity:0}.modal-container .modal{background-color:#546e7a;margin:auto;padding:1rem;border-style:none;border-radius:8px;-webkit-box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22);box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22)}.modal-container .modal-title{max-width:85vw;margin:1rem;text-align:center}.modal-container .modal-body{margin:0.25rem}.modal .modal-title{white-space:nowrap;overflow:hidden}.modal .modal-body{display:-ms-grid;display:grid;-ms-grid-columns:10em 1fr;grid-template-columns:10em 1fr;-ms-grid-rows:1fr 1fr;grid-template-rows:1fr 1fr;grid-row-gap:0.5rem}.modal .modal-body div{display:contents;font-size:1.25rem}.modal .modal-body div label{-ms-flex-preferred-size:30%;flex-basis:30%;margin-right:2rem;grid-column:1 2}.modal .modal-body div input{-ms-flex-preferred-size:calc(70% - 2rem);flex-basis:calc(70% - 2rem);grid-column:2 3} +html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.btn{border:none;border-radius:4px;padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;background-color:#546e7a;color:#fff;text-transform:uppercase;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);box-shadow:0 1px 3px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);cursor:pointer;letter-spacing:0.25rem;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.btn:hover{background:#29434e radial-gradient(circle, transparent 1%, #29434e 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.12);box-shadow:0 1px 3px rgba(0,0,0,0.12);-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.btn:disabled{color:#ffffff61;background:#546e7a61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.text-btn{padding:8px;margin:0;font-size:1rem;font-family:'Roboto Condensed', sans-serif;font-weight:bold;display:inline-block;color:#fff;background-color:rgba(0,0,0,0);text-transform:uppercase;-webkit-box-shadow:none;box-shadow:none;background-position:center;-webkit-transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, color 200ms ease, -webkit-box-shadow 100ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease;transition:background 800ms ease, box-shadow 100ms ease, color 200ms ease, -webkit-box-shadow 100ms ease}.text-btn:hover{background:#29434e61 radial-gradient(circle, transparent 1%, #29434e61 1%) center/15000%;-webkit-box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23);box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}.text-btn:active{background-color:#819ca9;background-size:100%;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, -webkit-box-shadow 0s;transition:background 0s, box-shadow 0s;transition:background 0s, box-shadow 0s, -webkit-box-shadow 0s}.text-btn:disabled{background:rgba(0,0,0,0);color:#ffffff61;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease;transition:background 200ms ease, box-shadow 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .banner{z-index:1;background-color:white;border:none;border-radius:16px 16px 0 0;display:-webkit-box;display:-ms-flexbox;display:flex;margin:0;margin-bottom:1rem;padding-top:1rem;max-height:10rem;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-transform-origin:top;transform-origin:top;-webkit-transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-start, -webkit-transform 200ms ease;min-height:3.5rem;justify-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}@media (max-height: 550px){.front-layer .banner{position:absolute;width:100%;-webkit-box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22);box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22)}}.front-layer .banner.hidden{-webkit-transform:scaleY(0);transform:scaleY(0);visibility:hidden;max-height:0;-webkit-transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end;transition:max-height 200ms ease, transform 200ms ease, visibility 200ms step-end, -webkit-transform 200ms ease;min-height:0;margin-bottom:0}.front-layer .banner .banner-text{-ms-flex-item-align:left;-ms-grid-row-align:left;align-self:left;margin:1rem;-webkit-box-flex:100;-ms-flex-positive:100;flex-grow:100}.front-layer .banner .btn-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.front-layer .banner .btn-container .banner-button{color:#29434e;padding:8px 16px;margin:0;margin-right:1rem;letter-spacing:0.125rem}.front-layer .banner hr{width:100%}@media (max-height: 550px){.front-layer .banner hr{margin-bottom:0}}.front-layer .server-listing{-webkit-box-sizing:border-box;box-sizing:border-box;background-color:#212121;color:#fff;min-height:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;border-style:none;border-radius:8px;margin:1rem;margin-bottom:2rem;padding:0.5rem;padding-top:0.25rem;-webkit-box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);box-shadow:0 8px 10px 1px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2)}.front-layer .server-listing h1{text-align:center}@media (max-height: 550px){.front-layer .server-listing h1{display:none}}.front-layer .server-listing hr{width:100%}@media (max-height: 550px){.front-layer .server-listing hr{display:none}}@media (max-height: 450px){.front-layer .server-listing{padding-bottom:0.125rem}}.front-layer .server-listing .server-entries{overflow-y:auto;min-height:0}.front-layer .server-listing .server-entries .server{font-size:1.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#484848;padding:0.5rem;margin-bottom:0.25rem;border-style:none;border-radius:8px}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server{-ms-flex-wrap:wrap;flex-wrap:wrap}}.front-layer .server-listing .server-entries .server .server-name{font-weight:bold;letter-spacing:0.125rem;white-space:nowrap;overflow:hidden;margin:0.5rem 0}.front-layer .server-listing .server-entries .server .right-aligned-items{margin-left:auto;white-space:nowrap;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-dot{background-color:#393;border-radius:50%;min-width:1rem;min-height:1rem;width:1rem;height:1rem;margin-right:0.25rem}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count{font-family:'Roboto Condensed', sans-serif}.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-static{white-space:nowrap;margin-left:0.25rem;letter-spacing:0;font-family:'Roboto Condensed', sans-serif}@media (max-width: 1000px){.front-layer .server-listing .server-entries .server .right-aligned-items .player-count-static{display:none}}.front-layer .server-listing .server-entries .server .right-aligned-items .join-btn{margin-left:0.5rem;min-width:12rem}.front-layer .server-listing .button-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;margin-top:1rem;margin-right:0.25rem;min-height:2.5rem}@media (max-height: 450px){.front-layer .server-listing .button-container{margin-top:0.125rem;min-height:2rem}}@media (max-width: 450px){.front-layer .server-listing .button-container .btn{letter-spacing:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}.modal-container{position:absolute;top:0;width:100vw;height:100vh;background-color:#000000AA;display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease}.modal-container.hidden{opacity:0}.modal-container .modal{background-color:#212121;margin:auto;padding:1rem;border-style:none;border-radius:8px;-webkit-box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22);box-shadow:0 19px 38px rgba(0,0,0,0.3),0 15px 12px rgba(0,0,0,0.22)}.modal-container .modal-title{max-width:85vw;margin:1rem;text-align:center}.modal-container .modal-body{margin:0.25rem}.modal .modal-title{white-space:nowrap;overflow:hidden}.modal .modal-body{display:-ms-grid;display:grid;-ms-grid-columns:10em 1fr;grid-template-columns:10em 1fr;-ms-grid-rows:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr;grid-row-gap:0.5rem}.modal .modal-body div{display:contents;font-size:1.25rem}.modal .modal-body div label{-ms-flex-preferred-size:30%;flex-basis:30%;margin-right:2rem;grid-column:1 2}.modal .modal-body div input{-ms-flex-preferred-size:calc(70% - 2rem);flex-basis:calc(70% - 2rem);grid-column:2 3}.modal .modal-body div button{-ms-grid-column:1;-ms-grid-column-span:2;grid-column:1 / 3} diff --git a/WebInterface/NodeJSServer/src/index.js b/WebInterface/NodeJSServer/src/index.js index 0377a75..9a06504 100644 --- a/WebInterface/NodeJSServer/src/index.js +++ b/WebInterface/NodeJSServer/src/index.js @@ -2,7 +2,6 @@ import Backdrop from './modules/ui/backdrop.js'; import BannerController from './modules/ui/notification-banner.js'; import ServerClient from './modules/server-client.js' import LoginModal from './modules/ui/login-modal.js'; // TODO: JUST FOR DEBUGGING -import './modules/hash.js'; let backdrop = new Backdrop('menu', 'front-layer', 'show-menu'); backdrop.register(); @@ -15,4 +14,4 @@ let client = new ServerClient('http://89.183.8.51:5000/chatHub', 'server-list', document.getElementById('refresh-button') .addEventListener('click', client.loadServers.bind(client)); -// new LoginModal('The Crew'); +new LoginModal('The Crew', client); diff --git a/WebInterface/NodeJSServer/src/modules/hash.js b/WebInterface/NodeJSServer/src/modules/hash.js index 29be0af..826c8ee 100644 --- a/WebInterface/NodeJSServer/src/modules/hash.js +++ b/WebInterface/NodeJSServer/src/modules/hash.js @@ -5,5 +5,13 @@ String.prototype.getHash = async function() { bufferView[i] = this.charCodeAt(i); } - return await crypto.subtle.digest('SHA-256', bufferView); + let encrypted = await crypto.subtle.digest('SHA-256', bufferView); + let byteArray = new Uint8Array(encrypted); + let base64String = ''; + + for (let byte of byteArray) { + base64String += String.fromCharCode(byte); + } + + return btoa(base64String); } diff --git a/WebInterface/NodeJSServer/src/modules/server-client.js b/WebInterface/NodeJSServer/src/modules/server-client.js index 86ea336..96fbaba 100644 --- a/WebInterface/NodeJSServer/src/modules/server-client.js +++ b/WebInterface/NodeJSServer/src/modules/server-client.js @@ -45,6 +45,10 @@ export default class ServerClient { // TODO: Create } + sendLogin(group, password, username){ + this.connection.invoke('Login', group, username, password); + } + messageHandling(){ this.connection.on('ReceiveMessage', (user, message) => { let msg = message.replace(/&/g, "&") diff --git a/WebInterface/NodeJSServer/src/modules/ui/login-modal.js b/WebInterface/NodeJSServer/src/modules/ui/login-modal.js index eeb98cb..cb1f2ac 100644 --- a/WebInterface/NodeJSServer/src/modules/ui/login-modal.js +++ b/WebInterface/NodeJSServer/src/modules/ui/login-modal.js @@ -1,11 +1,15 @@ import Modal from './modal.js'; +import '../hash.js'; export default class LoginModal extends Modal { - constructor(serverName) { - super('Login: ' + serverName); + constructor(serverName, serverClient) { + super(serverName); + this.serverName = serverName; + this.serverClient = serverClient; 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'); @@ -26,13 +30,38 @@ export default class LoginModal extends Modal { nameInput.autocomplete = 'on'; nameInput.placeholder = 'Name'; + let sendButton = document.createElement('button'); + sendButton.className = 'btn'; + sendButton.textContent = 'Login'; + sendButton.id = 'login-button'; + passBox.appendChild(passwordLabel); passBox.appendChild(passwordInput); nameBox.appendChild(nameLabel); nameBox.appendChild(nameInput); + 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.registerLoginBtn(); + } + + registerLoginBtn() { + this.loginButton.addEventListener('click', () => { + console.log('button pressed') + let userName = this.nameInput.value; + this.passwordInput.value.getHash() + .then((result) => { + this.serverClient.sendLogin(this.serverName, result, userName); + this.close(); + }); + }); } } diff --git a/WebInterface/NodeJSServer/src/modules/ui/modal.js b/WebInterface/NodeJSServer/src/modules/ui/modal.js index 31e6397..55e38bd 100644 --- a/WebInterface/NodeJSServer/src/modules/ui/modal.js +++ b/WebInterface/NodeJSServer/src/modules/ui/modal.js @@ -31,10 +31,14 @@ export default class Modal { }); this.bg.addEventListener('click', () => { - this.bg.classList.add('hidden'); - this.bg.addEventListener('transitionend', () => { - document.body.removeChild(this.bg); - }); + this.close(); + }); + } + + close() { + this.bg.classList.add('hidden'); + this.bg.addEventListener('transitionend', () => { + document.body.removeChild(this.bg); }); } diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss index 1665003..006c241 100644 --- a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss +++ b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss @@ -15,7 +15,7 @@ } .modal { - background-color: $secondary; + background-color: $primary; margin: auto; padding: 1rem; border-style: none; diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss index 7aa1bf8..eed978f 100644 --- a/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss +++ b/WebInterface/NodeJSServer/src/style/partials/modal/_login.scss @@ -7,7 +7,7 @@ .modal-body { display: grid; grid-template-columns: 10em 1fr; - grid-template-rows: 1fr 1fr; + grid-template-rows: 1fr 1fr 1fr; grid-row-gap: 0.5rem; div { @@ -25,6 +25,10 @@ flex-basis: calc(70% - 2rem); grid-column: 2 3; } + + button { + grid-column: 1 / 3; + } } } } -- cgit v1.2.3-54-g00ecf From 7e77099c0458621b1345bfe3c848e2daf99bb4b5 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 21:48:12 +0200 Subject: Replaced icon with another temp. icon --- .../NodeJSServer/dist/ressources/Logo768.png | Bin 46128 -> 50005 bytes 1 file changed, 0 insertions(+), 0 deletions(-) diff --git a/WebInterface/NodeJSServer/dist/ressources/Logo768.png b/WebInterface/NodeJSServer/dist/ressources/Logo768.png index 0b9991a..5f769ab 100644 Binary files a/WebInterface/NodeJSServer/dist/ressources/Logo768.png and b/WebInterface/NodeJSServer/dist/ressources/Logo768.png differ -- cgit v1.2.3-54-g00ecf From 71783b20dbddd018d2ea140bced59048c7baf0a4 Mon Sep 17 00:00:00 2001 From: TrueKuehli Date: Sun, 30 Sep 2018 22:00:02 +0200 Subject: Small debugging additions --- WebInterface/NodeJSServer/dist/script/index.js | 2 +- WebInterface/NodeJSServer/src/index.js | 2 ++ WebInterface/NodeJSServer/src/modules/server-client.js | 3 +++ 3 files changed, 6 insertions(+), 1 deletion(-) diff --git a/WebInterface/NodeJSServer/dist/script/index.js b/WebInterface/NodeJSServer/dist/script/index.js index 1f5dd72..cba8989 100644 --- a/WebInterface/NodeJSServer/dist/script/index.js +++ b/WebInterface/NodeJSServer/dist/script/index.js @@ -13,4 +13,4 @@ MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */ -var r=function(t,e){return(r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function s(t,e){function n(){this.constructor=t}r(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var i=function(){return(i=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new d(r.status,r.statusText,r.response||r.responseText)):o(new u(r.statusText,r.status))},r.onerror=function(){e.logger.log(l.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new u(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(l.Warning,"Timeout from HTTP request."),o(new h)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),m=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var v=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,o,r,s,i){return a(this,void 0,void 0,function(){var a,u,h,p;return c(this,function(c){switch(c.label){case 0:return[4,r()];case 1:return(u=c.sent())&&((p={}).Authorization="Bearer "+u,a=p),t.log(l.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(o,{content:s,headers:a})];case 2:return h=c.sent(),t.log(l.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,C,E=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case l.Critical:case l.Error:console.error(l[t]+": "+e);break;case l.Warning:console.warn(l[t]+": "+e);break;case l.Information:console.info(l[t]+": "+e);break;default:console.log(l[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var o=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new m,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(l.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(l.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(l.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(l.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(l.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(l.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(l.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(l.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,C,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(l.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==C.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(l.Trace,"(SSE transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(l.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),N=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,C,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(l.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===C.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(l.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(l.Trace,"(WebSockets transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(l.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(l.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),O=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(l.Information):null===t?v.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new g(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||C.Binary,b.isIn(t,C,"transferFormat"),this.logger.log(l.Debug,"Starting connection with transfer format '"+C[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i,a,u=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return c(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return u.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(l.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(l.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(l.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return a(this,void 0,void 0,function(){var r,s,i,a,u,h,p;return c(this,function(c){switch(c.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(l.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(o===S.WebSockets&&"undefined"==typeof WebSocket||o===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(l.Debug,"Selecting transport '"+S[o]+"'"),o;this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it is not supported in your environment.'")}else this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it does not support the requested transfer format '"+C[n]+"'.");else this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(l.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(l.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(l.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var B="json",F=function(){function t(){this.name=B,this.version=1,this.transferFormat=C.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=v.instance);for(var n=[],o=0,r=f.parse(t);o{t.stopPropagation()}),this.bg.addEventListener("click",()=>{this.close()})}close(){this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})}setBodyText(t){this.body.textContent=t}}n(1);new o.a("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let A=new class{constructor(t,e,n=!1){const o=(new H).withUrl(t);n?o.configureLogging(l.Debug):o.configureLogging(l.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new q(e)}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}sendLogin(t,e,n){this.connection.invoke("Login",t,n,e)}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{e.replace(/&/g,"&").replace(//g,">")})}}("http://89.183.8.51:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",A.loadServers.bind(A)),new class extends j{constructor(t,e){super(t),this.serverName=t,this.serverClient=e;let n=document.createElement("div"),o=document.createElement("div"),r=document.createElement("div"),s=document.createElement("label"),i=document.createElement("input");s.setAttribute("for","password-input"),s.textContent="Passwort:",s.title="Das Passwort des Spiels",i.id="password-input",i.type="password",i.placeholder="Passwort";let a=document.createElement("label"),c=document.createElement("input");a.setAttribute("for","name-input"),a.textContent="Benutzername:",a.title="Dein Anzeigename",c.id="name-input",c.type="text",c.autocomplete="on",c.placeholder="Name";let l=document.createElement("button");l.className="btn",l.textContent="Login",l.id="login-button",n.appendChild(s),n.appendChild(i),o.appendChild(a),o.appendChild(c),r.appendChild(l),this.body.appendChild(n),this.body.appendChild(o),this.body.appendChild(r),this.nameInput=c,this.passwordInput=i,this.loginButton=l,this.registerLoginBtn()}registerLoginBtn(){this.loginButton.addEventListener("click",()=>{console.log("button pressed");let t=this.nameInput.value;this.passwordInput.value.getHash().then(e=>{this.serverClient.sendLogin(this.serverName,e,t),this.close()})})}}("The Crew",A)}]); \ No newline at end of file +var r=function(t,e){return(r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function s(t,e){function n(){this.constructor=t}r(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var i=function(){return(i=Object.assign||function(t){for(var e,n=1,o=arguments.length;n0&&r[r.length-1])&&(6===s[0]||2===s[0])){i=0;continue}if(3===s[0]&&(!r||s[1]>r[0]&&s[1]=200&&r.status<300?n(new d(r.status,r.statusText,r.response||r.responseText)):o(new u(r.statusText,r.status))},r.onerror=function(){e.logger.log(l.Warning,"Error from HTTP request. "+r.status+": "+r.statusText),o(new u(r.statusText,r.status))},r.ontimeout=function(){e.logger.log(l.Warning,"Timeout from HTTP request."),o(new h)},r.send(t.content||"")})},e}(function(){function t(){}return t.prototype.get=function(t,e){return this.send(i({},e,{method:"GET",url:t}))},t.prototype.post=function(t,e){return this.send(i({},e,{method:"POST",url:t}))},t.prototype.delete=function(t,e){return this.send(i({},e,{method:"DELETE",url:t}))},t}()),f=function(){function t(){}return t.write=function(e){return""+e+t.RecordSeparator},t.parse=function(e){if(e[e.length-1]!==t.RecordSeparator)throw new Error("Message is incomplete.");var n=e.split(t.RecordSeparator);return n.pop(),n},t.RecordSeparatorCode=30,t.RecordSeparator=String.fromCharCode(t.RecordSeparatorCode),t}(),m=function(){function t(){}return t.prototype.writeHandshakeRequest=function(t){return f.write(JSON.stringify(t))},t.prototype.parseHandshakeResponse=function(t){var e,n;if(t instanceof ArrayBuffer){var o=new Uint8Array(t);if(-1===(s=o.indexOf(f.RecordSeparatorCode)))throw new Error("Message is incomplete.");var r=s+1;e=String.fromCharCode.apply(null,o.slice(0,r)),n=o.byteLength>r?o.slice(r).buffer:null}else{var s,i=t;if(-1===(s=i.indexOf(f.RecordSeparator)))throw new Error("Message is incomplete.");r=s+1;e=i.substring(0,r),n=i.length>r?i.substring(r):null}var a=f.parse(e);return[n,JSON.parse(a[0])]},t}();!function(t){t[t.Invocation=1]="Invocation",t[t.StreamItem=2]="StreamItem",t[t.Completion=3]="Completion",t[t.StreamInvocation=4]="StreamInvocation",t[t.CancelInvocation=5]="CancelInvocation",t[t.Ping=6]="Ping",t[t.Close=7]="Close"}(p||(p={}));var v=function(){function t(){}return t.prototype.log=function(t,e){},t.instance=new t,t}(),b=function(){function t(){}return t.isRequired=function(t,e){if(null===t||void 0===t)throw new Error("The '"+e+"' argument is required.")},t.isIn=function(t,e,n){if(!(t in e))throw new Error("Unknown "+n+" value: "+t+".")},t}();function y(t,e){var n=null;return t instanceof ArrayBuffer?(n="Binary data of length "+t.byteLength,e&&(n+=". Content: '"+function(t){var e="";return new Uint8Array(t).forEach(function(t){e+="0x"+(t<16?"0":"")+t.toString(16)+" "}),e.substr(0,e.length-1)}(t)+"'")):"string"==typeof t&&(n="String data of length "+t.length,e&&(n+=". Content: '"+t+"'.")),n}function w(t,e,n,o,r,s,i){return a(this,void 0,void 0,function(){var a,u,h,p;return c(this,function(c){switch(c.label){case 0:return[4,r()];case 1:return(u=c.sent())&&((p={}).Authorization="Bearer "+u,a=p),t.log(l.Trace,"("+e+" transport) sending data. "+y(s,i)+"."),[4,n.post(o,{content:s,headers:a})];case 2:return h=c.sent(),t.log(l.Trace,"("+e+" transport) request complete. Response status: "+h.statusCode+"."),[2]}})})}var S,C,E=function(){function t(t){this.observers=[],this.cancelCallback=t}return t.prototype.next=function(t){for(var e=0,n=this.observers;e-1&&this.subject.observers.splice(t,1),0===this.subject.observers.length&&this.subject.cancelCallback().catch(function(t){})},t}(),T=function(){function t(t){this.minimumLogLevel=t}return t.prototype.log=function(t,e){if(t>=this.minimumLogLevel)switch(t){case l.Critical:case l.Error:console.error(l[t]+": "+e);break;case l.Warning:console.warn(l[t]+": "+e);break;case l.Information:console.info(l[t]+": "+e);break;default:console.log(l[t]+": "+e)}},t}(),I=3e4,L=function(){function t(t,e,n){var o=this;b.isRequired(t,"connection"),b.isRequired(e,"logger"),b.isRequired(n,"protocol"),this.serverTimeoutInMilliseconds=I,this.logger=e,this.protocol=n,this.connection=t,this.handshakeProtocol=new m,this.connection.onreceive=function(t){return o.processIncomingData(t)},this.connection.onclose=function(t){return o.connectionClosed(t)},this.callbacks={},this.methods={},this.closedCallbacks=[],this.id=0}return t.create=function(e,n,o){return new t(e,n,o)},t.prototype.start=function(){return a(this,void 0,void 0,function(){var t;return c(this,function(e){switch(e.label){case 0:return t={protocol:this.protocol.name,version:this.protocol.version},this.logger.log(l.Debug,"Starting HubConnection."),this.receivedHandshakeResponse=!1,[4,this.connection.start(this.protocol.transferFormat)];case 1:return e.sent(),this.logger.log(l.Debug,"Sending handshake request."),[4,this.connection.send(this.handshakeProtocol.writeHandshakeRequest(t))];case 2:return e.sent(),this.logger.log(l.Information,"Using HubProtocol '"+this.protocol.name+"'."),this.cleanupTimeout(),this.configureTimeout(),[2]}})})},t.prototype.stop=function(){return this.logger.log(l.Debug,"Stopping HubConnection."),this.cleanupTimeout(),this.connection.stop()},t.prototype.stream=function(t){for(var e=this,n=[],o=1;o")),this.onclose(n)),this.logger.log(l.Trace,"(LongPolling transport) Transport finished."),[7];case 9:return[2]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.running?[2,w(this.logger,"LongPolling",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return a(this,void 0,void 0,function(){var t,e,n=this;return c(this,function(o){switch(o.label){case 0:return o.trys.push([0,,3,4]),this.running=!1,this.logger.log(l.Trace,"(LongPolling transport) sending DELETE request to "+this.url+"."),t={headers:{}},[4,this.accessTokenFactory()];case 1:return e=o.sent(),this.updateHeaderToken(t,e),[4,this.httpClient.delete(this.url,t)];case 2:return o.sent(),this.logger.log(l.Trace,"(LongPolling transport) DELETE request accepted."),[3,4];case 3:return this.stopped||(this.shutdownTimer=setTimeout(function(){n.logger.log(l.Warning,"(LongPolling transport) server did not terminate after DELETE request, canceling poll."),n.pollAbort.abort()},this.shutdownTimeout)),[7];case 4:return[2]}})})},t}(),R=function(){function t(t,e,n,o){this.httpClient=t,this.accessTokenFactory=e||function(){return null},this.logger=n,this.logMessageContent=o}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,C,"transferFormat"),"undefined"==typeof EventSource)throw new Error("'EventSource' is not supported in your environment.");return this.logger.log(l.Trace,"(SSE transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),this.url=t,[2,new Promise(function(n,r){var s=!1;e!==C.Text&&r(new Error("The Server-Sent Events transport only supports the 'Text' transfer format"));var i=new EventSource(t,{withCredentials:!0});try{i.onmessage=function(t){if(o.onreceive)try{o.logger.log(l.Trace,"(SSE transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive(t.data)}catch(t){return void(o.onclose&&o.onclose(t))}},i.onerror=function(t){var e=new Error(t.message||"Error occurred");s?o.close(e):r(e)},i.onopen=function(){o.logger.log(l.Information,"SSE connected to "+o.url),o.eventSource=i,s=!0,n()}}catch(t){return Promise.reject(t)}})]}})})},t.prototype.send=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.eventSource?[2,w(this.logger,"SSE",this.httpClient,this.url,this.accessTokenFactory,t,this.logMessageContent)]:[2,Promise.reject(new Error("Cannot send until the transport is connected"))]})})},t.prototype.stop=function(){return this.close(),Promise.resolve()},t.prototype.close=function(t){this.eventSource&&(this.eventSource.close(),this.eventSource=null,this.onclose&&this.onclose(t))},t}(),N=function(){function t(t,e,n){this.logger=e,this.accessTokenFactory=t||function(){return null},this.logMessageContent=n}return t.prototype.connect=function(t,e){return a(this,void 0,void 0,function(){var n,o=this;return c(this,function(r){switch(r.label){case 0:if(b.isRequired(t,"url"),b.isRequired(e,"transferFormat"),b.isIn(e,C,"transferFormat"),"undefined"==typeof WebSocket)throw new Error("'WebSocket' is not supported in your environment.");return this.logger.log(l.Trace,"(WebSockets transport) Connecting"),[4,this.accessTokenFactory()];case 1:return(n=r.sent())&&(t+=(t.indexOf("?")<0?"?":"&")+"access_token="+encodeURIComponent(n)),[2,new Promise(function(n,r){t=t.replace(/^http/,"ws");var s=new WebSocket(t);e===C.Binary&&(s.binaryType="arraybuffer"),s.onopen=function(e){o.logger.log(l.Information,"WebSocket connected to "+t),o.webSocket=s,n()},s.onerror=function(t){r(t.error)},s.onmessage=function(t){o.logger.log(l.Trace,"(WebSockets transport) data received. "+y(t.data,o.logMessageContent)+"."),o.onreceive&&o.onreceive(t.data)},s.onclose=function(t){o.logger.log(l.Trace,"(WebSockets transport) socket closed."),o.onclose&&(!1===t.wasClean||1e3!==t.code?o.onclose(new Error("Websocket closed with status code: "+t.code+" ("+t.reason+")")):o.onclose())}})]}})})},t.prototype.send=function(t){return this.webSocket&&this.webSocket.readyState===WebSocket.OPEN?(this.logger.log(l.Trace,"(WebSockets transport) sending data. "+y(t,this.logMessageContent)+"."),this.webSocket.send(t),Promise.resolve()):Promise.reject("WebSocket is not in the OPEN state")},t.prototype.stop=function(){return this.webSocket&&(this.webSocket.close(),this.webSocket=null),Promise.resolve()},t}(),O=function(){function t(t,e){void 0===e&&(e={}),this.features={},b.isRequired(t,"url"),this.logger=function(t){return void 0===t?new T(l.Information):null===t?v.instance:t.log?t:new T(t)}(e.logger),this.baseUrl=this.resolveUrl(t),(e=e||{}).accessTokenFactory=e.accessTokenFactory||function(){return null},e.logMessageContent=e.logMessageContent||!1,this.httpClient=e.httpClient||new g(this.logger),this.connectionState=2,this.options=e}return t.prototype.start=function(t){return t=t||C.Binary,b.isIn(t,C,"transferFormat"),this.logger.log(l.Debug,"Starting connection with transfer format '"+C[t]+"'."),2!==this.connectionState?Promise.reject(new Error("Cannot start a connection that is not in the 'Disconnected' state.")):(this.connectionState=0,this.startPromise=this.startInternal(t),this.startPromise)},t.prototype.send=function(t){if(1!==this.connectionState)throw new Error("Cannot send data if the connection is not in the 'Connected' State.");return this.transport.send(t)},t.prototype.stop=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){switch(e.label){case 0:this.connectionState=2,e.label=1;case 1:return e.trys.push([1,3,,4]),[4,this.startPromise];case 2:return e.sent(),[3,4];case 3:return e.sent(),[3,4];case 4:return this.transport?(this.stopError=t,[4,this.transport.stop()]):[3,6];case 5:e.sent(),this.transport=null,e.label=6;case 6:return[2]}})})},t.prototype.startInternal=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i,a,u=this;return c(this,function(h){switch(h.label){case 0:e=this.baseUrl,this.accessTokenFactory=this.options.accessTokenFactory,h.label=1;case 1:return h.trys.push([1,12,,13]),this.options.skipNegotiation?this.options.transport!==S.WebSockets?[3,3]:(this.transport=this.constructTransport(S.WebSockets),[4,this.transport.connect(e,t)]):[3,5];case 2:return h.sent(),[3,4];case 3:throw Error("Negotiation can only be skipped when using the WebSocket transport directly.");case 4:return[3,11];case 5:n=null,o=0,r=function(){var t;return c(this,function(r){switch(r.label){case 0:return[4,s.getNegotiationResponse(e)];case 1:return n=r.sent(),2===s.connectionState?[2,{value:void 0}]:(n.url&&(e=n.url),n.accessToken&&(t=n.accessToken,s.accessTokenFactory=function(){return t}),o++,[2])}})},s=this,h.label=6;case 6:return[5,r()];case 7:if("object"==typeof(i=h.sent()))return[2,i.value];h.label=8;case 8:if(n.url&&o<100)return[3,6];h.label=9;case 9:if(100===o&&n.url)throw Error("Negotiate redirection limit exceeded.");return[4,this.createTransport(e,this.options.transport,n,t)];case 10:h.sent(),h.label=11;case 11:return this.transport instanceof M&&(this.features.inherentKeepAlive=!0),this.transport.onreceive=this.onreceive,this.transport.onclose=function(t){return u.stopConnection(t)},this.changeState(0,1),[3,13];case 12:throw a=h.sent(),this.logger.log(l.Error,"Failed to start the connection: "+a),this.connectionState=2,this.transport=null,a;case 13:return[2]}})})},t.prototype.getNegotiationResponse=function(t){return a(this,void 0,void 0,function(){var e,n,o,r,s,i;return c(this,function(a){switch(a.label){case 0:return[4,this.accessTokenFactory()];case 1:(e=a.sent())&&((i={}).Authorization="Bearer "+e,n=i),o=this.resolveNegotiateUrl(t),this.logger.log(l.Debug,"Sending negotiation request: "+o),a.label=2;case 2:return a.trys.push([2,4,,5]),[4,this.httpClient.post(o,{content:"",headers:n})];case 3:if(200!==(r=a.sent()).statusCode)throw Error("Unexpected status code returned from negotiate "+r.statusCode);return[2,JSON.parse(r.content)];case 4:throw s=a.sent(),this.logger.log(l.Error,"Failed to complete negotiation with the server: "+s),s;case 5:return[2]}})})},t.prototype.createConnectUrl=function(t,e){return t+(-1===t.indexOf("?")?"?":"&")+"id="+e},t.prototype.createTransport=function(t,e,n,o){return a(this,void 0,void 0,function(){var r,s,i,a,u,h,p;return c(this,function(c){switch(c.label){case 0:return r=this.createConnectUrl(t,n.connectionId),this.isITransport(e)?(this.logger.log(l.Debug,"Connection was provided an instance of ITransport, using that directly."),this.transport=e,[4,this.transport.connect(r,o)]):[3,2];case 1:return c.sent(),this.changeState(0,1),[2];case 2:s=n.availableTransports,i=0,a=s,c.label=3;case 3:return i=0){if(!(o===S.WebSockets&&"undefined"==typeof WebSocket||o===S.ServerSentEvents&&"undefined"==typeof EventSource))return this.logger.log(l.Debug,"Selecting transport '"+S[o]+"'"),o;this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it is not supported in your environment.'")}else this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it does not support the requested transfer format '"+C[n]+"'.");else this.logger.log(l.Debug,"Skipping transport '"+S[o]+"' because it was disabled by the client.")}return null},t.prototype.isITransport=function(t){return t&&"object"==typeof t&&"connect"in t},t.prototype.changeState=function(t,e){return this.connectionState===t&&(this.connectionState=e,!0)},t.prototype.stopConnection=function(t){return a(this,void 0,void 0,function(){return c(this,function(e){return this.transport=null,(t=this.stopError||t)?this.logger.log(l.Error,"Connection disconnected with error '"+t+"'."):this.logger.log(l.Information,"Connection disconnected."),this.connectionState=2,this.onclose&&this.onclose(t),[2]})})},t.prototype.resolveUrl=function(t){if(0===t.lastIndexOf("https://",0)||0===t.lastIndexOf("http://",0))return t;if("undefined"==typeof window||!window||!window.document)throw new Error("Cannot resolve '"+t+"'.");var e=window.document.createElement("a");return e.href=t,this.logger.log(l.Information,"Normalizing '"+t+"' to '"+e.href+"'."),e.href},t.prototype.resolveNegotiateUrl=function(t){var e=t.indexOf("?"),n=t.substring(0,-1===e?t.length:e);return"/"!==n[n.length-1]&&(n+="/"),n+="negotiate",n+=-1===e?"":t.substring(e)},t}();var B="json",H=function(){function t(){this.name=B,this.version=1,this.transferFormat=C.Text}return t.prototype.parseMessages=function(t,e){if("string"!=typeof t)throw new Error("Invalid input for JSON hub protocol. Expected a string.");if(!t)return[];null===e&&(e=v.instance);for(var n=[],o=0,r=f.parse(t);o{t.stopPropagation()}),this.bg.addEventListener("click",()=>{this.close()})}close(){this.bg.classList.add("hidden"),this.bg.addEventListener("transitionend",()=>{document.body.removeChild(this.bg)})}setBodyText(t){this.body.textContent=t}}n(1);new o.a("menu","front-layer","show-menu").register(),new class{constructor(t,e,n){this.banner=document.getElementById(t),this.bannerText=document.getElementById(e),this.dismissBtn=document.getElementById(n),this.bannerMsgs=[],this.banner.classList.add("hidden")}register(){this.dismissBtn.addEventListener("click",()=>{this.dismissCurrent()})}show(t,e){let n={name:t,text:e,html:!1};this.bannerMsgs.push(n),this.update()}hide(t){if(t){for(let e=0;e {\n if (persistent) notificationManager.show('storageSuccess', 'Storage persistence successfully turned on.');\n else notificationManager.show('storageFail', 'Storage persistence has been rejected.');\n });\n \">here to enable storage persistence.",html:!0};this.bannerMsgs.push(t),this.update()}}("notifications","banner-info","dismiss-banner").register();let A=new class{constructor(t,e,n=!1){const o=(new F).withUrl(t);n?o.configureLogging(l.Debug):o.configureLogging(l.Error),this.connection=o.build(),this.connection.start().then(()=>this.loadServers()).catch(()=>t=>console.error(t.toString())),this.refreshing=!1,this.serverListing=new q(e),this.messageHandling()}loadServers(){this.refreshing||(this.connection.on("ListGroups",t=>{console.log(t),this.serverListing.flushElements(),this.serverListing.addElements(t),this.connection.off("ListGroups"),this.refreshing=!1}),this.connection.invoke("GetGroups").catch(t=>{this.refreshing=!1,console.error(t.toString())}),this.refreshing=!0)}createServer(){}sendLogin(t,e,n){this.connection.invoke("Login",t,n,e)}messageHandling(){this.connection.on("ReceiveMessage",(t,e)=>{let n=t+" sagt: "+e.replace(/&/g,"&").replace(//g,">");console.log(n)})}}("http://89.183.8.51:5000/chatHub","server-list",!0);document.getElementById("refresh-button").addEventListener("click",A.loadServers.bind(A)),new class extends j{constructor(t,e){super(t),this.serverName=t,this.serverClient=e;let n=document.createElement("div"),o=document.createElement("div"),r=document.createElement("div"),s=document.createElement("label"),i=document.createElement("input");s.setAttribute("for","password-input"),s.textContent="Passwort:",s.title="Das Passwort des Spiels",i.id="password-input",i.type="password",i.placeholder="Passwort";let a=document.createElement("label"),c=document.createElement("input");a.setAttribute("for","name-input"),a.textContent="Benutzername:",a.title="Dein Anzeigename",c.id="name-input",c.type="text",c.autocomplete="on",c.placeholder="Name";let l=document.createElement("button");l.className="btn",l.textContent="Login",l.id="login-button",n.appendChild(s),n.appendChild(i),o.appendChild(a),o.appendChild(c),r.appendChild(l),this.body.appendChild(n),this.body.appendChild(o),this.body.appendChild(r),this.nameInput=c,this.passwordInput=i,this.loginButton=l,this.registerLoginBtn()}registerLoginBtn(){this.loginButton.addEventListener("click",()=>{console.log("button pressed");let t=this.nameInput.value;this.passwordInput.value.getHash().then(e=>{this.serverClient.sendLogin(this.serverName,e,t),this.close()})})}}("The Crew",A),window.client=A}]); \ No newline at end of file diff --git a/WebInterface/NodeJSServer/src/index.js b/WebInterface/NodeJSServer/src/index.js index 9a06504..a37ae5f 100644 --- a/WebInterface/NodeJSServer/src/index.js +++ b/WebInterface/NodeJSServer/src/index.js @@ -15,3 +15,5 @@ document.getElementById('refresh-button') .addEventListener('click', client.loadServers.bind(client)); new LoginModal('The Crew', client); + +window.client = client; //TODO: REMOVE, JUST FOR DEBUGGING diff --git a/WebInterface/NodeJSServer/src/modules/server-client.js b/WebInterface/NodeJSServer/src/modules/server-client.js index 96fbaba..0a257ba 100644 --- a/WebInterface/NodeJSServer/src/modules/server-client.js +++ b/WebInterface/NodeJSServer/src/modules/server-client.js @@ -20,6 +20,8 @@ export default class ServerClient { this.refreshing = false; this.serverListing = new ServerListing(serverListingId); + + this.messageHandling(); //TODO: REMOVE, JUST FOR DEBUGGING } loadServers() { @@ -55,6 +57,7 @@ export default class ServerClient { .replace(//g, ">"); let encodedMsg = user + " sagt: " + msg; + console.log(encodedMsg); //TODO: REMOVE, JUST FOR DEBUGGING }); } } -- cgit v1.2.3-54-g00ecf