From 26083728890ff019c3bda9f2bfc13b4f04828314 Mon Sep 17 00:00:00 2001 From: f 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 659805e3..c9e7f088 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 92c92f21..71b7ed38 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')}