Initial commit
This commit is contained in:
Joey Kimsey
210
app/plugins/initiativetracker/views/index.html
Normal file
210
app/plugins/initiativetracker/views/index.html
Normal file
@ -0,0 +1,210 @@
|
||||
<link rel="stylesheet" href="{ROOT_URL}app/plugins/initiativetracker/css/initiative.css" crossorigin="anonymous">
|
||||
<script src="{ROOT_URL}app/plugins/initiativetracker/js/initiative.js" type="module" defer></script>
|
||||
|
||||
<div id="initiative-container" class="initiative-container">
|
||||
|
||||
<div class="row">
|
||||
<h2>Initiative Tracker</h2>
|
||||
</div>
|
||||
|
||||
<!-- Tracker Settings -->
|
||||
<div class="row well well-sm">
|
||||
<div class="checkbox">
|
||||
<label><input type="checkbox" name="trackHP" id="trackHP"> Track HP</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label><input type="checkbox" name="trackAC" id="trackAC"> Track AC</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label><input type="checkbox" name="trackRounds" id="trackRounds"> Track Rounds</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Character Form -->
|
||||
<div id="character-form" class="character-form row well well-sm">
|
||||
<div class="form-group col-lg-3">
|
||||
<label for="name">Name</label>
|
||||
<input type="text" class="form-control" name="name" id="name" autocomplete="on">
|
||||
</div>
|
||||
<div class="form-group col-lg-2">
|
||||
<label for="initiative">Initiative</label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-btn">
|
||||
<button id="d20-roll" class="btn btn-default" aria-label="Roll a d20 for initiative.">Roll</button>
|
||||
</div>
|
||||
<input type="number" class="form-control" name="initiative" id="initiative">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group col-lg-1 ac-tracker" style="display: none;">
|
||||
<label for="ac">AC</label>
|
||||
<input type="number" class="form-control" name="ac" id="ac">
|
||||
</div>
|
||||
<div class="form-group col-lg-1 hp-tracker" style="display: none;">
|
||||
<label for="hp">HP</label>
|
||||
<input type="number" class="form-control" name="hp" id="hp">
|
||||
</div>
|
||||
<div class="form-group col-lg-2">
|
||||
<label for="pc">Type</label><br>
|
||||
<label class="radio-inline">
|
||||
<input type="radio" name="characterType" id="pc" value="pc" checked> PC
|
||||
</label>
|
||||
<label class="radio-inline">
|
||||
<input type="radio" name="characterType" id="npc" value="npc"> NPC
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-group col-lg-3">
|
||||
<button id="character-add" class="btn btn-primary">
|
||||
Add
|
||||
</button>
|
||||
<button id="character-reset" class="btn btn-danger">
|
||||
Reset
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Initiative List -->
|
||||
<div id="character-container" style="display: none;">
|
||||
|
||||
<div id="initiative-list" class="well well-sm">
|
||||
<!-- Tab Header -->
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li class="active">
|
||||
<a data-target="#cmb-list" role="tab" data-toggle="tab">
|
||||
Combined
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-target="#pc-list" role="tab" data-toggle="tab">
|
||||
PC
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-target="#npc-list" role="tab" data-toggle="tab">
|
||||
NPC
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Tab panes -->
|
||||
<div class="tab-content">
|
||||
<!-- Combined List -->
|
||||
<div role="tabpanel" class="tab-pane active" id="cmb-list">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th class="text-center">Initiative</th>
|
||||
<th class="ac-tracker text-center" style="display: none;">AC</th>
|
||||
<th class="hp-tracker text-center" style="display: none;">HP</th>
|
||||
<th class="text-center">Type</th>
|
||||
<th class="text-right"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="character-list">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- PC List -->
|
||||
<div role="tabpanel" class="tab-pane" id="pc-list">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th class="text-center">Initiative</th>
|
||||
<th class="ac-tracker text-center" style="display: none;">AC</th>
|
||||
<th class="hp-tracker text-center" style="display: none;">HP</th>
|
||||
<th class="text-center">Type</th>
|
||||
<th class="text-right"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="character-list-pc">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- NPC List -->
|
||||
<div role="tabpanel" class="tab-pane" id="npc-list">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th class="text-center">Initiative</th>
|
||||
<th class="ac-tracker text-center" style="display: none;">AC</th>
|
||||
<th class="hp-tracker text-center" style="display: none;">HP</th>
|
||||
<th class="text-center">Type</th>
|
||||
<th class="text-right"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="character-list-npc">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- List Controls -->
|
||||
<div class="row list-controls row">
|
||||
<div class="form-group col-lg-3">
|
||||
<button id="list-reset" class="d4-die die-btn btn btn-warning">
|
||||
Reset Round
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group col-lg-3">
|
||||
<div class="input-group">
|
||||
<div class="input-group-btn">
|
||||
<button id="character-sort" class="btn btn-primary" aria-label="Sort the List.">Sort</button>
|
||||
</div>
|
||||
<select class="form-control" id="sortBy">
|
||||
<option value="initiative">Initiative</option>
|
||||
<option value="name">Name</option>
|
||||
<option value="ac">AC</option>
|
||||
<option value="hp">HP</option>
|
||||
<option value="type">Type</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group col-lg-3">
|
||||
<button id="list-next" class="btn btn-success">
|
||||
Next Character
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-group col-lg-3 list-controls-last">
|
||||
<button id="list-clear" class="btn btn-danger">
|
||||
Clear List
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Round Controls -->
|
||||
<div class="row rounds-tracker" style="display: none;">
|
||||
<div class="panel panel-info">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">Round History</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr id="rounds-history-header-row">
|
||||
<th id="rounds-history-header">Character</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="rounds-history">
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="form-group col-lg-2">
|
||||
<button id="rounds-clear" class="d4-die die-btn btn btn-danger">
|
||||
Clear History
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer round-footer">
|
||||
<b>Round Count</b>: <span id="round-count"></span>
|
||||
<span class="pull-right round-reset">
|
||||
<button id="rounds-reset" class="btn btn-warning">
|
||||
Reset Round Count
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user