diff --git a/index.html b/index.html index 2e47e4f..672f2cd 100644 --- a/index.html +++ b/index.html @@ -23,8 +23,15 @@ -
+
+ Shadowrun 2 Initiative Tracker + +
+
@@ -37,38 +44,7 @@ - - - - - - - - - - - -
- - - - -
- - D+ - -
- 		-
- -
-
- -
- -
-
@@ -91,5 +67,38 @@ + + + diff --git a/js/sr2ini.js b/js/sr2ini.js index af55325..87aef85 100644 --- a/js/sr2ini.js +++ b/js/sr2ini.js @@ -7,7 +7,7 @@ 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); +// console.log(roll); ini += roll; } return ini + parseInt(rea); @@ -22,8 +22,8 @@ function rollForInitiative(dice, rea) { function handleBlur (e) { let $tr = $(e.target).parents("tr"); - // trigger validation check only if the blurred input element is not in #newCombRow and focus is not going to another input in the same row - if ( ( ! $tr.is("#newCombRow") ) && ( ! ( $(e.relatedTarget).is("input") && $(e.relatedTarget).parents("tr") == $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) ) { @@ -75,42 +75,55 @@ function handleRemoveButtonClick (e) { */ // validate a combatant row form by checking for all conditions, including regular HTML5 validation -function validateCombRowValues($tr) { +function validateCombRowValues(tr) { - let inputElements = $($tr).find("input[class*='comb']").toArray(); +// let inputElements = $($tr).find("input[class*='comb']").toArray(); + 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) + }; - // do standard HTML5 form validation first (validates 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; - for (let input of inputElements) { + Object.values(inputElements).forEach(function(input) { +console.log(input); + if ( ! input.reportValidity() ) { + valid = false; + } + }) +/* for (let input in inputElements) { if ( ! input.reportValidity() ) { valid = false; break } - } + } */ + if ( ! valid ) { return false; } // now some custom validation // first get values - let ini = inputElements[1].value.trim(); - let dice = inputElements[2].value.trim(); - let rea = inputElements[3].value.trim(); + let ini = inputElements["ini"].value.trim(); + let dice = inputElements["dice"].value.trim(); + let rea = inputElements["rea"].value.trim(); console.log("I/D/R: " + ini + "/" + dice + "/" + rea); // invalidate if ini, dice and rea are all empty if ( ini == "" && ( dice == "" || rea == "" ) ) { - inputElements[1].setCustomValidity("Requiring values for initiative, ini dice and reaction, or all three"); - inputElements[1].reportValidity(); - inputElements[1].setCustomValidity(""); + 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[2].setCustomValidity("Values required for both dice and reaction, or none (if ini is given)"); - inputElements[2].reportValidity(); - inputElements[2].setCustomValidity(""); + 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; } @@ -119,9 +132,9 @@ console.log("I/D/R: " + ini + "/" + dice + "/" + rea); let d = parseInt(dice); let r = parseInt(rea); if ( ini < d+r || ini > d*6+r ) { - inputElements[1].setCustomValidity("Impossible to reach initiative " + ini + " with " + dice + "D6+" + rea + ", please adjust ini or leave empty"); - inputElements[1].reportValidity(); - inputElements[1].setCustomValidity(""); + inputElements["ini"].setCustomValidity("Impossible to reach initiative " + ini + " with " + dice + "D6+" + rea + ", please adjust ini or leave empty"); + inputElements["ini"].reportValidity(); + inputElements["ini"].setCustomValidity(""); return false; } }*/ @@ -139,13 +152,15 @@ console.log("I/D/R: " + ini + "/" + dice + "/" + rea); function insertCombRow($tr) { let ini = parseInt($tr.find(".combIni").val()); - let $combRows = $("tr.combRow:not(#newCombRow)"); + let $combRows = $("tr.combRow"); + +console.log($("tbody#sortable")); // find correct position for new row // no combatants in table => put new row below the form row if ( $combRows.length == 0 ) { - $("tr#newCombRow").after($tr); + $("tbody#sortable").append($tr); } // ini is less than the lowest in table => put new row at the end @@ -188,14 +203,14 @@ console.log("rea is " + rea + " and currentRowRea is " + currentRowRea); // add new combatant function addCombatant (e) { - if ( ! validateCombRowValues($("#newCombRow")) ) { + if ( ! validateCombRowValues($("#addCombForm")) ) { return; } // get values - let ini = $("#newCombRow .combIni").val().trim(); - let dice = $("#newCombRow .combDice").val().trim(); - let rea = $("#newCombRow .combRea").val().trim(); + let ini = $("#addCombModal .combIni").val().trim(); + let dice = $("#addCombModal .combDice").val().trim(); + let rea = $("#addCombModal .combRea").val().trim(); // roll for initiative if ini is empty ini = (ini != "") ? ini : rollForInitiative(dice, rea); @@ -205,7 +220,7 @@ function addCombatant (e) { '\n', '
\n', '\n', - '\n', + '\n', '\n', '\n', '\n', @@ -237,7 +252,7 @@ function addCombatant (e) { insertCombRow($tr); //reset form values - $("#newCombRow input[class*='comb']").val(""); + $("#addCombModal input[class*='comb']").val(""); return; } @@ -247,7 +262,7 @@ function addCombatant (e) { function newRound() { // are there rows at all? - let $oldRows = $("tr.combRow:not('#newCombRow')"); + let $oldRows = $("tr.combRow"); if ( $oldRows.length == 0 ) { return; } @@ -283,11 +298,15 @@ function newRound() { $(document).ready(function(){ // add event handlers to initial buttons and input elements - $("#newCombAddButton").on("click", addCombatant); + $("#addCombModalButton").on("click", addCombatant); $("#newRoundOkButton").on("click", newRound); - $("#newCombRow input[class*='comb']").on("blur", handleBlur).on("keydown", function (e) { + $("#addCombModal input[class*='comb']").on("keydown", function (e) { if ( e.which == 13 || e.which == 10 ) { addCombatant(); + $('#addCombModal').modal("hide"); } }); + $('#addCombModal').on('shown.bs.modal', function() { + $('.combName').focus(); + }) });