Merge pull request #143 from Pax1601/76-add-configuration-file-for-server-properties

Added configuration file to set address and port

client/src/index.ts

@@ -9,7 +9,7 @@ import { AIC } from "./aic/aic";
 import { ATC } from "./atc/atc";
 import { FeatureSwitches } from "./featureswitches";
 import { LogPanel } from "./panels/logpanel";
-import { getAirbases, getBullseye as getBullseyes, getMission, getUnits, toggleDemoEnabled } from "./server/server";
+import { getAirbases, getBullseye as getBullseyes, getConfig, getMission, getUnits, setAddress, toggleDemoEnabled } from "./server/server";
 import { UnitDataTable } from "./units/unitdatatable";
 
 var map: Map;
@@ -69,16 +69,33 @@ function setup() {
     /* Setup event handlers */
     setupEvents();
 
-    /* On the first connection, force request of full data */
-    getAirbases((data: AirbasesData) => getMissionData()?.update(data));
-    getBullseyes((data: BullseyesData) => getMissionData()?.update(data));
-    getMission((data: any) => {getMissionData()?.update(data)});
-    getUnits((data: UnitsData) => getUnitsManager()?.update(data), true /* Does a full refresh */);
-
-    /* Start periodically requesting updates */
-    startPeriodicUpdate();
+    getConfig(readConfig)
 }
 
+function readConfig(config: any)
+{
+    if (config && config["server"] != undefined && config["server"]["address"] != undefined && config["server"]["port"] != undefined)
+    {
+        const address = config["server"]["address"];
+        const port = config["server"]["port"];
+        if ((typeof address === 'string' || address instanceof String) && typeof port == 'number')
+        {
+            setAddress(<string>address, <number>port);
+        } 
+
+        /* On the first connection, force request of full data */
+        getAirbases((data: AirbasesData) => getMissionData()?.update(data));
+        getBullseyes((data: BullseyesData) => getMissionData()?.update(data));
+        getMission((data: any) => {getMissionData()?.update(data)});
+        getUnits((data: UnitsData) => getUnitsManager()?.update(data), true /* Does a full refresh */);
+
+        /* Start periodically requesting updates */
+        startPeriodicUpdate();
+    }
+    else {
+        throw new Error('Could not read configuration file!');
+    }    
+}
 
 function startPeriodicUpdate() {
     requestUpdate();

client/src/panels/unitcontrolpanel.ts

@@ -87,7 +87,7 @@ export class UnitControlPanel extends Panel {
                 }
 
                 var button = document.createElement("button");
-                var callsign = aircraftDatabase.getByName(unit.getBaseData().unitName)?.label || "";
+                var callsign = unit.getBaseData().unitName || "";
 
                 button.innerText = unit.getBaseData().unitName;
                 button.setAttribute("data-short-label", database?.getByName(unit.getBaseData().name)?.shortLabel || "");

client/src/server/server.ts

@@ -2,9 +2,8 @@ import * as L from 'leaflet'
 import { setConnected } from '..';
 import { SpawnOptions } from '../controls/mapcontextmenu';
 
-/* Edit here to change server address */
-const REST_ADDRESS = "http://localhost:30000/olympus";
-const DEMO_ADDRESS = "http://localhost:3000/demo";
+var REST_ADDRESS = "http://localhost:30000/olympus";
+var DEMO_ADDRESS = window.location.href + "demo";
 const UNITS_URI = "units";
 const LOGS_URI = "logs";
 const AIRBASES_URI = "airbases";
@@ -45,6 +44,25 @@ export function POST(request: object, callback: CallableFunction){
     xhr.send(JSON.stringify(request));
 }
 
+export function getConfig(callback: CallableFunction) {
+    var xmlHttp = new XMLHttpRequest();
+    xmlHttp.open("GET", window.location.href + "config", true);
+    xmlHttp.onload = function (e) {
+        var data = JSON.parse(xmlHttp.responseText);
+        callback(data);
+        lastUpdateTime = parseInt(data.time);
+    };
+    xmlHttp.onerror = function () {
+        console.error("An error occurred during the XMLHttpRequest, could not retrieve configuration file");
+    };
+    xmlHttp.send(null);
+}
+
+export function setAddress(address: string, port: number) {
+    REST_ADDRESS = `http://${address}:${port}/olympus`
+    console.log(`Setting REST address to ${REST_ADDRESS}`)
+}
+
 export function getAirbases(callback: CallableFunction) {
     GET(callback, AIRBASES_URI);
 }

client/src/units/unit.ts

@@ -573,6 +573,15 @@ export class GroundUnit extends Unit {
         super(ID, data);
     }
 
+    getMarkerHTML() {
+        var role = groundUnitsDatabase.getByName(this.getBaseData().name)?.loadouts[0].roles[0];
+        return  `<div class="unit" data-object="unit-${this.getMarkerCategory()}" data-coalition="${this.getMissionData().coalition}">
+                    <div class="unit-selected-spotlight"></div>
+                    <div class="unit-marker"></div>
+                    <div class="unit-short-label">${role?.substring(0, 1)?.toUpperCase() || ""}</div>
+                </div>`
+    }
+
     getMarkerCategory()
     {
         // TODO this is very messy