- streamlined element IDs, function etc.
- sortTable() now adds contextual classes to combatantRows (depending on their ini value) - moved all inline CSS styles to custom.css
This commit is contained in:
parent
07747b3b18
commit
208738531a
@ -1,20 +1,20 @@
|
||||
input
|
||||
{
|
||||
/*input {
|
||||
opacity: 0.65;
|
||||
}
|
||||
|
||||
/*tr#newCombRow input {
|
||||
background: paleturquoise;
|
||||
}*/
|
||||
|
||||
*/
|
||||
input:invalid {
|
||||
border: 2px solid red;
|
||||
}
|
||||
|
||||
tr[data-ini='0'] {
|
||||
background: lightgray;
|
||||
}
|
||||
|
||||
th#combIniHeader, th#combDiceReaHeader, th#combActionsHeader {
|
||||
.header-align-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
table.diceandrea {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
td.combatantDice, td.combatantRea {
|
||||
width: 45%;
|
||||
}
|
||||
|
||||
40
index.html
40
index.html
@ -24,25 +24,25 @@
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<header class="navbar navbar-expand navbar-light bg-light">
|
||||
<header class="navbar navbar-expand bg-light">
|
||||
<span class="navbar-brand">Shadowrun 2 Initiative Tracker</span>
|
||||
<nav class="container-fluid justify-content-end" aria-label="Main navigation">
|
||||
<button type="button" class="btn btn-outline-secondary" id="newCombAddButton" title="Add combatant to fight">Add Combatant …</button>
|
||||
<button type="button" class="btn btn-outline-secondary" id="newRoundButton" data-bs-toggle="modal" data-bs-target="#newRoundModal" title="begin new round">New Round</button>
|
||||
<button type="submit" class="btn btn-outline-secondary" id="addCombatantButton" title="Add combatant">Add Combatant</button>
|
||||
<button type="submit" class="btn btn-outline-secondary" id="newRoundButton" data-bs-toggle="modal" data-bs-target="#newRoundModal" title="Begin new round">New Round</button>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm table-borderless" id="combatants">
|
||||
<table class="table table-sm" id="combatantsTable">
|
||||
<thead>
|
||||
<tr id="combatants-headrow">
|
||||
<th class="col-sm-5" id="combNameHeader" title="Name">Name</th>
|
||||
<th class="col-sm-2" id="combIniHeader" title="Initiative">Initiative</th>
|
||||
<th class="col-sm-3" id="combDiceReaHeader" title="Initiative Dice and Reaction">Ini Dice & REA</th>
|
||||
<th class="col-sm-2" id="combActionsHeader" title="Available Actions">Actions</th>
|
||||
<tr>
|
||||
<th class="col-sm-5" title="Name">Name</th>
|
||||
<th class="col-sm-2 header-align-center" title="Initiative">Initiative</th>
|
||||
<th class="col-sm-2 header-align-center" title="Initiative Dice and Reaction">Ini Dice & REA</th>
|
||||
<th class="col-sm-3 header-align-center" title="Available Actions">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="align-middle" id="sortable">
|
||||
<tbody class="align-middle">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@ -60,13 +60,13 @@
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="button" class="btn btn-primary" id="newroundModalOkButton" data-bs-dismiss="modal">OK</button>
|
||||
<button type="submit" class="btn btn-primary" id="newroundModalOkButton" data-bs-dismiss="modal">OK</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="addCombModal" tabindex="-1">
|
||||
<div class="modal fade" id="combatantModal" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content modal-sm">
|
||||
<div class="modal-header">
|
||||
@ -74,26 +74,26 @@
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="addCombForm" name="addCombModalForm" class="combForm was-validated" onsubmit="return false;">
|
||||
<form id="combatantForm" name="combatantModalForm" class="was-validated" onsubmit="return false;">
|
||||
<div class="form-outline mb-4">
|
||||
<input type="text" maxlength="40" class="form-control combName" form="addCombModalForm" id="newCombName" placeholder="Name" required />
|
||||
<input type="text" maxlength="40" class="form-control" id="combatantModalName" form="combatantModalForm" id="newCombName" placeholder="Name" required />
|
||||
</div>
|
||||
<div class="form-outline mb-4">
|
||||
<div class="input-group">
|
||||
<input type="number" min="1" max="5" class="form-control combDice" form="addCombModalForm" placeholder="Dice" />
|
||||
<input type="number" min="1" max="5" class="form-control" id="combatantModalDice" form="combatantModalForm" placeholder="Dice" />
|
||||
<span class="input-group-text">D+</span>
|
||||
<input type="number" min="1" max="25" class="form-control combRea" form="addCombModalForm" placeholder="REA" />
|
||||
<input type="number" min="1" max="25" class="form-control" id="combatantModalRea" form="combatantModalForm" placeholder="REA" />
|
||||
</div>
|
||||
<div class="form-outline mb-4">
|
||||
</div>
|
||||
<input type="number" min="0" max="55" class="form-control combIni" form="addCombModalForm" placeholder="Ini" />
|
||||
<input type="number" min="0" max="55" class="form-control" id="combatantModalIni" form="combatantModalForm" placeholder="Ini" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="button" class="btn btn-primary" id="addModalOkButton" data-bs-dismiss="modal">OK (add)</button>
|
||||
<button type="button" class="btn btn-primary" id="editModalOkButton" data-bs-dismiss="modal" style="display: none">OK (edit)</button>
|
||||
<button type="button" class="btn btn-secondary" id="combatantModalCancelButton" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" class="btn btn-primary" id="combatantModalAddOkButton">OK (add)</button>
|
||||
<button type="submit" class="btn btn-primary" id="combatantModalEditOkButton" style="display: none">OK (edit)</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
345
js/sr2ini.js
345
js/sr2ini.js
@ -7,7 +7,6 @@ function rollForInitiative(dice, rea) {
|
||||
let ini = 0;
|
||||
for ( let i = 0; i < parseInt(dice); i++ ) {
|
||||
roll = Math.floor(Math.random() * 6) + 1;
|
||||
// console.log(roll);
|
||||
ini += roll;
|
||||
}
|
||||
return ini + parseInt(rea);
|
||||
@ -15,14 +14,37 @@ function rollForInitiative(dice, rea) {
|
||||
|
||||
// sorts the combatants by ini value
|
||||
function sortTable() {
|
||||
console.log("OK let's sort");
|
||||
let $table = $("table#combatants");
|
||||
let $rows = $table.find("tr.combRow").toArray().sort(function(a, b) {
|
||||
return parseInt($(b).attr("data-ini")) - parseInt($(a).attr("data-ini"));
|
||||
// sort rows
|
||||
let $rows = $(".combatantRow").toArray().sort(function(a, b) {
|
||||
return parseInt($(b).find(".combatantIni").text()) - parseInt($(a).find(".combatantIni").text());
|
||||
});
|
||||
|
||||
// append rows in sorted order
|
||||
for ( var i = 0; i < $rows.length; i++ ) {
|
||||
$table.append($rows[i]);
|
||||
$("#combatantsTable").append($rows[i]);
|
||||
}
|
||||
|
||||
// compute highest ini
|
||||
let iniValues = $.map( $(".combatantIni"), function(td, i) {
|
||||
return parseInt($(td).text());
|
||||
});
|
||||
let iniMax = Math.max.apply(null, iniValues);
|
||||
|
||||
// add contextual classes to rows
|
||||
$(".combatantRow").each( function() {
|
||||
// default: remove previous classes, disable act button
|
||||
$(this).removeClass("table-primary table-secondary").find(".act-button").prop("disabled", true).attr("aria-disabled", "true");
|
||||
// ini is zero: add class
|
||||
if ( parseInt($(this).find(".combatantIni").text()) == 0 ) {
|
||||
$(this).addClass("table-secondary");
|
||||
}
|
||||
// ini is max and non-zero: add class, enable act button
|
||||
else if ( parseInt($(this).find(".combatantIni").text()) == iniMax && iniMax > 0 ) {
|
||||
$(this).addClass("table-primary").find(".act-button").prop("disabled", false).removeAttr("aria-disabled");
|
||||
}
|
||||
})
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
@ -30,108 +52,80 @@ console.log("OK let's sort");
|
||||
* Event handler functions
|
||||
*/
|
||||
|
||||
// blur handler for input elements (blur is triggered when an element loses focus) that checks if validation is required
|
||||
function handleBlur (e) {
|
||||
let $tr = $(e.target).parents("tr");
|
||||
|
||||
// trigger validation check only if focus is not going to another input in the same row
|
||||
if ( ( ! ( $(e.relatedTarget).is("input") && $(e.relatedTarget).parents("tr") == $tr ) ) ) {
|
||||
|
||||
// validation check
|
||||
if ( ! validateCombRowValues($tr) ) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
|
||||
// did Ini value stay the same? do nothing then
|
||||
if ( $tr.find(".combIni")[0].value == $tr.attr("data-ini") ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// Ini value changed => reposition row
|
||||
$tr.attr("data-ini", $tr.find(".combIni")[0].value);
|
||||
sortTable()
|
||||
}
|
||||
}
|
||||
|
||||
// click handler for add buttons
|
||||
function handleAddButtonClick (e) {
|
||||
|
||||
// restyle modal
|
||||
$modal = $("#addCombModal");
|
||||
$modal.find(".modal-title").text("Add Combatant");
|
||||
$modal.find("#addModalOkButton").show();
|
||||
$modal.find("#editModalOkButton").hide();
|
||||
|
||||
// add handler for enter key
|
||||
$("#addCombModal input[class*='comb']").off("keydown");
|
||||
$("#addCombModal input[class*='comb']").on("keydown", function (e) {
|
||||
if ( e.which == 13 || e.which == 10 ) {
|
||||
addCombatant();
|
||||
$('#addCombModal').modal("hide");
|
||||
}
|
||||
});
|
||||
|
||||
// show modal
|
||||
$modal.modal("show");
|
||||
}
|
||||
|
||||
|
||||
// click handler for edit buttons
|
||||
function handleEditButtonClick (e) {
|
||||
|
||||
// find current table row
|
||||
let $tr = $(e.target).parents("tr.combRow");
|
||||
|
||||
// restyle modal
|
||||
$modal = $("#addCombModal");
|
||||
$modal.find(".modal-title").text("Edit Combatant");
|
||||
$modal.find("#addModalOkButton").hide();
|
||||
$modal.find("#editModalOkButton").show();
|
||||
|
||||
// populate modal with values from row
|
||||
$modal.find(".combName").val($tr.find(".combName").val());
|
||||
$modal.find(".combDice").val($tr.find(".combDice").val());
|
||||
$modal.find(".combRea").val($tr.find(".combRea").val());
|
||||
$modal.find(".combIni").val($tr.find(".combIni").val());
|
||||
|
||||
// note which row is being edited
|
||||
console.log($("tr.combRow").index($tr));
|
||||
$modal.attr("data-row", $("tr.combRow").index($tr));
|
||||
|
||||
// add handler for enter key
|
||||
$("#addCombModal input[class*='comb']").off("keydown");
|
||||
$("#addCombModal input[class*='comb']").on("keydown", function (e) {
|
||||
if ( e.which == 13 || e.which == 10 ) {
|
||||
modifyCombatant();
|
||||
$('#addCombModal').modal("hide");
|
||||
}
|
||||
});
|
||||
|
||||
// show modal
|
||||
$modal.modal("show");
|
||||
}
|
||||
|
||||
|
||||
// click handler for act buttons
|
||||
function handleActButtonClick (e) {
|
||||
// find current table row
|
||||
let $tr = $(e.target).parents("tr.combRow");
|
||||
let input = $tr.find(".combIni")[0];
|
||||
let $tr = $(e.target).parents(".combatantRow");
|
||||
let ini = $tr.find(".combatantIni").text();
|
||||
|
||||
// reduce ini by 10 but not lower than 0
|
||||
input.value = Math.max(parseInt(input.value) - 10, 0);
|
||||
$tr.attr("data-ini", input.value);
|
||||
ini = Math.max(parseInt(ini) - 10, 0);
|
||||
|
||||
// set new ini value
|
||||
$tr.find(".combatantIni").text(ini);
|
||||
|
||||
// resort table
|
||||
sortTable();
|
||||
}
|
||||
|
||||
|
||||
// click handler for add buttons
|
||||
function handleAddButtonClick (e) {
|
||||
|
||||
// restyle modal
|
||||
$("#combatantModal .modal-title").text("Add Combatant");
|
||||
$("#combatantModalAddOkButton").show();
|
||||
$("#combatantModalEditOkButton").hide();
|
||||
|
||||
// add handler for enter key
|
||||
$("#combatantModal input[id*='combatantModal']").off("keydown");
|
||||
$("#combatantModal input[id*='combatantModal']").on("keydown", function (e) {
|
||||
if ( e.which == 13 || e.which == 10 ) {
|
||||
addCombatant(e);
|
||||
}
|
||||
});
|
||||
|
||||
// show modal
|
||||
$("#combatantModal").modal("show");
|
||||
}
|
||||
|
||||
|
||||
// click handler for edit buttons
|
||||
function handleEditButtonClick (e) {
|
||||
// find current table row
|
||||
let $tr = $(e.target).parents(".combatantRow");
|
||||
|
||||
// restyle modal
|
||||
$("#combatantModal .modal-title").text("Edit Combatant");
|
||||
$("#combatantModalAddOkButton").hide();
|
||||
$("#combatantModalEditOkButton").show();
|
||||
|
||||
// populate modal with values from row
|
||||
$("#combatantModalName").val($tr.find(".combatantName").text());
|
||||
$("#combatantModalDice").val($tr.find(".combatantDice").text());
|
||||
$("#combatantModalRea").val($tr.find(".combatantRea").text());
|
||||
$("#combatantModalIni").val($tr.find(".combatantIni").text());
|
||||
|
||||
// mark which row is being edited
|
||||
$("#combatantModal").attr("data-row", $(".combatantRow").index($tr));
|
||||
|
||||
// add handler for enter key
|
||||
$("#combatantModal input[id*='combatantModal']").off("keydown");
|
||||
$("#combatantModal input[id*='combatantModal']").on("keydown", function (e) {
|
||||
if ( e.which == 13 || e.which == 10 ) {
|
||||
editCombatant(e);
|
||||
}
|
||||
});
|
||||
|
||||
// show modal
|
||||
$("#combatantModal").modal("show");
|
||||
}
|
||||
|
||||
|
||||
// click handler for remove buttons
|
||||
function handleRemoveButtonClick (e) {
|
||||
// remove table row
|
||||
$(e.target).parents("tr.combRow").remove();
|
||||
$(e.target).parents(".combatantRow").remove();
|
||||
}
|
||||
|
||||
|
||||
@ -140,16 +134,18 @@ function handleRemoveButtonClick (e) {
|
||||
*/
|
||||
|
||||
// validate a combatant row form by checking for all conditions, including regular HTML5 validation
|
||||
function validateCombRowValues(tr) {
|
||||
function validateCombatant() {
|
||||
|
||||
// get input elements
|
||||
let inputElements = {
|
||||
name: $(tr).find("input[class*='combName']").get(0),
|
||||
ini: $(tr).find("input[class*='combIni']").get(0),
|
||||
dice: $(tr).find("input[class*='combDice']").get(0),
|
||||
rea: $(tr).find("input[class*='combRea']").get(0)
|
||||
name: $("#combatantModalName").get(0),
|
||||
ini: $("#combatantModalIni").get(0),
|
||||
dice: $("#combatantModalDice").get(0),
|
||||
rea: $("#combatantModalRea").get(0)
|
||||
};
|
||||
|
||||
// do standard HTML5 form validation first (makes sure that name is not empty and that all other values are numbers within their individual ranges)
|
||||
// do standard HTML5 form validation first
|
||||
// (makes sure that name is not empty and that all other values are numbers within their individual ranges)
|
||||
let valid = true;
|
||||
Object.values(inputElements).forEach(function(input) {
|
||||
if ( ! input.reportValidity() ) {
|
||||
@ -160,8 +156,7 @@ function validateCombRowValues(tr) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// now some custom validation
|
||||
// first get values
|
||||
// now for some custom validation; first we need to get the input values
|
||||
let ini = inputElements["ini"].value.trim();
|
||||
let dice = inputElements["dice"].value.trim();
|
||||
let rea = inputElements["rea"].value.trim();
|
||||
@ -182,7 +177,7 @@ function validateCombRowValues(tr) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// ok fine
|
||||
// ok then
|
||||
return true;
|
||||
}
|
||||
|
||||
@ -193,117 +188,122 @@ function validateCombRowValues(tr) {
|
||||
|
||||
// add new combatant
|
||||
function addCombatant (e) {
|
||||
if ( ! validateCombRowValues($("#addCombForm")) ) {
|
||||
return;
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
// validate form
|
||||
if ( ! validateCombatant() ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// hide modal
|
||||
$("#combatantModal").modal("hide");
|
||||
|
||||
// get values
|
||||
let name = $("#addCombModal .combName").val().trim();
|
||||
let ini = $("#addCombModal .combIni").val().trim();
|
||||
let dice = $("#addCombModal .combDice").val().trim();
|
||||
let rea = $("#addCombModal .combRea").val().trim();
|
||||
let name = $("#combatantModalName").val().trim();
|
||||
let ini = $("#combatantModalIni").val().trim();
|
||||
let dice = $("#combatantModalDice").val().trim();
|
||||
let rea = $("#combatantModalRea").val().trim();
|
||||
|
||||
// roll for initiative if ini is empty
|
||||
ini = (ini != "") ? ini : rollForInitiative(dice, rea);
|
||||
|
||||
// construct jQuery object for table row
|
||||
let $tr = $($.parseHTML( [
|
||||
'<tr class="combRow" data-ini="', ini, '">\n',
|
||||
'<form name="combForm" class="combForm needs-validation" onsubmit="return false;">\n',
|
||||
'<tr class="combatantRow">\n',
|
||||
'<td class="combatantName" title="Combatant\'s name">', name, '</td>\n',
|
||||
'<td class="combatantIni text-center" title="Initiative">', ini, '</td>\n',
|
||||
'<td>\n',
|
||||
'<input type="text" required="" maxlength="40" class="form-control combName" title="click to edit" value="', name, '" />\n',
|
||||
'</td>\n',
|
||||
'<td class="col-sm-2">\n',
|
||||
'<input type="number" min="0" max="50" class="form-control combIni" title="click to edit" value="', ini, '" />\n',
|
||||
'</td>\n',
|
||||
'<td class="col-sm-3">\n',
|
||||
'<div class="input-group">\n',
|
||||
'<input type="number" min="1" max="5" class="form-control combDice" title="click to edit" value="', dice, '" />\n',
|
||||
'<span class="input-group-text">D+</span>\n',
|
||||
'<input type="number" min="1" max="20" class="form-control combRea" title="click to edit" value="', rea, '" />\n',
|
||||
'<div>\n',
|
||||
'<table class="table table-sm table-borderless diceandrea">\n',
|
||||
'<tr>\n',
|
||||
'<td class="combatantDice text-end" title="Number of initiative dice">', dice, '</td>\n',
|
||||
'<td class="text-center">D+</td>\n',
|
||||
'<td class="combatantRea text-start" title="Reaction">', rea, '</td>\n',
|
||||
'</tr>\n',
|
||||
'</table>\n',
|
||||
'</div>\n',
|
||||
'</td>\n',
|
||||
'<td>\n',
|
||||
'<div class="btn-group d-flex">\n',
|
||||
'<button type="button" class="btn btn-primary w-50 edit-button" title="Edit combatant\'s values">Edit</button> \n',
|
||||
'<button type="button" class="btn btn-warning w-50 act-button" title="Complete this combatant\'s current phase and reduce ini by 10">-10</button> \n',
|
||||
'<button type="button" class="btn btn-danger w-50 remove-button" title="Remove combatant">X</button>\n',
|
||||
'<button type="button" class="btn btn-primary btn-rounded w-50 edit-button" title="Edit combatant\'s values">Edit</button> \n',
|
||||
'<button type="button" class="btn btn-warning btn-rounded w-50 act-button" title="Act and reduce ini by 10">-10</button> \n',
|
||||
'<button type="button" class="btn btn-danger btn-rounded w-50 remove-button" title="Remove combatant">X</button>\n',
|
||||
'</div>\n',
|
||||
'</td>\n',
|
||||
'</form>\n',
|
||||
'</tr>'].join("")
|
||||
));
|
||||
|
||||
// add handlers to table row object
|
||||
// $tr.find("input[class*='comb']").on("blur", handleBlur);
|
||||
// $tr.find("input[type='number']").bind('keyup input change', handleBlur);
|
||||
// add handlers to table row buttons
|
||||
$tr.find("button.edit-button").on("click", handleEditButtonClick);
|
||||
$tr.find("button.act-button").on("click", handleActButtonClick);
|
||||
$tr.find("button.remove-button").on("click", handleRemoveButtonClick);
|
||||
|
||||
// insert combatant row
|
||||
$("table#combatants").append($tr);
|
||||
sortTable();
|
||||
// add handlers to table cells (click to edit)
|
||||
$tr.find("[class*='combatant']").on("click", handleEditButtonClick);
|
||||
|
||||
//reset form values
|
||||
$("#addCombModal input[class*='comb']").val("");
|
||||
// add row to table and sort
|
||||
$("#combatantsTable").append($tr);
|
||||
sortTable();
|
||||
}
|
||||
|
||||
// modify combatant values
|
||||
function modifyCombatant (e) {
|
||||
|
||||
$("#addCombModal").modal("hide");
|
||||
// edit combatant values
|
||||
function editCombatant (e) {
|
||||
e.preventDefault();
|
||||
|
||||
// validate form
|
||||
if ( ! validateCombRowValues($("#addCombForm")) ) {
|
||||
return;
|
||||
if ( ! validateCombatant() ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// hide modal
|
||||
$("#combatantModal").modal("hide");
|
||||
|
||||
// get values
|
||||
let name = $("#addCombModal .combName").val().trim();
|
||||
let ini = $("#addCombModal .combIni").val().trim();
|
||||
let dice = $("#addCombModal .combDice").val().trim();
|
||||
let rea = $("#addCombModal .combRea").val().trim();
|
||||
let name = $("#combatantModalName").val().trim();
|
||||
let ini = $("#combatantModalIni").val().trim();
|
||||
let dice = $("#combatantModalDice").val().trim();
|
||||
let rea = $("#combatantModalRea").val().trim();
|
||||
|
||||
// roll for initiative if ini is empty
|
||||
ini = (ini != "") ? ini : rollForInitiative(dice, rea);
|
||||
|
||||
// get correct row
|
||||
let index = parseInt($("#addCombModal").attr("data-row"));
|
||||
$tr = $("tr.combRow").eq(index);
|
||||
let index = parseInt($("#combatantModal").attr("data-row"));
|
||||
$tr = $("tr.combatantRow").eq(index);
|
||||
|
||||
// set new values
|
||||
$tr.find(".combName").val(name);
|
||||
$tr.find(".combDice").val(dice);
|
||||
$tr.find(".combRea").val(rea);
|
||||
$tr.find(".combIni").val(ini);
|
||||
$tr.attr("data-ini", ini);
|
||||
$tr.find(".combatantName").text(name);
|
||||
$tr.find(".combatantDice").text(dice);
|
||||
$tr.find(".combatantRea").text(rea);
|
||||
$tr.find(".combatantIni").text(ini);
|
||||
|
||||
// sort table
|
||||
sortTable();
|
||||
|
||||
// clean up
|
||||
$("#addCombModal").removeAttr("data-row");
|
||||
$("#addCombModal input[class*='comb']").val("");
|
||||
$("#combatantModal").removeAttr("data-row");
|
||||
}
|
||||
|
||||
|
||||
// start a new combat round
|
||||
function newRound() {
|
||||
|
||||
// are there rows at all?
|
||||
let $rows = $("tr.combRow");
|
||||
if ( $rows.length == 0 ) {
|
||||
if ( $(".combatantRow").length == 0 ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// reset ini values in cloned rows
|
||||
$rows.each( function() {
|
||||
let $input = $(this).find(".combIni");
|
||||
let dice = $(this).find(".combDice").val();
|
||||
if ( dice == "" ) {
|
||||
$input.val(0);
|
||||
// reset ini values
|
||||
$(".combatantRow").each( function() {
|
||||
let $ini = $(this).find(".combatantIni");
|
||||
let $dice = $(this).find(".combatantDice");
|
||||
if ( $dice.text() == "" ) {
|
||||
$ini.text(1);
|
||||
$ini.text(1);
|
||||
} else {
|
||||
$input.val(rollForInitiative(dice, $(this).find(".combRea").val()));
|
||||
$ini.text(rollForInitiative($dice.text(), $(this).find(".combatantRea").text()));
|
||||
}
|
||||
$(this).attr("data-ini", $input.val());
|
||||
});
|
||||
|
||||
// resort table
|
||||
@ -316,13 +316,22 @@ function newRound() {
|
||||
*/
|
||||
|
||||
$(document).ready(function(){
|
||||
// add event handlers to initial buttons and input elements
|
||||
$("#newCombAddButton").on("click", handleAddButtonClick);
|
||||
// add event handlers to navbar buttons
|
||||
$("#addCombatantButton").on("click", handleAddButtonClick);
|
||||
$("#newroundModalOkButton").on("click", newRound);
|
||||
$("#addModalOkButton").on("click", addCombatant);
|
||||
$("#editModalOkButton").on("click", modifyCombatant);
|
||||
|
||||
$('#addCombModal').on('shown.bs.modal', function() {
|
||||
$('.combName').focus();
|
||||
// add event handlers to modal buttons
|
||||
$("#combatantModalAddOkButton").on("click", addCombatant);
|
||||
$("#combatantModalEditOkButton").on("click", editCombatant);
|
||||
|
||||
// always focus name input field when combatant modal appears
|
||||
$('#combatantModal').on('shown.bs.modal', function() {
|
||||
$('#combatantModalName').focus();
|
||||
})
|
||||
|
||||
// always empty input fields when combatant modal disappears
|
||||
$("#combatantModal").on('hidden.bs.modal', function (e) {
|
||||
$("#combatantModal input[id*='combatantModal']").val("");
|
||||
})
|
||||
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user