mirror of
https://github.com/Pax1601/DCSOlympus.git
synced 2025-10-29 16:56:34 +00:00
Reformatted some files
This commit is contained in:
parent
5d4fdf1e76
commit
fcb02602a0
@ -182,7 +182,7 @@ export class OlympusApp {
|
||||
.add("serverStatus", new ServerStatusPanel("server-status-panel"))
|
||||
.add("unitControl", new UnitControlPanel("unit-control-panel"))
|
||||
.add("unitInfo", new UnitInfoPanel("unit-info-panel"))
|
||||
.add("unitList", new UnitListPanel( this, "unit-list-panel", "unit-list-panel-content" ) )
|
||||
.add("unitList", new UnitListPanel("unit-list-panel", "unit-list-panel-content"))
|
||||
|
||||
// Popups
|
||||
this.getPopupsManager().add("infoPopup", new Popup("info-popup"));
|
||||
@ -198,8 +198,8 @@ export class OlympusApp {
|
||||
if (config && config.address != undefined && config.port != undefined) {
|
||||
const address = config.address;
|
||||
const port = config.port;
|
||||
if (typeof address === 'string' && typeof port == 'number') {
|
||||
this.getServerManager().setAddress(address == "*" ? window.location.hostname : address, port);
|
||||
if (typeof address === 'string' && typeof port == 'number') {
|
||||
this.getServerManager().setAddress(address == "*" ? window.location.hostname : address, port);
|
||||
}
|
||||
}
|
||||
else {
|
||||
@ -250,16 +250,16 @@ export class OlympusApp {
|
||||
},
|
||||
"code": "Space",
|
||||
"ctrlKey": false
|
||||
}).addKeyboardShortcut( "deselectAll", {
|
||||
"callback": ( ev:KeyboardEvent ) => {
|
||||
}).addKeyboardShortcut("deselectAll", {
|
||||
"callback": (ev: KeyboardEvent) => {
|
||||
this.getUnitsManager().deselectAllUnits();
|
||||
},
|
||||
"code": "Escape"
|
||||
}).addKeyboardShortcut( "toggleUnitLabels", {
|
||||
}).addKeyboardShortcut("toggleUnitLabels", {
|
||||
"altKey": false,
|
||||
"callback": () => {
|
||||
const chk = document.querySelector( `label[title="Show unit labels"] input[type="checkbox"]` );
|
||||
if ( chk instanceof HTMLElement ) {
|
||||
const chk = document.querySelector(`label[title="Show unit labels"] input[type="checkbox"]`);
|
||||
if (chk instanceof HTMLElement) {
|
||||
chk.click();
|
||||
}
|
||||
},
|
||||
@ -288,14 +288,14 @@ export class OlympusApp {
|
||||
});
|
||||
|
||||
const digits = ["Digit1", "Digit2", "Digit3", "Digit4", "Digit5", "Digit6", "Digit7", "Digit8", "Digit9"];
|
||||
|
||||
|
||||
digits.forEach(code => {
|
||||
shortcutManager.addKeyboardShortcut(`hotgroup${code}`, {
|
||||
"altKey": false,
|
||||
"callback": (ev: KeyboardEvent) => {
|
||||
if (ev.ctrlKey && ev.shiftKey)
|
||||
this.getUnitsManager().selectedUnitsAddToHotgroup(parseInt(ev.code.substring(5)));
|
||||
else if (ev.ctrlKey && !ev.shiftKey)
|
||||
else if (ev.ctrlKey && !ev.shiftKey)
|
||||
this.getUnitsManager().selectedUnitsSetHotgroup(parseInt(ev.code.substring(5)));
|
||||
else if (!ev.ctrlKey && ev.shiftKey)
|
||||
this.getUnitsManager().selectUnitsByHotgroup(parseInt(ev.code.substring(5)), false);
|
||||
@ -305,11 +305,11 @@ export class OlympusApp {
|
||||
"code": code
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Stop hotgroup controls sending the browser to another tab
|
||||
digits.forEach( code => {
|
||||
document.addEventListener( "keydown", ( ev:KeyboardEvent ) => {
|
||||
if ( ev.code === code && ev.ctrlKey === true && ev.altKey === false && ev.shiftKey === false ) {
|
||||
digits.forEach(code => {
|
||||
document.addEventListener("keydown", (ev: KeyboardEvent) => {
|
||||
if (ev.code === code && ev.ctrlKey === true && ev.altKey === false && ev.shiftKey === false) {
|
||||
ev.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,111 +1,83 @@
|
||||
import { OlympusApp } from "../olympusapp";
|
||||
import { getApp } from "..";
|
||||
import { ShortcutKeyboard } from "../shortcut/shortcut";
|
||||
import { Unit } from "../unit/unit";
|
||||
import { Panel } from "./panel";
|
||||
|
||||
export class UnitListPanel extends Panel {
|
||||
|
||||
#contentElement: HTMLElement;
|
||||
#currentSortAlgorithm: string = "unitName";
|
||||
#currentSortDirection: string = "ASC";
|
||||
#olympusApp: OlympusApp;
|
||||
#units: Unit[] = [];
|
||||
#updatesInterval!: ReturnType<typeof setInterval>;
|
||||
|
||||
constructor( olympusApp:OlympusApp, panelElement:string, contentElement:string ) {
|
||||
constructor(panelElement: string, contentElement: string) {
|
||||
super(panelElement);
|
||||
const getElement = document.getElementById(contentElement);
|
||||
|
||||
super( panelElement );
|
||||
|
||||
this.#olympusApp = olympusApp;
|
||||
|
||||
const getElement = document.getElementById( contentElement );
|
||||
|
||||
if ( getElement instanceof HTMLElement ) {
|
||||
if (getElement instanceof HTMLElement)
|
||||
this.#contentElement = getElement;
|
||||
} else {
|
||||
throw new Error( `UnitList: unable to find element "${contentElement}".` );
|
||||
}
|
||||
|
||||
else
|
||||
throw new Error(`UnitList: unable to find element "${contentElement}".`);
|
||||
|
||||
// Add the header click listener and sorting
|
||||
[].slice.call( this.getElement().querySelectorAll( ".headers > *" ) ).forEach( ( header:HTMLElement ) => {
|
||||
header.addEventListener( "click", ( ev:MouseEvent ) => {
|
||||
[].slice.call(this.getElement().querySelectorAll(".headers > *")).forEach((header: HTMLElement) => {
|
||||
header.addEventListener("click", (ev: MouseEvent) => {
|
||||
const el = ev.target;
|
||||
if (el instanceof HTMLElement) {
|
||||
const newSort = el.getAttribute("data-sort-field") || "unitName";
|
||||
|
||||
if ( el instanceof HTMLElement ) {
|
||||
const newSort = el.getAttribute( "data-sort-field" ) || "unitName";
|
||||
|
||||
if ( this.#currentSortAlgorithm === newSort ) {
|
||||
this.#currentSortDirection = ( this.#currentSortDirection === "ASC" ) ? "DESC" : "ASC";
|
||||
} else {
|
||||
if (this.#currentSortAlgorithm === newSort)
|
||||
this.#currentSortDirection = (this.#currentSortDirection === "ASC") ? "DESC" : "ASC";
|
||||
else
|
||||
this.#currentSortDirection = "ASC";
|
||||
}
|
||||
|
||||
|
||||
this.#currentSortAlgorithm = newSort;
|
||||
|
||||
this.doUpdate();
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Dynamically listen for clicks in order to do stuff with units
|
||||
this.getElement().addEventListener( "click", ( ev:MouseEvent ) => {
|
||||
|
||||
this.getElement().addEventListener("click", (ev: MouseEvent) => {
|
||||
const t = ev.target;
|
||||
|
||||
if ( t instanceof HTMLElement ) {
|
||||
|
||||
let id:number = Number( t.getAttribute( "data-unit-id" ) || 0 );
|
||||
|
||||
this.#olympusApp.getUnitsManager().selectUnit( id );
|
||||
if (t instanceof HTMLElement) {
|
||||
let id: number = Number(t.getAttribute("data-unit-id") || 0);
|
||||
getApp().getUnitsManager().selectUnit(id);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
new ShortcutKeyboard({
|
||||
"callback": () => {
|
||||
this.toggle()
|
||||
},
|
||||
"callback": () => { this.toggle() },
|
||||
"code": "KeyU"
|
||||
});
|
||||
|
||||
this.startUpdates();
|
||||
|
||||
}
|
||||
|
||||
doUpdate() {
|
||||
|
||||
if ( !this.getVisible() ) {
|
||||
if (!this.getVisible())
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
this.#contentElement.innerHTML = "";
|
||||
|
||||
this.#units = Object.values( this.#olympusApp.getUnitsManager().getUnits() );
|
||||
this.#units = Object.values(getApp().getUnitsManager().getUnits());
|
||||
|
||||
|
||||
if ( this.#currentSortAlgorithm === "coalition" ) {
|
||||
if (this.#currentSortAlgorithm === "coalition")
|
||||
this.#sortUnitsByCoalition();
|
||||
}
|
||||
|
||||
if ( this.#currentSortAlgorithm === "name" ) {
|
||||
|
||||
if (this.#currentSortAlgorithm === "name")
|
||||
this.#sortUnitsByName();
|
||||
}
|
||||
|
||||
if ( this.#currentSortAlgorithm === "unitName" ) {
|
||||
if (this.#currentSortAlgorithm === "unitName")
|
||||
this.#sortUnitsByUnitName();
|
||||
}
|
||||
|
||||
|
||||
Object.values( this.#units ).forEach( ( unit:Unit ) => {
|
||||
|
||||
Object.values(this.#units).forEach((unit: Unit) => {
|
||||
// Exclude dead units
|
||||
if ( !unit.getAlive() ) {
|
||||
if (!unit.getAlive()) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.#contentElement.innerHTML += `
|
||||
<div class="unit-list-unit" data-value-unitName="${unit.getUnitName()}" data-value-name="${unit.getName()}" data-value-coalition="${unit.getCoalition()}" data-value-human="${unit.getHuman() ? "Human" : "AI"}">
|
||||
<div data-unit-id="${unit.ID}">${unit.getUnitName()}</div>
|
||||
@ -113,96 +85,76 @@ export class UnitListPanel extends Panel {
|
||||
<div>${unit.getCoalition()}</div>
|
||||
<div>${unit.getHuman() ? "Human" : "AI"}</div>
|
||||
</div>`;
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
getContentElement() {
|
||||
return this.#contentElement;
|
||||
}
|
||||
|
||||
#sortStringsCompare( str1:string, str2:string ) {
|
||||
|
||||
if ( str1 > str2 ) {
|
||||
return ( this.#currentSortDirection === "ASC" ) ? 1 : -1;
|
||||
} else if ( str1 < str2 ) {
|
||||
return ( this.#currentSortDirection === "ASC" ) ? -1 : 1;
|
||||
#sortStringsCompare(str1: string, str2: string) {
|
||||
if (str1 > str2) {
|
||||
return (this.#currentSortDirection === "ASC") ? 1 : -1;
|
||||
} else if (str1 < str2) {
|
||||
return (this.#currentSortDirection === "ASC") ? -1 : 1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
|
||||
}
|
||||
|
||||
#sortUnitsByUnitName() {
|
||||
|
||||
this.#units.sort( ( unit1:Unit, unit2:Unit ) => {
|
||||
this.#units.sort((unit1: Unit, unit2: Unit) => {
|
||||
|
||||
const str1 = unit1.getUnitName().toLowerCase();
|
||||
const str2 = unit2.getUnitName().toLowerCase();
|
||||
|
||||
return this.#sortStringsCompare( str1, str2 );
|
||||
});
|
||||
|
||||
return this.#sortStringsCompare(str1, str2);
|
||||
});
|
||||
}
|
||||
|
||||
#sortUnitsByCoalition() {
|
||||
|
||||
this.#units.sort( ( unit1:Unit, unit2:Unit ) => {
|
||||
|
||||
this.#units.sort((unit1: Unit, unit2: Unit) => {
|
||||
let str1 = unit1.getCoalition();
|
||||
let str2 = unit2.getCoalition();
|
||||
|
||||
let cmp = this.#sortStringsCompare( str1, str2 );
|
||||
let cmp = this.#sortStringsCompare(str1, str2);
|
||||
|
||||
if ( cmp !== 0 ) {
|
||||
if (cmp !== 0)
|
||||
return cmp;
|
||||
}
|
||||
|
||||
|
||||
str1 = unit1.getUnitName().toLowerCase();
|
||||
str2 = unit2.getUnitName().toLowerCase();
|
||||
|
||||
return this.#sortStringsCompare( str1, str2 );
|
||||
|
||||
return this.#sortStringsCompare(str1, str2);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
#sortUnitsByName() {
|
||||
|
||||
this.#units.sort( ( unit1:Unit, unit2:Unit ) => {
|
||||
|
||||
this.#units.sort((unit1: Unit, unit2: Unit) => {
|
||||
const str1 = unit1.getName().toLowerCase();
|
||||
const str2 = unit2.getName().toLowerCase();
|
||||
|
||||
return this.#sortStringsCompare( str1, str2 );
|
||||
|
||||
return this.#sortStringsCompare(str1, str2);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
startUpdates() {
|
||||
|
||||
this.doUpdate();
|
||||
|
||||
this.#updatesInterval = setInterval(() => {
|
||||
this.doUpdate();
|
||||
}, 2000 );
|
||||
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
stopUpdates() {
|
||||
clearInterval( this.#updatesInterval );
|
||||
clearInterval(this.#updatesInterval);
|
||||
}
|
||||
|
||||
toggle() {
|
||||
if ( this.getVisible() ) {
|
||||
if (this.getVisible())
|
||||
this.stopUpdates();
|
||||
} else {
|
||||
else
|
||||
this.startUpdates();
|
||||
}
|
||||
|
||||
|
||||
super.toggle();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user