enhanced and bugfixed damage level tracking

This commit is contained in:
Tobias 2023-02-07 13:16:53 +01:00
parent 7d5455fdfd
commit 86f1f4bad3
3 changed files with 65 additions and 46 deletions

View File

@ -9,12 +9,21 @@ input:invalid {
border: 2px solid red;
}
.out-of-commission {
color: coral;
text-decoration: line-through;
background-color: darkslategray;
}
.max-ini {
font-weight: bold;
}
/* Dropdown Content (Hidden by Default) */
.damage-monitor {
display: none;
position: absolute;
z-index: 20;
top: 40px;
right: -8px;
width: 60px;
@ -34,16 +43,13 @@ input:invalid {
border: solid darkgray 1px;
font-size: smaller;
user-select: none;
}
.damage-monitor td::selection { background: none; }
.damage-monitor td::-moz-selection { background: none; }
td.damage-stun { background-color: cornflowerblue; }
/*td.damage-stun:hover { background-color: steelblue; }*/
td.damage-stun.selected { background-color: dodgerblue; }
td.damage-physical { background-color: indianred; }
/*td.damage-physical:hover { background-color: coral; }*/
td.damage-physical.selected { background-color: tomato; }
/* bgcolors: default, active, hover
@ -51,8 +57,3 @@ td.damage-physical.selected { background-color: tomato; }
stun: cornflowerblue, lightskyblue, mediumlateblue, steelblue, royalblue
*/
/* Change color of dropdown links on hover */
.damage-monitor td:hover {
background-color: gray;
}

View File

@ -81,7 +81,7 @@
<div class="my-2">
<input type="text" maxlength="40" class="form-control form-control-sm" id="combatantModalName" form="combatantModalForm" id="newCombName" placeholder="Name" required />
</div>
<div class="input-group my-2">
<div class="input-group input-group-sm my-2">
<input type="number" min="1" max="5" class="form-control form-control-sm" id="combatantModalDice" form="combatantModalForm" placeholder="Dice" />
<span class="input-group-text">D+</span>
<input type="number" min="1" max="25" class="form-control form-control-sm" id="combatantModalRea" form="combatantModalForm" placeholder="REA" />

View File

@ -23,6 +23,9 @@ const damageMonitorHTML = ['<table class="damage-monitor text-center">\n',
'</tbody>\n',
'</table>'].join("");
const maxIniClass = "max-ini";
const zeroIniClass = "table-secondary";
// roll for initiative with the given reaction and number of ini dice
function rollForInitiative(dice, rea) {
@ -37,49 +40,62 @@ function rollForInitiative(dice, 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());
// check for K.O./death
let tmpA = $(a).hasClass("out-of-commission") ? -1 : parseInt($(a).find(".combatantIni").text()) || 0;
let tmpB = $(b).hasClass("out-of-commission") ? -1 : parseInt($(b).find(".combatantIni").text()) || 0;
console.log("iniA, iniB are", tmpA, tmpB);
// compare ini
let comparer = tmpB - tmpA;
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;
} else
// tie; compare reaction
{
tmpA = parseInt($(a).find(".combatantRea").text()) || 0;
tmpB = parseInt($(b).find(".combatantRea").text()) || 0
console.log("Reaction values are: ", tmpA, tmpB);
return tmpB - tmpA;
}
}
// sorts the combatants by ini value
// add contextual classes and sort combatants by ini value
function sortTable() {
// remove previous classes from rows, disable act buttons
$(".combatantRow").removeClass(maxIniClass + " " + zeroIniClass).find(".act-button").prop("disabled", true).attr("aria-disabled", "true");
// get ini value for every combatant; set to 0 if K.O./dead
let iniValues = $.map( $(".combatantIni"), function(td, i) {
return $(td).parents(".combatantRow").hasClass("out-of-commission") ? 0 : parseInt($(td).text());
});
// compute highest ini
let iniMax = Math.max.apply(null, iniValues);
// add contextual classes
$(".combatantRow").each( function() {
// K.O./dead -> don't add anything
if ( $(this).hasClass("out-of-commission") ) {
return true;
}
// ini = zero
if ( parseInt($(this).find(".combatantIni").text()) == 0 ) {
$(this).addClass(zeroIniClass);
}
// ini = max and non-zero
else if ( parseInt($(this).find(".combatantIni").text()) == iniMax && iniMax > 0 ) {
$(this).addClass(maxIniClass).find(".act-button").prop("disabled", false).removeAttr("aria-disabled");
}
})
// 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;
}
@ -101,7 +117,6 @@ function getEffectiveIni(value, dmgLvl1, dmgLvl2) {
}
//
else { return NaN; }
console.log("effectiveIni is ", effectiveIni);
return effectiveIni < 0 ? 0 : effectiveIni;
}
@ -177,7 +192,12 @@ function handleDamageMonitorClick (e) {
// add damage level to table row as as data attribute
$tr.attr("data-damage-" + damageType, damageLevel);
if ( damageLevel == 10 || otherDamageLevel == 10 ) {
$tr.addClass("out-of-commission");
} else {
$tr.removeClass("out-of-commission");
}
// select/unselect damage boxes
$td.addClass("selected");
$td.parent().nextAll().children("td.damage-" + damageType).removeClass("selected");
@ -187,8 +207,7 @@ function handleDamageMonitorClick (e) {
$tr.find(".combatantIni").text(getEffectiveIni($tr));
sortTable();
return false;
// return false;
}
// click handler for edit buttons
@ -311,9 +330,8 @@ function addCombatant (e) {
// roll for initiative if necessary
ini = (ini != "") ? ini : rollForInitiative(dice, rea);
// TODO: actually calculate effective ini
// get effective initiative value (modified by wound penalties)
let effectiveIni = getEffectiveIni(ini, 0, 0);
console.log("effective ini = ", effectiveIni);
// construct jQuery object for table row
let $tr = $($.parseHTML( [