/*
 *	constants definitions
 */
const DAMAGE_PENALTY = [0, 1, 1, 2, 2, 2, 3, 3, 3, 3, 4];
const DAMAGE_NIVEAU = ["", "L", "M", "S", "D"];
const COMBATANT_TABLE_ROW = [
'<tr class="combatant-row align-middle" data-true-ini="" data-augmented-ui="tl-scoop bl-clip-y tr-clip-y br-scoop">\n', //TODO: add data-damage-* attributes with initial damage levels
	'<td class="combatant-name" title="Combatant\'s name" data-bs-toggle="modal" data-bs-target="#combatant-modal" data-augmented-ui="tl-scoop bl-clip-y both">Test</td>\n',
	'<td class="combatant-ini" title="Effective initiative (w/ wound penalties)" data-bs-toggle="modal" data-bs-target="#combatant-modal" data-augmented-ui="both"></td>\n',
	'<td class="text-center combatant-dice-and-rea" title="Iniative dice and reaction" data-bs-toggle="modal" data-bs-target="#combatant-modal" data-augmented-ui="both"><span class="combatant-dice"></span>D+<span class="combatant-rea"></span></td>\n',
	'<td class="combatant-actions text-end" data-augmented-ui="tr-clip-y br-scoop both">\n',
		'<button type="button" class="edit-button" title="Edit combatant\'s values" data-bs-toggle="modal" data-bs-target="#combatant-modal"><img src="001-edit.png"/></button>\n',
		'<button type="button" class="act-button" title="Act and reduce ini by 10"><img src="002-act.png"/></button>\n',
		'<div class="damage-dropdown">\n',
			'<button type="button" class="damage-button" title="Take damage" ><img src="003-damage.png"/></button>\n',
		'</div>\n',
	'</td>\n',
'</tr>'].join("");
const DAMAGE_MONITOR_HTML = [
'<table class="damage-monitor text-center align-middle d-none" data-augmented-ui="tl-scoop bl-clip-y tr-clip-y br-scoop both">\n',
	'<tr><td><button class="damage-stun active" title="Light stun damage">L</button></td><td><button class="damage-physical active" title="Light physical damage">L</button></td></tr>\n',
	'<tr><td><button class="damage-stun active"></button></td><td><button class="damage-physical active"></button></td></tr>\n',
	'<tr><td><button class="damage-stun active" title="Medium stun damage">M</button></td><td><button class="damage-physical active" title="Medium physical damage">M</button></td></tr>\n',
	'<tr><td><button class="damage-stun active"></button></td><td><button class="damage-physical active"></button></td></tr>\n',
	'<tr><td><button class="damage-stun active"></button></td><td><button class="damage-physical active"></button></td></tr>\n',
	'<tr><td><button class="damage-stun active" title="Severe stun damage">S</button></td><td><button class="damage-physical active" title="Severe physical damage">S</button></td></tr>\n',
	'<tr><td><button class="damage-stun active"></button></td><td><button class="damage-physical active"></button></td></tr>\n',
	'<tr><td><button class="damage-stun active"></button></td><td><button class="damage-physical active"></button></td></tr>\n',
	'<tr><td><button class="damage-stun active"></button></td><td><button class="damage-physical active"></button></td></tr>\n',
	'<tr><td><button class="damage-stun active" title="K.O."><img src="zzz.png" height="16" /></button></td><td><button class="damage-physical active" title="dead"><img src="cross.png" height="16"/></button></td></tr>\n',
	'<tr><th colspan="2"><button type)"submit" class="remove-button" title="Remove combatant" data-bs-toggle="modal" data-bs-target="#confirm-modal"><img src="trash.png" /></button></th></tr>\n',
'</table>'].join("");
const STUN_BADGE_HTML = '<sup><span class="badge bg-warning position-absolute translate-middle stun-badge" title="Stun damage niveau"></span></sup>';
const PHYSICAL_BADGE_HTML = '<sub><span class="badge bg-danger position-absolute translate-middle physical-badge" title="Physical damage niveau"></span></sub>';
/*
 *	helper functions
 */
