ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add title property to UI elements

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2025-07-24 16:38:20 -07:00
parent 6775d76e38
commit da43d21acd
1 changed files with 48 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
public/index.html
View File

@ -219,52 +219,59 @@
<div> <div>
Turn: Turn:
<span id="turn-count" data-update="0"> <span id="turn-count" data-update="0">
<span name="count">0</span> <span name="count" title="Turns count">0</span>
<span class="inning-top">◓</span> <span class="inning-top" title="1st inning">◓</span>
<span class="inning-bottom">◒</span> <span class="inning-bottom" title="2nd inning">◒</span>
</span> </span>
<button id="show-dialog" type="button">Scenario</button> <button id="show-dialog" type="button" title="Select a scenario">Scenario</button>
<button id="download-save" type="button">Save</button> <button id="download-save" type="button" disabled>Save</button>
<button id="upload-save" type="button">Load</button> <button id="upload-save" type="button" disabled>Load</button>
<button id="fullscreen" type="button"> <button id="fullscreen" type="button" title="Fullscreen">
<img src="assets/images/icon_full_screen.png" height="12" /> <img src="assets/images/icon_full_screen.png" height="12" />
</button> </button>
<span style="white-space: nowrap;"> <span style="white-space: nowrap;">
<button type="button" class="set-firing-arc" data-size="small"> <button type="button" class="set-firing-arc" data-size="small"
title="Set a small firing arc (2 MP) for selected unit">
<img src="assets/images/firing_arc_small.png" height="12" /> 2 MP <img src="assets/images/firing_arc_small.png" height="12" /> 2 MP
</button> </button>
<button type="button" class="set-firing-arc" data-size="medium"> <button type="button" class="set-firing-arc" data-size="medium"
title="Set a medium firing arc (4 MP) for selected unit">
<img src="assets/images/firing_arc_medium.png" height="12" /> 4 MP <img src="assets/images/firing_arc_medium.png" height="12" /> 4 MP
</button> </button>
<button type="button" class="set-firing-arc" data-size="large"> <button type="button" class="set-firing-arc" data-size="large"
title="Set a large firing arc (6 MP) for selected unit">
<img src="assets/images/firing_arc_large.png" height="12" /> 6 MP <img src="assets/images/firing_arc_large.png" height="12" /> 6 MP
</button> </button>
<button type="button" class="set-mech-template">Mech</button> <button type="button" class="set-mech-template" title="Place a mech
<button type="button" class="attacker"> template counter (A/D keys to rotate, Q/E to torso-twist)">Mech</button>
<button type="button" class="attacker" title="Place an attacker's
counter">
<img src="assets/images/counter_attacker.svg" height="12" /> <img src="assets/images/counter_attacker.svg" height="12" />
</button> </button>
<button type="button" class="defender"> <button type="button" class="defender" title="Place a defender's
counter">
<img src="assets/images/counter_defender.svg" height="12" /> <img src="assets/images/counter_defender.svg" height="12" />
</button> </button>
</span> </span>
<div class="counters-list"> <div class="counters-list">
<button type="button" class="grenade"> <button type="button" class="grenade" title="Place a grenade counter">
<img src="assets/images/icon_grenade.png" height="12" /> <img src="assets/images/icon_grenade.png" height="12" />
</button> </button>
<button type="button" class="prone"> <button type="button" class="prone" title="Place a prone counter">
<img src="assets/images/icon_prone.png" height="12" /> <img src="assets/images/icon_prone.png" height="12" />
</button> </button>
<button type="button" class="basement"> <button type="button" class="basement" title="Place a basement level
counter">
<img src="assets/images/icon_basement.png" height="12" /> <img src="assets/images/icon_basement.png" height="12" />
</button> </button>
<button type="button" class="1st-floor"> <button type="button" class="1st-floor" title="Place a level 1 counter">
<img src="assets/images/icon_1st_floor.png" height="12" /> <img src="assets/images/icon_1st_floor.png" height="12" />
</button> </button>
<button type="button" class="2nd-floor"> <button type="button" class="2nd-floor" title="Place a level 2 counter">
<img src="assets/images/icon_2nd_floor.png" height="12" /> <img src="assets/images/icon_2nd_floor.png" height="12" />
</button> </button>
<button type="button" class="3rd-floor"> <button type="button" class="3rd-floor" title="Place a level 3 counter">
<img src="assets/images/icon_3rd_floor.png" height="12" /> <img src="assets/images/icon_3rd_floor.png" height="12" />
</button> </button>
</div> </div>
@ -275,20 +282,26 @@
<!-- <img class="logo" src="logo-davion.png" /> --> <!-- <img class="logo" src="logo-davion.png" /> -->
<div class="records-header"> <div class="records-header">
<div><strong class="name">Attacker</strong></div> <div><strong class="name">Attacker</strong></div>
<div><button type="button" class="end-move" data-allegiance="attacker"> <div><button type="button" class="end-move"
data-allegiance="attacker" title="Mark/Unmark attacker's selected
unit's turn as 'taken' and auto-select the next available unit">
End Movement End Movement
</button></div> </button></div>
<div><button type="button" class="end-turn" data-allegiance="defender"> <div><button type="button" class="end-turn"
data-allegiance="defender" title="End attacker's turn and
auto-select defender's first available unit">
End Turn End Turn
</button></div> </button></div>
<div><button type="button" class="view-squad" value="previous">&lt;</button></div> <div><button type="button" class="view-squad" value="previous"
<div class="squad-number"> title="View previous squad">&lt;</button></div>
<div class="squad-number" title="Current squad">
<svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg">
<circle id="counter-base" r="5" cx="0" cy="0"></circle> <circle id="counter-base" r="5" cx="0" cy="0"></circle>
<text>1</text> <text>1</text>
</svg> </svg>
</div> </div>
<div><button type="button" class="view-squad" value="next">&gt;</button></div> <div><button type="button" class="view-squad" value="next"
title="View next squad">&gt;</button></div>
<!-- 1st Squad, 3rd Platoon, Bravo Company, 2nd Battalion<br> <!-- 1st Squad, 3rd Platoon, Bravo Company, 2nd Battalion<br>
17th Kestral Mechanized Infantry --> 17th Kestral Mechanized Infantry -->
</div> </div>
@ -298,22 +311,28 @@
<!-- <img class="logo" src="logo-liao.png" /> --> <!-- <img class="logo" src="logo-liao.png" /> -->
<div class="records-header"> <div class="records-header">
<div><strong class="name">Defender</strong></div> <div><strong class="name">Defender</strong></div>
<div><button type="button" class="end-move" data-allegiance="defender"> <div><button type="button" class="end-move" data-allegiance="defender"
title="Mark/Unmark defender's selected
unit's turn as 'taken' and auto-select the next available unit">
End Movement End Movement
</button></div> </button></div>
<div><button type="button" class="end-turn" data-allegiance="attacker"> <div><button type="button" class="end-turn"
data-allegiance="attacker" title="End defender's turn and
auto-select attacker's first available unit">
End Turn End Turn
</button></div> </button></div>
<div><button type="button" class="view-squad" value="previous">&lt;</button></div> <div><button type="button" class="view-squad" value="previous"
title="View previous squad">&lt;</button></div>
<div> <div>
<div class="squad-number"> <div class="squad-number" title="Current squad">
<svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="-5 -5 10 10" xmlns="http://www.w3.org/2000/svg">
<circle id="counter-base" r="5" cx="0" cy="0"></circle> <circle id="counter-base" r="5" cx="0" cy="0"></circle>
<text>1</text> <text>1</text>
</svg> </svg>
</div> </div>
</div> </div>
<div><button type="button" class="view-squad" value="next">&gt;</button></div> <div><button type="button" class="view-squad" value="next"
title="View next squad">&gt;</button></div>
<!-- 2nd Squad, 1st Platoon, 3rd Company, 2nd Battalion<br> <!-- 2nd Squad, 1st Platoon, 3rd Company, 2nd Battalion<br>
Aldebaran Home Guard --> Aldebaran Home Guard -->
</div> </div>