From 08e4eafaea1b9f53f76c1e1aa05f06d70dcf533b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20G=C3=B3rny?= <zrchos@gmail.com>
Date: Mon, 1 Aug 2022 22:53:21 +0200
Subject: [PATCH] Fix validation

---
 .eslintrc.json |  1 +
 src/display.ts | 35 +++++++++++++++++++----------------
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index 9541ec9..4ef314b 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -38,6 +38,7 @@
 			],
 			"rules": {
 				"indent": "off",
+				"max-len": [2, 120],
 				"@typescript-eslint/indent": ["error", "tab"],
 				"@typescript-eslint/explicit-function-return-type": "off",
 				"@typescript-eslint/no-non-null-assertion": "off"
diff --git a/src/display.ts b/src/display.ts
index 38d9dfb..720319e 100644
--- a/src/display.ts
+++ b/src/display.ts
@@ -120,40 +120,43 @@ const displayConstituencyResults = () => {
 	});
 };
 
-const validate = (inputs: NodeListOf<HTMLInputElement>, support: number[]) => {
-	const supportSum = support.reduce((a, b) => a + b, 0);
-	if (supportSum > 100) {
-		inputs.forEach((input) => input.setCustomValidity('Suma poparcia nie może przekraczać 100%'));
-		return false;
-	}
-	if (supportSum <= 0) {
-		inputs.forEach((input) => input.setCustomValidity('Suma poparcia musi być wyższa niż 0%'));
-		return false;
-	}
+const validate = (form: HTMLFormElement, inputs: NodeListOf<HTMLInputElement>, support: number[]) => {
 	inputs.forEach((input) => input.setCustomValidity(''));
 
-	return document.querySelector<HTMLFormElement>('#support-form')!.checkValidity();
+	support.some((inputValue, index) => {
+		if (inputValue < 0) {
+			inputs[index].setCustomValidity('Poparcie nie może byc mniejsze od 0%');
+			return true;
+		}
+		return false;
+	});
+
+	const supportSum = support.reduce((a, b) => a + b, 0);
+	if (supportSum > 100) {
+		inputs[0].setCustomValidity('Suma poparcia nie może przekraczać 100%');
+	} else if (supportSum <= 0) {
+		inputs[0].setCustomValidity('Suma poparcia musi być wyższa niż 0%');
+	}
+
+	return form.reportValidity();
 };
 
 export const calculate = (): void => {
+	const form = document.querySelector<HTMLFormElement>('#support-form')!;
 	const inputs = document.querySelectorAll<HTMLInputElement>('#support-form input');
 	const support = Array
 		.from(inputs)
 		.map((input) => parseFloat(input.value))
 		.map((value) => (Number.isNaN(value) ? 0 : value));
 
-	if (!validate(inputs, support)) return;
+	if (!validate(form, inputs, support)) return;
 
 	const mandates = calculateMandates(support);
 
 	displayResults(mandates);
-
 	displayUrl(support);
-
 	barChart = displayBarChart(support);
-
 	pieChart = displayPieChart(mandates);
-
 	displayConstituencyResults();
 
 	inputs.forEach((input) => input.addEventListener('input', () => {