From 291772cd99f7ae550650da8928934cc8c30bf51b Mon Sep 17 00:00:00 2001
From: Josh de Leeuw <josh.deleeuw@gmail.com>
Date: Sun, 15 Dec 2024 13:38:25 -0500
Subject: [PATCH] add newsletter subscribe page

---
 docs/newsletter/subscribe.md | 61 ++++++++++++++++++++++++++++++++++++
 mkdocs.yml                   |  2 ++
 2 files changed, 63 insertions(+)
 create mode 100644 docs/newsletter/subscribe.md

diff --git a/docs/newsletter/subscribe.md b/docs/newsletter/subscribe.md
new file mode 100644
index 0000000000..9950e475f2
--- /dev/null
+++ b/docs/newsletter/subscribe.md
@@ -0,0 +1,61 @@
+# Subscribe to our newsletter
+
+Subscribe to our newsletter to stay up to date with the latest news and updates from the jsPsych team.
+We send out newsletters about once a month.
+The newsletter includes information about new releases, upcoming events, community spotlights, and other news related to jsPsych.
+You can unsubscribe at any time.
+
+
+<form method="post" name="subscribeform" id="subscribeform" enctype="multipart/form-data"> 
+<input type="email" name="email" placeholder="Email address" id="email" size="40" class="md-input" required>
+<input type="hidden" name="htmlemail" value="1"> 
+<input type="hidden" name="list[2]" value="signup" /> 
+<input type="hidden" name="subscribe" value="subscribe"/> 
+<button class='md-button md-button--primary' onclick="if (checkform()) {submitForm();} return false;" >Subscribe</button> 
+<div id="result" style="color: red;"></div> 
+</form>
+
+<script type="text/javascript"> 
+
+  function checkform() { 
+    const re = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;    
+    const emailInput = document.getElementById("email");
+    const resultDiv = document.getElementById("result");
+    
+    if (!re.test(emailInput.value)) {
+        resultDiv.innerHTML = "Please enter a valid email address";
+        emailInput.focus();
+        return false;
+    }
+    return true;
+  } 
+
+  function submitForm() { 
+  
+    const emailInput = document.getElementById("email");
+    const successMessage = 'Thank you for your registration. Please check your email to confirm.'; 
+    const url = 'https://mail.jspsych.org/?p=asubscribe&id=6';
+    const resultDiv = document.getElementById("result");
+
+    fetch(url, {
+      method: 'POST',
+      headers: {
+          'Content-Type': 'application/x-www-form-urlencoded', // Adjust based on your content type
+      },
+      body: new URLSearchParams(new FormData(document.getElementById('subscribeform'))),
+    })
+    .then(async response => {
+      const r = await response.text();
+      console.log(r);
+    })
+    .then(data => {
+      console.log(data)
+      resultDiv.innerHTML = successMessage;
+    })
+    .catch(error => {
+      resultDiv.innerHTML = 'An error occurred. Please try again later.';
+    });
+  }
+
+  document.querySelector('button#subscribe').addEventListener('click', submitForm);
+</script>
diff --git a/mkdocs.yml b/mkdocs.yml
index e5495598c7..4510e03ec2 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -145,3 +145,5 @@ nav:
 - About:
   - 'About jsPsych': 'about/about.md'
   - 'License': 'about/license.md'
+- Newsletter:
+  - 'Subscribe': 'newsletter/subscribe.md'