php dateien in php verzeichnis verschoben. message construct in eigene datei message.php verschoben.

This commit is contained in:
Andreas Hnida 2024-02-22 06:51:56 +00:00
commit 94e182a96e
11 changed files with 174 additions and 107 deletions

View file

@ -0,0 +1,34 @@
window.onload = function () {
document.getElementById('formular').addEventListener('submit', function (e) {
e.preventDefault(); // Verhindert die Standard-Formularsendung
const form = e.target;
const data = new FormData(form);
const notification = document.getElementById('notification');
const btn = document.getElementById('bestellformular-btn');
fetch(form.action, {
method: 'POST',
mode: 'cors',
body: data,
})
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
// Erfolgsnachricht anzeigen
notification.textContent = 'Nachricht erfolgreich gesendet!';
btn.className = 'submitbutton text-white mx-auto submit-after-valid-captchaaaa .fadeOut';
// notification.className = 'bg-green-500 text-white px-4 py-2 rounded block';
// setTimeout(() => notification.className = 'bg-green-500 text-white px-4 py-2 rounded hidden', 5000); // Benachrichtigung nach 5 Sekunden ausblenden
})
.catch((error) => {
// Fehlermeldung anzeigen
notification.textContent = 'Fehler beim Senden der Nachricht.';
console.log(error);
notification.className = 'bg-red-500 text-white px-4 py-2 rounded block';
// setTimeout(() => notification.className = 'bg-red-500 text-white px-4 py-2 rounded hidden', 5000); // Benachrichtigung nach 5 Sekunden ausblenden
});
});
};

30
assets/js/veruaslider.js Normal file
View file

@ -0,0 +1,30 @@
window.onload = function(){
setInterval(nextSlide, 5000);
}
let slideNumber = 0;
const prevSlide = () =>{
const slides = document.getElementsByClassName('slides');
const slider = document.getElementById("verua-slider");
const currentSlide = slider.getElementsByClassName('current');
currentSlide[0].classList.remove("current");
if(slideNumber == 0){
slideNumber = slides.length-1;
}
else{
slideNumber = slideNumber-1;
}
slides[slideNumber].classList.add("current");
}
const nextSlide = () =>{
const slides = document.getElementsByClassName('slides');
const slider = document.getElementById("verua-slider");
const currentSlide = slider.getElementsByClassName('current');
currentSlide[0].classList.remove("current");
if(slideNumber == (slides.length-1)){
slideNumber = 0;
}
else{
slideNumber = slideNumber+1;
}
slides[slideNumber].classList.add("current");
}

View file

