diff --git a/README.md b/README.md
index 4d5e760..4445041 100644
--- a/README.md
+++ b/README.md
@@ -1,10 +1,10 @@
# BezahlBrudi
-In an effort to reduce the usage of Paypal, I created this simple web app. It can generate GiroCodes that can be used to easily transfer money between friends by showing a QR code that can be scanned by most banking apps. It will import all neccessary infos for a normal SEPA bank transfer. No third parties involved, only the banks of the friends who want to exchange money.
+In an effort to reduce the usage of Paypal, I created this simple web app. It can generate GiroCodes that can be used to easily transfer money between friends by showing a QR code that can be scanned by most banking apps. It will import all necessary infos for a normal SEPA bank transfer. No third parties involved, only the banks of the friends who want to exchange money.
# How to use
-Simple visit the webpage, and put in the details. The QR code will be generated automatically. You can choose to save your details in a cookie, so you don't have to input your bank details everytime. The cookie will be store on your device.
+Simple visit the webpage, and put in the details. The QR code will be generated automatically. You can choose to save your details in a cookie, so you don't have to input your bank details every time.
# Data privacy
diff --git a/index.html b/index.html
index 03306ab..c6d0fe7 100644
--- a/index.html
+++ b/index.html
@@ -6,6 +6,19 @@
BezahlBrudi
+
@@ -49,10 +62,9 @@
-
+
- €
-
+ €
diff --git a/js/index.js b/js/index.js
index 460e04b..f4b7eec 100644
--- a/js/index.js
+++ b/js/index.js
@@ -17,21 +17,7 @@ getCookie = (key) => {
setCookie = () => {
const d = new Date();
d.setTime(d.getTime() + (180*24*60*60*1000)); // 180 days
- document.cookie = `name=${document.querySelector("#name input").value};iban=${document.querySelector("#iban input").value};bic=${document.querySelector("#bic input").value};expires=${d.toUTCString()};path=/`;
-}
-
-// Fill in form from cookie
-const cookieName = getCookie("name");
-if (cookieName !== "") {
- document.querySelector("#name input").value = cookieName;
-}
-const cookieIban = getCookie("iban");
-if (cookieIban !== "") {
- document.querySelector("#iban input").value = cookieIban;
-}
-const cookieBic = getCookie("bic");
-if (cookieBic !== "") {
- document.querySelector("#bic input").value = cookieBic;
+ document.cookie = `name=${document.querySelector("#name input").value};iban=${document.querySelector("#iban input").value};bic=${document.querySelector("#bic input").value};expires=${d.toUTCString()};path=/;SameSite=Strict;Secure`;
}
// Field data checks
@@ -108,7 +94,9 @@ validateIban = (target) => {
}
validatePurpose = (target) => {
- if (target.value.length > 0 && target.value.length <= 140) {
+ 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")) {
@@ -123,7 +111,7 @@ validatePurpose = (target) => {
if (!document.querySelector("#purpose p")) {
const help = document.createElement("p");
help.classList.add("help", "is-danger");
- help.textContent = "Purpose can only have 140 characters.";
+ help.textContent = "Purpose can only have 140 characters and only include A-Z, a-z, 0-9, /?:().,'+- and spaces.";
document.querySelector("#purpose").appendChild(help);
}
}
@@ -189,9 +177,24 @@ ${document.querySelector("#purpose input").value}
}
}
-// generate qr code on first visit
+// Fill in form from cookie
+const cookieName = getCookie("name");
+if (cookieName !== "") {
+ document.querySelector("#name input").value = cookieName;
+}
+const cookieIban = getCookie("iban");
+if (cookieIban !== "") {
+ document.querySelector("#iban input").value = cookieIban;
+}
+const cookieBic = getCookie("bic");
+if (cookieBic !== "") {
+ document.querySelector("#bic input").value = cookieBic;
+}
+
validateName(document.querySelector("#name input"));
validateIban(document.querySelector("#iban input"));
validateBic(document.querySelector("#bic input"));
validatePurpose(document.querySelector("#purpose input"));
+
+// generate qr code on first visit
regenerate();