Sending packets via UDP instead

package.json

@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "@types/node": "^12.7.2",
-    "axios": "^0.21.1",
+    "dgram-as-promised": "^5.0.1",
     "express": "^4.17.1",
     "express-ws": "^4.0.0",
     "lodash": "^4.17.20",

server/color.ts

@@ -23,7 +23,7 @@ export class Color {
         return `rgb(${this.r},${this.g},${this.b})`;
     }
 
-    public withOpactiy(opacity): Color {
+    public withOpacitiy(opacity): Color {
         return new Color(
             Math.round(this.r * opacity),
             Math.round(this.g * opacity),

server/display-api.ts

@@ -1,11 +1,14 @@
-import axios from 'axios';
+import dgram from 'dgram-as-promised';
+import {Color} from "./color";
 
 export class DisplayAPI {
-    constructor(public rootEndpoint: string) {}
+    constructor(public size: number, public rootHost: string, public rootPort) {}
 
     private lastFrameRendered: boolean = true;
 
-    public set(colors): void {
+    private socket = dgram.createSocket('udp4');
+
+    public set(colors: Color[]): void {
         if (this.lastFrameRendered) {
             this.lastFrameRendered = false;
 
@@ -19,15 +22,21 @@ export class DisplayAPI {
         }
     }
 
-    public sendColors(colors): Promise<any> {
+    private sendColors(colors: Color[]): Promise<any> {
         const sendData = { colors };
 
-        const options = {
-            headers: {
-                'Content-Type': 'application/json',
-            }
-        };
+        const header = 0x04; // 0x03 for RGB, 0x04 for RGBW
+        const message = [header];
+
+        sendData.colors.forEach(color => {
+            message.push(color.r);
+            message.push(color.g);
+            message.push(color.b);
+            message.push(color.w);
+        });
+
+        const messageBuffer = Buffer.from(message);
 
-        return axios.post(this.rootEndpoint, sendData, options);
+        return this.socket.send(messageBuffer, 0, messageBuffer.length, this.rootPort, this.rootHost);
     }
 }

server/display.ts

@@ -6,8 +6,12 @@ import { Line } from "./types/Line";
 export class Display {
     public displayApi: DisplayAPI;
 
-    constructor(public size: number, rootEndpoint: string, public isDisplay: boolean = true, public invertOrientation: boolean = false) {
-        this.displayApi = new DisplayAPI(rootEndpoint);
+    constructor(public size: number,
+                rootHost: string,
+                rootPort: number,
+                public isDisplay: boolean = true,
+                public invertOrientation: boolean = false) {
+        this.displayApi = new DisplayAPI(size, rootHost, rootPort);
     }
 
     private previousFrame: Color[] = this.newBlackArray(this.size);
@@ -56,7 +60,7 @@ export class Display {
     }
 
     public drawAll(color: Color): void {
-        this.drawLine(new Line(0, this.size, this.size), color);
+        this.drawLine(new Line(this.size, 0, this.size), color);
     }
 
     public get(index: number): Color {

server/game.test.ts

@@ -24,7 +24,7 @@ let gameOptions: GameOptions = {
 };
 
 test('Game is created correctly', () => {
-    const display: Display = new Display(100, '', false, false);
+    const display: Display = new Display(100, '', 13335, false, false);
     const game = new Game(2, display, gameOptions);
     expect(game.newInputs.length).toBe(0);
 });

server/mods/BattleRoyale.ts

@@ -6,18 +6,19 @@ import { Line } from "../types/Line";
 export type BattleRoyaleState = {
     warnLines: Line[],
     deathLines: Line[],
+    lastExpansion: number,
 };
 
 export class BattleRoyale {
     private static DEATH_COLOR = HtmlColors.orangered;
     private static WARN_COLOR = HtmlColors.darkred;
     private static EXPANSION_SIZE = 10;
     private static EXPANSION_DELAY = 200;
-    private static lastExpansion = 0;
 
     public static startingGameState: BattleRoyaleState = {
         warnLines: [],
         deathLines: [],
+        lastExpansion: 0,
     }
 
     public static tick(gameState: GameState, display: Display) {
@@ -26,8 +27,8 @@ export class BattleRoyale {
     }
 
     public static nextState(gameState: GameState, nextState: GameState, stageSize: number): BattleRoyaleState {
-        if (gameState.turnNb >= this.lastExpansion + this.EXPANSION_DELAY) {
-            this.lastExpansion = gameState.turnNb;
+        if (gameState.turnNb >= gameState.battleRoyale.lastExpansion + this.EXPANSION_DELAY) {
+            nextState.battleRoyale.lastExpansion = gameState.turnNb;
 
             const warnLines = Line.simplifyArray(gameState.battleRoyale.warnLines);
             const deathLines = Line.simplifyArray(gameState.battleRoyale.deathLines);

server/server.ts

@@ -34,7 +34,8 @@ let app = express();
 const expressWs = expressWsWrapper(app);
 const NB_LED = 300;
 const MINIMUM_PLAYERS = 2;
-const DISPLAY_API_ROOT_ENDPOINT = 'http://localhost:13334';
+const DISPLAY_API_ROOT_HOSTNAME = 'localhost';
+const DISPLAY_API_ROOT_PORT = 13335;
 const WAITING_TIME = 10 * 1000;
 let players: {ws: WebSocket, character?: Character, inputs?: Partial<Inputs>}[] = [];
 let spectators: WebSocket[] = [];
@@ -94,7 +95,7 @@ if (process.argv.includes('--no-display')) {
 }
 
 const invertOrientation = process.argv.includes('--invert');
-const display: Display = new Display(NB_LED, DISPLAY_API_ROOT_ENDPOINT, isDisplay, invertOrientation);
+const display: Display = new Display(NB_LED, DISPLAY_API_ROOT_HOSTNAME, DISPLAY_API_ROOT_PORT, isDisplay, invertOrientation);
 
 displayServerStarted();
 
@@ -305,18 +306,18 @@ function displayWinnerColor(color: Color) {
     let it = 0;
     currentDisplayAnim = setInterval(() => {
         if (it <= 255) {
-            display.drawAll(color.withOpactiy(1 - it / 255));
+            display.drawAll(color.withOpacitiy(1 - it / 255));
             display.render();
         } else {
-            display.drawAll(color.withOpactiy((it - 255) / 255));
+            display.drawAll(color.withOpacitiy((it - 255) / 255));
             display.render();
         }
         if (it > 512) {
             it = 0;
             nbLoops--;
         }
         if (it === 255 && nbLoops < 0) {
-            display.drawAll(color.withOpactiy(0));
+            display.drawAll(color.withOpacitiy(0));
             display.render();
             stopCurrentAnimation();
         }
@@ -329,7 +330,7 @@ function displayWaitingColor(percentage: number) {
 
     const color: Color = new Color(percentage * 255, 0, (1 - percentage) * 255);
 
-    display.drawLine(new Line(0, Math.floor(NB_LED * percentage), NB_LED), color);
+    display.drawLine(new Line(NB_LED, 0, Math.floor(NB_LED * percentage)), color);
     display.render();
 }