'].join("");
// roll for initiative with the given reaction and number of ini dice
function rollForInitiative(dice, rea) {
let ini = 0;
for ( let i = 0; i < parseInt(dice); i++ ) {
roll = Math.floor(Math.random() * 6) + 1;
ini += roll;
}
return ini + parseInt(rea);
}
// figure out whose action comes first out of two combatants a and b
function whoGoesFirst(a, b) {
let comparer = parseInt($(b).find(".combatantIni").text()) - parseInt($(a).find(".combatantIni").text());
if (comparer != 0) {
return comparer;
} else {
let reaA = parseInt($(a).find(".combatantRea").text());
let reaB = parseInt($(b).find(".combatantRea").text());
reaA = isNaN(reaA) ? 0 : reaA;
if (isNaN(reaB)) { reaB = 0; }
console.log(reaA, reaB);
return reaB - reaA;
}
}
// sorts the combatants by ini value
function sortTable() {
// sort rows and append them in new order
let $rows = $(".combatantRow").toArray().sort(whoGoesFirst);
for ( var i = 0; i < $rows.length; i++ ) {
$("#combatantsTable").append($rows[i]);
}
// add contectual classes to rows – currently for highest ini and ini = 0
// 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() {
// always remove previous classes, disable act button
$(this).removeClass("table-primary table-secondary").find(".act-button").prop("disabled", true).attr("aria-disabled", "true");
// add class if ini is zero
if ( parseInt($(this).find(".combatantIni").text()) == 0 ) {
$(this).addClass("table-secondary");
}
// add class, enable act button if ini is max and non-zero
else if ( parseInt($(this).find(".combatantIni").text()) == iniMax && iniMax > 0 ) {
$(this).addClass("table-primary").find(".act-button").prop("disabled", false).removeAttr("aria-disabled");
}
})
return;
}
// returns a combatant's effective ini value (modified by wound penalties)
function getEffectiveIni(value, dmgLvl1, dmgLvl2) {
let effectiveIni;
// was function called with 1 argument (tr jQuery object)?
if ( arguments.length == 1 && $(value).is("tr.combatantRow") ) {
let trueIni = parseInt($(value).attr("data-true-ini"));
let dmgStun = parseInt($(value).attr("data-damage-stun")) || 0;
let dmgPhysical = parseInt($(value).attr("data-damage-physical")) || 0;
effectiveIni = trueIni - penalty[dmgStun] - penalty[dmgPhysical];
}
// or with 3 arguments (ini and dmg levels)?
else if ( arguments.length == 3 ) {
effectiveIni = parseInt(value) - penalty[parseInt(dmgLvl1)] - penalty[parseInt(dmgLvl2)];
}
//
else { return NaN; }
console.log("effectiveIni is ", effectiveIni);
return effectiveIni < 0 ? 0 : effectiveIni;
}
/*
* Event handler functions
*/
// click handler for act buttons
function handleActButtonClick (e) {
// find current table row
let $tr = $(e.target).parents(".combatantRow");
let ini = $tr.attr("data-true-ini");
// reduce ini by 10 but not lower than 0
ini = Math.max(parseInt(ini) - 10, 0);
// set new ini value
$tr.attr("data-true-ini", ini);
$tr.find(".combatantIni").text(getEffectiveIni($tr));
// 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 damage buttons
function handleDamageButtonClick (e) {
let display = $(e.target).parents(".damage-dropdown").find(".damage-monitor").css("display");
$(e.target).parents(".damage-dropdown").find(".damage-monitor").css("display", display == "block" ? "none" : "block");
return false;
}
// click handler for damage monitor fields
function handleDamageMonitorClick (e) {
let $td = $(e.target);
let $tr = $td.parents("tr.combatantRow");
let damageType;
let otherDamageLevel
// calculate new damage level and type
let damageLevel = $td.parent().index();
if ( $td.hasClass("damage-stun") ) {
damageType = "stun";
otherDamageLevel = $tr.attr("data-damage-physical") ? parseInt($tr.attr("data-damage-physical")) : 0;
} else if ( $td.hasClass("damage-physical") ) {
damageType = "physical";
otherDamageLevel = $tr.attr("data-damage-stun") ? parseInt($tr.attr("data-damage-stun")) : 0;
} else {
return false;
}
// add damage level to table row as as data attribute
$tr.attr("data-damage-" + damageType, damageLevel);
// select/unselect damage boxes
$td.addClass("selected");
$td.parent().nextAll().children("td.damage-" + damageType).removeClass("selected");
$td.parent().prevAll().children("td.damage-" + damageType).addClass("selected");
// recalculate effective ini and resort
$tr.find(".combatantIni").text(getEffectiveIni($tr));
sortTable();
return false;
}
// 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.attr("data-true-ini"));
//TODO: show effective ini in modal
// 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(".combatantRow").remove();
}
/*
* Validation functions
*/
// validate a combatant row form by checking for all conditions, including regular HTML5 validation
function validateCombatant() {
// get input elements
let inputElements = {
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)
let valid = true;
Object.values(inputElements).forEach(function(input) {
if ( ! input.reportValidity() ) {
valid = false;
}
})
if ( ! valid ) {
return false;
}
// 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();
// invalidate if ini, dice and rea are all empty
if ( ini == "" && ( dice == "" || rea == "" ) ) {
inputElements["ini"].setCustomValidity("Requiring values for ini dice and reaction, or initiative, or all three");
inputElements["ini"].reportValidity();
inputElements["ini"].setCustomValidity("");
return false;
}
// invalidate if dice or rea is empty but not both
if ( ( dice == "" ) != ( rea == "" ) ) {
inputElements["dice"].setCustomValidity("Values required for both dice and reaction, or none (in which case ini is required)");
inputElements["dice"].reportValidity();
inputElements["dice"].setCustomValidity("");
return false;
}
// ok then
return true;
}
/*
* Main functions
*/
// add new combatant
function addCombatant (e) {
e.preventDefault();
// validate form
if ( ! validateCombatant() ) {
return false;
}
// hide modal
$("#combatantModal").modal("hide");
// get values
let name = $("#combatantModalName").val().trim();
let ini = $("#combatantModalIni").val().trim();
let dice = $("#combatantModalDice").val().trim();
let rea = $("#combatantModalRea").val().trim();
//TODO: retrieve initial damage levels
// roll for initiative if necessary
ini = (ini != "") ? ini : rollForInitiative(dice, rea);
// TODO: actually calculate effective ini
let effectiveIni = getEffectiveIni(ini, 0, 0);
console.log("effective ini = ", effectiveIni);
// construct jQuery object for table row
let $tr = $($.parseHTML( [
'
\n', //TODO: add data-damage-* attributes with initial damage levels
'
', name, '
\n',
'
', effectiveIni, '
\n',
'
', dice, 'D+', rea, '
\n',
'
\n',
'
\n',
'\n',
'\n',
'
\n',
'\n',
damageMonitorHTML + "\n",
'
\n',
'
\n',
'
\n',
'
'].join("")
));
//TODO: mark initial damage levels with .selected class
// 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);
$tr.find("button.damage-button").on("click", handleDamageButtonClick);
// add handler to table cells (click to edit)
$tr.find(".combatantName, .combatantIni, .combatantDiceAndRea").on("click", handleEditButtonClick);
// add handler to damage monitor
$tr.find(".damage-stun, .damage-physical").on("click", handleDamageMonitorClick);
// add row to table and sort
$("#combatantsTable").append($tr);
sortTable();
}
// edit combatant values
function editCombatant (e) {
e.preventDefault();
// validate form
if ( ! validateCombatant() ) {
return false;
}
// hide modal
$("#combatantModal").modal("hide");
// get values
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($("#combatantModal").attr("data-row"));
$tr = $("tr.combatantRow").eq(index);
// set new values
$tr.find(".combatantName").text(name);
$tr.find(".combatantDice").text(dice);
$tr.find(".combatantRea").text(rea);
$tr.attr("data-true-ini", ini);
$tr.find(".combatantIni").text(getEffectiveIni($tr));
// sort table
sortTable();
// clean up
$("#combatantModal").removeAttr("data-row");
}
// start a new combat round
function newRound() {
// are there rows at all?
if ( $(".combatantRow").length == 0 ) {
return;
}
// reset ini values
$(".combatantRow").each( function() {
let effectiveIni = $(this).find(".combatantIni").text();
let dice = $(this).find(".combatantDice").text();
if ( dice == "" ) {
$(this).attr("data-true-ini", "1");
} else {
$(this).attr("data-true-ini", rollForInitiative(dice, $(this).find(".combatantRea").text()));
}
$(this).find(".combatantIni").text(getEffectiveIni($(this)));
});
// resort table
sortTable();
}
// add test combatant for testing purposes (duh)
function addTestCombatant() {
$("#addCombatantButton").click();
$("#combatantModalName").val("Goon1");
$("#combatantModalDice").val(2);
$("#combatantModalRea").val(6);
$("#combatantModalIni").val(12);
setTimeout(function(){
$("#combatantModalAddOkButton").click();
},500);
}
/*
* Initialize document
*/
$(document).ready(function(){
// add event handlers to navbar buttons
$("#addCombatantButton").on("click", handleAddButtonClick);
$("#newroundModalOkButton").on("click", newRound);
// 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("");
});
// Hide damage monitors if mouse is clicked outside
$("html").on("click", function(e) {
$(".damage-monitor:visible").css("display", "none");
});
addTestCombatant();
});