// roll for initiative with the given reaction and number of ini dice  
function rollForInitiative(dice, rea) {
	let diceRolls = Array.from({ length: parseInt(dice) }, () => Math.ceil(Math.random() * 6));
	return diceRolls.reduce((a, b) => a + b, 0) + parseInt(rea);
}
// figure out whose action comes first out of two combatants a and b
function whoGoesFirst(a, b) {
	// check for K.O./death
	let tmpA = $(a).hasClass("ko-or-dead") ? -1 : parseInt($(a).find(".combatant-ini").text()) || 0;
	let tmpB = $(b).hasClass("ko-or-dead") ? -1 : parseInt($(b).find(".combatant-ini").text()) || 0;
	// compare ini
	let compIni = tmpB - tmpA;
	if (compIni != 0) {
		return compIni;
	}
	// tie; compare reaction
	else {
		if ($(a).find(".combatant-rea").text() == "" || $(b).find(".combatant-rea").text() == "") {
			return 0;
		} else {
			return parseInt($(b).find(".combatant-rea").text()) - parseInt($(a).find(".combatant-rea").text());
		}
	}
}
// returns a combatant's effective ini value (modified by wound penalties)
function getEffectiveIni(tr) {
	// return -1 if combatant is K.O. or dead
	if ($(tr).hasClass("ko-or-dead")) {
		return -1;
	}
	// otherwise compute effective ini (true ini minus wound penalties)
	let effectiveIni = parseInt($(tr).attr("data-true-ini")) - DAMAGE_PENALTY[parseInt($(tr).attr("data-damage-stun")) || 0] - DAMAGE_PENALTY[parseInt($(tr).attr("data-damage-physical")) || 0];
	return Math.max(effectiveIni, 0);
}
// add test combatant for testing purposes (duh)
function addTestCombatant() {
	// Eclipse
	$("#add-combatant-button").click();
	$("#combatant-modal-name").val("Eclipse");
	$("#combatant-modal-dice").val(3);
	$("#combatant-modal-rea").val(6);
	//	$("#combatant-modal-ini").val(12);
	setTimeout(function () {
		$("#combatant-modal-add-ok-button").click();
	}, 500);
}
/*
 *	Event handler functions
 */
// click handler for act buttons; reduces ini by 10
function handleActButtonClick(e) {
	// reduce ini by 10 but not lower than 0
	let ini = Math.max(parseInt($(e.target).parents(".combatant-row").attr("data-true-ini")) - 10, 0);
	// set new ini value
	$(e.target).parents(".combatant-row").attr("data-true-ini", ini);
	// resort table
	sortTable();
}
// click handler for add buttons
function handleAddButtonClick(e) {
	// restyle modal
	$("#combatant-modal .modal-title").text("Add Combatant");
	$("#combatant-modal-add-ok-button").removeClass("d-none");
	$("#combatant-modal-edit-ok-button").addClass("d-none");
	// add handler for enter key
	$("#combatant-modal input[id*='combatant-modal']").off("keydown");
	$("#combatant-modal input[id*='combatant-modal']").on("keydown", function (e) {
		if (e.which == 13 || e.which == 10) {
			addCombatant(e);
		}
	});
}
// click handler for damage buttons; basically toggles visibility of table.damage-monitor
function handleDamageButtonClick(e) {
	// get visibility status at click time
	let hiddenAtClick = $(e.target).parents(".damage-dropdown").find(".damage-monitor").hasClass("d-none");
	// hide all damage monitors
	$(".damage-monitor:visible").addClass("d-none");
	// if targeted dm was hidden before, show it now
	if (hiddenAtClick) {
		$(e.target).parents(".damage-dropdown").find(".damage-monitor").removeClass("d-none");
	}
	return false;
}
// click handler for edit buttons
function handleEditButtonClick(e) {
	// find current table row
	let $tr = $(e.target).parents(".combatant-row");
	// restyle modal
	$("#combatant-modal .modal-title").text("Edit Combatant");
	$("#combatant-modal-add-ok-button").addClass("d-none");
	$("#combatant-modal-edit-ok-button").removeClass("d-none");
	// populate modal with values from row
	$("#combatant-modal-name").val($tr.find(".combatant-name").text());
	$("#combatant-modal-dice").val($tr.find(".combatant-dice").attr("data-combatant-dice"));
	$("#combatant-modal-rea").val($tr.find(".combatant-rea").attr("data-combatant-rea"));
	$("#combatant-modal-ini").val($tr.attr("data-true-ini"));
	// show effective ini in modal
	$("#penalty-stun").text(DAMAGE_PENALTY[parseInt($tr.attr("data-damage-stun")) || 0]);
	$("#penalty-physical").text(DAMAGE_PENALTY[parseInt($tr.attr("data-damage-physical")) || 0]);
	// mark which row is being edited
	$("#combatant-modal").data("row", $(".combatant-row").index($tr)); // here it's okay to use .data() b/c HTML/CSS does not care about this value
	// add handler for enter key
	$("#combatant-modal input[id*='combatant-modal']").off("keydown");
	$("#combatant-modal input[id*='combatant-modal']").on("keydown", function (e) {
		if (e.which == 13 || e.which == 10) {
			editCombatant(e);
		}
	});
}

