From 26083728890ff019c3bda9f2bfc13b4f04828314 Mon Sep 17 00:00:00 2001
From: f <f@sutty.nl>
Date: Thu, 19 Nov 2020 18:49:53 -0300
Subject: [PATCH] =?UTF-8?q?guardar=20art=C3=ADculos=20para=20poder=20recup?=
 =?UTF-8?q?erarlos=20despu=C3=A9s?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/assets/javascripts/02-editor.js      | 34 ++++++++++++++++++++++--
 app/views/posts/attributes/_content.haml |  2 +-
 2 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/02-editor.js b/app/assets/javascripts/02-editor.js
index 659805e..c9e7f08 100644
--- a/app/assets/javascripts/02-editor.js
+++ b/app/assets/javascripts/02-editor.js
@@ -1,5 +1,28 @@
 const origin = location.origin
 
+/*
+ * Guarda una copia local de los cambios para poder recuperarlos
+ * después.
+ *
+ * Usamos la URL completa sin anchors.
+ */
+const storageKey = (editorEl) => window.location.href.split('#')[0] + '#' + editorEl.id
+
+const storeContent = (editorEl, contentEl) => {
+	if (contentEl.innerText.trim().length === 0) return
+
+	window.localStorage.setItem(storageKey(editorEl), contentEl.innerHTML)
+}
+
+const restoreContent = (editorEl, contentEl) => {
+	const content = window.localStorage.getItem(storageKey(editorEl))
+
+	if (!content) return
+	if (content.trim().length === 0) return
+
+	contentEl.innerHTML = content
+}
+
 function uploadFile (file) {
 	return new Promise((resolve, reject) => {
 		const upload = new ActiveStorage.DirectUpload(
@@ -431,8 +454,10 @@ function setupEditor (editorEl) {
 	const htmlEl = editorEl.querySelector("textarea")
 	const observer = new MutationObserver((mutationList, observer) => {
 		cleanContent(contentEl)
-		htmlEl.value = contentEl.innerHTML
 		fixContent(contentEl)
+		storeContent(editorEl, contentEl)
+
+		htmlEl.value = contentEl.innerHTML
 	})
 	observer.observe(contentEl, {
 		childList: true,
@@ -485,8 +510,13 @@ function setupEditor (editorEl) {
 	}
 
 	cleanContent(contentEl)
-	htmlEl.value = contentEl.innerHTML
 	fixContent(contentEl)
+
+	// Recuperar el contenido si hay algo guardado
+	// TODO: Preguntar si se lo quiere recuperar.
+	restoreContent(editorEl, contentEl)
+
+	htmlEl.value = contentEl.innerHTML
 }
 
 // TODO: por ahora confiamos, quizás queremos filtrar estilos?
diff --git a/app/views/posts/attributes/_content.haml b/app/views/posts/attributes/_content.haml
index 92c92f2..71b7ed3 100644
--- a/app/views/posts/attributes/_content.haml
+++ b/app/views/posts/attributes/_content.haml
@@ -3,7 +3,7 @@
   = render 'posts/attribute_feedback',
     post: post, attribute: attribute, metadata: metadata
 
-  .editor
+  .editor{ id: attribute }
     .alert.alert-info
       :markdown
         #{t('editor.alert')}