eclipse/sr2ini
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

- capitalized const names

Browse Source 
- put all html into consts
- fixed minor bugs
This commit is contained in:
Tobias 2023-02-08 12:26:46 +01:00
parent c26dd7be94
commit a142740330
1 changed files with 67 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
js/sr2ini.js
View File

@ -1,7 +1,24 @@
const penalty = [0, 1, 1, 2, 2, 2, 3, 3, 3, 3, 4]; const DAMAGE_PENALTY = [0, 1, 1, 2, 2, 2, 3, 3, 3, 3, 4];
const dmg = ["", "L", "M", "S", "D"]; const DAMAGE_NIVEAU = ["", "L", "M", "S", "D"];
const damageMonitorHTML = ['<table class="bg-light damage-monitor text-center align-middle">\n', const COMBATANT_TABLE_ROW = [
'<tr class="combatantRow align-middle" data-true-ini="">\n', //TODO: add data-damage-* attributes with initial damage levels
'<td class="combatantName" title="Combatant\'s name"></td>\n',
'<td class="combatantIni text-center" title="Effective initiative (w/ wound penalties)"></td>\n',
'<td class="text-center combatantDiceAndRea" title="Iniative dice and reaction"><span class="combatantDice"></span>D+<span class="combatantRea"></span></td>\n',
'<td class="text-end">\n',
'<div class="btn-group">\n',
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 edit-button" title="Edit combatant\'s values"><img src="img/edit.png" /></button>\n',
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 act-button" title="Act and reduce ini by 10"><img src="img/check.png" /></button>\n',
'<div class="damage-dropdown">\n',
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 damage-button" title="Take damage"><img src="img/explosion.png" /></button>\n',
'</div>\n',
'</div>\n',
'</td>\n',
'</tr>'].join("");
const DAMAGE_MONITOR_HTML = [
'<table class="bg-light damage-monitor text-center align-middle">\n',
'<tr>\n', '<tr>\n',
'<td><button class="btn btn-sm btn-warning damage-stun active" title="+/-0">0</button></td>\n', '<td><button class="btn btn-sm btn-warning damage-stun active" title="+/-0">0</button></td>\n',
'<td><button class="btn btn-sm btn-danger damage-physical active" title="+/-0">0</button></td>\n', '<td><button class="btn btn-sm btn-danger damage-physical active" title="+/-0">0</button></td>\n',
@ -19,9 +36,9 @@ const damageMonitorHTML = ['<table class="bg-light damage-monitor text-center al
'<tr><th colspan="2"><button type)"submit" class="btn btn-sm btn-light remove-button" title="Remove combatant" data-bs-toggle="modal" data-bs-target="#confirmModal"><img src="img/trash.png" /></button></th></tr>\n', '<tr><th colspan="2"><button type)"submit" class="btn btn-sm btn-light remove-button" title="Remove combatant" data-bs-toggle="modal" data-bs-target="#confirmModal"><img src="img/trash.png" /></button></th></tr>\n',
'</table>'].join(""); '</table>'].join("");
const maxIniClass = "table-primary"; const MAX_INI_CLASS = "table-primary";
const zeroIniClass = "table-secondary"; const ZERO_INI_CLASS = "table-secondary";
const regularClass = "table-success"; const REGULAR_INI_CLASS = "table-success";
/* /*
* helper functions * helper functions
@ -29,22 +46,19 @@ const regularClass = "table-success";
// roll for initiative with the given reaction and number of ini dice // roll for initiative with the given reaction and number of ini dice
function rollForInitiative(dice, rea) { function rollForInitiative(dice, rea) {
let ini = 0; let diceRolls = Array.from({length: parseInt(dice)}, () => Math.ceil(Math.random() * 6));
for ( let i = 0; i < parseInt(dice); i++ ) { console.log(diceRolls);
roll = Math.floor(Math.random() * 6) + 1; return diceRolls.reduce((a, b) => a + b, 0) + parseInt(rea);
ini += roll;
}
return ini + parseInt(rea);
} }
// figure out whose action comes first out of two combatants a and b // figure out whose action comes first out of two combatants a and b
function whoGoesFirst(a, b) { function whoGoesFirst(a, b) {
// check for K.O./death // check for K.O./death
let tmpA = $(a).hasClass("out-of-commission") ? -1 : parseInt($(a).find(".combatantIni").text()) || 0; 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; let tmpB = $(b).hasClass("out-of-commission") ? -1 : parseInt($(b).find(".combatantIni").text()) || 0;
console.log("iniA, iniB are", tmpA, tmpB);
// compare ini // compare ini
let comparer = tmpB - tmpA; let comparer = tmpB - tmpA;
if (comparer != 0) { if (comparer != 0) {
@ -54,7 +68,6 @@ console.log("iniA, iniB are", tmpA, tmpB);
{ {
tmpA = parseInt($(a).find(".combatantRea").text()) || 0; tmpA = parseInt($(a).find(".combatantRea").text()) || 0;
tmpB = parseInt($(b).find(".combatantRea").text()) || 0 tmpB = parseInt($(b).find(".combatantRea").text()) || 0
console.log("Reaction values are: ", tmpA, tmpB);
return tmpB - tmpA; return tmpB - tmpA;
} }
} }
@ -64,21 +77,20 @@ console.log("Reaction values are: ", tmpA, tmpB);
function sortTable() { function sortTable() {
// remove previous classes from rows, disable act buttons // remove previous classes from rows, disable act buttons
$(".combatantRow").removeClass(maxIniClass + " " + zeroIniClass + " " + regularClass).find(".act-button").prop("disabled", true).attr("aria-disabled", "true"); $(".combatantRow").removeClass(MAX_INI_CLASS + " " + ZERO_INI_CLASS + " " + REGULAR_INI_CLASS).find(".act-button").prop("disabled", true).attr("aria-disabled", "true");
// get ini value for every combatant; set to 0 if K.O./dead // get ini value for every combatant; set to 0 if K.O./dead
let iniValues = $.map( $(".combatantRow"), function(tr, i) { let iniValues = $.map( $(".combatantRow"), function(tr, i) {
console.log($(tr).find(".combatantIni")); //TODO: don't rely on class out-of-commission being set, check and set it here instead
return $(tr).hasClass("out-of-commission") ? 0 : parseInt($(tr).find(".combatantIni").text()); return $(tr).hasClass("out-of-commission") ? 0 : parseInt($(tr).find(".combatantIni").text());
}); });
console.log(iniValues);
//TODO: maxIni wid nicht vergeben wenn damage > 0 //TODO: maxIni wid nicht vergeben wenn damage > 0
// compute highest ini // compute highest ini
let iniMax = Math.max.apply(null, iniValues); let iniMax = Math.max.apply(null, iniValues);
console.log(iniValues);
// add contextual classes // add contextual classes
//TODO: I should probably add badges here as well, maybe even effectiveIni
$(".combatantRow").each( function() { $(".combatantRow").each( function() {
// K.O./dead -> don't add anything // K.O./dead -> don't add anything
if ( $(this).hasClass("out-of-commission") ) { if ( $(this).hasClass("out-of-commission") ) {
@ -86,16 +98,16 @@ console.log(iniValues);
} }
// ini = zero // ini = zero
if ( parseInt($(this).find(".combatantIni").text()) == 0 ) { if ( parseInt($(this).find(".combatantIni").text()) == 0 ) {
$(this).addClass(zeroIniClass); $(this).addClass(ZERO_INI_CLASS);
return true; return true;
} }
// ini = max and non-zero // ini = max and non-zero
if ( parseInt($(this).find(".combatantIni").text()) == iniMax && iniMax > 0 ) { if ( parseInt($(this).find(".combatantIni").text()) == iniMax && iniMax > 0 ) {
$(this).addClass(maxIniClass).find(".act-button").prop("disabled", false).removeAttr("aria-disabled"); $(this).addClass(MAX_INI_CLASS).find(".act-button").prop("disabled", false).removeAttr("aria-disabled");
return true; return true;
} }
// everything else // everything else
$(this).addClass(regularClass); $(this).addClass(REGULAR_INI_CLASS);
}) })
// sort rows and append them in new order // sort rows and append them in new order
@ -109,24 +121,25 @@ console.log(iniValues);
// returns a combatant's effective ini value (modified by wound penalties) // returns a combatant's effective ini value (modified by wound penalties)
function getEffectiveIni(value, dmgLvl1, dmgLvl2) { function getEffectiveIni(value, damageLevel1, damageLevel2) {
let effectiveIni; let effectiveIni;
// was function called with 1 argument (tr jQuery object)? // was function called with 1 argument (tr jQuery object)?
if ( arguments.length == 1 && $(value).is("tr.combatantRow") ) { if ( arguments.length == 1 && $(value).is("tr.combatantRow") ) {
let trueIni = parseInt($(value).attr("data-true-ini")); let trueIni = parseInt($(value).attr("data-true-ini"));
let dmgStun = parseInt($(value).attr("data-damage-stun")) || 0; let damageStun = parseInt($(value).attr("data-damage-stun")) || 0;
let dmgPhysical = parseInt($(value).attr("data-damage-physical")) || 0; let damagePhysical = parseInt($(value).attr("data-damage-physical")) || 0;
effectiveIni = trueIni - penalty[dmgStun] - penalty[dmgPhysical]; effectiveIni = trueIni - DAMAGE_PENALTY[damageStun] - DAMAGE_PENALTY[damagePhysical];
} }
// or with 3 arguments (ini and dmg levels)? // or with 3 arguments (ini and damage levels)?
else if ( arguments.length == 3 ) { else if ( arguments.length == 3 ) {
effectiveIni = parseInt(value) - penalty[parseInt(dmgLvl1)] - penalty[parseInt(dmgLvl2)]; effectiveIni = parseInt(value) - DAMAGE_PENALTY[parseInt(damageLevel1)] - DAMAGE_PENALTY[parseInt(damageLevel2)];
} }
// //
else { else {
return NaN; return NaN;
} }
//TODO: maybe check here for out-of-commission and return 'dead' or something instead of int
return effectiveIni < 0 ? 0 : effectiveIni; return effectiveIni < 0 ? 0 : effectiveIni;
} }
@ -212,6 +225,7 @@ console.log("damage level is", damageLevel);
// add damage level to table row as as data attribute // add damage level to table row as as data attribute
$tr.attr("data-damage-" + damageType, damageLevel); $tr.attr("data-damage-" + damageType, damageLevel);
//TODO: class out-of-commission should be set in sortTable() with the other contextual classes
if ( damageLevel == 10 || otherDamageLevel == 10 ) { if ( damageLevel == 10 || otherDamageLevel == 10 ) {
$tr.addClass("out-of-commission"); $tr.addClass("out-of-commission");
} else { } else {
@ -228,10 +242,10 @@ console.log("damage level is", damageLevel);
// add damage level badges // add damage level badges
if ( $tr.attr("data-damage-stun") && $tr.attr("data-damage-stun") != "0" ) { if ( $tr.attr("data-damage-stun") && $tr.attr("data-damage-stun") != "0" ) {
$tr.find(".combatantIni").append('<sup><span class="badge bg-warning position-absolute translate-middle" title="Stun damage level">' + dmg[penalty[$tr.attr("data-damage-stun")]] + '</span></sup>'); $tr.find(".combatantIni").append('<sup><span class="badge bg-warning position-absolute translate-middle" title="Stun damage niveau">' + DAMAGE_NIVEAU[DAMAGE_PENALTY[$tr.attr("data-damage-stun")]] + '</span></sup>');
} }
if ( $tr.attr("data-damage-physical") && $tr.attr("data-damage-physical") != "0" ) { if ( $tr.attr("data-damage-physical") && $tr.attr("data-damage-physical") != "0" ) {
$tr.find(".combatantIni").append('<sub><span class="badge bg-danger position-absolute translate-middle">' + dmg[penalty[$tr.attr("data-damage-physical")]] + '<span class="visually-hidden">Physical damage level</span></span></sub>'); $tr.find(".combatantIni").append('<sub><span class="badge bg-danger position-absolute translate-middle" title="Physical damage niveau">' + DAMAGE_NIVEAU[DAMAGE_PENALTY[$tr.attr("data-damage-physical")]] + '</span></sub>');
} }
// resort // resort
@ -369,21 +383,25 @@ function addCombatant (e) {
// hide modal // hide modal
$("#combatantModal").modal("hide"); $("#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 // roll for initiative if necessary
ini = (ini != "") ? ini : rollForInitiative(dice, rea); let ini = $("#combatantModalIni").val().trim();
ini = (ini != "") ? ini : rollForInitiative($("#combatantModalDice").val(), $("#combatantModalRea").val());
// get effective initiative value (modified by wound penalties)
let effectiveIni = getEffectiveIni(ini, 0, 0);
// construct jQuery object for table row // construct jQuery object for table row
let $tr = $($.parseHTML( [ let $tr = $($.parseHTML(COMBATANT_TABLE_ROW));
$tr.find(".damage-dropdown").append($.parseHTML(DAMAGE_MONITOR_HTML));
// populate table row with values from modal
$tr.attr("data-true-ini", ini);
$tr.find(".combatantName").text($("#combatantModalName").val().trim());
$tr.find(".combatantIni").text(getEffectiveIni(ini, 0, 0)); // don't need to use contents()[0].data here b/c wound badges are added later
$tr.find(".combatantDice").text($("#combatantModalDice").val().trim());
$tr.find(".combatantRea").text($("#combatantModalRea").val().trim());
//TODO: retrieve initial damage levels
// construct jQuery object for table row
/* let $tr = $($.parseHTML( [
'<tr class="combatantRow align-middle" data-true-ini="', ini, '">\n', //TODO: add data-damage-* attributes with initial damage levels '<tr class="combatantRow align-middle" data-true-ini="', ini, '">\n', //TODO: add data-damage-* attributes with initial damage levels
'<td class="combatantName" title="Combatant\'s name">', name, '</td>\n', '<td class="combatantName" title="Combatant\'s name">', name, '</td>\n',
'<td class="combatantIni text-center" title="Effective initiative (w/ wound penalties)">', effectiveIni, '</td>\n', '<td class="combatantIni text-center" title="Effective initiative (w/ wound penalties)">', effectiveIni, '</td>\n',
@ -394,24 +412,24 @@ function addCombatant (e) {
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 act-button" title="Act and reduce ini by 10"><img src="img/check.png" /></button>\n', '<button type="button" class="btn btn-light btn-rounded mx-1 p-1 act-button" title="Act and reduce ini by 10"><img src="img/check.png" /></button>\n',
'<div class="damage-dropdown">\n', '<div class="damage-dropdown">\n',
'<button type="button" class="btn btn-light btn-rounded mx-1 p-1 damage-button" title="Take damage"><img src="img/explosion.png" /></button>\n', '<button type="button" class="btn btn-light btn-rounded mx-1 p-1 damage-button" title="Take damage"><img src="img/explosion.png" /></button>\n',
damageMonitorHTML + "\n", DAMAGE_MONITOR_HTML + "\n",
'</div>\n', '</div>\n',
'</div>\n', '</div>\n',
'</td>\n', '</td>\n',
'</tr>'].join("") '</tr>'].join("")
)); ));*/
//TODO: mark initial damage levels with active class //TODO: mark initial damage levels with active class -> what? don't know what this means
// add handlers to table row buttons // add handler to table cells (click to edit)
$tr.find(".combatantName, .combatantIni, .combatantDiceAndRea").on("click", handleEditButtonClick);
// add handlers to action buttons
$tr.find("button.edit-button").on("click", handleEditButtonClick); $tr.find("button.edit-button").on("click", handleEditButtonClick);
$tr.find("button.act-button").on("click", handleActButtonClick); $tr.find("button.act-button").on("click", handleActButtonClick);
$tr.find("button.damage-button").on("click", handleDamageButtonClick); $tr.find("button.damage-button").on("click", handleDamageButtonClick);
$tr.find("button.remove-button").on("click", handleRemoveButtonClick); $tr.find("button.remove-button").on("click", handleRemoveButtonClick);
// add handler to table cells (click to edit)
$tr.find(".combatantName, .combatantIni, .combatantDiceAndRea").on("click", handleEditButtonClick);
// add handler to damage monitor // add handler to damage monitor
$tr.find(".damage-stun, .damage-physical").on("click", handleDamageMonitorClick); $tr.find(".damage-stun, .damage-physical").on("click", handleDamageMonitorClick);