From 17d0ab6df3f21be1daa6ef96e99d09d37113050b Mon Sep 17 00:00:00 2001
From: f <f@sutty.nl>
Date: Thu, 11 Feb 2021 17:49:49 -0300
Subject: [PATCH] validar fechas en navegadores que no las soportan

closes 168
---
 app/javascript/packs/application.js            | 9 +++++++++
 app/views/posts/attributes/_date.haml          | 3 ++-
 app/views/posts/attributes/_document_date.haml | 3 ++-
 config/locales/en.yml                          | 4 +++-
 config/locales/es.yml                          | 4 +++-
 5 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index 7295446d..4c232fd6 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -107,4 +107,13 @@ document.addEventListener('turbolinks:load', () => {
     // Ocultar el area
     textArea.style.display = 'none'
   })
+
+  // Validar fechas en navegadores que no soportan date
+  document.querySelectorAll('input[type="date"]').forEach(date => {
+    if (date.type === 'date') return
+
+    date.addEventListener('change', event => {
+      date.setCustomValidity(date.validity.patternMismatch ? date.dataset.patternMismatch : '')
+    })
+  })
 })
diff --git a/app/views/posts/attributes/_date.haml b/app/views/posts/attributes/_date.haml
index 38c4f500..1347c59c 100644
--- a/app/views/posts/attributes/_date.haml
+++ b/app/views/posts/attributes/_date.haml
@@ -1,6 +1,7 @@
 .form-group
   = label_tag "#{base}_#{attribute}", post_label_t(attribute, post: post)
   = date_field base, attribute, value: metadata.value.to_date.strftime('%F'),
-    **field_options(attribute, metadata)
+    **field_options(attribute, metadata), pattern: '\d{4}-\d{2}-\d{2}',
+    data: { 'pattern-mismatch': t('metadata.date.invalid_format') }
   = render 'posts/attribute_feedback',
     post: post, attribute: attribute, metadata: metadata
diff --git a/app/views/posts/attributes/_document_date.haml b/app/views/posts/attributes/_document_date.haml
index 65516718..1be997cc 100644
--- a/app/views/posts/attributes/_document_date.haml
+++ b/app/views/posts/attributes/_document_date.haml
@@ -1,6 +1,7 @@
 .form-group
   = label_tag "#{base}_#{attribute}", post_label_t(attribute, post: post)
   = date_field base, attribute, value: metadata.value.strftime('%F'),
-    **field_options(attribute, metadata)
+    **field_options(attribute, metadata), pattern: '\d{4}-\d{2}-\d{2}',
+    data: { 'pattern-mismatch': t('metadata.date.invalid_format') }
   = render 'posts/attribute_feedback',
     post: post, attribute: attribute, metadata: metadata
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 9e8cc572..e25c4d2b 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -50,6 +50,8 @@ en:
       missing_post: "Couldn't find the related post"
     has_many:
       missing_posts: "Couldn't find some related posts"
+    date:
+      invalid_format: "It seems that your browser doesn't support dates and the date is on the incorrect format, please use yyyy-mm-dd, ie. 2021-01-31"
   exceptions:
     post:
       site_missing: 'Needs an instance of Site'
@@ -462,7 +464,7 @@ en:
         label: Language
       date:
         label: Date
-        help: Publication date for this post.  If you use a date in the future the post won't be published until then.
+        help: Date for this post.  If you use a date in the future the post won't be published until you publish changes on that day.
       required:
         label: ' (required)'
         feedback: 'This field cannot be empty!'
diff --git a/config/locales/es.yml b/config/locales/es.yml
index 0bf0368d..b3bc9e5e 100644
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -50,6 +50,8 @@ es:
       missing_post: 'No se pudo encontrar el artículo relacionado'
     has_many:
       missing_posts: 'No se pudieron encontrar algunos artículos relacionados'
+    date:
+      invalid_format: 'Parece que tu navegador no soporta fechas y la fecha no está en el formato correcto, por favor usa aaaa-mm-dd, por ejemplo: 2021-01-31'
   exceptions:
     post:
       site_missing: 'Necesita una instancia de Site'
@@ -471,7 +473,7 @@ es:
         label: Idioma
       date:
         label: Fecha
-        help: La fecha de publicación del artículo.  Si colocas una fecha en el futuro no se publicará hasta ese día.
+        help: La fecha del artículo.  Si colocas una fecha en el futuro no se publicará hasta que publiques cambios ese día.
       required:
         label: ' (requerido)'
         feedback: '¡Este campo no puede estar vacío!'