diff --git a/assets/js/contact_form.js b/assets/js/contact_form.js index 1d8bf657..43681f61 100644 --- a/assets/js/contact_form.js +++ b/assets/js/contact_form.js @@ -1,29 +1,45 @@ -const ajaxUrl = '../php/contact_form.php'; -const contact_form = document.getElementsByClassName('content__contact_form')[0]; -const subject = document.getElementsByClassName('contact_form__subject')[0]; -const message = document.getElementsByClassName('contact_form__message')[0]; -const name = document.getElementsByClassName('contact_form__name')[0]; -const email = document.getElementsByClassName('contact_form__email')[0]; -const captcha = document.getElementsByClassName('contact_form__captcha')[0]; -const now = (new Date().getTime()/1000).toFixed(); -const feedback = document.getElementsByClassName('contact_form__feedback')[0]; +const contactFormAjaxUrl = '/php/contact_form.php'; -window.addEventListener('DOMContentLoaded', function(event) { +window.addEventListener('DOMContentLoaded', function() { + const contact_form = document.getElementsByClassName('content__contact_form')[0]; + if (contact_form) { + contact_form.addEventListener('submit', wtf_submitContactForm, false); + wtf_startContactFormSession(); + } +}); + +function wtf_startContactFormSession() { let formData = new FormData(); formData.append('action', 'start_session'); - fetch(ajaxUrl, { + fetch(contactFormAjaxUrl, { method: 'POST', mode: 'same-origin', body: formData, }) - .then(response => response.json()) + .then(response => { + if (!response.ok) { + throw new Error('Response was not OK'); + } + + return response.json(); + }) .then(json => { console.log(json); }) -}); + .catch(error => { + console.error('Could not start the session:', error); + }); +} -contact_form.addEventListener('submit', function(event) { +function wtf_submitContactForm(event) { event.preventDefault(); + + const subject = document.getElementsByClassName('contact_form__subject')[0]; + const message = document.getElementsByClassName('contact_form__message')[0]; + const name = document.getElementsByClassName('contact_form__name')[0]; + const email = document.getElementsByClassName('contact_form__email')[0]; + const captcha = document.getElementsByClassName('contact_form__captcha')[0]; + let formData = new FormData(); formData.append('action', 'handle_form'); formData.append('subject', subject.value); @@ -39,13 +55,14 @@ contact_form.addEventListener('submit', function(event) { return; } - fetch(ajaxUrl, { + fetch(contactFormAjaxUrl, { method: 'POST', mode: 'same-origin', body: formData, }) .then(response => response.json()) .then(json => { + const feedback = document.getElementsByClassName('contact_form__feedback')[0]; console.log(json); if (json.errors) { feedback.classList.remove('--success'); @@ -75,4 +92,4 @@ contact_form.addEventListener('submit', function(event) { } }) .catch(error => console.log(error)); -}, false); +} diff --git a/assets/js/contact_form_toggle.js b/assets/js/contact_form_toggle.js index b2dce0c2..00ca58c5 100644 --- a/assets/js/contact_form_toggle.js +++ b/assets/js/contact_form_toggle.js @@ -1,5 +1,7 @@ /* Unhide contact form if JS is enabled */ window.addEventListener('DOMContentLoaded', (event) => { const contact_form_wrapper = document.getElementsByClassName('content__contact_form_wrapper')[0]; - contact_form_wrapper.style.setProperty('display', 'block'); + if (contact_form_wrapper) { + contact_form_wrapper.style.setProperty('display', 'block'); + } }); diff --git a/assets/php/contact_form.php b/assets/php/contact_form.php index d0c8e33c..d6b93a66 100644 --- a/assets/php/contact_form.php +++ b/assets/php/contact_form.php @@ -6,17 +6,16 @@ function sanitize_text(string $name, string $type) { 'text' => FILTER_SANITIZE_SPECIAL_CHARS, 'email' => FILTER_SANITIZE_EMAIL, ); - $text = trim($text); - $text = filter_var($_POST[$name], $filters[$type]); + $text = filter_var(trim($_POST[$name]), $filters[$type]); $text = stripslashes($text); return $text; } -function prepare_message_body($message) { +function prepare_message_body(string $message, string $name) { // Replace HTML-Entities with actual carriage returns and line feeds $message = str_replace(" ", "\r", $message); - $message = str_replace(" ", "\r", $message); + $message = str_replace(" ", "\n", $message); // Ensure line breaks via carriage return + line feed $message = str_replace("\r\n", "\n", $message); @@ -34,22 +33,30 @@ function prepare_message_body($message) { * mail(): Braucht auf dem Server einen korrekt konfigurierten Mailserver * phpmailer: Bibliothek, der per Composer installiert wird. Tut ganz gut mit SMTP. */ -function send_message_to_office($subject, $message, $name, $email) { +function send_message_to_office(string $subject, string $message, string $name, string $email) { + $returnPath = filter_var(getenv('WTF_RETURN_PATH'), FILTER_VALIDATE_EMAIL); + $to = filter_var(getenv('WTF_CONTACT_TO'), FILTER_VALIDATE_EMAIL); + + if (!$returnPath || !$to) { + error_log('Address for "To" or "Return-Path" is invalid'); + return false; + } + return mail( - getenv('WTF_CONTACT_TO'), + $to, "=?UTF-8?B?" . base64_encode($subject) . "?=", - prepare_message_body($message), - $additional_headers = array( + prepare_message_body($message, $name), + array( "From" => getenv('WTF_CONTACT_FROM'), "Reply-To" => $email, - "Return-Path" => getenv('WTF_RETURN_PATH'), "Content-Type" => "text/plain; charset=utf-8", "Content-Transfer-Encoding" => "base64", ), + "-f $returnPath" ); } -function send_response($response_data) { +function send_response(array $response_data) { $json = json_encode($response_data); if ($json === false) { // Avoid echo of empty string (which is invalid JSON), and diff --git a/templates/layout.html b/templates/layout.html index 79dd07cd..7a890eab 100644 --- a/templates/layout.html +++ b/templates/layout.html @@ -63,7 +63,7 @@ __ ____________________ {% if 'manifest.json'|asseturl is defined -%} {%- endif %} - {% if '/js/contact_form_toggle.js'|asseturl is defined -%} + {% if '/js/contact_form_toggle.js'|asseturl is defined and this.title == 'Kontakt' -%} {%- endif %} @@ -131,7 +131,7 @@ __ ____________________ {%- if '/js/nav_toggle.js'|asseturl is defined -%} {%- endif %} - {% if '/js/contact_form_toggle.js'|asseturl is defined -%} + {% if '/js/contact_form_toggle.js'|asseturl is defined and this.title == 'Kontakt' -%} {%- endif %}