weyne/DCSOlympus
1
0
Fork 0
mirror of https://github.com/Pax1601/DCSOlympus.git synced 2025-10-29 16:56:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added a more dynamic way of passing data to the UI.

Browse Source
This commit is contained in:
PeekabooSteam 2023-03-26 09:42:48 +01:00
parent eb97588ffa
commit b332b2a75b
3 changed files with 32 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
client/src/other/utils.ts
View File

@ -26,6 +26,27 @@ export function ConvertDDToDMS(D: number, lng: boolean) {
}
export function dataPointMap( container:HTMLElement, data:any) {
Object.keys( data ).forEach( ( key ) => {
const val = "" + data[ key ]; // Ensure a string
container.querySelectorAll( `[data-point="${key}"]`).forEach( el => {
// We could probably have options here
if ( el instanceof HTMLInputElement ) {
el.value = val;
} else if ( el instanceof HTMLElement ) {
el.innerText = val;
}
});
});
}
export function deg2rad(deg: number) {
var pi = Math.PI;
return deg * (pi / 180);

15
client/src/panels/unitcontrolpanel.ts
View File

@ -1,5 +1,6 @@
import { getUnitsManager } from "..";
import { Slider } from "../controls/slider";
import { dataPointMap } from "../other/utils";
import { aircraftDatabase } from "../units/aircraftdatabase";
import { groundUnitsDatabase } from "../units/groundunitsdatabase";
import { Aircraft, GroundUnit, Unit } from "../units/unit";
@ -74,21 +75,23 @@ export class UnitControlPanel extends Panel {
if (index === 0) {
this.getElement().querySelectorAll(`[data-object|="unit"]`).forEach(marker => {
marker.setAttribute("data-coalition", unit.getMissionData().coalition);
const shortLabel = <HTMLElement>marker.querySelector(".unit-short-label");
if (shortLabel)
shortLabel.innerText = database?.getByName(unit.getBaseData().name)?.shortLabel || "";
dataPointMap( this.getElement(), {
"shortLabel" : database?.getByName(unit.getBaseData().name)?.shortLabel,
"unitName": unit.getBaseData().unitName
});
});
}
var button = document.createElement("button");
const unitName = <HTMLInputElement>this.getElement().querySelector("#unit-name");
var callsign = aircraftDatabase.getByName(unit.getBaseData().unitName)?.label || "";
button.innerText = "";
button.innerText = unit.getBaseData().unitName;
button.setAttribute("data-short-label", database?.getByName(unit.getBaseData().name)?.shortLabel || "");
button.setAttribute("data-callsign", callsign);
unitName.value = callsign;
button.setAttribute("data-coalition", unit.getMissionData().coalition);
button.classList.add("pill", "highlight-coalition")

4
client/views/unitcontrolpanel.ejs
View File

@ -5,10 +5,10 @@
<div id="unit-identification">
<div data-object="unit-aircraft">
<div class="unit-marker"></div>
<div class="unit-short-label"></div>
<div class="unit-short-label" data-point="shortLabel"></div>
</div>
<input id="unit-name" value="" readonly disabled />
<input id="unit-name" value="" data-point="unitName" readonly disabled />
<!-- <button id="edit-unit-name" data-on-click="editUnitName"></button> -->
</div>