diff --git a/TODO.md b/TODO.md
index a4d2abf..b8f120e 100644
--- a/TODO.md
+++ b/TODO.md
@@ -2,4 +2,3 @@
- only validate and decorate purpose field when value.length > 0
- only validate and decorate bic field when value.length > 0
-- always format amount as #.##
diff --git a/index.html.pre b/index.html.pre
index f90586b..978bb92 100644
--- a/index.html.pre
+++ b/index.html.pre
@@ -126,7 +126,7 @@
-
+
€
diff --git a/js/index.js b/js/index.js
index f2b7537..6db75d6 100644
--- a/js/index.js
+++ b/js/index.js
@@ -95,24 +95,29 @@ const validateName = (target) => {
}
const validateBic = (target) => {
- if (target.value.length == 0) return
- const re = /^[a-z]{6}[2-9a-z][0-9a-np-z]([a-z0-9]{3}|x{3})?$/i;
-
- if (re.test(target.value)) {
- target.classList.remove("is-danger")
- document.querySelector("#bic div span").innerHTML = "✅";
- if (document.querySelector("#bic p")) {
- document.querySelector("#bic p").remove();
+ if (target.value.length > 0) {
+ const re = /^[a-z]{6}[2-9a-z][0-9a-np-z]([a-z0-9]{3}|x{3})?$/i;
+ if (re.test(target.value)) {
+ target.classList.remove("is-danger")
+ document.querySelector("#bic div span").innerHTML = "✅";
+ if (document.querySelector("#bic p")) {
+ document.querySelector("#bic p").remove();
+ }
+ } else {
+ target.classList.add("is-danger")
+ document.querySelector("#bic div span").innerHTML = "❌";
+ if (!document.querySelector("#bic p")) {
+ const help = document.createElement("p");
+ help.classList.add("help", "is-danger");
+ help.textContent = "BIC is invalid";
+ document.querySelector("#bic").appendChild(help);
+ }
}
} else {
- target.classList.add("is-danger")
- document.querySelector("#bic div span").innerHTML = "❌";
-
- if (!document.querySelector("#bic p")) {
- const help = document.createElement("p");
- help.classList.add("help", "is-danger");
- help.textContent = "BIC is invalid";
- document.querySelector("#bic").appendChild(help);
+ target.classList.remove("is-danger");
+ document.querySelector("#bic div span").innerHTML = "";
+ if (document.querySelector("#bic p")) {
+ document.querySelector("#bic p").remove();
}
}
}
@@ -153,36 +158,49 @@ const validateIban = (target) => {
}
const validateAmount = (target) => {
- if (target.value == 0) return
- if (parseFloat(target.value) > 0 && target.value.toString() === parseFloat(target.value).toFixed(2).toString()) {
- target.value = parseFloat(target.value).toFixed(2);
- target.classList.remove("is-danger")
- document.querySelector("#amount div span.is-right").innerHTML = "✅";
+ console.log(`${target.value} = ${parseFloat(target.value.replace(",", ".")).toFixed(2)}`);
+ if (target.value.length > 0) {
+ const val = parseFloat(target.value.replace(",", "."))
+ if (val.toFixed(2) == val && val >= 0) {
+ target.classList.remove("is-danger");
+ document.querySelector("#amount div span.is-right").innerHTML = "✅";
+ } else {
+ target.classList.add("is-danger");
+ document.querySelector("#amount div span.is-right").innerHTML = "❌";
+ }
} else {
- target.classList.add("is-danger")
- document.querySelector("#amount div span.is-right").innerHTML = "❌";
+ target.classList.remove("is-danger");
+ document.querySelector("#amount div span.is-right").innerHTML = "";
+ if (document.querySelector("#amount p")) {
+ document.querySelector("#amount p").remove();
+ }
}
}
const validatePurpose = (target) => {
- if (target.value.length == 0) return
- const re = /[a-zA-Z0-9\/?:().,'+\- ]{1,140}/i;
-
- if (re.test(target.value)) {
- target.classList.remove("is-danger")
- document.querySelector("#purpose div span").innerHTML = "✅";
- if (document.querySelector("#purpose p")) {
- document.querySelector("#purpose p").remove();
+ if (target.value.length > 0) {
+ const re = /[a-z0-9\/?:().,'+\- ]{1,140}/i;
+ if (re.test(target.value)) {
+ target.classList.remove("is-danger")
+ document.querySelector("#purpose div span").innerHTML = "✅";
+ if (document.querySelector("#purpose p")) {
+ document.querySelector("#purpose p").remove();
+ }
+ } else {
+ target.classList.add("is-danger")
+ document.querySelector("#purpose div span").innerHTML = "❌";
+ if (!document.querySelector("#purpose p")) {
+ const help = document.createElement("p");
+ help.classList.add("help", "is-danger");
+ help.textContent = "Purpose can only have 140 characters and only include A-Z, a-z, 0-9, /?:().,'+- and spaces.";
+ document.querySelector("#purpose").appendChild(help);
+ }
}
} else {
- target.classList.add("is-danger")
- document.querySelector("#purpose div span").innerHTML = "❌";
-
- if (!document.querySelector("#purpose p")) {
- const help = document.createElement("p");
- help.classList.add("help", "is-danger");
- help.textContent = "Purpose can only have 140 characters and only include A-Z, a-z, 0-9, /?:().,'+- and spaces.";
- document.querySelector("#purpose").appendChild(help);
+ target.classList.remove("is-danger");
+ document.querySelector("#purpose div span.is-right").innerHTML = "";
+ if (document.querySelector("#purpose p")) {
+ document.querySelector("#purpose p").remove();
}
}
}
@@ -203,6 +221,12 @@ document.querySelector("#bic input").addEventListener("input", (event) => {
});
document.querySelector("#amount input").addEventListener("input", (event) => {
+ // Remove invalid characters
+ //event.target.value = event.target.value.replace(/[^0-9.]/g, '');
+ if (event.target.value.length > 0 && !isNaN(parseFloat(event.target.value))) {
+ event.target.value = parseFloat(event.target.value).toFixed(2);
+ }
+
validateAmount(event.target);
regenerate();
});