From a1aa4ca9bfd8f8bcaadf8ecbecf7aa74b72009d4 Mon Sep 17 00:00:00 2001
From: Chris Cochrun <chris@cochrun.xyz>
Date: Thu, 30 Mar 2023 13:24:05 -0500
Subject: [PATCH] add requirement to camp-form

These requirements are to ensure emails from parents are added to the camp-form
---
 layouts/shortcodes/camp-form.html | 26 ++++++++++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/layouts/shortcodes/camp-form.html b/layouts/shortcodes/camp-form.html
index bb18673..ee16da6 100644
--- a/layouts/shortcodes/camp-form.html
+++ b/layouts/shortcodes/camp-form.html
@@ -12,6 +12,17 @@
      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';
+     }
+
      var xhr = new XMLHttpRequest();
      xhr.onreadystatechange = function() {
          if (this.readyState == 4 && this.status == 200) {
@@ -53,6 +64,9 @@
 
  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.addEventListener('DOMContentLoaded', process);
 </script>
@@ -143,10 +157,10 @@
         <input type="tel" id="parentphone" name="parentphone"
                class="basis-full form-input {{ $formClasses }}">
 
-        <label for="parentemail" class="basis-full">Guardian's Email</label>
+        <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"
                pattern="^[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*@[a-zA-Z0-9]+(?:\.[a-zA-Z0-9]+)*$"
-               class="basis-full form-input {{ $formClasses }}">
+               class="basis-full form-input {{ $formClasses }}" required>
 
         <label for="allergies" class="basis-full">Do you have any food allergies?</label>
         <input type="text" id="allergies" name="allergies"
@@ -224,5 +238,13 @@
         <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>
         </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>
+
     </form>
 </div>