Contact form thank you message

layouts/partials/scripts/contact.min.js

@@ -1 +1,91 @@
-$("#form-contact").addEventListener("submit",function(e){e.preventDefault();var t=$("input[name=name]").value,a=$("input[name=email").value,n=$("input[name=_subject").value,s=$("textarea[name=message]").value,i=new XMLHttpRequest,m={name:t,_replyto:a,email:a,_subject:n,message:s};i.open("POST","https://formspree.io/{{ .Site.Params.email }}",!0),i.setRequestHeader("Content-Type","application/json; charset=UTF-8"),i.send(JSON.stringify(m))});
+$('#form-contact').addEventListener('submit', function(e) {
+ e.preventDefault();
+
+ // Store form field values
+ var name = $("input[name=name]").value;
+ var email = $("input[name=email").value;
+ var subject = $("input[name=_subject").value;
+ var message = $("textarea[name=message]").value;
+
+ // AJAX request
+ var request = new XMLHttpRequest();
+ var data = {
+ name:name,
+ _replyto:email,
+ email:email,
+ _subject:subject,
+ message:message,
+ }
+
+ // Send to Formspree
+ request.open('POST', 'https://formspree.io/{{ .Site.Params.email }}', true);
+ request.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
+ // Call function when the state changes
+ request.onreadystatechange = function() {
+ if (request.readyState == 4 && request.status == 200) {
+ console.log(request.responseText);
+
+ // Reset form
+ $('#form-contact').reset();
+
+ var submit = $('#form-submit');
+ var thanks = $('#form-thankyou');
+
+ function thankYouFadeIn() {
+ // Fade out submit button
+ submit.visibility = 'hidden';
+ submit.classList.add('hide');
+ submit.classList.remove('show');
+
+ // Fade in thank you message
+ thanks.visibility = 'visible';
+ thanks.classList.add('show');
+ thanks.classList.remove('hide');
+ setTimeout(thankYouFadeOut, 4000);
+ };
+
+ function thankYouFadeOut() {
+ // Fade out thank you message
+ thanks.visibility = 'hidden';
+ thanks.classList.add('hide');
+ thanks.classList.remove('show');
+
+ // Fade in submit button
+ submit.visibility = 'visible';
+ submit.classList.add('show');
+ submit.classList.remove('hide');
+ };
+
+ thankYouFadeIn();
+ }
+ }
+ request.send(JSON.stringify(data));
+
+
+ // $.ajax({
+ // url:"https://formspree.io/{{ .Site.Params.email }}",
+ // method:"POST",
+ // data:{
+ // name:name,
+ // _replyto:email,
+ // email:email,
+ // _subject:subject,
+ // message:message,
+ // },
+ // dataType:"json",
+ // success:function() {
+ // console.log("Form successfully sent");
+ // // Reset form
+ // $("#form-contact").get(0).reset();
+ // // Fade out submit button, fade in thank you message, then fade out message and fade in submit button
+ // $("#form-submit").fadeOut(function(){
+ // $("#form-thankyou").fadeIn(function(){
+ // $("#form-thankyou").delay(4000).fadeOut(function(){
+ // $("#form-submit").fadeIn();
+ // });
+ // });
+ // });
+ // }
+ // });
+
+});