Tobias
cb36ae4159
- removed zero-row from damage monitor; damage buttons now toggle - added decreasing z-indexes on sorted combatant-rows to mitigate a weird bug where damage monitors would be displayed under instead of over the rows
114 lines
5.6 KiB
HTML
114 lines
5.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title>Shadowrun 2e Ini Tracker</title>
|
|
|
|
<!-- Style sheets -->
|
|
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@latest/dist/css/bootstrap.min.css" >
|
|
<link type="text/css" rel="stylesheet" href="https://unpkg.com/augmented-ui@latest/augmented-ui.min.css">
|
|
<link type="text/css" rel="stylesheet" href="css/custom.scss">
|
|
|
|
<!-- javascript files -->
|
|
<script type="module" src="https://cdn.jsdelivr.net/npm/bootstrap@latest/dist/js/bootstrap.min.js"></script>
|
|
<script type="module" src="https://code.jquery.com/jquery-latest.min.js"></script>
|
|
<script type="module" src="js/sr2ini.js"></script>
|
|
|
|
<!-- web font -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Electrolize&display=swap" rel="stylesheet">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<header class="navbar navbar-expand" data-augmented-ui="tl-clip-y br-clip-y both">
|
|
<span class="navbar-brand text-bold ps-4">SR2 Initiative Tracker</span>
|
|
<nav class="container-fluid justify-content-end" aria-label="Main navigation">
|
|
<button type="submit" class="" id="add-combatant-button" title="Add combatant" data-bs-toggle="modal" data-bs-target="#combatant-modal"><img src="img/add.png"></button>
|
|
<button type="submit" class="" id="new-round-button" data-bs-toggle="modal" data-bs-target="#confirm-modal" title="Start new round"><img src="img/newround.png"></button>
|
|
</nav>
|
|
</header>
|
|
<div class="table-responsive overflow-visible">
|
|
<table class="table table-sm table-borderless" id="combatants-table">
|
|
<thead>
|
|
<tr data-augmented-ui="tl-2-clip-y r-clip-y">
|
|
<th class="col text-start th-name" data-augmented-ui="tl-2-clip-y both" title="Name">Name</th>
|
|
<th class="col-2 text-center th-ini" data-augmented-ui="both" title="Initiative">Ini</th>
|
|
<th class="col-2 text-center th-dice-and-rea" data-augmented-ui="both" title="Initiative Dice and Reaction"><img src="img/dice.png">+R</th>
|
|
<th class="col-3 text-center th-actions" data-augmented-ui="r-clip-y both" title="Actions">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="confirm-modal" tabindex="-2" role="dialog">
|
|
<div class="modal-dialog modal-sm" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Start New Round</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Are you sure?</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="submit" class="btn btn-primary" id="confirm-modal-new-round-ok-button" data-bs-dismiss="modal">OK</button>
|
|
<button type="submit" class="btn btn-primary d-none" id="confirm-modal-remove-combatant-ok-button" data-bs-dismiss="modal">OK</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="combatant-modal" tabindex="-1" role="dialog">
|
|
<div class="modal-dialog modal-sm" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Add New Combatant</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form id="combatant-form" name="combatant-modal-form" class="was-validated" onsubmit="return false;">
|
|
<div class="my-2">
|
|
<input type="text" maxlength="40" class="form-control form-control-sm" id="combatant-modal-name" form="#combatant-modal-form" placeholder="Name" required>
|
|
</div>
|
|
<div class="input-group input-group-sm my-2">
|
|
<input type="number" min="1" max="5" class="form-control form-control-sm" id="combatant-modal-dice" form="#combatant-modal-form" placeholder="Dice">
|
|
<span class="input-group-text">D+</span>
|
|
<input type="number" min="1" max="25" class="form-control form-control-sm" id="combatant-modal-rea" form="#combatant-modal-form" placeholder="REA">
|
|
</div>
|
|
<div class="my-2">
|
|
<input type="number" min="0" max="55" class="form-control form-control-sm" id="combatant-modal-ini" form="#combatant-modal-form" placeholder="Ini">
|
|
<label for="combatant-modal-ini" class="form-label">Wound penalties: -<span id="penalty-stun">0</span> (stun) and -<span id="penalty-physical">0</span> (physical)</label>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" id="combatant-modal-cancel-button" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="submit" class="btn btn-primary" id="combatant-modal-add-ok-button" data-bs-dismiss="modal">OK</button>
|
|
<button type="submit" class="btn btn-primary d-none" id="combatant-modal-edit-ok-button" data-bs-dismiss="modal">OK</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<footer class="footer fixed-bottom bg-light">
|
|
<hr>
|
|
<p class="text-center text-muted">code & design by <a href="https://tobias-radloff.de/">Eclipse</a> | Shadowrun trademarked by <a href="https://www.topps.com/">Topps</a><br>
|
|
icons by <a href="https://www.freepik.com" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> | background by <a href="https://www.deviantart.com/xxaries1970xx">xxAries1970xx</a></p>
|
|
</footer>
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html> |