Add net client for connecting with StarGazer server

build.js

@@ -12,6 +12,10 @@ const fs = require("fs-extra"),
   VERSION_PLACEHOLDER = "$VERSION",
   version = require("./package.json").version,
   fileList = [{
+    url: "https://raw.githubusercontent.com/colyseus/colyseus.js/master/dist/colyseus.js",
+    localPath: "build/vendors/colyseus.js",
+    },
+    {
       url: "https://lab.las3.de/gitlab/eye-tracking-classroom/gaze-client.js/raw/master/build/gazeclient.js",
       localPath: "build/vendors/gazeclient.js",
     },

index.html

@@ -31,6 +31,7 @@
     <canvas class="hidden">
     </canvas>
     <script type="application/javascript" src="vendors/gazeclient.js"></script>
+    <script type="application/javascript" src="vendors/colyseus.js"></script>
     <script type="module" src="resources/js/index.js"></script>
 </body>
 

package-lock.json

 {
   "name": "stargazer",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

resources/js/com/NetClient.js

+const DEFAULT_GAME_ROOM = "star_gazer_lab";
+
+class NetClient {
+
+  connect(url) {
+    this.client = new Colyseus.Client('ws://localhost:2567');
+  }
+
+  joinGame() {
+    this.client.joinOrCreate(DEFAULT_GAME_ROOM).then(this.onConnect.bind(this)).catch(
+      this.onError.bind(this));
+  }
+
+  onConnect(room) {
+    console.log(room.sessionId, "joined", room.name);
+    room.onStateChange(this.onUpdate);
+    room.onMessage(this.onMessage);
+    room.onError(this.onError);
+    room.onLeave(this.onLeave);
+  }
+
+  onUpdate(state) {
+    console.log("received new state from server");
+    console.log(state);
+  }
+
+  onMessage(message) {
+    console.log("Received new message from server")
+  }
+
+  onError(error) {
+    console.log(error);
+  }
+
+  onLeave() {
+    console.log("Client left room")
+  }
+}
+
+export default NetClient;
\ No newline at end of file

resources/js/game/objects/GameObject.js

@@ -33,8 +33,6 @@ class GameObject {
     return Math.sqrt(deltaX * deltaX + deltaY * deltaY);
   }
 
-  draw(context) {}
-
 }
 
 export default GameObject;
\ No newline at end of file

resources/js/index.js

@@ -3,6 +3,7 @@ import Logger from "./utils/Logger.js";
 import StarGazer from "./game/StarGazer.js";
 import FakeGazeDataProvider from "./gaze/FakeGazeDataProvider.js";
 import GazeDataProvider from "./gaze/GazeDataProvider.js";
+import NetClient from "./com/NetClient.js";
 
 var canvas = document.querySelector("canvas"),
   starScreen = document.querySelector("#startScreen");
@@ -14,8 +15,7 @@ function init() {
   }
   document.querySelector("#versionInfo").innerHTML =
     `build ${GameConfig.getVersion()}`;
-  document.querySelector("#startButton").addEventListener("click",
-    prepareGame);
+    document.querySelector("#startButton").addEventListener("click", prepareGame);
 }
 
 function loadOptions() {
@@ -27,6 +27,13 @@ function loadOptions() {
   GameConfig.setShowVerboseDebugInfoInConsole(logToConsole);
 }
 
+function testServer() {
+  console.log("Testing Server ...");
+  let client = new NetClient();
+  client.connect("ws://localhost:2567");
+  client.joinGame();
+}
+
 function prepareGame() {
   loadOptions();
   StarGazer.init({