From 78b791bd45990003155eb2385bec7641b97d145b Mon Sep 17 00:00:00 2001
From: Fredrik Jonsson <frjo@xdeb.org>
Date: Thu, 22 Aug 2019 15:16:57 +0200
Subject: [PATCH] Make the spam protect javascript more generic and use it for
newsletter form as well.
---
.../templates/public_forms/form_page.html | 4 ++--
.../mailchimp/newsletter_signup.html | 9 +++++++--
.../{wagtail-form.js => protect-form.js} | 20 +++++++++----------
3 files changed, 19 insertions(+), 14 deletions(-)
rename opentech/static_src/src/javascript/public/{wagtail-form.js => protect-form.js} (54%)
diff --git a/opentech/public/forms/templates/public_forms/form_page.html b/opentech/public/forms/templates/public_forms/form_page.html
index 4467e849d..dfe28f87e 100644
--- a/opentech/public/forms/templates/public_forms/form_page.html
+++ b/opentech/public/forms/templates/public_forms/form_page.html
@@ -6,7 +6,7 @@
<h1>{{ page.title }}</h1>
{{ page.intro|richtext }}
<p class="wrapper--error message-no-js js-hidden">You must have Javascript enabled to use this form.</p>
- <form class="form wagtail-form" action="#" data-pageurl="{% pageurl page %}" method="post" enctype="multipart/form-data">
+ <form class="form wagtail-form" action="#" data-actionpath="{% pageurl page %}" method="post" enctype="multipart/form-data">
{% csrf_token %}
{{ form.media }}
{% for field in form %}
@@ -22,5 +22,5 @@
{% endblock %}
{% block extra_js %}
- <script src="{% static 'js/public/wagtail-form.js' %}"></script>
+ <script src="{% static 'js/public/protect-form.js' %}"></script>
{% endblock %}
diff --git a/opentech/public/mailchimp/templates/mailchimp/newsletter_signup.html b/opentech/public/mailchimp/templates/mailchimp/newsletter_signup.html
index d45a2dfd5..5308980c8 100644
--- a/opentech/public/mailchimp/templates/mailchimp/newsletter_signup.html
+++ b/opentech/public/mailchimp/templates/mailchimp/newsletter_signup.html
@@ -1,5 +1,6 @@
+{% load static i18n %}
<h4>Get the latest internet freedom news</h4>
-<form class="form" action="{{ PUBLIC_SITE.root_url }}{% url "newsletter:subscribe" %}" method="post">
+<form class="form newsletter-form" action="#" data-actionpath="{{ PUBLIC_SITE.root_url }}{% url "newsletter:subscribe" %}" method="post">
<div>
{% for field in newsletter_form %}
<label for="{{ field.id_for_label }}"{% if field.field.required %} required{% endif %}>
@@ -11,7 +12,11 @@
{{ field }}
{% endfor %}
<div class="form-actions form-wrapper">
- <input type="submit" value="Sign up" class="form-submit button button--transparent--wide link--footer-signup">
+ <button class="form-submit button button--transparent--wide link--footer-signup" type="submit">{% trans 'Sign up' %}</button>
</div>
</div>
</form>
+
+{% block extra_js %}
+ <script src="{% static 'js/public/protect-form.js' %}"></script>
+{% endblock %}
diff --git a/opentech/static_src/src/javascript/public/wagtail-form.js b/opentech/static_src/src/javascript/public/protect-form.js
similarity index 54%
rename from opentech/static_src/src/javascript/public/wagtail-form.js
rename to opentech/static_src/src/javascript/public/protect-form.js
index c9440ff3d..64f98cba7 100644
--- a/opentech/static_src/src/javascript/public/wagtail-form.js
+++ b/opentech/static_src/src/javascript/public/protect-form.js
@@ -2,10 +2,10 @@
'use strict';
- $('.wagtail-form').each(function () {
- var $wagtail_form = $(this);
- var $wagtail_form_button = $wagtail_form.find('button[type="submit"]');
- var wagtail_form_action = $wagtail_form.data('pageurl');
+ $('.wagtail-form, .newsletter-form').each(function () {
+ var $protect_form = $(this);
+ var $protect_form_button = $protect_form.find('button[type="submit"]');
+ var protect_form_action = $protect_form.data('actionpath');
// Remove the "no javascript" messages
$('.message-no-js').detach();
@@ -13,23 +13,23 @@
// Wait for a mouse to move, indicating they are human.
$('body').mousemove(function () {
// Unlock the form.
- $wagtail_form.attr('action', wagtail_form_action);
- $wagtail_form_button.attr('disabled', false);
+ $protect_form.attr('action', protect_form_action);
+ $protect_form_button.attr('disabled', false);
});
// Wait for a touch move event, indicating that they are human.
$('body').on('touchmove', function () {
// Unlock the form.
- $wagtail_form.attr('action', wagtail_form_action);
- $wagtail_form_button.attr('disabled', false);
+ $protect_form.attr('action', protect_form_action);
+ $protect_form_button.attr('disabled', false);
});
// A tab or enter key pressed can also indicate they are human.
$('body').keydown(function (e) {
if ((e.keyCode === 9) || (e.keyCode === 13)) {
// Unlock the form.
- $wagtail_form.attr('action', wagtail_form_action);
- $wagtail_form_button.attr('disabled', false);
+ $protect_form.attr('action', protect_form_action);
+ $protect_form_button.attr('disabled', false);
}
});
});
--
GitLab