diff --git a/_includes/contact.html b/_includes/contact.html index 860b3bc..58aa20d 100644 --- a/_includes/contact.html +++ b/_includes/contact.html @@ -9,6 +9,8 @@ envío del formulario. encuentra en _data/forms/contacto.yml {% endcomment %}
{%- for field in include.form -%} diff --git a/_includes/submit.html b/_includes/submit.html index 5032564..6f82e96 100644 --- a/_includes/submit.html +++ b/_includes/submit.html @@ -1 +1,5 @@ - + diff --git a/_packs/controllers/contact_controller.js b/_packs/controllers/contact_controller.js new file mode 100644 index 0000000..108119d --- /dev/null +++ b/_packs/controllers/contact_controller.js @@ -0,0 +1,42 @@ +import { Controller } from 'stimulus' + +/* + * Sólo permite enviar el formulario de contacto después de unos + * segundos, para evitar el spam. + */ +export default class extends Controller { + static targets = [ 'submit' ] + + connect () { + if (!this.hasSubmitTarget) return + + this.submitTarget.disabled = true + + this._value = this.submitTarget.value + + // Esperar un minuto desde que se carga la página hasta que se + // permite enviar. + this._interval = setInterval(() => { + const delay = this.delay + + if (this.delay == 0) { + clearInterval(this._interval) + this.submitTarget.disabled = false + this.submitTarget.value = this._value + } else { + this.delay = delay - 1 + } + }, 1000) + } + + get delay () { + const delay = parseInt(this.element.dataset.delay) + + return isNaN(delay) ? 0 : delay + } + + set delay (value) { + this.element.dataset.delay = value + this.submitTarget.value = `${this._value} (${value})` + } +}