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

Merge pull request #142 from Pax1601/98-roe-and-reaction-icons-not-correct-or-in-correct-order

Browse Source 
Updated RoE and threat icons.
This commit is contained in:
Pax1601 2023-03-26 11:08:31 +02:00 committed by GitHub
commit 40a36846d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 86 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
client/public/stylesheets/olympus.css
View File

@ -666,101 +666,93 @@ body[data-hide-navyunit] #unit-visibility-control-navyunit {
}
#roe-buttons-container button::before, #reaction-to-threat-buttons-container button::before {
background-position:center;
background-repeat: no-repeat;
background-size:16px 16px;
content: "";
display:block;
height:16px;
width:16px;
height:24px;
width:24px;
}
#roe-buttons-container button[title="Free"]::before {
background-image: url( "/themes/olympus/images/icons_roe_free_light.svg");
}
#roe-buttons-container button[title="Designated free"]::before {
#roe-buttons-container button[title="Hold"]::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_light.svg");
}
#roe-buttons-container button[title="Designated"]::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_light.svg");
#roe-buttons-container button[title="Hold"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_dark.svg");
}
/**/
#roe-buttons-container button[title="Return"]::before {
background-image: url( "/themes/olympus/images/icons_roe_defend_light.svg");
}
#roe-buttons-container button[title="Return"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_defend_dark.svg");
}
/**/
#roe-buttons-container button[title="Designated"]::before {
background-image: url( "/themes/olympus/images/icons_roe_target_light.svg");
}
#roe-buttons-container button[title="Hold"]::before {
background-image: url( "/themes/olympus/images/icons_actions_nothing_light.svg");
#roe-buttons-container button[title="Designated"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_target_dark.svg");
}
/**/
#roe-buttons-container button[title="Free"]::before {
background-image: url( "/themes/olympus/images/icons_roe_free_light.svg");
}
#roe-buttons-container button[title="Free"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_free_dark.svg");
}
#roe-buttons-container button[title="Designated free"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_dark.svg");
}
#roe-buttons-container button[title="Designated"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_dark.svg");
}
#roe-buttons-container button[title="Return"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_target_dark.svg");
}
#roe-buttons-container button[title="Hold"].selected::before {
background-image: url( "/themes/olympus/images/icons_actions_nothing_dark.svg");
}
/****************************************************************************************/
#reaction-to-threat-buttons-container button[title="None"]::before {
background-image: url( "/themes/olympus/images/icons_actions_nothing_light.svg");
background-image: url( "/themes/olympus/images/icons_threat_nothing_light.svg");
}
#reaction-to-threat-buttons-container button[title="Passive"]::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_light.svg");
}
#reaction-to-threat-buttons-container button[title="Evade"]::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_light.svg");
}
#reaction-to-threat-buttons-container button[title="Escape"]::before {
background-image: url( "/themes/olympus/images/icons_threat_retreat_light.svg");
}
#reaction-to-threat-buttons-container button[title="Abort"]::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_light.svg");
}
#reaction-to-threat-buttons-container button[title="None"]::before {
background-image: url( "/themes/olympus/images/icons_actions_nothing_light.svg");
}
#reaction-to-threat-buttons-container button[title="None"].selected::before {
background-image: url( "/themes/olympus/images/icons_actions_nothing_dark.svg");
background-image: url( "/themes/olympus/images/icons_threat_nothing_dark.svg");
}
/**/
#reaction-to-threat-buttons-container button[title="Passive"]::before {
background-image: url( "/themes/olympus/images/icons_threat_cms_light.svg");
}
#reaction-to-threat-buttons-container button[title="Passive"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_dark.svg");
background-image: url( "/themes/olympus/images/icons_threat_cms_dark.svg");
}
/**/
#reaction-to-threat-buttons-container button[title="Evade"]::before {
background-image: url( "/themes/olympus/images/icons_threat_defend_light.svg");
}
#reaction-to-threat-buttons-container button[title="Evade"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_dark.svg");
background-image: url( "/themes/olympus/images/icons_threat_defend_dark.svg");
}
#reaction-to-threat-buttons-container button[title="Escape"].selected::before {
background-image: url( "/themes/olympus/images/icons_threat_retreat_dark.svg");
}
#reaction-to-threat-buttons-container button[title="Abort"].selected::before {
background-image: url( "/themes/olympus/images/icons_roe_stop_dark.svg");
}
/****************************************************************************************/
#splash-screen {

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);

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

@ -1,14 +1,18 @@
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";
import { UnitDatabase } from "../units/unitdatabase";
import { UnitsManager } from "../units/unitsmanager";
import { Panel } from "./panel";
const ROEs: string[] = ["Free", "Designated free", "Designated", "Return", "Hold"];
const reactionsToThreat: string[] = ["None", "Passive", "Evade", "Escape", "Abort"];
// const ROEs: string[] = ["Free", "Designated free", "Designated", "Return", "Hold"]; // Full list
// const reactionsToThreat: string[] = ["None", "Passive", "Evade", "Escape", "Abort"]; // Full list
const ROEs: string[] = [ "Hold", "Return", "Designated", "Free" ];
const reactionsToThreat: string[] = [ "None", "Passive", "Evade" ];
const minSpeedValues: { [key: string]: number } = { Aircraft: 100, Helicopter: 0, NavyUnit: 0, GroundUnit: 0 };
const maxSpeedValues: { [key: string]: number } = { Aircraft: 800, Helicopter: 300, NavyUnit: 60, GroundUnit: 60 };
const speedIncrements: { [key: string]: number } = { Aircraft: 25, Helicopter: 10, NavyUnit: 5, GroundUnit: 5 };
@ -71,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>