function handleNewRoundButton(e) {
	// restyle modal
	$("#confirm-modal .modal-title").text("Start new Round");
	$("#confirm-modal-new-round-ok-button").removeClass("d-none");
	$("#confirm-modal-remove-combatant-ok-button").addClass("d-none");
}
// click handler for remove buttons
function handleRemoveButtonClick(e) {
	// restyle modal
	$("#confirm-modal .modal-title").text("Remove Combatant");
	$("#confirm-modal-remove-combatant-ok-button").removeClass("d-none");
	$("#confirm-modal-new-round-ok-button").addClass("d-none");
	// mark which row is being removed
	$("#confirm-modal").data("row", $(".combatant-row").index($(e.target).parents(".combatant-row"))); // here it's okay to use .data() b/c HTML/CSS does not care about this value
}
/*
 *	Main functions
 */
// add new combatant 
function addCombatant(e) {
	//	e.preventDefault();
	// validate form
	if (!validateCombatant()) {
		return false;
	}
	// roll for initiative if necessary
	let ini = $("#combatant-modal-ini").val().trim();
	ini = (ini != "") ? ini : rollForInitiative($("#combatant-modal-dice").val(), $("#combatant-modal-rea").val());
	// construct jQuery object for table row
	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(".combatant-name").text($("#combatant-modal-name").val().trim());
	$tr.find(".combatant-dice").attr("data-combatant-dice", $("#combatant-modal-dice").val().trim());
	$tr.find(".combatant-rea").attr("data-combatant-rea", $("#combatant-modal-rea").val().trim());
	//TODO: retrieve initial damage levels 
	// add handler to table cells (click to edit)
	$tr.find(".combatant-name, .combatant-ini, .combatant-dice-and-rea").on("click", handleEditButtonClick);
	// add handlers to action buttons 
	$tr.find("button.edit-button").on("click", handleEditButtonClick);
	$tr.find("button.act-button").on("click", handleActButtonClick);
	$tr.find("button.damage-button").on("click", handleDamageButtonClick);
	$tr.find("button.remove-button").on("click", handleRemoveButtonClick);
	// add handler to damage monitor
	$tr.find(".damage-stun, .damage-physical").on("click", applyDamage);
	// add row to table and sort
	$("#combatants-table").append($tr);
	sortTable();
}
// event handler for when any damage monitor is clicked
function applyDamage(e) {
	let $btn = $(e.target).is("button") ? $(e.target) : $(e.target).parent();
	// retrieve new damage level and type from button position and "damage-[type]" class
	let damageLevel = $btn.parent().parent().index();
	if ( $btn.hasClass("active") ) {
		damageLevel += 1;
	}
	let damageType = $btn.attr("class").split(" ").filter(function (cls) {
		return cls.substr(0, 7) == "damage-" ? cls : false;
	}).toString().substr(7);
	// add damage level to table row as as data attribute
	$btn.parents("tr.combatant-row").attr("data-damage-" + damageType, damageLevel);
	// select/unselect damage buttons above/below
	$btn.toggleClass("active");
	$btn.parent().parent().prevAll().find("button.damage-" + damageType).removeClass("active");
	$btn.parent().parent().nextAll().find("button.damage-" + damageType + ":not(.active)").addClass("active");
	// resort
/*	setTimeout(function(){
		sortTable();
	},250);*/
	sortTable();
}
// edit combatant
function editCombatant(e) {
	//	e.preventDefault();
	// validate form
	if (!validateCombatant()) {
		return false;
	}
	// get values
	let name = $("#combatant-modal-name").val().trim();
	let ini = $("#combatant-modal-ini").val().trim();
	let dice = $("#combatant-modal-dice").val().trim();
	let rea = $("#combatant-modal-rea").val().trim();
	// roll for initiative if ini is empty
	ini = (ini != "") ? ini : rollForInitiative(dice, rea);
	// get correct row
	let index = parseInt($("#combatant-modal").data("row"));
	$tr = $("tr.combatant-row").eq(index);
	// set new values
	$tr.attr("data-true-ini", ini);
	$tr.find(".combatant-name").text(name);
	$tr.find(".combatant-dice").attr("data-combatant-dice", dice);
	$tr.find(".combatant-rea").attr("data-combatant-rea", rea);
	// sort table
	sortTable();
	// clean up
	$("#combatant-modal").data("row", "");
}
// remove combatant
function removeCombatant(e) {
	e.preventDefault();
	// remove correct row
	let index = parseInt($("#confirm-modal").data("row"));
	$(".combatant-row").eq(index).remove();
	sortTable();
	// clean up
	$("#confirm-modal").data("row", "");
}
// start a new combat round
function startNewRound(e) {
	e.preventDefault();
	// are there rows at all?
	if ($(".combatant-row").length == 0) {
		return;
	}
	// reset ini values 
	$(".combatant-row").each(function () {
		if ($(this).find(".combatant-dice").attr("data-combatant-dice") == "") {
			$(this).attr("data-true-ini", 1);
		} else {
			$(this).attr("data-true-ini", rollForInitiative(parseInt($(this).find(".combatant-dice").attr("data-combatant-dice")), parseInt($(this).find(".combatant-rea").attr("data-combatant-rea"))));
		}
	});
	// resort table
	sortTable();
}
// add contextual classes and sort combatants by ini value
function sortTable() {
	// do some clean up: remove previous classes from rows, disable act buttons, remove effective ini and damage badges
	$(".combatant-row").removeClass("ko-or-dead max-ini zero-ini"); //REGULAR_INI 
	$(".combatant-row").find(".act-button").prop("disabled", true).attr("aria-disabled", "true");
	$(".combatant-ini").empty();
	// mark KO or death with class
	$(".combatant-row").each(function () {
		if (parseInt($(this).attr("data-damage-stun")) == 10 || parseInt($(this).attr("data-damage-physical")) == 10) {
			$(this).addClass("ko-or-dead");
		}
	});
	// compute highest effective ini
	let iniMax = Math.max.apply(null, $.map($(".combatant-row"), function (tr, i) {
		// write current effective ini to table row
		$(tr).find(".combatant-ini").text($(tr).hasClass("ko-or-dead") ? 0 : getEffectiveIni($(tr)));
		return $(tr).find(".combatant-ini").text();
	}));
	// add damage badges and contextual classes
	$(".combatant-row").each(function () {
		// damage badges
		if ($(this).attr("data-damage-stun") && $(this).attr("data-damage-stun") != "0") {
			$(this).find(".combatant-ini").append($.parseHTML(STUN_BADGE_HTML));
			$(this).find(".stun-badge").append(DAMAGE_NIVEAU[DAMAGE_PENALTY[$(this).attr("data-damage-stun")]]);
		}
		if ($(this).attr("data-damage-physical") && $(this).attr("data-damage-physical") != "0") {
			$(this).find(".combatant-ini").append($.parseHTML(PHYSICAL_BADGE_HTML));
			$(this).find(".physical-badge").append(DAMAGE_NIVEAU[DAMAGE_PENALTY[$(this).attr("data-damage-physical")]]);
		}
		// K.O./dead -> don't add anything
		if ($(this).hasClass("ko-or-dead")) {
			return true;
		}
		// ini = zero
		if (parseInt($(this).find(".combatant-ini").text()) == 0) {
			$(this).addClass("zero-ini");
			return true;
		}
		// ini = max and non-zero 
		if (parseInt($(this).find(".combatant-ini").text()) == iniMax && iniMax > 0) {
			$(this).addClass("max-ini").find(".act-button").prop("disabled", false).removeAttr("aria-disabled");
			return true;
		}
/*		// everything else
		$(this).addClass("REGULAR_INI");*/
	})
	// sort rows and append them in new order
	let $rows = $(".combatant-row").toArray().sort(whoGoesFirst);
	for (let i = 0; i < $rows.length; i++) {
		$("#combatants-table").append($rows[i]);
		$($rows[i]).css("z-index", 50-i).css("position", "relative"); 
	}
	return;
}
// validate a combatant row form by checking for all conditions, including regular HTML5 validation
function validateCombatant() {
	// get input elements
	let inputElements = {
		name: $("#combatant-modal-name").get(0),
		ini: $("#combatant-modal-ini").get(0),
		dice: $("#combatant-modal-dice").get(0),
		rea: $("#combatant-modal-rea").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;
}
/*
 *	Initialize document
 */
$(document).ready(function () {
	// add event handlers to navbar buttons
	$("#add-combatant-button").on("click", handleAddButtonClick);
	$("#new-round-button").on("click", handleNewRoundButton);
	// add event handlers to modal buttons
	$("#combatant-modal-add-ok-button").on("click", addCombatant);
	$("#combatant-modal-edit-ok-button").on("click", editCombatant);
	$("#confirm-modal-new-round-ok-button").on("click", startNewRound);
	$("#confirm-modal-remove-combatant-ok-button").on("click", removeCombatant);
	// always focus name input field when combatant modal appears
	$('#combatant-modal').on('shown.bs.modal', function () {
		$('#combatant-modal-name').focus();
	});
	// always empty input fields when combatant modal disappears
	$("#combatant-modal").on('hidden.bs.modal', function (e) {
		$("#combatant-modal input[id*='combatant-modal']").val("");
	});
	// Hide damage monitors after click somewhere else
	$("html").on("click", function (e) {
		if ($(e.target).parents(".damage-monitor").length == 0) {
			$(".damage-monitor:visible").addClass("d-none");
		}
	});
	addTestCombatant();
});