no pembroke no pickup

TomConner · Nov 22, 2023 · 5ea8582 · 5ea8582
1 parent 1d206fd
commit 5ea8582
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 3 deletions.
diff --git a/generator/content/register/index.html b/generator/content/register/index.html
@@ -26,6 +26,7 @@ <h2>Address</h2>
             <!-- Elements will create address element here -->
           </div>
         </section>
+        <div id="address-message" class="hidden"></div>
         <button id="button-register">Register</button>
 
         <!---------- Payment Options --------------->

diff --git a/generator/content/register/stripe-payment.js b/generator/content/register/stripe-payment.js
@@ -1,6 +1,21 @@
 // ------- UI helpers -------
 
-function showMessage(messageText) {
+function showAddressMessage(messageText) {
+  const messageContainer = document.querySelector("#address-message");
+
+  messageContainer.classList.remove("hidden");
+  messageContainer.textContent = messageText;
+
+  setTimeout(clearAddressMessage, 4000);
+}
+
+function clearAddressMessage() {
+  const messageContainer = document.querySelector("#address-message");
+  messageContainer.classList.add("hidden");
+  messageContainer.textContent = "";
+}
+
+function showPaymentMessage(messageText) {
   const messageContainer = document.querySelector("#payment-message");
 
   messageContainer.classList.remove("hidden");
@@ -94,11 +109,14 @@ document.addEventListener('DOMContentLoaded', async () => {
   // create and mount the address element
   const options = {
     mode: 'shipping',
+    autocomplete: {
+      mode: 'automatic',
+    },
     fields: {
       phone: 'always',
     },
     validation: {
-      phone: {required: 'always'},
+      phone: {required: 'auto'},
     }
   };
   const addressElement = elements.create('address', options);
@@ -111,6 +129,11 @@ document.addEventListener('DOMContentLoaded', async () => {
       const address = event.value;
       setLocalItem("address", JSON.stringify(address));
     }
+    if (event.error) {
+      showAddressMessage(event.error.message);
+    } else {
+      clearAddressMessage();
+    }
   });
 
   // on register button, post address and then hand off to payment choices
@@ -237,7 +260,7 @@ document.addEventListener('DOMContentLoaded', async () => {
       });
 
       if (stripeError) {
-        showMessage(stripeError.message);
+        showPaymentMessage(stripeError.message);
 
         // reenable the form.
         submitted = false;