a full workflow using htmx is finished.
Still needs lots of polish, but it works now.
This commit is contained in:
parent
ba1fdd967e
commit
d653ccdf9f
|
|
@ -2048,6 +2048,10 @@ select {
|
||||||
height: 1000px;
|
height: 1000px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-0 {
|
||||||
|
height: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
.max-h-\[5rem\] {
|
.max-h-\[5rem\] {
|
||||||
max-height: 5rem;
|
max-height: 5rem;
|
||||||
}
|
}
|
||||||
|
|
@ -2455,16 +2459,16 @@ select {
|
||||||
background-color: rgba(var(--color-neutral-500), var(--tw-bg-opacity));
|
background-color: rgba(var(--color-neutral-500), var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-primary-700 {
|
|
||||||
--tw-bg-opacity: 1;
|
|
||||||
background-color: rgba(var(--color-primary-700), var(--tw-bg-opacity));
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg-\[\#ef4444\] {
|
.bg-\[\#ef4444\] {
|
||||||
--tw-bg-opacity: 1;
|
--tw-bg-opacity: 1;
|
||||||
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
|
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bg-primary-700 {
|
||||||
|
--tw-bg-opacity: 1;
|
||||||
|
background-color: rgba(var(--color-primary-700), var(--tw-bg-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.bg-primary-600 {
|
.bg-primary-600 {
|
||||||
--tw-bg-opacity: 1;
|
--tw-bg-opacity: 1;
|
||||||
background-color: rgba(var(--color-primary-600), var(--tw-bg-opacity));
|
background-color: rgba(var(--color-primary-600), var(--tw-bg-opacity));
|
||||||
|
|
@ -2626,6 +2630,10 @@ select {
|
||||||
padding: 1.5rem;
|
padding: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.p-8 {
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
.px-0 {
|
.px-0 {
|
||||||
padding-left: 0px;
|
padding-left: 0px;
|
||||||
padding-right: 0px;
|
padding-right: 0px;
|
||||||
|
|
@ -4731,6 +4739,11 @@ pre {
|
||||||
color: rgb(255 51 153 / var(--tw-text-opacity));
|
color: rgb(255 51 153 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.invalid\:text-\[\#f39\]:invalid {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(255 51 153 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.invalid\:ring-\[\#f39\]:invalid {
|
.invalid\:ring-\[\#f39\]:invalid {
|
||||||
--tw-ring-opacity: 1;
|
--tw-ring-opacity: 1;
|
||||||
--tw-ring-color: rgb(255 51 153 / var(--tw-ring-opacity));
|
--tw-ring-color: rgb(255 51 153 / var(--tw-ring-opacity));
|
||||||
|
|
@ -4955,6 +4968,90 @@ pre {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:visible {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:mt-10 {
|
||||||
|
margin-top: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:mb-10 {
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:mb-16 {
|
||||||
|
margin-bottom: 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:mb-24 {
|
||||||
|
margin-bottom: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:mb-32 {
|
||||||
|
margin-bottom: 8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:h-8 {
|
||||||
|
height: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:h-24 {
|
||||||
|
height: 6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:h-32 {
|
||||||
|
height: 8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:h-2 {
|
||||||
|
height: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:basis-full {
|
||||||
|
flex-basis: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:p-8 {
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid ~ .peer-invalid\:p-2 {
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:empty ~ .peer-empty\:visible {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:empty ~ .peer-empty\:invisible {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:empty ~ .peer-empty\:mb-0 {
|
||||||
|
margin-bottom: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:empty ~ .peer-empty\:h-0 {
|
||||||
|
height: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:focus ~ .peer-focus\:visible {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid:focus ~ .peer-invalid\:peer-focus\:visible {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:focus:invalid ~ .peer-focus\:peer-invalid\:visible {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.peer:invalid:focus ~ .peer-invalid\:peer-focus\:p-2 {
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
[dir="ltr"] .ltr\:right-0 {
|
[dir="ltr"] .ltr\:right-0 {
|
||||||
right: 0px;
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,129 +2,6 @@
|
||||||
{{ $requiredField := "<span class='inline-block text-[#f39] text-sm align-super'>* required</span>" }}
|
{{ $requiredField := "<span class='inline-block text-[#f39] text-sm align-super'>* required</span>" }}
|
||||||
|
|
||||||
|
|
||||||
<script>
|
|
||||||
function submitForm(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
const form = document.getElementById('form');
|
|
||||||
const data = new FormData(form);
|
|
||||||
|
|
||||||
console.log(data.get("birthdate"));
|
|
||||||
const birthdate = new Date(data.get("birthdate"));
|
|
||||||
const age = calculate_age(birthdate);
|
|
||||||
data.append("age", age);
|
|
||||||
|
|
||||||
if (data.get("parentemail") == "") {
|
|
||||||
document.getElementById('warning-email').style.visibility = 'visible';
|
|
||||||
document.getElementById('warning-email').style.height = '';
|
|
||||||
document.getElementById('warning-email').style.margin = '';
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
document.getElementById('warning-email').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-email').style.height = '0';
|
|
||||||
document.getElementById('warning-email').style.margin = '0';
|
|
||||||
}
|
|
||||||
if (data.get("firstname") == "") {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'visible';
|
|
||||||
document.getElementById('warning-name').style.height = '';
|
|
||||||
document.getElementById('warning-name').style.margin = '';
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-name').style.height = '0';
|
|
||||||
document.getElementById('warning-name').style.margin = '0';
|
|
||||||
}
|
|
||||||
if (data.get("lastname") == "") {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'visible';
|
|
||||||
document.getElementById('warning-name').style.height = '';
|
|
||||||
document.getElementById('warning-name').style.margin = '';
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-name').style.height = '0';
|
|
||||||
document.getElementById('warning-name').style.margin = '0';
|
|
||||||
}
|
|
||||||
if (data.get("parentfirstname") == "") {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'visible';
|
|
||||||
document.getElementById('warning-name').style.height = '';
|
|
||||||
document.getElementById('warning-name').style.margin = '';
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-name').style.height = '0';
|
|
||||||
document.getElementById('warning-name').style.margin = '0';
|
|
||||||
}
|
|
||||||
if (data.get("parentlastname") == "") {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'visible';
|
|
||||||
document.getElementById('warning-name').style.height = '';
|
|
||||||
document.getElementById('warning-name').style.margin = '';
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
document.getElementById('warning-name').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-name').style.height = '0';
|
|
||||||
document.getElementById('warning-name').style.margin = '0';
|
|
||||||
}
|
|
||||||
if (data.get("final-agreement") == "") {
|
|
||||||
document.getElementById('warning-agreement').style.visibility = 'visible';
|
|
||||||
document.getElementById('warning-agreement').style.height = '';
|
|
||||||
document.getElementById('warning-agreement').style.margin = '';
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
document.getElementById('warning-agreement').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-agreement').style.height = '0';
|
|
||||||
document.getElementById('warning-agreement').style.margin = '0';
|
|
||||||
}
|
|
||||||
|
|
||||||
let base = "http://localhost:4242/camp-form";
|
|
||||||
/* let base = "https://api.tfcconnection.org/camp-form"; */
|
|
||||||
|
|
||||||
fetch(base, {
|
|
||||||
method: "POST",
|
|
||||||
body: data
|
|
||||||
}).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
if (res.ok) {
|
|
||||||
let payment = data.get('registration');
|
|
||||||
let health = data.get('health');
|
|
||||||
if (health === 'later') {
|
|
||||||
if (payment === 'now')
|
|
||||||
window.location.href = 'https://secure.myvanco.com/L-Z772/campaign/C-13JPJ';
|
|
||||||
else if (payment === 'full')
|
|
||||||
window.location.href = 'https://secure.myvanco.com/L-Z772/campaign/C-13JQE';
|
|
||||||
else
|
|
||||||
window.location.href = '/thankyou/';
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
window.location.href = '/camp-health-form?registration=' + payment;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function calculate_age(dob) {
|
|
||||||
var diff_ms = Date.now() - dob.getTime();
|
|
||||||
var age_dt = new Date(diff_ms);
|
|
||||||
|
|
||||||
return Math.abs(age_dt.getUTCFullYear() - 1970);
|
|
||||||
}
|
|
||||||
|
|
||||||
function process() {
|
|
||||||
/* document.getElementById('mt-form').hidden = false */
|
|
||||||
document.getElementById('warning-email').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-email').style.height = '0';
|
|
||||||
document.getElementById('warning-email').style.margin = '0';
|
|
||||||
document.getElementById('warning-name').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-name').style.height = '0';
|
|
||||||
document.getElementById('warning-name').style.margin = '0';
|
|
||||||
document.getElementById('warning-agreement').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-agreement').style.height = '0';
|
|
||||||
document.getElementById('warning-agreement').style.margin = '0';
|
|
||||||
document.getElementById('warning-other').style.visibility = 'hidden';
|
|
||||||
document.getElementById('warning-other').style.height = '0';
|
|
||||||
document.getElementById('warning-other').style.margin = '0';
|
|
||||||
}
|
|
||||||
document.addEventListener('DOMContentLoaded', process);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div id="mt-form" class="form text-lg w-full">
|
<div id="mt-form" class="form text-lg w-full">
|
||||||
<form id='form' hx-post="http://localhost:4242/camp-api" autocomplete="on" method="post" target="_parent" class="w-full items-center flex flex-wrap">
|
<form id='form' hx-post="http://localhost:4242/camp-api" autocomplete="on" method="post" target="_parent" class="w-full items-center flex flex-wrap">
|
||||||
<h3 class="basis-full">Camp Form</h3>
|
<h3 class="basis-full">Camp Form</h3>
|
||||||
|
|
@ -132,19 +9,18 @@
|
||||||
<label for="firstname" class="basis-full">What is your first and last name? <span class='inline-block text-[#f39] text-sm align-sub'>* required</span></label>
|
<label for="firstname" class="basis-full">What is your first and last name? <span class='inline-block text-[#f39] text-sm align-sub'>* required</span></label>
|
||||||
<br/>
|
<br/>
|
||||||
<input type="text" id="firstname" name="firstname"
|
<input type="text" id="firstname" name="firstname"
|
||||||
placeholder="First Name" class="flex-1 form-input {{ $formClasses }}"
|
placeholder="First Name" class="peer flex-1 form-input {{ $formClasses }}"
|
||||||
required>
|
required>
|
||||||
<input type="text" id="lastname" name="lastname"
|
<input type="text" id="lastname" name="lastname"
|
||||||
placeholder="Last Name" class="flex-1 form-input {{ $formClasses }}"
|
placeholder="Last Name" class="peer flex-1 form-input {{ $formClasses }}"
|
||||||
required>
|
required>
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap my-4">
|
<label for="parentfirstname" class="basis-full mt-2">What is your guardian's first and last name? <span class='inline-block text-[#f39] text-sm align-sub'>* required</span></label>
|
||||||
<label for="parentfirstname" class="basis-full">What is your guardian's first and last name? <span class='inline-block text-[#f39] text-sm align-sub'>* required</span></label>
|
|
||||||
<input type="text" id="parentfirstname" name="parentfirstname"
|
<input type="text" id="parentfirstname" name="parentfirstname"
|
||||||
class="flex-1 form-input {{ $formClasses }}"
|
class="peer flex-1 form-input {{ $formClasses }}"
|
||||||
placeholder="First Name" required>
|
placeholder="First Name" required>
|
||||||
<input type="text" id="parentlastname" name="parentlastname"
|
<input type="text" id="parentlastname" name="parentlastname"
|
||||||
class="flex-1 form-input {{ $formClasses }}"
|
class="peer flex-1 form-input {{ $formClasses }}"
|
||||||
placeholder="Last Name" required>
|
placeholder="Last Name" required>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -211,17 +87,54 @@
|
||||||
|
|
||||||
<label for="parentphone" class="basis-full">Guardian's phone <span class='inline-block text-[#f39] text-sm align-sub'>* required</span></label>
|
<label for="parentphone" class="basis-full">Guardian's phone <span class='inline-block text-[#f39] text-sm align-sub'>* required</span></label>
|
||||||
<input type="tel" id="parentphone" name="parentphone"
|
<input type="tel" id="parentphone" name="parentphone"
|
||||||
class="basis-full form-input {{ $formClasses }}"
|
class="basis-full peer form-input {{ $formClasses }}
|
||||||
required>
|
invalid:text-[#f39] invalid:ring-[#f39]
|
||||||
|
focus:invalid:ring-[#f39]
|
||||||
|
focus:invalid:border-[#f39]"
|
||||||
|
required pattern="\(?\d{3}\)? ?-?\d{3} ?-?\d{4}"/>
|
||||||
|
|
||||||
<label for="parentemail" class="basis-full">Guardian's Email
|
<!-- <div id="warning-phone"
|
||||||
<span class='inline-block text-[#f39] text-sm align-sub'>* required</span>
|
class="invisible flex
|
||||||
|
rounded-lg h-0
|
||||||
|
peer-invalid:p-2
|
||||||
|
peer-invalid:visible
|
||||||
|
peer-empty:invisible
|
||||||
|
peer-empty:h-0
|
||||||
|
peer-empty:mb-0
|
||||||
|
peer-invalid:basis-full
|
||||||
|
peer-invalid:mb-32">
|
||||||
|
|
||||||
|
<span class="text-[#f39] ltr:pr-3 rtl:pl-3 content-right float-right">
|
||||||
|
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }} Make sure you have included a valid phone number for your guardian so we can contact them. Numbers are in the format "999-999-9999 or 0123456789". Make sure to include an area code.
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
-->
|
||||||
|
<div class="basis-full flex flex-wrap">
|
||||||
|
|
||||||
|
<label for="parentemail" class="basis-full">Guardian's Email
|
||||||
|
<span class='inline-block text-[#f39] text-sm align-sub'>* required</span>
|
||||||
|
</label>
|
||||||
<input type="parentemail" id="parentemail" name="parentemail"
|
<input type="parentemail" id="parentemail" name="parentemail"
|
||||||
pattern="^[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*@[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*$"
|
pattern="^[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*@[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*$"
|
||||||
class="basis-full peer form-input {{ $formClasses }} invalid:text-[#F39] invalid:ring-[#f39] focus:invalid:ring-[#f39] focus:invalid:border-[#f39]">
|
class="basis-full peer form-input
|
||||||
<span class='invisible text-[#f39] text-sm peer-invalid:visibile'>Please use a valid email</span>
|
{{ $formClasses }}
|
||||||
|
invalid:text-[#F39]
|
||||||
|
invalid:ring-[#f39]
|
||||||
|
focus:invalid:ring-[#f39]
|
||||||
|
focus:invalid:border-[#f39]">
|
||||||
|
|
||||||
</label>
|
<div id="warning-email"
|
||||||
|
class="invisible flex
|
||||||
|
rounded-lg h-0
|
||||||
|
peer-invalid:p-2 peer-invalid:visible
|
||||||
|
peer-invalid:basis-full
|
||||||
|
peer-invalid:mb-24">
|
||||||
|
|
||||||
|
<span class="text-[#f39] ltr:pr-3 rtl:pl-3 content-right float-right">
|
||||||
|
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }} Make sure you have included an email for your guardian so we can contact them. Emails are in the format "name@website.end".
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<label for="allergies" class="basis-full">Do you have any food allergies?</label>
|
<label for="allergies" class="basis-full">Do you have any food allergies?</label>
|
||||||
<input type="text" id="allergies" name="allergies"
|
<input type="text" id="allergies" name="allergies"
|
||||||
class="basis-full form-input {{ $formClasses }}">
|
class="basis-full form-input {{ $formClasses }}">
|
||||||
|
|
@ -298,34 +211,5 @@
|
||||||
<div class="basis-full mt-8">
|
<div class="basis-full mt-8">
|
||||||
<button type="submit" class="content-right rounded-lg bg-primary-700 h-12 w-24 focus:bg-primary-900 focus:ring focus:ring-primary-700 hover:bg-primary-900 float-right">Submit</button>
|
<button type="submit" class="content-right rounded-lg bg-primary-700 h-12 w-24 focus:bg-primary-900 focus:ring focus:ring-primary-700 hover:bg-primary-900 float-right">Submit</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="warning-email" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
|
||||||
Make sure you have included an email for your guardian so we can contact them.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="warning-name" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
|
||||||
Make sure that all names are filled out
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="warning-agreement" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
|
||||||
You have to agree to the registration information.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="warning-other" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
|
||||||
Have you checked to make sure all required fields are filled out?
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -77,8 +77,8 @@
|
||||||
// For use in dev
|
// For use in dev
|
||||||
// Can now start using this in production IF,
|
// Can now start using this in production IF,
|
||||||
// I get the server running on the server
|
// I get the server running on the server
|
||||||
let base = "https://api.tfcconnection.org/health-form";
|
/* let base = "https://api.tfcconnection.org/health-form"; */
|
||||||
/* let base = "http://localhost:4242/health-form"; */
|
let base = "http://localhost:4242/health-form";
|
||||||
fetch(base, {
|
fetch(base, {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
body: data
|
body: data
|
||||||
|
|
@ -208,298 +208,308 @@
|
||||||
const parentPhone = params.get('parentPhone');
|
const parentPhone = params.get('parentPhone');
|
||||||
|
|
||||||
console.log(mtRegistration);
|
console.log(mtRegistration);
|
||||||
|
document.body.addEventListener('htmx:configRequest', function(evt) {
|
||||||
|
console.log(registration);
|
||||||
|
evt.detail.parameters['registration'] = registration;
|
||||||
|
console.log(evt);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div id="health-form" class="form text-lg w-full">
|
<div id="health-form" class="form text-lg w-full">
|
||||||
<form id='form' onsubmit="submitForm(event);" autocomplete="on" method="post" target="_parent" class="w-full items-center flex flex-wrap">
|
<form id='form'
|
||||||
<h3 class="basis-full">2024-2025 Health Form</h3>
|
hx-post="http://localhost:4242/health-form"
|
||||||
<div class="basis-full flex flex-wrap my-4">
|
hx-encoding="multipart/form-data"
|
||||||
<label for="firstname" class="basis-full">What is your first and last name?</label>
|
autocomplete="on" method="post"
|
||||||
<br/>
|
target="_parent"
|
||||||
<input type="text" id="firstname" name="firstname" required
|
class="w-full items-center flex flex-wrap">
|
||||||
placeholder="First Name" class="flex-1 form-input {{ $formClasses }}">
|
|
||||||
<input type="text" id="lastname" name="lastname" required
|
|
||||||
placeholder="Last Name" class="flex-1 form-input {{ $formClasses }}">
|
|
||||||
</div>
|
|
||||||
<div class="basis-full my-8">
|
|
||||||
<div class="">
|
|
||||||
<label for="birthdate" class="">When were you born?</label>
|
|
||||||
<input type="date" id="birthdate" name="birthdate"
|
|
||||||
class="form-date {{ $formClasses }}" required>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap my-4">
|
|
||||||
<label for="parentfirstname" class="basis-full">What is your parent's first and last name?</label>
|
|
||||||
<input type="text" id="parentfirstname" name="parentfirstname"
|
|
||||||
class="flex-1 form-input {{ $formClasses }}"
|
|
||||||
placeholder="First Name" required>
|
|
||||||
<input type="text" id="parentlastname" name="parentlastname"
|
|
||||||
class="flex-1 form-input {{ $formClasses }}"
|
|
||||||
placeholder="Last Name" required>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap my-4">
|
|
||||||
<label for="street" class="basis-full">What is your address?</label>
|
|
||||||
<input type="text" id="street" name="street"
|
|
||||||
class="basis-full form-input {{ $formClasses }}"
|
|
||||||
placeholder="Street Address">
|
|
||||||
<input type="text" id="city" name="city"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="City">
|
|
||||||
<input type="text" id="state" name="state"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="State">
|
|
||||||
<input type="text" id="zip" name="zip"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="Zip Code">
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap items-center my-8">
|
|
||||||
<div class="flex-auto flex flex-wrap items-center">
|
|
||||||
<label for="cellphone" class="mr-4">Parent Cell phone</label>
|
|
||||||
<input type="tel" id="cellphone" name="cellphone"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}">
|
|
||||||
</div>
|
|
||||||
<div class="flex-auto flex flex-wrap items-center">
|
|
||||||
<label for="homephone" class="mr-4">Home phone</label>
|
|
||||||
<input type="tel" id="homephone" name="homephone"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap my-4">
|
|
||||||
<label for="add-emergency-contact" class="basis-full">Additional Emergency Contact</label>
|
|
||||||
<input type="text" id="add-emergency-contact" name="add-emergency-contact"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="Full Name">
|
|
||||||
<input type="tel" id="add-emergency-contact-phone"
|
|
||||||
name="add-emergency-contact-phone"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="Phone Number">
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap my-4">
|
|
||||||
<label for="doctor" class="basis-full">Doctor</label>
|
|
||||||
<input type="text" id="doctorname" name="doctorname"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="Doctor's Name">
|
|
||||||
<input type="text" id="doctorcity" name="doctorcity"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="Doctor's City">
|
|
||||||
<input type="tel" id="doctorphone"
|
|
||||||
name="doctorphone"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}"
|
|
||||||
placeholder="Phone Number">
|
|
||||||
</div>
|
|
||||||
<div class="basis-full my-4 flex flex-wrap items-center">
|
|
||||||
<label for="medical-coverage" class="basis-full mt-8">Is this participant covered by medical insurance?</label>
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="medical-coverage" name="medical-coverage"
|
|
||||||
onclick="process()" value="yes"
|
|
||||||
class="flex-none form-input {{ $formClasses }} checked">
|
|
||||||
<label for="medical-coverage" class="flex-auto">Yes</label>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="medical-coverage" name="medical-coverage"
|
|
||||||
onclick="process()" value="no"
|
|
||||||
class="flex-none form-input {{ $formClasses }} ">
|
|
||||||
<label for="medical-coverage" class="flex-auto">No</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div id="policy" class="basis-full flex flex-wrap my-4">
|
|
||||||
<label for="insurance-name" class="basis-full">Insurance Name</label>
|
|
||||||
<input type="text" id="insurance-name" name="insurance-name"
|
|
||||||
class="flex-1 form-input {{ $formClasses }}"
|
|
||||||
placeholder="Insurance Name">
|
|
||||||
<label for="policy-number" class="basis-full">Policy Number</label>
|
|
||||||
<input type="text" id="policy-number" name="policy-number"
|
|
||||||
class="flex-1 form-input {{ $formClasses }}"
|
|
||||||
placeholder="Policy Number">
|
|
||||||
</div>
|
|
||||||
<div class="basis-full my-4 mb-8 flex flex-wrap">
|
|
||||||
<label for="image" class="basis-full">
|
|
||||||
Please give us a scanned copy of your insurance card.
|
|
||||||
</label>
|
|
||||||
<input type="file" id="image" name="image"
|
|
||||||
class="file:my-4 file:ml-2 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-neutral-500 file:text-neutral-100 hover:file:bg-primary-300 hover:file:ring-offset-2 hover:file:ring-2 hover:file:ring-offset-transparent hover:file:text-primary-500 hover:file:ring-primary-500">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
<h3 class="basis-full">2024-2025 Health Form</h3>
|
||||||
<h3 class="basis-full">Please read and agree to the following</h3>
|
<div class="basis-full flex flex-wrap my-4">
|
||||||
<li>On this <span id="current_date"></span>, I/we the parent(s)/legal guardian(s) of the above-named child ("Participant") do hereby delegate to the TFC Connection Staff a "Power of Attorney" for the above-named child for the purpose of having custody of my/our child and my/our consent to any needed emergency/medical treatment and administration of prescribed medications of my/our child.
|
<label for="firstname" class="basis-full">What is your first and last name? <span class='inline-block text-[#f39] text-sm'>* required</span></label>
|
||||||
<li>In the event that I cannot be reached in an emergency during the dates specified on this form, I hereby give my permission to the physician or dentist selected by the TFC Connection Staff to hospitalize, to secure proper treatment, and/or order any injection, anesthesia, or surgery for my son or daughter as deemed necessary.
|
<br/>
|
||||||
<li>I understand that every activity sponsored by TFC Connection is carefully planned and adequately supervised by mature adults. However, even with the best planning and precaution, unforeseen events can occur. By signing this form as parent/guardian, I/we agree to assume and accept all risks and hazards inherent in ministry-related activities and events. I/we acknowledge that participation in TFC Connection ministry activities and events involves risk to the participant (and to the participant's parents or guardians, if the participant is a minor), and may result in various types of injury including, but not limited to, the following: sickness, exposure to infectious/communicable disease, bodily injury, death, emotional injury, personal injury, property damage, and financial damage.
|
<input type="text" id="firstname" name="firstname" required
|
||||||
<li>In consideration for the opportunity to participate in TFC Connection activities and events, the participant (or parent/guardian if the participant is a minor) acknowledges and accepts the risks of injury associated with participation in and transportation to and from the activities or events. The participant (or parent/guardian) accepts personal financial responsibility for any injury or other loss sustained during the activity or event, or during transportation to and from the activity or event, as well as for any medical treatment rendered to the participant that is authorized by the sponsor or its agents, employees, volunteers, or any other representatives (collectively referred to as the "activity sponsor"). Further, the participant (or parent/guardian) releases and promises to indemnify, defend, and hold harmless the activity sponsor for any injury arising directly or indirectly out of ministry activities and events, or transportation to and from activities and events, whether such injury arises out of the negligence of the activity sponsor, the participant, or otherwise.
|
placeholder="First Name" class="flex-1 form-input {{ $formClasses }}">
|
||||||
<li>I/we also agree not to hold TFC Connection, it's employees or volunteer assistants liable for damages, losses, or injuries to the participant or their personal property. As parent/guardian, I understand that I am signing for the minor named on this form and the signatures are to provide for the medical release and the liability release.
|
<input type="text" id="lastname" name="lastname" required
|
||||||
<li>Further, should it be necessary for the participant to return home due to medical reasons, disciplinary action, or otherwise, I/we hereby assume transportation costs for their return.
|
placeholder="Last Name" class="flex-1 form-input {{ $formClasses }}">
|
||||||
<li>I give permission to TFC Connection to use my child's image in photos or videos taken at TFC sponsored activities and events in order to publicize or promote TFC activities, including promotional materials, the TFC website, and social media pages.
|
</div>
|
||||||
</div>
|
<div class="basis-full my-8">
|
||||||
|
<div class="">
|
||||||
|
<label for="birthdate" class="">When were you born? <span class='inline-block text-[#f39] text-sm'>* required</span></label>
|
||||||
|
<input type="date" id="birthdate" name="birthdate"
|
||||||
|
class="form-date {{ $formClasses }}" required>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap my-4">
|
||||||
|
<label for="parentfirstname" class="basis-full">What is your parent's first and last name? <span class='inline-block text-[#f39] text-sm'>* required</span></label>
|
||||||
|
<input type="text" id="parentfirstname" name="parentfirstname"
|
||||||
|
class="flex-1 form-input {{ $formClasses }}"
|
||||||
|
placeholder="First Name" required>
|
||||||
|
<input type="text" id="parentlastname" name="parentlastname"
|
||||||
|
class="flex-1 form-input {{ $formClasses }}"
|
||||||
|
placeholder="Last Name" required>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap my-4">
|
||||||
|
<label for="street" class="basis-full">What is your address? <span class='inline-block text-[#f39] text-sm'>* required</span></label>
|
||||||
|
<input type="text" id="street" name="street"
|
||||||
|
class="basis-full form-input {{ $formClasses }}"
|
||||||
|
placeholder="Street Address">
|
||||||
|
<input type="text" id="city" name="city"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="City">
|
||||||
|
<input type="text" id="state" name="state"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="State">
|
||||||
|
<input type="text" id="zip" name="zip"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="Zip Code">
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap items-center my-8">
|
||||||
|
<div class="flex-auto flex flex-wrap items-center">
|
||||||
|
<label for="cellphone" class="mr-4">Parent Cell phone</label>
|
||||||
|
<input type="tel" id="cellphone" name="cellphone"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}">
|
||||||
|
</div>
|
||||||
|
<div class="flex-auto flex flex-wrap items-center">
|
||||||
|
<label for="homephone" class="mr-4">Home phone</label>
|
||||||
|
<input type="tel" id="homephone" name="homephone"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap my-4">
|
||||||
|
<label for="add-emergency-contact" class="basis-full">Additional Emergency Contact</label>
|
||||||
|
<input type="text" id="add-emergency-contact" name="add-emergency-contact"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="Full Name">
|
||||||
|
<input type="tel" id="add-emergency-contact-phone"
|
||||||
|
name="add-emergency-contact-phone"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="Phone Number">
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap my-4">
|
||||||
|
<label for="doctor" class="basis-full">Doctor</label>
|
||||||
|
<input type="text" id="doctorname" name="doctorname"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="Doctor's Name">
|
||||||
|
<input type="text" id="doctorcity" name="doctorcity"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="Doctor's City">
|
||||||
|
<input type="tel" id="doctorphone"
|
||||||
|
name="doctorphone"
|
||||||
|
class="flex-auto form-input {{ $formClasses }}"
|
||||||
|
placeholder="Phone Number">
|
||||||
|
</div>
|
||||||
|
<div class="basis-full my-4 flex flex-wrap items-center">
|
||||||
|
<label for="medical-coverage" class="basis-full mt-8">Is this participant covered by medical insurance? <span class='inline-block text-[#f39] text-sm'>* required</span></label>
|
||||||
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
|
<input type="radio" id="medical-coverage" name="medical-coverage"
|
||||||
|
onclick="process()" value="yes"
|
||||||
|
class="flex-none form-input {{ $formClasses }} checked">
|
||||||
|
<label for="medical-coverage" class="flex-auto">Yes</label>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
|
<input type="radio" id="medical-coverage" name="medical-coverage"
|
||||||
|
onclick="process()" value="no"
|
||||||
|
class="flex-none form-input {{ $formClasses }} ">
|
||||||
|
<label for="medical-coverage" class="flex-auto">No</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="policy" class="basis-full flex flex-wrap my-4">
|
||||||
|
<label for="insurance-name" class="basis-full">Insurance Name</label>
|
||||||
|
<input type="text" id="insurance-name" name="insurance-name"
|
||||||
|
class="flex-1 form-input {{ $formClasses }}"
|
||||||
|
placeholder="Insurance Name">
|
||||||
|
<label for="policy-number" class="basis-full">Policy Number</label>
|
||||||
|
<input type="text" id="policy-number" name="policy-number"
|
||||||
|
class="flex-1 form-input {{ $formClasses }}"
|
||||||
|
placeholder="Policy Number">
|
||||||
|
</div>
|
||||||
|
<div class="basis-full my-4 mb-8 flex flex-wrap">
|
||||||
|
<label for="image" class="basis-full">
|
||||||
|
Please give us a scanned copy of your insurance card.
|
||||||
|
</label>
|
||||||
|
<input type="file" id="image" name="image"
|
||||||
|
class="file:my-4 file:ml-2 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-neutral-500 file:text-neutral-100 hover:file:bg-primary-300 hover:file:ring-offset-2 hover:file:ring-2 hover:file:ring-offset-transparent hover:file:text-primary-500 hover:file:ring-primary-500">
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="basis-full my-4 flex flex-wrap items-center">
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<label for="agreement" class="basis-full mt-8">Do you agree with the above?</label>
|
<h3 class="basis-full">Please read and agree to the following</h3>
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
<li>On this <span id="current_date"></span>, I/we the parent(s)/legal guardian(s) of the above-named child ("Participant") do hereby delegate to the TFC Connection Staff a "Power of Attorney" for the above-named child for the purpose of having custody of my/our child and my/our consent to any needed emergency/medical treatment and administration of prescribed medications of my/our child.
|
||||||
<input type="radio" id="agreement" name="agreement"
|
<li>In the event that I cannot be reached in an emergency during the dates specified on this form, I hereby give my permission to the physician or dentist selected by the TFC Connection Staff to hospitalize, to secure proper treatment, and/or order any injection, anesthesia, or surgery for my son or daughter as deemed necessary.
|
||||||
onclick="process()" value="yes"
|
<li>I understand that every activity sponsored by TFC Connection is carefully planned and adequately supervised by mature adults. However, even with the best planning and precaution, unforeseen events can occur. By signing this form as parent/guardian, I/we agree to assume and accept all risks and hazards inherent in ministry-related activities and events. I/we acknowledge that participation in TFC Connection ministry activities and events involves risk to the participant (and to the participant's parents or guardians, if the participant is a minor), and may result in various types of injury including, but not limited to, the following: sickness, exposure to infectious/communicable disease, bodily injury, death, emotional injury, personal injury, property damage, and financial damage.
|
||||||
class="flex-none form-input {{ $formClasses }} checked"
|
<li>In consideration for the opportunity to participate in TFC Connection activities and events, the participant (or parent/guardian if the participant is a minor) acknowledges and accepts the risks of injury associated with participation in and transportation to and from the activities or events. The participant (or parent/guardian) accepts personal financial responsibility for any injury or other loss sustained during the activity or event, or during transportation to and from the activity or event, as well as for any medical treatment rendered to the participant that is authorized by the sponsor or its agents, employees, volunteers, or any other representatives (collectively referred to as the "activity sponsor"). Further, the participant (or parent/guardian) releases and promises to indemnify, defend, and hold harmless the activity sponsor for any injury arising directly or indirectly out of ministry activities and events, or transportation to and from activities and events, whether such injury arises out of the negligence of the activity sponsor, the participant, or otherwise.
|
||||||
required>
|
<li>I/we also agree not to hold TFC Connection, it's employees or volunteer assistants liable for damages, losses, or injuries to the participant or their personal property. As parent/guardian, I understand that I am signing for the minor named on this form and the signatures are to provide for the medical release and the liability release.
|
||||||
<label for="agreement" class="flex-auto">Yes</label>
|
<li>Further, should it be necessary for the participant to return home due to medical reasons, disciplinary action, or otherwise, I/we hereby assume transportation costs for their return.
|
||||||
</div>
|
<li>I give permission to TFC Connection to use my child's image in photos or videos taken at TFC sponsored activities and events in order to publicize or promote TFC activities, including promotional materials, the TFC website, and social media pages.
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
</div>
|
||||||
<input type="radio" id="agreement" name="agreement"
|
|
||||||
onclick="process()" value="no"
|
|
||||||
class="flex-none form-input {{ $formClasses }} "
|
|
||||||
checked>
|
|
||||||
<label for="agreement" class="flex-auto">No</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="basis-full my-4 flex flex-wrap items-center">
|
<div class="basis-full my-4 flex flex-wrap items-center">
|
||||||
<label for="allergies" class="basis-full mt-8">What allergies do we need to be aware of?</label>
|
<label for="agreement" class="basis-full mt-8">Do you agree with the above? <span class='inline-block text-[#f39] text-sm'>* required</span></label>
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<input type="radio" id="allergies" name="allergies"
|
<input type="radio" id="agreement" name="agreement"
|
||||||
value="none" class="flex-none form-input {{ $formClasses }}" checked>
|
onclick="process()" value="yes"
|
||||||
<label for="allergies" class="flex-auto">None</label>
|
class="flex-none form-input {{ $formClasses }} checked"
|
||||||
</div>
|
required>
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
<label for="agreement" class="flex-auto">Yes</label>
|
||||||
<input type="radio" id="allergies" name="allergies"
|
</div>
|
||||||
value="insects" class="flex-none form-input {{ $formClasses }}">
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<label for="allergies" class="flex-auto">Insects</label>
|
<input type="radio" id="agreement" name="agreement"
|
||||||
</div>
|
onclick="process()" value="no"
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
class="flex-none form-input {{ $formClasses }} "
|
||||||
<input type="radio" id="allergies" name="allergies"
|
checked>
|
||||||
value="plants" class="flex-none form-input {{ $formClasses }}">
|
<label for="agreement" class="flex-auto">No</label>
|
||||||
<label for="allergies" class="flex-auto">Plants or Weeds</label>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="allergies" name="allergies"
|
|
||||||
value="animals" class="flex-none form-input {{ $formClasses }}">
|
|
||||||
<label for="allergies" class="flex-auto">Animals</label>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="allergies" name="allergies"
|
|
||||||
value="medication" class="flex-none form-input {{ $formClasses }}">
|
|
||||||
<label for="allergies" class="flex-auto">Medication</label>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="allergies" name="allergies"
|
|
||||||
value="other" class="flex-none form-input {{ $formClasses }}">
|
|
||||||
<input type="text" id="allergies-other" name="allergies-other"
|
|
||||||
class="flex-auto form-input {{ $formClasses }}" placeholder="Other">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="basis-full mt-10">
|
<div class="basis-full my-4 flex flex-wrap items-center">
|
||||||
<label for="specific-allergies" class="p-4">
|
<label for="allergies" class="basis-full mt-8">What allergies do we need to be aware of?</label>
|
||||||
Please list specific allergies
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
</label>
|
<input type="radio" id="allergies" name="allergies"
|
||||||
<br/>
|
value="none" class="flex-none form-input {{ $formClasses }}" checked>
|
||||||
<textarea id="specific-allergies" name="specific-allergies"
|
<label for="allergies" class="flex-auto">None</label>
|
||||||
class="form-input w-full h-64 {{ $formClasses }}"
|
</div>
|
||||||
placeholder=""></textarea>
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
</div>
|
<input type="radio" id="allergies" name="allergies"
|
||||||
<div class="basis-full mt-10">
|
value="insects" class="flex-none form-input {{ $formClasses }}">
|
||||||
<label for="allergic-treatment" class="p-4">
|
<label for="allergies" class="flex-auto">Insects</label>
|
||||||
Treatment for those allergies
|
</div>
|
||||||
</label>
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<br/>
|
<input type="radio" id="allergies" name="allergies"
|
||||||
<textarea id="allergic-treatment" name="allergic-treatment"
|
value="plants" class="flex-none form-input {{ $formClasses }}">
|
||||||
class="form-input w-full h-64 {{ $formClasses }}"
|
<label for="allergies" class="flex-auto">Plants or Weeds</label>
|
||||||
placeholder=""></textarea>
|
</div>
|
||||||
</div>
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<div class="basis-full mt-10">
|
<input type="radio" id="allergies" name="allergies"
|
||||||
<label for="conditions" class="p-4">
|
value="animals" class="flex-none form-input {{ $formClasses }}">
|
||||||
Physical or mental conditions that we should be aware of
|
<label for="allergies" class="flex-auto">Animals</label>
|
||||||
</label>
|
</div>
|
||||||
<br/>
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<textarea id="conditions" name="conditions"
|
<input type="radio" id="allergies" name="allergies"
|
||||||
class="form-input w-full h-64 {{ $formClasses }}"
|
value="medication" class="flex-none form-input {{ $formClasses }}">
|
||||||
placeholder=""></textarea>
|
<label for="allergies" class="flex-auto">Medication</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="basis-full my-8">
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
<label for="tetanus-shot" class="">When was your last tetanus shot?</label>
|
<input type="radio" id="allergies" name="allergies"
|
||||||
<input type="date" id="tetanus-shot" name="tetanus-shot"
|
value="other" class="flex-none form-input {{ $formClasses }}">
|
||||||
class="form-date {{ $formClasses }}">
|
<input type="text" id="allergies-other" name="allergies-other"
|
||||||
</div>
|
class="flex-auto form-input {{ $formClasses }}" placeholder="Other">
|
||||||
<div class="basis-full my-4 flex flex-wrap items-center">
|
</div>
|
||||||
<label for="swimming-ability" class="basis-full mt-8">Swimming ability</label>
|
</div>
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="swimming-ability" name="swimming-ability"
|
|
||||||
value="good" class="flex-none form-input {{ $formClasses }}" checked>
|
|
||||||
<label for="swimming-ability" class="flex-auto">Good</label>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="swimming-ability" name="swimming-ability"
|
|
||||||
value="fair" class="flex-none form-input {{ $formClasses }}">
|
|
||||||
<label for="swimming-ability" class="flex-auto">Fair</label>
|
|
||||||
<div class="basis-full flex flex-wrap items-center">
|
|
||||||
<input type="radio" id="swimming-ability" name="swimming-ability"
|
|
||||||
value="none" class="flex-none form-input {{ $formClasses }}">
|
|
||||||
<label for="swimming-ability" class="flex-auto">None</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full mt-10">
|
|
||||||
<h3 class="pt-4 px-4">What medication schedule do you follow?</h3>
|
|
||||||
<h4 class="px-4 pt-2 pb-4">Medication must be in it's original labeled container from the pharmacy</h3>
|
|
||||||
<label for="medication-schedule" class="p-4">
|
|
||||||
Please write them out in this pattern and a new medication on each line.
|
|
||||||
<br>
|
|
||||||
<table>
|
|
||||||
<tr>
|
|
||||||
<th>Medication Name</th>
|
|
||||||
<th>Time Given</th>
|
|
||||||
<th>How Many</th>
|
|
||||||
<th>Purpose of Medication</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>(Sample) Tums,</td>
|
|
||||||
<td>After each meal,</td>
|
|
||||||
<td>1-2,</td>
|
|
||||||
<td>Stomach issues</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</label>
|
|
||||||
<textarea id="medication-schedule" name="medication-schedule"
|
|
||||||
class="form-input w-full h-64 {{ $formClasses }}"
|
|
||||||
placeholder=""></textarea>
|
|
||||||
</div>
|
|
||||||
<div class="basis-full mt-10">
|
|
||||||
<label for="other-notes" class="p-4">
|
|
||||||
Is there anything you want the TFC staff to know that would help your child have a great experience?
|
|
||||||
</label>
|
|
||||||
<br/>
|
|
||||||
<textarea id="other-notes" name="other-notes"
|
|
||||||
class="form-input w-full h-64 {{ $formClasses }}"
|
|
||||||
placeholder=""></textarea>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="basis-full mt-8">
|
<div class="basis-full mt-10">
|
||||||
<button type="submit" class="content-right rounded-lg bg-primary-700 h-12 w-24 focus:bg-primary-900 focus:ring focus:ring-primary-700 hover:bg-primary-900 float-right">Submit</button>
|
<label for="specific-allergies" class="p-4">
|
||||||
</div>
|
Please list specific allergies
|
||||||
|
</label>
|
||||||
|
<br/>
|
||||||
|
<textarea id="specific-allergies" name="specific-allergies"
|
||||||
|
class="form-input w-full h-64 {{ $formClasses }}"
|
||||||
|
placeholder=""></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full mt-10">
|
||||||
|
<label for="allergic-treatment" class="p-4">
|
||||||
|
Treatment for those allergies
|
||||||
|
</label>
|
||||||
|
<br/>
|
||||||
|
<textarea id="allergic-treatment" name="allergic-treatment"
|
||||||
|
class="form-input w-full h-64 {{ $formClasses }}"
|
||||||
|
placeholder=""></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full mt-10">
|
||||||
|
<label for="conditions" class="p-4">
|
||||||
|
Physical or mental conditions that we should be aware of
|
||||||
|
</label>
|
||||||
|
<br/>
|
||||||
|
<textarea id="conditions" name="conditions"
|
||||||
|
class="form-input w-full h-64 {{ $formClasses }}"
|
||||||
|
placeholder=""></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full my-8">
|
||||||
|
<label for="tetanus-shot" class="">When was your last tetanus shot?</label>
|
||||||
|
<input type="date" id="tetanus-shot" name="tetanus-shot"
|
||||||
|
class="form-date {{ $formClasses }}">
|
||||||
|
</div>
|
||||||
|
<div class="basis-full my-4 flex flex-wrap items-center">
|
||||||
|
<label for="swimming-ability" class="basis-full mt-8">Swimming ability</label>
|
||||||
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
|
<input type="radio" id="swimming-ability" name="swimming-ability"
|
||||||
|
value="good" class="flex-none form-input {{ $formClasses }}" checked>
|
||||||
|
<label for="swimming-ability" class="flex-auto">Good</label>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
|
<input type="radio" id="swimming-ability" name="swimming-ability"
|
||||||
|
value="fair" class="flex-none form-input {{ $formClasses }}">
|
||||||
|
<label for="swimming-ability" class="flex-auto">Fair</label>
|
||||||
|
<div class="basis-full flex flex-wrap items-center">
|
||||||
|
<input type="radio" id="swimming-ability" name="swimming-ability"
|
||||||
|
value="none" class="flex-none form-input {{ $formClasses }}">
|
||||||
|
<label for="swimming-ability" class="flex-auto">None</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full mt-10">
|
||||||
|
<h3 class="pt-4 px-4">What medication schedule do you follow?</h3>
|
||||||
|
<h4 class="px-4 pt-2 pb-4">Medication must be in it's original labeled container from the pharmacy</h3>
|
||||||
|
<label for="medication-schedule" class="p-4">
|
||||||
|
Please write them out in this pattern and a new medication on each line.
|
||||||
|
<br>
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<th>Medication Name</th>
|
||||||
|
<th>Time Given</th>
|
||||||
|
<th>How Many</th>
|
||||||
|
<th>Purpose of Medication</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>(Sample) Tums,</td>
|
||||||
|
<td>After each meal,</td>
|
||||||
|
<td>1-2,</td>
|
||||||
|
<td>Stomach issues</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</label>
|
||||||
|
<textarea id="medication-schedule" name="medication-schedule"
|
||||||
|
class="form-input w-full h-64 {{ $formClasses }}"
|
||||||
|
placeholder=""></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="basis-full mt-10">
|
||||||
|
<label for="other-notes" class="p-4">
|
||||||
|
Is there anything you want the TFC staff to know that would help your child have a great experience?
|
||||||
|
</label>
|
||||||
|
<br/>
|
||||||
|
<textarea id="other-notes" name="other-notes"
|
||||||
|
class="form-input w-full h-64 {{ $formClasses }}"
|
||||||
|
placeholder=""></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="warning" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
<div class="basis-full mt-8">
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
<button type="submit" class="content-right rounded-lg bg-primary-700 h-12 w-24 focus:bg-primary-900 focus:ring focus:ring-primary-700 hover:bg-primary-900 float-right">Submit</button>
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
</div>
|
||||||
You have not agreed to the liability release. Please have a guardian read and agree to it first.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="warning-insurance" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
<div id="warning" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
||||||
You have not entered in your insurance name.
|
You have not agreed to the liability release. Please have a guardian read and agree to it first.
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="warning-policy" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
<div id="warning-insurance" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
||||||
You have not entered in a policy number.
|
You have not entered in your insurance name.
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="warning-image" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
<div id="warning-policy" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
||||||
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
||||||
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
||||||
You have not included a copy of your insurance card.
|
You have not entered in a policy number.
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</form>
|
<div id="warning-image" class="basis-full mt-10 flex px-4 py-3 rounded-lg bg-[#ef4444] dark:bg-[#ef4444]">
|
||||||
</div>
|
<span class="text-[#fca5a5] ltr:pr-3 rtl:pl-3 content-right float-right">
|
||||||
|
{{ partial "icon.html" (.Get 0 | default "triangle-exclamation") }}
|
||||||
|
You have not included a copy of your insurance card.
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -381,6 +381,58 @@ with the image attached"
|
||||||
(:th (car row))
|
(:th (car row))
|
||||||
(:td (cdr row))))))))))))
|
(:td (cdr row))))))))))))
|
||||||
|
|
||||||
|
(tbnl:define-easy-handler (respond :uri "/health-form") ()
|
||||||
|
(setf (tbnl:header-out :access-control-expose-headers) "*")
|
||||||
|
(let* ((data (tbnl:post-parameters* tbnl:*request*))
|
||||||
|
(registration (cdr (assoc "registration" data :test 'string=)))
|
||||||
|
(image (cdr (assoc "image" data :test 'string=)))
|
||||||
|
(first-name (cdr (assoc "firstname" data :test 'string=)))
|
||||||
|
(last-name (cdr (assoc "lastname" data :test 'string=)))
|
||||||
|
(image (cdr (assoc "image" data :test 'string=)))
|
||||||
|
(attachment nil))
|
||||||
|
(loop :for d :in data
|
||||||
|
:do (progn
|
||||||
|
(uiop:println d)
|
||||||
|
(if (string= "firstname" (car d))
|
||||||
|
(progn
|
||||||
|
(uiop:println (cdr d))
|
||||||
|
(setf first-name (cdr d))))
|
||||||
|
(if (string= "lastname" (car d))
|
||||||
|
(progn
|
||||||
|
(uiop:println (cdr d))
|
||||||
|
(setf last-name (cdr d))))
|
||||||
|
(if (string= "image" (car d))
|
||||||
|
(let ((path (path-join
|
||||||
|
hunchentoot:*tmp-directory*
|
||||||
|
(format nil "~a_~a.~a" first-name last-name
|
||||||
|
(cadr (uiop:split-string
|
||||||
|
(car (last d 2)) :separator "."))))))
|
||||||
|
(uiop:copy-file
|
||||||
|
(cadr d)
|
||||||
|
(path-join
|
||||||
|
hunchentoot:*tmp-directory*
|
||||||
|
(format nil "~a_~a.~a" first-name last-name
|
||||||
|
(cadr (uiop:split-string
|
||||||
|
(car (last d 2)) :separator ".")))))
|
||||||
|
(setf attachment path)
|
||||||
|
(uiop:println attachment)))))
|
||||||
|
(uiop:println data)
|
||||||
|
(mail-health-form data attachment)
|
||||||
|
(cond ((string= registration "now")
|
||||||
|
(setf (hunchentoot:header-out :HX-Redirect) "https://secure.myvanco.com/L-Z772/campaign/C-13JPJ"))
|
||||||
|
((string= registration "full")
|
||||||
|
(setf (tbnl:header-out :HX-Redirect) "https://secure.myvanco.com/L-Z772/campaign/C-13JQE"))
|
||||||
|
((string= registration "later")
|
||||||
|
(with-html-string
|
||||||
|
(:div
|
||||||
|
:class "mt-8"
|
||||||
|
(:h2 (format nil
|
||||||
|
"Thank You ~A!"
|
||||||
|
(concat
|
||||||
|
first-name " " last-name)))
|
||||||
|
(:p :class "text-md"
|
||||||
|
"If you'd like to pay for your registration go to the donate tab in the top right when you are ready and find the camp registration option.")))))))
|
||||||
|
|
||||||
(hunchentoot:define-easy-handler (respond :uri "/camp-api") ()
|
(hunchentoot:define-easy-handler (respond :uri "/camp-api") ()
|
||||||
(let* ((request-type (hunchentoot:request-method hunchentoot:*request*))
|
(let* ((request-type (hunchentoot:request-method hunchentoot:*request*))
|
||||||
(data (hunchentoot:post-parameters* hunchentoot:*request*))
|
(data (hunchentoot:post-parameters* hunchentoot:*request*))
|
||||||
|
|
@ -403,14 +455,17 @@ with the image attached"
|
||||||
((string= registration "later")
|
((string= registration "later")
|
||||||
(let ((first-name (cdr (assoc "firstname" data :test 'string=)))
|
(let ((first-name (cdr (assoc "firstname" data :test 'string=)))
|
||||||
(last-name (cdr (assoc "lastname" data :test 'string=))))
|
(last-name (cdr (assoc "lastname" data :test 'string=))))
|
||||||
|
(mail-camp-form data nil)
|
||||||
(with-html-string
|
(with-html-string
|
||||||
(:div
|
(:div
|
||||||
:class "mt-8"
|
:class "mt-8"
|
||||||
(:p :class "text-lg"
|
(:h2 (format nil
|
||||||
(format nil
|
"Thank You ~A!"
|
||||||
"Thank You ~A, can't wait to see you at camp!!"
|
(concat
|
||||||
(concat
|
first-name " " last-name)))
|
||||||
first-name " " last-name)))))))))
|
(:p "Can't wait to see you at camp!!")
|
||||||
|
(:p :class "text-md"
|
||||||
|
"If you'd like to pay for your registration go to the donate tab in the top right when you are ready and find the camp registration option.")))))))
|
||||||
(progn
|
(progn
|
||||||
(uiop:println "Health now")
|
(uiop:println "Health now")
|
||||||
(setf (tbnl:header-out :HX-Redirect) (format nil "/camp-health-form?registration=~A" registration))
|
(setf (tbnl:header-out :HX-Redirect) (format nil "/camp-health-form?registration=~A" registration))
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue