Connection Class

web/connection.js

@@ -2,6 +2,38 @@ import { Game } from './main.js';
 
 const address = 'localhost:9090';
 
+export class Connection {
+    constructor(params) {
+        this.address = params.address;
+
+        console.log(`Constructed with address: ${this.address}`);
+    }
+
+    async connectPlayer() {
+        if (window.WebSocket) {
+            const response = await fetch(`http://${this.address}/start`);
+            const res = await response.json();
+
+            // Address of lobby to connect to
+            console.log(res.location);
+            this.socket = new WebSocket(`ws://${this.address}/connect`);
+            this.socket.onopen = () => {
+                this.socket.onmessage = event => handleMessage(JSON.parse(event.data));
+            };
+
+            return true;
+        }
+
+        return false;
+    }
+
+    on(event, handler) {
+        console.log(event, handler);
+    }
+}
+
+
+// TODO: Should be in Game related functions
 function initializeArena(data) {
     Game.player.id = data.playerID;
     Object.assign(Game, {
@@ -11,6 +43,7 @@ function initializeArena(data) {
     });
 }
 
+// TODO: hould be in Game related functions
 function update(data) {
     console.log(Game);
 }
@@ -26,19 +59,4 @@ function handleMessage(msg) {
         default:
             break;
     }
-}
-
-export default async function connectPlayer() {
-    const response = await fetch(`http://${address}/start`);
-    const res = await response.json();
-
-    // Address of lobby to connect to
-    console.log(res.location);
-
-    if (window.WebSocket) {
-        let socket = new WebSocket(`ws://${address}/connect`);
-        socket.onopen = () => {
-            socket.onmessage = event => handleMessage(JSON.parse(event.data));
-        };
-    }
 }

web/main.js

@@ -1,5 +1,5 @@
 
-import connectPlayer from './connection.js';
+import { Connection, connectPlayer} from './connection.js';
 export const Game = {
     showMiniMap: false,
     showWelcomeModal: true,
@@ -68,8 +68,14 @@ function setup() {
     rocket.scale.set(0.2, 0.2); //scale of original png object
     rocket.rotation = 0.5; //radians
     app.stage.addChild(rocket);
-    connectPlayer();
-    console.log(Game)
 }
 
-//must add things to the stage
+window.onload = async () => {
+    console.log('Starting...');
+
+    const socket = new Connection({
+        address: 'localhost:9090',
+    });
+
+    socket.connectPlayer();
+};