@ -15,12 +15,15 @@ a {
text-decoration: none;
transition: 0.3s ease-in-out;
}
.nav-link.active, a.nav-dropdown-link.active {
color: #a9cd2e;
}
h1, h2, h3, h4, h5, h6 {
font-weight:normal;
margin-bottom: 16px;
}
h1, h2 {
h1, h2, .content h1, .content h2{
font-weight:bold;
}
h3 {
@ -151,17 +154,17 @@ table .far {
}
/* Formular */
#bestellformular {
#formular {
max-width: 64rem;
margin-left: auto;
margin-right: auto;
}
#bestellformular div {
#formular div {
margin-bottom: 1rem;
}
#bestellformular label {
#formular label {
display: block;
margin-bottom: 0.5rem;
font-size: 0.875rem;
@ -169,24 +172,24 @@ table .far {
color: #4B5563;
}
#bestellformular select,
#bestellformular input,
#bestellformular textarea {
#formular select,
#formular input,
#formular textarea {
width: 100%;
padding: 0.5rem 1rem;
border: 1px solid #D1D5DB;
border-radius: 0.375rem;
}
#bestellformular select:focus,
#bestellformular input:focus,
#bestellformular textarea:focus {
#formular select:focus,
#formular input:focus,
#formular textarea:focus {
outline: none;
border-color: #3B82F6;
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5);
}
#bestellformular button {
#formular button {
width:350px;
padding: 0.5rem 1rem;
margin-bottom:10px;
@ -197,15 +200,15 @@ table .far {
border-radius: 0.375rem;
}
#bestellformular .submitbutton{
#formular .submitbutton{
background-color: #a9cd2e;
align-self: center;
width:100%;
}
#bestellformular button:hover {
#formular button:hover {
background-color: #2563EB;
}
#bestellformular .submitbutton:hover{
#formular .submitbutton:hover{
background-color: #88a625;
}
.captcha-container {
@ -218,6 +221,13 @@ table .far {
margin-right: auto;
}
.fadeOut {
@apply transition-opacity duration-500 ease-in-out opacity-0 invisible;
}
.fadeIn {
@apply transition-opacity duration-500 ease-in-out opacity-100 visible;
}
/**************** Component Styles ******************/
// Icons

View file

@ -3,7 +3,7 @@ date = '2024-02-21T08:49:32Z'
draft = false
title = 'Freiberufliche'
+++
{{% veruaslider %}}
{{% veruaslider height="450px" %}}
{{% slide image="../bestellungen-header.jpg" first="true " %}}
{{% /veruaslider %}}
{{% section %}}
@ -19,64 +19,72 @@ title = 'Freiberufliche'
{{% /aligncenter %}}
<form action="https://verua.dev-1.andreashnida.de/ajaxmail.php" method="POST" id="bestellformular">
<form action="https://verua.dev-1.andreashnida.de/php/ajaxmail.php" method="POST" id="formular">
<div id="formPartOne">
<input type="hidden" name="formularart" value="Bestellformular Freiberufliche">
<div>
<label for="gender">Gender</label>
<select id="gender" name="gender" required>
<option value="frau">Frau</option>
<option value="mann">Mann</option>
<label for="gender">Geschlecht</label>
<select id="gender" name="gender" require >
<option value="weiblich">Frau</option>
<option value="männlich">Mann</option>
<option value="divers">Divers</option>
</select>
</div>
<div>
<label for="name">Name</label>
<input type="text" id="name" name="name" required>
<label for="sprache">Sprache</label>
<select id="sprache" name="sprache" require >
<option value="deutsch">Deutsch</option>
<option value="franzoesisch">Französisch</option>
</select>
</div>
<div>
<label for="name">Nachname</label>
<input type="text" id="name" name="name" require >
</div>
<div>
<label for="vorname">Vorname</label>
<input type="text" id="vorname" name="vorname" required>
<input type="text" id="vorname" name="vorname" require >
</div>
<div>
<label for="strasse">Strasse</label>
<input type="text" id="strasse" name="strasse" required>
<input type="text" id="strasse" name="strasse" require >
</div>
<div>
<label for="plz_ort">PLZ Ort</label>
<input type="text" id="plz_ort" name="plz_ort" required>
<input type="text" id="plz_ort" name="plz_ort" require >
</div>
<div>
<label for="telefon">Telefon</label>
<input type="text" id="telefon" name="telefon" required>
<input type="text" id="telefon" name="telefon" require >
</div>
<div>
<label for="email">Email</label>
<input type="email" id="email" name="email" required>
<input type="email" id="email" name="email" require >
</div>
<div>
<label for="message">Message</label>
<textarea id="message" name="message" rows="4" required></textarea>
<textarea id="message" name="message" rows="4" require ></textarea>
</div>
<div>
<label for="zsr_nummer">ZSR Nummer</label>
<input type="text" id="zsr_nummer" name="zsr_nummer" required>
<input type="text" id="zsr_nummer" name="zsr_nummer" require >
</div>
</div>
<div id="formPartTwo">
<div>
<label for="bestehend">Wünschen Sie einen neuer Server oder den Zugang zu einem bestehenden Team-Server?</label>
<select id="bestehend" name="bestehend" required>
<select id="bestehend" name="bestehend" require >
<option value="Applikation und Zugang zu bestehendem Team-Server">Applikation und Zugang zu bestehendem Team-Server (1'296 CHF)</option>
<option value="Applikation und neuer Webserver">Applikation und neuer Webserver (1'296 CHF)</option>
</select>
</div>
<div>
<label for="servername">Bitte geben Sie den Namen des Servers an. Der Zugriff erfolgt immer über die Web-Adresse: https://<strong>wunschname</strong>.verua.ch</label>
<input type="url" id="servername" name="servername" placeholder="https://wunschname.verua.ch" required>
<input type="url" id="servername" name="servername" placeholder="https://wunschname.verua.ch" require >
</div>
<div>
<label for="modulpop2">Wünschen Sie die Erweiterung um das Modul POP2?</label>
<select id="modulpop2" name="modulpop2" required>
<select id="modulpop2" name="modulpop2" require >
<option value="Nein, nur das Standard-Programm">Nein, nur das Standard-Programm</option>
<option value="Ja, ich bestelle das Zusatzmodul POP2 für 42.00 CHF jährlich, Bereitstellungskosten einmalig 438.00 CHF">Ja, ich bestelle das Zusatzmodul POP2 für 42.00 CHF jährlich, Bereitstellungskosten einmalig 438.00 CHF</option>
<option value="Ich bin mir noch nicht sicher.">Ich bin mir noch nicht sicher.</option>
@ -84,7 +92,7 @@ title = 'Freiberufliche'
</div>
<div>
<label for="materialverwaltung">Benötigen Sie das Zusatzmodul Materialverwaltung?</label>
<select id="materialverwaltung" name="materialverwaltung" required>
<select id="materialverwaltung" name="materialverwaltung" require >
<option value="Nein, nur das Standard-Programm">Nein, nur das Standard-Programm</option>
<option value="Ja, ich bestelle das Zusatzmodul Materialverwaltung für 138.00 CHF jährlich, Bereitstellungskosten einmalig 342.00 CHF">Ja, ich bestelle das Zusatzmodul Materialverwaltung für 138.00 CHF jährlich, Bereitstellungskosten einmalig 342.00 CHF</option>
<option value="Ich bin mir noch nicht sicher.">Ich bin mir noch nicht sicher.</option>
@ -92,7 +100,7 @@ title = 'Freiberufliche'
</div>
<div>
<label for="qrcode">Wünschen Sie die Erweiterung um das Modul QR-Code?</label>
<select id="qrcode" name="qrcode" required>
<select id="qrcode" name="qrcode" require >
<option value="Nein, nur das Standard-Programm">Nein, nur das Standard-Programm</option>
<option value="Ja, ich bestelle das Zusatzmodul Materialverwaltung für 138.00 CHF jährlich, Bereitstellungskosten einmalig 342.00 CHF">Ja, ich bestelle das Zusatzmodul Materialverwaltung für 138.00 CHF jährlich, Bereitstellungskosten einmalig 342.00 CHF</option>
<option value="Ich bin mir noch nicht sicher.">Ich bin mir noch nicht sicher.</option>
@ -100,47 +108,21 @@ title = 'Freiberufliche'
</div>
<div>
<label for="wochenbett">Benötigen Sie das Programm für Wochenbett-Betreuung?</label>
<select id="wochenbett" name="wochenbett" required>
<select id="wochenbett" name="wochenbett" require >
<option value="Nein">Nein</option>
<option value="Ja, ich möchte die Wochenbett-Version">Ja, ich möchte die Wochenbett-Version</option>
</select>
</div>
<div>
<label for="anmerkung">Anmerkung</label>
<textarea id="anmerkung" name="anmerkung" rows="4" required></textarea>
<textarea id="anmerkung" name="anmerkung" rows="4" require ></textarea>
</div>
</div>
<div class ="captcha-container"></div>
<button type="submit" class="submitbutton text-white mx-auto submit-after-valid-captcha">Submit</button>
<button id="bestellformular-btn" type="submit" class="submitbutton text-white mx-auto submit-after-valid-captchaaaa">Kostenpflichtig bestellen</button>
<div id="notification" class="mt-10 bg-blue-500 px-4 py-2 text-white rounded hidden">Notification</div>
</form>
<div id="notification" class="mt-10 bg-blue-500 px-4 py-2 text-white hidden rounded">Notification</div>
<link rel="stylesheet" href="https://verua.dev-1.andreashnida.de/vendor/captcha-system/css/main.css">
<script src = 'https://verua.dev-1.andreashnida.de/vendor/captcha-system/js/main.js'></script>
<script>
window.onload = function() {
document.getElementById('bestellformular').addEventListener('submit', function(e) {
e.preventDefault(); // Verhindert die Standard-Formularsendung
const form = e.target;
const data = new FormData(form);
const notification = document.getElementById('notification');
fetch(form.action, {
method: 'POST',
body: data,
})
.then(response => response.json()) // Erwartet, dass die Antwort ein JSON ist
.then(data => {
// Erfolgsnachricht anzeigen
notification.textContent = 'Nachricht erfolgreich gesendet!';
notification.className = 'bg-green-500 text-white px-4 py-2 rounded block';
setTimeout(() => notification.className = 'bg-green-500 text-white px-4 py-2 rounded hidden', 5000); // Benachrichtigung nach 5 Sekunden ausblenden
})
.catch((error) => {
// Fehlermeldung anzeigen
notification.textContent = 'Fehler beim Senden der Nachricht.';
notification.className = 'bg-red-500 text-white px-4 py-2 rounded block';
setTimeout(() => notification.className = 'bg-red-500 text-white px-4 py-2 rounded hidden', 5000); // Benachrichtigung nach 5 Sekunden ausblenden
});
});
};
</script>
{{% /section %}}
<script src ='https://verua.dev-1.andreashnida.de/vendor/captcha-system/js/main.js'></script>
{{% /section %}}

View file

@ -4,7 +4,7 @@ draft = false
title = 'Online Testversion'
+++
{{% veruaslider %}}
{{% veruaslider height="450px" %}}
{{% slide image="../online-testversion-header.jpg" first="true " %}}
{{% /veruaslider %}}

View file

@ -0,0 +1,34 @@
+++
date = '2024-02-21T13:22:03Z'
draft = false
title = 'Zusatzmodule Freiberufliche'
+++
{{% veruaslider height="450px" %}}
{{% slide image="../bestellungen-header.jpg" first="true " %}}
{{% /veruaslider %}}
{{% section %}}
{{% aligncenter %}}
#### Bestellformular
## VeruA ** Verwaltung und Abrechnung
### Zsatzmodule für Freiberufliche
<br>
---
<br>
{{% /aligncenter %}}
{{% /section %}}

View file

@ -4,7 +4,7 @@ draft = false
title = 'Verua Preisliste für Freiberufliche'
+++
{{% veruaslider %}}
{{% veruaslider height="450px" %}}
{{% slide image="../freiberufliche-header-slide-1.jpg" first="true " %}}
{{% slide image="../freiberufliche-header-slide-2.jpg" %}}
{{% /veruaslider %}}

View file

@ -4,7 +4,7 @@ draft = false
title = 'Organisationen'
+++
{{% veruaslider %}}
{{% veruaslider height="450px" %}}
{{% slide image="../freiberufliche-header-slide-1.jpg" first="true " %}}
{{% slide image="../freiberufliche-header-slide-2.jpg" %}}
{{% /veruaslider %}}

View file

@ -4,7 +4,7 @@ draft = false
title = 'Weitere Dienstleistungen'
+++
{{% veruaslider %}}
{{% veruaslider height="450px" %}}
{{% slide image="../freiberufliche-header-slide-1.jpg" first="true " %}}
{{% slide image="../freiberufliche-header-slide-2.jpg" %}}
{{% /veruaslider %}}

View file

@ -1,5 +1,12 @@
{{ define "main" }}
{{/* Lade JS nur wenn wir es brauchen */}}
<div class="content">
{{ .Content }}
{{ .Content }}
</div>
{{ if eq .Section "bestellung" }}
{{ $js := resources.Get "js/bestellformular.js" | minify }}
<script src="{{ $js.RelPermalink }}"></script>
{{ end }}
{{ end }}

View file

@ -1,43 +1,13 @@
{{/* TODO ADD S M L Modes */}}
{{/* TODO FIX HEIGHT ISSUE */}}
{{/* TODO FIX Slider Height on Mobile when no Headline is given */}}
<section class="hero-slider h-screen md:h-[750px]">
<section class="hero-slider h-screen {{ with .Get "height" }}md:h-[{{ . }}]{{ else }}md:h-[750px]{{ end }}">
<div class="verua-slider-wrapper">
<div class="verua-slider h-screen md:h-[750px]" id="verua-slider">
<div class="verua-slider h-screen {{ with .Get "height" }}md:h-[{{ . }}]{{ else }}md:h-[750px]{{ end }}" id="verua-slider">
{{ .Inner }}
</div>
</div>
</section>
<script>
window.onload = function(){
setInterval(nextSlide, 5000);
}
let slideNumber = 0;
const prevSlide = () =>{
const slides = document.getElementsByClassName('slides');
const slider = document.getElementById("verua-slider");
const currentSlide = slider.getElementsByClassName('current');
currentSlide[0].classList.remove("current");
if(slideNumber == 0){
slideNumber = slides.length-1;
}
else{
slideNumber = slideNumber-1;
}
slides[slideNumber].classList.add("current");
}
const nextSlide = () =>{
const slides = document.getElementsByClassName('slides');
const slider = document.getElementById("verua-slider");
const currentSlide = slider.getElementsByClassName('current');
currentSlide[0].classList.remove("current");
if(slideNumber == (slides.length-1)){
slideNumber = 0;
}
else{
slideNumber = slideNumber+1;
}
slides[slideNumber].classList.add("current");
}
</script>
{{ $vsjs := resources.Get "js/veruaslider.js" | minify }}
<script src="{{ $vsjs.RelPermalink }}"></script>
<!-- /Hero Slider -->