mirror of
https://github.com/Pax1601/DCSOlympus.git
synced 2025-10-29 16:56:34 +00:00
Added beginnings of new ATC framework.
This commit is contained in:
109
client/src/atc/atc.ts
Normal file
109
client/src/atc/atc.ts
Normal file
@@ -0,0 +1,109 @@
|
|||||||
|
import { ATCBoard } from "./atcboard";
|
||||||
|
import { ATCBoardFlight } from "./board/flight";
|
||||||
|
|
||||||
|
export interface FlightInterface {
|
||||||
|
id : string;
|
||||||
|
name : string;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
class ATCDataHandler {
|
||||||
|
|
||||||
|
#atc:ATC;
|
||||||
|
|
||||||
|
#updateInterval:number|undefined = undefined;
|
||||||
|
#updateIntervalDelay:number = 1000;
|
||||||
|
|
||||||
|
|
||||||
|
constructor( atc:ATC ) {
|
||||||
|
|
||||||
|
this.#atc = atc;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
startUpdates() {
|
||||||
|
|
||||||
|
this.#updateInterval = setInterval( () => {
|
||||||
|
|
||||||
|
fetch( '/api/atc/flight', {
|
||||||
|
method: 'GET',
|
||||||
|
headers: {
|
||||||
|
'Accept': '*/*',
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.then( response => response.json() )
|
||||||
|
.then( data => {
|
||||||
|
this.#atc.setFlights( data );
|
||||||
|
});
|
||||||
|
|
||||||
|
}, this.#updateIntervalDelay );
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
stopUpdates() {
|
||||||
|
|
||||||
|
clearInterval( this.#updateInterval );
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export class ATC {
|
||||||
|
|
||||||
|
#boards<T extends ATCBoard>:<T>[] = [];
|
||||||
|
#dataHandler:ATCDataHandler;
|
||||||
|
#flights:{[key:string]: FlightInterface} = {};
|
||||||
|
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
|
||||||
|
this.#dataHandler = new ATCDataHandler( this );
|
||||||
|
|
||||||
|
this.lookForBoards();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
addBoard<T extends ATCBoard>( board:T ) {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
lookForBoards() {
|
||||||
|
|
||||||
|
document.querySelectorAll( "ol-atc-board" ).forEach( board => {
|
||||||
|
|
||||||
|
if ( board instanceof HTMLElement ) {
|
||||||
|
this.addBoard( new ATCBoardFlight( board ) );
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
setFlights( flights:{[key:string]: any} ) {
|
||||||
|
|
||||||
|
this.#flights = flights;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
startUpdates() {
|
||||||
|
|
||||||
|
this.#dataHandler.startUpdates();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
stopUpdates() {
|
||||||
|
|
||||||
|
this.#dataHandler.stopUpdates();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
15
client/src/atc/atcboard.ts
Normal file
15
client/src/atc/atcboard.ts
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
export abstract class ATCBoard {
|
||||||
|
|
||||||
|
#boardElement:HTMLElement;
|
||||||
|
|
||||||
|
constructor( boardElement:HTMLElement ) {
|
||||||
|
|
||||||
|
this.#boardElement = boardElement;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
getBoardElement() {
|
||||||
|
return this.#boardElement;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
11
client/src/atc/board/flight.ts
Normal file
11
client/src/atc/board/flight.ts
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
import { ATCBoard } from "../atcboard";
|
||||||
|
|
||||||
|
export class ATCBoardFlight extends ATCBoard {
|
||||||
|
|
||||||
|
constructor( element:HTMLElement ) {
|
||||||
|
|
||||||
|
super( element );
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
@@ -63,7 +63,7 @@ function setup() {
|
|||||||
let atcFeatureSwitch = featureSwitches.getSwitch("atc");
|
let atcFeatureSwitch = featureSwitches.getSwitch("atc");
|
||||||
if (atcFeatureSwitch?.isEnabled()) {
|
if (atcFeatureSwitch?.isEnabled()) {
|
||||||
atc = new ATC();
|
atc = new ATC();
|
||||||
// TODO: add back buttons
|
atc.startUpdates();
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Setup event handlers */
|
/* Setup event handlers */
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
<div class="ol-panel ol-dialog">
|
<div class="ol-panel ol-dialog ol-atc-board" data-feature-switch="atc">
|
||||||
ATC
|
|
||||||
|
<div class="atc-stripboard"></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
Reference in New Issue
Block a user