mirror of
https://github.com/Pax1601/DCSOlympus.git
synced 2025-10-29 16:56:34 +00:00
Merge pull request #254 from Pax1601/216-increase-ui-reactivity
Removed 200ms delay and small UI fixes
This commit is contained in:
Pax1601
GitHub
commit
987c8ee41c
@ -77,7 +77,7 @@ form>div {
|
||||
|
||||
.ol-scrollable {
|
||||
overflow-y: scroll;
|
||||
scrollbar-color: white var(--background-grey);
|
||||
scrollbar-color: white transparent;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
@ -86,12 +86,20 @@ form>div {
|
||||
}
|
||||
|
||||
.ol-scrollable::-webkit-scrollbar-track {
|
||||
background-color: var(--background-grey);
|
||||
background-color: transparent;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.ol-select .ol-scrollable {
|
||||
scrollbar-color: white var(--background-grey);
|
||||
}
|
||||
|
||||
.ol-select .ol-scrollable::-webkit-scrollbar-track {
|
||||
background-color: var(--background-grey);
|
||||
}
|
||||
|
||||
.ol-scrollable::-webkit-scrollbar-thumb {
|
||||
background-color: white;
|
||||
border-radius: 100px;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
body.feature-forceShowUnitControlPanel #unit-control-panel {
|
||||
display:block !important;
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
|
||||
@ -13,96 +13,96 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
|
||||
}
|
||||
|
||||
#unit-control-panel h3 {
|
||||
margin-bottom:8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container {
|
||||
align-items: left;
|
||||
border-radius: var( --border-radius-md );
|
||||
display:flex;
|
||||
border-radius: var(--border-radius-md);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-height: 136px;
|
||||
overflow-y:auto;
|
||||
overflow-y: auto;
|
||||
row-gap: 4px;
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button {
|
||||
align-items: center;
|
||||
border-radius: var( --border-radius-lg );
|
||||
display:flex;
|
||||
border-radius: var(--border-radius-lg);
|
||||
display: flex;
|
||||
font-size: 11px;
|
||||
height:30px;
|
||||
padding:8px 0;
|
||||
height: 30px;
|
||||
padding: 8px 0;
|
||||
position: relative;
|
||||
width:90%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button::before {
|
||||
background-color: var( --primary-grey );
|
||||
border-radius: var( --border-radius-md );
|
||||
content: attr( data-short-label );
|
||||
margin:0 5px;
|
||||
padding:4px 6px;
|
||||
background-color: var(--primary-grey);
|
||||
border-radius: 999px;
|
||||
content: attr(data-short-label);
|
||||
margin: 0 5px;
|
||||
padding: 4px 6px;
|
||||
white-space: nowrap;
|
||||
width:fit-content;
|
||||
width: 30px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#unit-control-panel #selected-units-container button[data-coalition="blue"]::before {
|
||||
background-color: var( --accent-light-blue );
|
||||
background-color: var(--accent-light-blue);
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button[data-coalition="red"]::before {
|
||||
background-color: var( --accent-light-red );
|
||||
color:var(--secondary-red-outline)
|
||||
background-color: var(--accent-light-red);
|
||||
color: var(--secondary-red-outline)
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button::after {
|
||||
border-radius: var( --border-radius-sm );
|
||||
content: attr( data-callsign );
|
||||
border-radius: var(--border-radius-sm);
|
||||
content: attr(data-callsign);
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding:4px;
|
||||
padding-left:0;
|
||||
padding: 4px;
|
||||
padding-left: 0;
|
||||
text-align: left;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width:fit-content;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
|
||||
#unit-control-panel #selected-units-container button:hover::after {
|
||||
overflow: visible;
|
||||
text-overflow:initial;
|
||||
text-overflow: initial;
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button:hover::after {
|
||||
background-color: var( --background-grey );
|
||||
background-color: var(--background-grey);
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button[data-coalition="blue"]:hover::after {
|
||||
background-color: var( --primary-blue );
|
||||
background-color: var(--primary-blue);
|
||||
}
|
||||
|
||||
#unit-control-panel #selected-units-container button[data-coalition="red"]:hover::after {
|
||||
background-color: var( --primary-red );
|
||||
background-color: var(--primary-red);
|
||||
}
|
||||
|
||||
#unit-control-panel h4 {
|
||||
margin-bottom:8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
#unit-control-panel #threat,
|
||||
#unit-control-panel #roe {
|
||||
margin-top:12px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
#advanced-settings-dialog {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
#advanced-settings-dialog > .ol-dialog-content {
|
||||
#advanced-settings-dialog>.ol-dialog-content {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
@ -111,6 +111,6 @@ body.feature-forceShowUnitControlPanel #unit-control-panel {
|
||||
row-gap: 10px;
|
||||
}
|
||||
|
||||
#advanced-settings-dialog > .ol-dialog-content > .ol-group {
|
||||
#advanced-settings-dialog>.ol-dialog-content>.ol-group {
|
||||
justify-content: space-between;
|
||||
}
|
||||
@ -352,7 +352,7 @@
|
||||
}
|
||||
|
||||
[data-object|="unit-sam"] .unit-short-label {
|
||||
translate: 0 50%;
|
||||
translate: 0 25%;
|
||||
}
|
||||
|
||||
[data-object|="unit-navyunit"] .unit-short-label {
|
||||
|
||||
@ -11,13 +11,9 @@ export class Panel {
|
||||
this.#visible = true;
|
||||
}
|
||||
|
||||
protected onHide() {}
|
||||
|
||||
hide() {
|
||||
this.#element.classList.toggle("hide", true);
|
||||
this.#visible = false;
|
||||
|
||||
this.onHide();
|
||||
}
|
||||
|
||||
toggle() {
|
||||
|
||||
@ -73,7 +73,7 @@ export class UnitControlPanel extends Panel {
|
||||
this.#advancedSettingsDialog = <HTMLElement> document.querySelector("#advanced-settings-dialog");
|
||||
|
||||
document.addEventListener("unitUpdated", (e: CustomEvent<Unit>) => { if (e.detail.getSelected()) this.update() });
|
||||
document.addEventListener("unitsSelection", (e: CustomEvent<Unit[]>) => { this.show(); this.update() });
|
||||
document.addEventListener("unitsSelection", (e: CustomEvent<Unit[]>) => { this.show(); this.addButtons(); this.update()});
|
||||
document.addEventListener("clearSelection", () => { this.hide() });
|
||||
document.addEventListener("applyAdvancedSettings", () => {this.#applyAdvancedSettings();})
|
||||
document.addEventListener("showAdvancedSettings", () => {
|
||||
@ -84,13 +84,57 @@ export class UnitControlPanel extends Panel {
|
||||
this.hide();
|
||||
}
|
||||
|
||||
|
||||
// Do this after panel is hidden (make sure there's a reset)
|
||||
protected onHide() {
|
||||
hide() {
|
||||
super.hide();
|
||||
|
||||
this.#expectedAltitude = -1;
|
||||
this.#expectedSpeed = -1;
|
||||
}
|
||||
|
||||
addButtons() {
|
||||
var units = getUnitsManager().getSelectedUnits();
|
||||
this.getElement().querySelector("#selected-units-container")?.replaceChildren(...units.map((unit: Unit, index: number) => {
|
||||
let database: UnitDatabase | null;
|
||||
if (unit instanceof Aircraft)
|
||||
database = aircraftDatabase;
|
||||
else if (unit instanceof GroundUnit)
|
||||
database = groundUnitsDatabase;
|
||||
else
|
||||
database = null; // TODO add databases for other unit types
|
||||
|
||||
var button = document.createElement("button");
|
||||
var callsign = unit.getBaseData().unitName || "";
|
||||
|
||||
button.setAttribute("data-short-label", database?.getByName(unit.getBaseData().name)?.shortLabel || "");
|
||||
button.setAttribute("data-callsign", callsign);
|
||||
|
||||
button.setAttribute("data-coalition", unit.getMissionData().coalition);
|
||||
button.classList.add("pill", "highlight-coalition")
|
||||
|
||||
button.addEventListener("click", () => {
|
||||
getUnitsManager().deselectAllUnits();
|
||||
getUnitsManager().selectUnit(unit.ID, true);
|
||||
});
|
||||
return (button);
|
||||
}));
|
||||
}
|
||||
|
||||
update() {
|
||||
var units = getUnitsManager().getSelectedUnits();
|
||||
this.getElement().querySelector("#advanced-settings-div")?.classList.toggle("hide", units.length != 1);
|
||||
if (this.getElement() != null && units.length > 0) {
|
||||
this.#showFlightControlSliders(units);
|
||||
|
||||
this.#optionButtons["ROE"].forEach((button: HTMLButtonElement) => {
|
||||
button.classList.toggle("selected", units.every((unit: Unit) => unit.getOptionsData().ROE === button.value))
|
||||
});
|
||||
|
||||
this.#optionButtons["reactionToThreat"].forEach((button: HTMLButtonElement) => {
|
||||
button.classList.toggle("selected", units.every((unit: Unit) => unit.getOptionsData().reactionToThreat === button.value))
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Update function will only be allowed to update the sliders once it's matched the expected value for the first time (due to lag of Ajax request)
|
||||
#updateCanSetAltitudeSlider(altitude: number) {
|
||||
@ -109,46 +153,6 @@ export class UnitControlPanel extends Panel {
|
||||
return false;
|
||||
}
|
||||
|
||||
update() {
|
||||
var units = getUnitsManager().getSelectedUnits();
|
||||
|
||||
this.getElement().querySelector("#advanced-settings-div")?.classList.toggle("hide", units.length != 1);
|
||||
|
||||
if (this.getElement() != null && units.length > 0) {
|
||||
this.#showFlightControlSliders(units);
|
||||
|
||||
this.getElement().querySelector("#selected-units-container")?.replaceChildren(...units.map((unit: Unit, index: number) => {
|
||||
let database: UnitDatabase | null;
|
||||
if (unit instanceof Aircraft)
|
||||
database = aircraftDatabase;
|
||||
else if (unit instanceof GroundUnit)
|
||||
database = groundUnitsDatabase;
|
||||
else
|
||||
database = null; // TODO add databases for other unit types
|
||||
|
||||
var button = document.createElement("button");
|
||||
var callsign = unit.getBaseData().unitName || "";
|
||||
|
||||
button.setAttribute("data-short-label", database?.getByName(unit.getBaseData().name)?.shortLabel || "");
|
||||
button.setAttribute("data-callsign", callsign);
|
||||
|
||||
button.setAttribute("data-coalition", unit.getMissionData().coalition);
|
||||
button.classList.add("pill", "highlight-coalition")
|
||||
|
||||
button.addEventListener("click", () => getUnitsManager().selectUnit(unit.ID, true));
|
||||
return (button);
|
||||
}));
|
||||
|
||||
this.#optionButtons["ROE"].forEach((button: HTMLButtonElement) => {
|
||||
button.classList.toggle("selected", units.every((unit: Unit) => unit.getOptionsData().ROE === button.value))
|
||||
});
|
||||
|
||||
this.#optionButtons["reactionToThreat"].forEach((button: HTMLButtonElement) => {
|
||||
button.classList.toggle("selected", units.every((unit: Unit) => unit.getOptionsData().reactionToThreat === button.value))
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
#showFlightControlSliders(units: Unit[]) {
|
||||
if (getUnitsManager().getSelectedUnitsType() !== undefined)
|
||||
this.#airspeedSlider.show()
|
||||
|
||||
@ -370,15 +370,16 @@ export class Unit extends Marker {
|
||||
}
|
||||
|
||||
#onClick(e: any) {
|
||||
this.#timer = window.setTimeout(() => {
|
||||
if (!this.#preventClick) {
|
||||
if (getMap().getState() === 'IDLE' || getMap().getState() === 'MOVE_UNIT' || e.originalEvent.ctrlKey) {
|
||||
if (!e.originalEvent.ctrlKey) {
|
||||
getUnitsManager().deselectAllUnits();
|
||||
}
|
||||
this.setSelected(!this.getSelected());
|
||||
if (!this.#preventClick) {
|
||||
if (getMap().getState() === 'IDLE' || getMap().getState() === 'MOVE_UNIT' || e.originalEvent.ctrlKey) {
|
||||
if (!e.originalEvent.ctrlKey) {
|
||||
getUnitsManager().deselectAllUnits();
|
||||
}
|
||||
this.setSelected(!this.getSelected());
|
||||
}
|
||||
}
|
||||
|
||||
this.#timer = window.setTimeout(() => {
|
||||
this.#preventClick = false;
|
||||
}, 200);
|
||||
}
|
||||
|
||||
@ -20,25 +20,18 @@ export class UnitsManager {
|
||||
document.addEventListener('unitSelection', (e: CustomEvent) => this.#onUnitSelection(e.detail));
|
||||
document.addEventListener('unitDeselection', (e: CustomEvent) => this.#onUnitDeselection(e.detail));
|
||||
document.addEventListener('keydown', (event) => this.#onKeyDown(event));
|
||||
document.addEventListener('deleteSelectedUnits', () => this.selectedUnitsDelete() )
|
||||
document.addEventListener('deleteSelectedUnits', () => this.selectedUnitsDelete())
|
||||
}
|
||||
|
||||
getSelectableAircraft() {
|
||||
|
||||
const units = this.getUnits();
|
||||
|
||||
return Object.keys( units ).reduce( ( acc:{[key:number]: Unit}, unitId:any ) => {
|
||||
|
||||
const baseData = units[ unitId ].getBaseData();
|
||||
|
||||
if ( baseData.category === "Aircraft" && baseData.alive === true ) {
|
||||
acc[ unitId ] = units[ unitId ];
|
||||
return Object.keys(units).reduce((acc: { [key: number]: Unit }, unitId: any) => {
|
||||
const baseData = units[unitId].getBaseData();
|
||||
if (baseData.category === "Aircraft" && baseData.alive === true) {
|
||||
acc[unitId] = units[unitId];
|
||||
}
|
||||
|
||||
return acc;
|
||||
|
||||
}, {});
|
||||
|
||||
}
|
||||
|
||||
getUnits() {
|
||||
@ -59,45 +52,40 @@ export class UnitsManager {
|
||||
this.#units[ID] = new constructor(ID, data);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
removeUnit(ID: number) {
|
||||
|
||||
}
|
||||
|
||||
update(data: UnitsData) {
|
||||
Object.keys(data.units)
|
||||
.filter((ID: string) => !(ID in this.#units))
|
||||
.reduce((timeout: number, ID: string) => {
|
||||
window.setTimeout(() => {
|
||||
if (!(ID in this.#units))
|
||||
this.addUnit(parseInt(ID), data.units[ID]);
|
||||
this.#units[parseInt(ID)]?.setData(data.units[ID]);
|
||||
}, timeout);
|
||||
return timeout + 10;
|
||||
}, 10);
|
||||
|
||||
.filter((ID: string) => !(ID in this.#units))
|
||||
.reduce((timeout: number, ID: string) => {
|
||||
window.setTimeout(() => {
|
||||
if (!(ID in this.#units))
|
||||
this.addUnit(parseInt(ID), data.units[ID]);
|
||||
this.#units[parseInt(ID)]?.setData(data.units[ID]);
|
||||
}, timeout);
|
||||
return timeout + 10;
|
||||
}, 10);
|
||||
|
||||
Object.keys(data.units)
|
||||
.filter((ID: string) => ID in this.#units)
|
||||
.forEach((ID: string) => this.#units[parseInt(ID)]?.setData(data.units[ID]));
|
||||
.filter((ID: string) => ID in this.#units)
|
||||
.forEach((ID: string) => this.#units[parseInt(ID)]?.setData(data.units[ID]));
|
||||
}
|
||||
|
||||
selectUnit(ID: number, deselectAllUnits: boolean = true)
|
||||
{
|
||||
if (deselectAllUnits)
|
||||
this.getSelectedUnits().filter((unit: Unit) => unit.ID !== ID ).forEach((unit: Unit) => unit.setSelected(false));
|
||||
selectUnit(ID: number, deselectAllUnits: boolean = true) {
|
||||
if (deselectAllUnits)
|
||||
this.getSelectedUnits().filter((unit: Unit) => unit.ID !== ID).forEach((unit: Unit) => unit.setSelected(false));
|
||||
this.#units[ID]?.setSelected(true);
|
||||
}
|
||||
|
||||
selectFromBounds(bounds: LatLngBounds)
|
||||
{
|
||||
selectFromBounds(bounds: LatLngBounds) {
|
||||
this.deselectAllUnits();
|
||||
for (let ID in this.#units)
|
||||
{
|
||||
if (this.#units[ID].getHidden() == false)
|
||||
{
|
||||
for (let ID in this.#units) {
|
||||
if (this.#units[ID].getHidden() == false) {
|
||||
var latlng = new LatLng(this.#units[ID].getFlightData().latitude, this.#units[ID].getFlightData().longitude);
|
||||
if (bounds.contains(latlng))
|
||||
{
|
||||
if (bounds.contains(latlng)) {
|
||||
this.#units[ID].setSelected(true);
|
||||
}
|
||||
}
|
||||
@ -119,44 +107,44 @@ export class UnitsManager {
|
||||
this.#units[ID].setSelected(false);
|
||||
}
|
||||
}
|
||||
|
||||
getSelectedUnitsType () {
|
||||
|
||||
getSelectedUnitsType() {
|
||||
if (this.getSelectedUnits().length == 0)
|
||||
return undefined;
|
||||
return this.getSelectedUnits().map((unit: Unit) => {
|
||||
return unit.constructor.name
|
||||
})?.reduce((a: any, b: any) => {
|
||||
return a == b? a: undefined
|
||||
return a == b ? a : undefined
|
||||
});
|
||||
};
|
||||
|
||||
getSelectedUnitsTargetSpeed () {
|
||||
getSelectedUnitsTargetSpeed() {
|
||||
if (this.getSelectedUnits().length == 0)
|
||||
return undefined;
|
||||
return this.getSelectedUnits().map((unit: Unit) => {
|
||||
return unit.getTaskData().targetSpeed
|
||||
})?.reduce((a: any, b: any) => {
|
||||
return a == b? a: undefined
|
||||
return a == b ? a : undefined
|
||||
});
|
||||
};
|
||||
|
||||
getSelectedUnitsTargetAltitude () {
|
||||
getSelectedUnitsTargetAltitude() {
|
||||
if (this.getSelectedUnits().length == 0)
|
||||
return undefined;
|
||||
return this.getSelectedUnits().map((unit: Unit) => {
|
||||
return unit.getTaskData().targetAltitude
|
||||
})?.reduce((a: any, b: any) => {
|
||||
return a == b? a: undefined
|
||||
return a == b ? a : undefined
|
||||
});
|
||||
};
|
||||
|
||||
getSelectedUnitsCoalition () {
|
||||
getSelectedUnitsCoalition() {
|
||||
if (this.getSelectedUnits().length == 0)
|
||||
return undefined;
|
||||
return this.getSelectedUnits().map((unit: Unit) => {
|
||||
return unit.getMissionData().coalition
|
||||
})?.reduce((a: any, b: any) => {
|
||||
return a == b? a: undefined
|
||||
return a == b ? a : undefined
|
||||
});
|
||||
};
|
||||
|
||||
@ -164,15 +152,14 @@ export class UnitsManager {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits) {
|
||||
const unit = selectedUnits[idx];
|
||||
if (unit.getTaskData().currentState === "Follow")
|
||||
{
|
||||
if (unit.getTaskData().currentState === "Follow") {
|
||||
const leader = this.getUnitByID(unit.getFormationData().leaderID)
|
||||
if (leader && leader.getSelected())
|
||||
leader.addDestination(latlng);
|
||||
else
|
||||
unit.addDestination(latlng);
|
||||
}
|
||||
else
|
||||
else
|
||||
unit.addDestination(latlng);
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, " new destination added");
|
||||
@ -182,83 +169,68 @@ export class UnitsManager {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits) {
|
||||
const unit = selectedUnits[idx];
|
||||
if (unit.getTaskData().currentState === "Follow")
|
||||
{
|
||||
if (unit.getTaskData().currentState === "Follow") {
|
||||
const leader = this.getUnitByID(unit.getFormationData().leaderID)
|
||||
if (leader && leader.getSelected())
|
||||
leader.clearDestinations();
|
||||
else
|
||||
unit.clearDestinations();
|
||||
}
|
||||
else
|
||||
else
|
||||
unit.clearDestinations();
|
||||
}
|
||||
}
|
||||
|
||||
selectedUnitsLandAt(latlng: LatLng)
|
||||
{
|
||||
selectedUnitsLandAt(latlng: LatLng) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].landAt(latlng);
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, " landing");
|
||||
}
|
||||
|
||||
selectedUnitsChangeSpeed(speedChange: string)
|
||||
{
|
||||
selectedUnitsChangeSpeed(speedChange: string) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].changeSpeed(speedChange);
|
||||
}
|
||||
}
|
||||
|
||||
selectedUnitsChangeAltitude(altitudeChange: string)
|
||||
{
|
||||
selectedUnitsChangeAltitude(altitudeChange: string) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].changeAltitude(altitudeChange);
|
||||
}
|
||||
}
|
||||
|
||||
selectedUnitsSetSpeed(speed: number)
|
||||
{
|
||||
selectedUnitsSetSpeed(speed: number) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].setSpeed(speed);
|
||||
}
|
||||
|
||||
|
||||
this.#showActionMessage(selectedUnits, `setting speed to ${speed * 1.94384} kts`);
|
||||
}
|
||||
|
||||
selectedUnitsSetAltitude(altitude: number)
|
||||
{
|
||||
selectedUnitsSetAltitude(altitude: number) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].setAltitude(altitude);
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, `setting altitude to ${altitude / 0.3048} ft`);
|
||||
}
|
||||
|
||||
selectedUnitsSetROE(ROE: string)
|
||||
{
|
||||
selectedUnitsSetROE(ROE: string) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].setROE(ROE);
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, `ROE set to ${ROE}`);
|
||||
}
|
||||
|
||||
selectedUnitsSetReactionToThreat(reactionToThreat: string)
|
||||
{
|
||||
selectedUnitsSetReactionToThreat(reactionToThreat: string) {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].setReactionToThreat(reactionToThreat);
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, `reaction to threat set to ${reactionToThreat}`);
|
||||
@ -272,38 +244,34 @@ export class UnitsManager {
|
||||
this.#showActionMessage(selectedUnits, `attacking unit ${this.getUnitByID(ID)?.getBaseData().unitName}`);
|
||||
}
|
||||
|
||||
selectedUnitsDelete()
|
||||
{
|
||||
selectedUnitsDelete() {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].delete();
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, `deleted`);
|
||||
}
|
||||
|
||||
selectedUnitsRefuel()
|
||||
{
|
||||
selectedUnitsRefuel() {
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
for (let idx in selectedUnits)
|
||||
{
|
||||
for (let idx in selectedUnits) {
|
||||
selectedUnits[idx].refuel();
|
||||
}
|
||||
this.#showActionMessage(selectedUnits, `sent to nearest tanker`);
|
||||
}
|
||||
|
||||
selectedUnitsFollowUnit(ID: number, offset?: {"x": number, "y": number, "z": number}, formation?: string) {
|
||||
if (offset == undefined){
|
||||
selectedUnitsFollowUnit(ID: number, offset?: { "x": number, "y": number, "z": number }, formation?: string) {
|
||||
if (offset == undefined) {
|
||||
// X: front-rear, positive front
|
||||
// Y: top-bottom, positive top
|
||||
// Z: left-right, positive right
|
||||
offset = {"x": 0, "y": 0, "z": 0};
|
||||
if (formation === "Trail") { offset.x = -50; offset.y = -30; offset.z = 0; }
|
||||
else if (formation === "Echelon (LH)") { offset.x = -50; offset.y = -10; offset.z = -50; }
|
||||
else if (formation === "Echelon (RH)") { offset.x = -50; offset.y = -10; offset.z = 50; }
|
||||
offset = { "x": 0, "y": 0, "z": 0 };
|
||||
if (formation === "Trail") { offset.x = -50; offset.y = -30; offset.z = 0; }
|
||||
else if (formation === "Echelon (LH)") { offset.x = -50; offset.y = -10; offset.z = -50; }
|
||||
else if (formation === "Echelon (RH)") { offset.x = -50; offset.y = -10; offset.z = 50; }
|
||||
else if (formation === "Line abreast (RH)") { offset.x = 0; offset.y = 0; offset.z = 50; }
|
||||
else if (formation === "Line abreast (LH)") { offset.x = 0; offset.y = 0; offset.z = -50; }
|
||||
else if (formation === "Front") { offset.x = 100; offset.y = 0; offset.z = 0; }
|
||||
else if (formation === "Front") { offset.x = 100; offset.y = 0; offset.z = 0; }
|
||||
else offset = undefined;
|
||||
}
|
||||
var selectedUnits = this.getSelectedUnits();
|
||||
@ -313,18 +281,17 @@ export class UnitsManager {
|
||||
for (let idx in selectedUnits) {
|
||||
var commandedUnit = selectedUnits[idx];
|
||||
if (offset != undefined)
|
||||
commandedUnit.followUnit(ID, {"x": offset.x * count, "y": offset.y * count, "z": offset.z * count} );
|
||||
commandedUnit.followUnit(ID, { "x": offset.x * count, "y": offset.y * count, "z": offset.z * count });
|
||||
else {
|
||||
if (formation === "Diamond")
|
||||
{
|
||||
if (formation === "Diamond") {
|
||||
var xl = xr * Math.cos(Math.PI / 4) - yr * Math.sin(Math.PI / 4);
|
||||
var yl = xr * Math.sin(Math.PI / 4) + yr * Math.cos(Math.PI / 4);
|
||||
commandedUnit.followUnit(ID, {"x": -yl * 50, "y": zr * 10, "z": xl * 50} );
|
||||
commandedUnit.followUnit(ID, { "x": -yl * 50, "y": zr * 10, "z": xl * 50 });
|
||||
|
||||
if (yr == 0) { layer++; xr = 0; yr = layer; zr = -layer; }
|
||||
else {
|
||||
if (xr < layer){ xr++; zr--; }
|
||||
else { yr--; zr++; }
|
||||
if (xr < layer) { xr++; zr--; }
|
||||
else { yr--; zr++; }
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -333,32 +300,26 @@ export class UnitsManager {
|
||||
this.#showActionMessage(selectedUnits, `following unit ${this.getUnitByID(ID)?.getBaseData().unitName}`);
|
||||
}
|
||||
|
||||
copyUnits()
|
||||
{
|
||||
copyUnits() {
|
||||
this.#copiedUnits = this.getSelectedUnits();
|
||||
this.#showActionMessage(this.#copiedUnits, `copied`);
|
||||
}
|
||||
|
||||
pasteUnits()
|
||||
{
|
||||
if (!this.#pasteDisabled)
|
||||
{
|
||||
for (let idx in this.#copiedUnits)
|
||||
{
|
||||
pasteUnits() {
|
||||
if (!this.#pasteDisabled) {
|
||||
for (let idx in this.#copiedUnits) {
|
||||
var unit = this.#copiedUnits[idx];
|
||||
getMap().addTemporaryMarker(getMap().getMouseCoordinates());
|
||||
cloneUnit(unit.ID, getMap().getMouseCoordinates());
|
||||
this.#showActionMessage(this.#copiedUnits, `pasted`);
|
||||
this.#showActionMessage(this.#copiedUnits, `pasted`);
|
||||
}
|
||||
this.#pasteDisabled = true;
|
||||
window.setTimeout(() => this.#pasteDisabled = false, 250);
|
||||
}
|
||||
}
|
||||
|
||||
#onKeyDown(event: KeyboardEvent)
|
||||
{
|
||||
if ( !keyEventWasInInput( event ) && event.key === "Delete")
|
||||
{
|
||||
#onKeyDown(event: KeyboardEvent) {
|
||||
if (!keyEventWasInInput(event) && event.key === "Delete") {
|
||||
this.selectedUnitsDelete();
|
||||
}
|
||||
}
|
||||
@ -367,10 +328,9 @@ export class UnitsManager {
|
||||
if (this.getSelectedUnits().length > 0) {
|
||||
getMap().setState(MOVE_UNIT);
|
||||
/* Disable the firing of the selection event for a certain amount of time. This avoids firing many events if many units are selected */
|
||||
if (!this.#selectionEventDisabled)
|
||||
{
|
||||
if (!this.#selectionEventDisabled) {
|
||||
window.setTimeout(() => {
|
||||
document.dispatchEvent(new CustomEvent("unitsSelection", {detail: this.getSelectedUnits()}));
|
||||
document.dispatchEvent(new CustomEvent("unitsSelection", { detail: this.getSelectedUnits() }));
|
||||
this.#selectionEventDisabled = false;
|
||||
}, 100);
|
||||
this.#selectionEventDisabled = true;
|
||||
@ -387,14 +347,14 @@ export class UnitsManager {
|
||||
getMap().setState(IDLE);
|
||||
document.dispatchEvent(new CustomEvent("clearSelection"));
|
||||
}
|
||||
else
|
||||
document.dispatchEvent(new CustomEvent("unitsDeselection", {detail: this.getSelectedUnits()}));
|
||||
else
|
||||
document.dispatchEvent(new CustomEvent("unitsDeselection", { detail: this.getSelectedUnits() }));
|
||||
}
|
||||
|
||||
#showActionMessage(units: Unit[], message: string) {
|
||||
if (units.length == 1)
|
||||
getInfoPopup().setText(`${units[0].getBaseData().unitName} ${message}`);
|
||||
else
|
||||
else
|
||||
getInfoPopup().setText(`${units[0].getBaseData().unitName} and ${units.length - 1} other units ${message}`);
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user