Multiple updates

.gitignore

@@ -10,3 +10,10 @@ demo/log4j2.xml
 demo/README.md
 demo/server.yaml
 .vscode/settings.json
+test-server/logs
+test-server/cms.pid
+test-server/modules
+test-server/hosts/demo/modules_data/
+test-server/hosts/demo/temp/
+test-server/hosts/demo/data/
+.DS_Store

demo/hosts/demo/assets/form-1.js

@@ -10,56 +10,11 @@ const generateString = (length) => {
     return result;
 }
 
-const validateCaptcha = async (event) => {
-    event.preventDefault();
-    let request = {
-        code: document.getElementById("inputCaptcha").value,
-        key: document.getElementById("captchaKey").value
-    }
-
-    const response = await fetch('/module/forms-module/captcha/validate', {
-        method: 'POST',
-        body: JSON.stringify(request)
-    })
-
-    const validationResponse = await response.json()
-
-    if (!validationResponse.valid) {
-        alert("captcha code is not valid")
-        event.preventDefault()
-        return false
-    } else {
-        console.log(event.target)
-        event.target.submit()
-        return true
-    }
-}
-
-const ajaxValidateCaptcha = async () => {
-    let request = {
-        code: document.getElementById("inputCaptcha").value,
-        key: document.getElementById("captchaKey").value
-    }
-
-    const response = await fetch('/module/forms-module/captcha/validate', {
-        method: 'POST',
-        body: JSON.stringify(request)
-    })
-
-    const validationResponse = await response.json()
-
-    if (!validationResponse.valid) {
-        return false
-    } else {
-        return true
-    }
-}
-
 document.addEventListener("DOMContentLoaded", () => {
     if (document.getElementById("reloadCaptcha")) {
         document.getElementById("reloadCaptcha").addEventListener("click", () => {
             let href = new URL(document.getElementById("captchaImg").src)
-            let key = generateString(8)
+            let key = crypto.randomUUID().replaceAll('-', '') + crypto.randomUUID().replaceAll('-', '')
             href.searchParams.set('key', key)
 
             document.getElementById("captchaKey").value = key
@@ -70,36 +25,20 @@ document.addEventListener("DOMContentLoaded", () => {
     if (document.getElementById("ajaxForm")) {
             document.getElementById("ajaxForm").addEventListener("submit", (event) => {
                 event.preventDefault()
-                console.log("send form via ajax")
-                if (!ajaxValidateCaptcha()) {
-                    alert("invalid captcha provided");
-                    return false
-                }
                 var form = event.target;
-                var formData = new FormData(form);
+                var formData = new URLSearchParams(new FormData(form));
                 fetch(form.action, {
                     method: "post",
+                    headers: {"Content-Type": "application/x-www-form-urlencoded"},
                     body: formData
-                }).then(res => res.json()).then(console.log);
+                }).then(res => res.json()).then(result => {
+                    if (!result.success) {
+                        alert(result.code || "The form could not be submitted")
+                    }
+                });
 
                 return false
             })
-        document.getElementById("submit-btn-test").addEventListener("click", (event) => {
-            event.preventDefault()
-
-            if (ajaxValidateCaptcha()) {
-                alert("invalid captcha provided");
-                return false
-            }
-
-            var form = document.getElementById("ajaxForm")
-            var formData = new FormData(form);
-            fetch(form.action, {
-                method: "post",
-                body: formData
-            }).then(res => res.json()).then(console.log);
-            return false;
-        })
     }
 
 })

demo/hosts/demo/config/forms.yaml

@@ -8,12 +8,36 @@ forms:
   - name: contact
     to: contact@example.com
     subject: Ich suche Kontakt!
-    fields: [message]
+    fields:
+      from:
+        type: email
+        required: true
+      message:
+        required: true
+        minLength: 10
+        maxLength: 5000
+    mail:
+      account: default
+      from: forms@example.com
+    spam:
+      honeypot:
+        enabled: true
+        field: website
     redirects:
       success: /forms/contact/success
   - name: test-form
-    fields: [message]
+    fields:
+      from:
+        type: email
+        required: true
+      message:
+        required: true
+        minLength: 3
+    spam:
+      honeypot:
+        enabled: true
+        field: website
     redirects:
       success: /forms/contact/success
 redirects:
-  error: /forms/error
+  error: /forms/error

demo/hosts/demo/templates/ajax.html

@@ -17,11 +17,12 @@
 		<h3>Test Formular</h3>
 		<form class="row g-3" method="post" 
 			action="/module/forms-module/form/submit/ajax" 
-			enctype="multipart/form-data"
+			enctype="application/x-www-form-urlencoded"
 			onsubmit="return false;"
 			id="ajaxForm"
 			>
 			<input type="hidden" name="form" value="test-form" >
+			<input class="visually-hidden" type="text" name="website" tabindex="-1" autocomplete="off" aria-hidden="true" />
 			<div class="col-md-12">
 				<label for="inputEmail4" class="form-label">Your mail</label>
 				<input type="email" name="from" class="form-control" id="inputEmail4" />
@@ -31,7 +32,7 @@ <h3>Test Formular</h3>
 				<textarea type="text" class="form-control" name="message" id="inputMessage" ></textarea>
 			</div>
 			<div class="col-3">
-				<img id="captchaImg" th:src="@{~/module/forms-module/captcha/generate(width=200,height=50,key=${captchaKey})}" />
+				<img id="captchaImg" th:src="@{~/module/forms-module/captcha/generate(width=200,height=50,key=${captchaKey},form='test-form')}" />
 				<input type="hidden" id="captchaKey" name="key" th:value="${captchaKey}" >
 				<span class="reload" id="reloadCaptcha">reload</span>
 			</div>
@@ -49,4 +50,4 @@ <h3>Test Formular</h3>
 </body>
 
 
-</html>
+</html>

demo/hosts/demo/templates/contact.html

@@ -13,14 +13,14 @@
 		<div class="container" th:utext="${content}"></div>
 	</div>
 
-	<div class="container" th:with="captchaKey=${forms.captcha.generateKey()}"></div>
+	<div class="container" th:with="captchaKey=${forms.captcha.generateKey()}">
 		<h3>Contact form</h3>
 		<form class="row g-3" method="post" 
 			action="/module/forms-module/form/submit" 
-			enctype="multipart/form-data"
-			onsubmit="return validateCaptcha(event)"
+			enctype="application/x-www-form-urlencoded"
 			>
 			<input type="hidden" name="form" value="contact" >
+			<input class="visually-hidden" type="text" name="website" tabindex="-1" autocomplete="off" aria-hidden="true" />
 			<div class="col-md-12">
 				<label for="inputEmail4" class="form-label">Your mail</label>
 				<input type="email" name="from" class="form-control" id="inputEmail4" />
@@ -30,7 +30,7 @@ <h3>Contact form</h3>
 				<textarea type="text" class="form-control" name="message" id="inputMessage" ></textarea>
 			</div>
 			<div class="col-3">
-				<img id="captchaImg" th:src="@{~/module/forms-module/captcha/generate(width=200,height=50,key=${captchaKey})}" />
+				<img id="captchaImg" th:src="@{~/module/forms-module/captcha/generate(width=200,height=50,key=${captchaKey},form='contact')}" />
 				<input type="hidden" id="captchaKey" name="key" th:value="${captchaKey}" >
 				<span class="reload" id="reloadCaptcha">reload</span>
 			</div>
@@ -47,4 +47,4 @@ <h3>Contact form</h3>
 </body>
 
 
-</html>
+</html>

demo/hosts/demo/templates/page.html

@@ -17,10 +17,10 @@
 		<h3>Test Formular</h3>
 		<form class="row g-3" method="post" 
 			action="/module/forms-module/form/submit" 
-			enctype="multipart/form-data"
-			onsubmit="return validateCaptcha(event)"
+			enctype="application/x-www-form-urlencoded"
 			>
 			<input type="hidden" name="form" value="test-form" >
+			<input class="visually-hidden" type="text" name="website" tabindex="-1" autocomplete="off" aria-hidden="true" />
 			<div class="col-md-12">
 				<label for="inputEmail4" class="form-label">Your mail</label>
 				<input type="email" name="from" class="form-control" id="inputEmail4" />
@@ -30,7 +30,7 @@ <h3>Test Formular</h3>
 				<textarea type="text" class="form-control" name="message" id="inputMessage" ></textarea>
 			</div>
 			<div class="col-3">
-				<img id="captchaImg" th:src="@{~/module/forms-module/captcha/generate(width=200,height=50,key=${captchaKey})}" />
+				<img id="captchaImg" th:src="@{~/module/forms-module/captcha/generate(width=200,height=50,key=${captchaKey},form='test-form')}" />
 				<input type="hidden" id="captchaKey" name="key" th:value="${captchaKey}" >
 				<span class="reload" id="reloadCaptcha">reload</span>
 			</div>
@@ -48,4 +48,4 @@ <h3>Test Formular</h3>
 </body>
 
 
-</html>
+</html>