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

Some styling to the unit control panel and changeable unit name.

Browse Source
This commit is contained in:
PeekabooSteam
2023-03-08 14:19:57 +00:00
parent 6c488dba63
commit 549eeb7c2e
8 changed files with 183 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
client/views/uikit.ejs
View File

@@ -104,7 +104,7 @@
<div class="content">
<div class="content-header">Primary nav</div>
<div class="content-header">Unit Control Panel</div>
<div class="content-body">
<div class="example">
@@ -1612,15 +1612,15 @@
<div class="ol-panel">
<div class="ol-panel-board">
<div class="panel-section">
<h1>Unit Callsign</h1>
<h3>Unit Callsign</h3>
<div class="pill highlight-primary">Airframe</div>
<div class="pill highlight-neutral">Group</div>
</div>
<div class="panel-section">
<h2>Flight data</h2>
<h4>Flight data</h4>
</div>
<div class="panel-section">
<h2>Loadout</h2>
<h4>Loadout</h4>
</div>
</div>
</div>
@@ -1734,6 +1734,21 @@
});
const $roe = document.getElementById( "roe-buttons-container" );
[ "Free", "Designated free", "Designated", "Return", "Hold" ].forEach( option => {
let $btn = document.createElement( "button" );
$btn.title = option;
$roe.appendChild( $btn );
});
const $threat = document.getElementById( "reaction-to-threat-buttons-container" );
[ "None", "Passive", "Evade", "Escape", "Abort" ].forEach( option => {
let $btn = document.createElement( "button" );
$btn.title = option;
$threat.appendChild( $btn );
});
</script>
</body>

50
client/views/unitcontrolpanel.ejs
View File

@@ -1,22 +1,30 @@
<div id="unit-control-panel" class="ol-panel ol-panel-padded">
<h2>Selected units</h2>
<div id="unit-control-panel" class="ol-panel ol-panel-padding-lg">
<div id="unit-info-panel">
<div id="general" class="panel-section">
<h3>
<div id="unit-name">Olympus 1-1</div>
<button>[e]</button>
</h3>
<div id="unit-identification">
<div class="unit unit-air no-function">
<div class="unit-marker"></div>
<div class="unit-short-label">18</div>
</div>
<input id="unit-name" value="Olympus 1-1" readonly disabled />
<button id="edit-unit-name" data-on-click="editUnitName"></button>
</div>
<div id="name" class="pill highlight-primary">Name</div>
<div id="group-name" class="pill highlight-primary">Group</div>
<div id="task" class="pill highlight-primary">Task</div>
</div>
<div id="selected-units-container" class="ol-scroll">
<!-- This is where all the unit selection buttons will be shown-->
</div>
<!-- This is where all the unit selection buttons will be shown-->
</div>
<div id="flight-data" class="panel-section">
<h3 id="flight-data-label">Flight data</h3>
<h4 id="flight-data-label">Flight data</h4>
<div id="latitude"></div>
<div id="longitude"></div>
<div class="data-grid">
@@ -26,7 +34,7 @@
</div>
</div>
<div id="loadout-data" class="panel-section">
<h3 id="loadout-label">Loadout</h3>
<h4 id="loadout-label">Loadout</h4>
<div class="data-grid">
<div class="data-row"><img class="icon-small" src="images/icons/fuel.svg"><h5>Fuel</h5><h4 id="fuel"></h4></div>
</div>
@@ -49,18 +57,20 @@
</div>
</div>
<h3>Formation</h3>
<div id="formation-buttons-container">
<!-- <h3>Formation</h3> -->
<!-- <div id="formation-buttons-container"> -->
<!-- This is where all the formation control buttons will be shown -->
<!-- </div> -->
<div id="roe">
<h4>Rules of engagement</h4>
<div id="roe-buttons-container" class="ol-group ol-button-box">
<!-- This is where the roe buttons will be shown -->
</div>
</div>
<h3>Rules of engagement</h3>
<div id="roe-buttons-container">
<!-- This is where the roe buttons will be shown -->
</div>
<h3>Reaction to threat</h3>
<div id="reaction-to-threat-buttons-container">
<h4>Reaction to threat</h4>
<div id="reaction-to-threat-buttons-container" class="ol-group ol-button-box">
<!-- This is where the reaction to threat buttons will be shown -->
</div>
</div>