diff --git a/app/assets/javascripts/01-types.js b/app/assets/javascripts/01-types.js index c57a9cd..909b9e3 100644 --- a/app/assets/javascripts/01-types.js +++ b/app/assets/javascripts/01-types.js @@ -27,6 +27,14 @@ const marks = { selector: "u", createFn: () => document.createElement("U"), }, + sub: { + selector: "sub", + createFn: () => document.createElement("SUB"), + }, + sup: { + selector: "sup", + createFn: () => document.createElement("SUP"), + }, mark: { selector: "mark", createFn: () => document.createElement("MARK"), diff --git a/app/assets/javascripts/02-editor.js b/app/assets/javascripts/02-editor.js index 2baa89c..659805e 100644 --- a/app/assets/javascripts/02-editor.js +++ b/app/assets/javascripts/02-editor.js @@ -338,8 +338,17 @@ function cleanNode (node, contentEl) { child.parentElement.removeChild(child) return } else if (child.tagName === "STYLE") { + return child.parentElement.removeChild(child) + } else if (child.tagName === "B") { + const el = document.createElement("STRONG") + moveChildren(child, el) + child.parentElement.insertBefore(el, child) + child.parentElement.removeChild(child) + } else if (child.tagName === "I") { + const el = document.createElement("EM") + moveChildren(child, el) + child.parentElement.insertBefore(el, child) child.parentElement.removeChild(child) - return } for (const style of Object.values(child.style)) { @@ -409,6 +418,9 @@ function setupEditor (editorEl) { range.collapse() } }) + contentEl.addEventListener("paste", event => { + contentEl.querySelector("editor-aviso-word").style.display = "block" + }) document.addEventListener("selectionchange", event => { cleanContent(contentEl) }) diff --git a/app/assets/stylesheets/editor.scss b/app/assets/stylesheets/editor.scss index 03eeebd..cbf96ae 100644 --- a/app/assets/stylesheets/editor.scss +++ b/app/assets/stylesheets/editor.scss @@ -35,6 +35,11 @@ background: white; } + .editor-aviso-word { + color: red; + display: none; + } + .editor-primary-toolbar, .editor-auxiliary-toolbar { display: block; overflow-x: auto; diff --git a/app/views/posts/attributes/_content.haml b/app/views/posts/attributes/_content.haml index f45031a..c8d9c97 100644 --- a/app/views/posts/attributes/_content.haml +++ b/app/views/posts/attributes/_content.haml @@ -17,6 +17,8 @@ %button.btn{ data: { button: 'italic' } }= t('editor.italic') %button.btn{ data: { button: 'deleted' } }= t('editor.deleted') %button.btn{ data: { button: 'underline' } }= t('editor.underline') + %button.btn{ data: { button: 'sup' } }= t('editor.sup') + %button.btn{ data: { button: 'sub' } }= t('editor.sub') %button.btn{ data: { button: 'mark' } }= t('editor.mark') %button.btn{ data: { button: 'a' } }= t('editor.a') %button.btn{ data: { button: 'h1' } }= t('editor.h1') @@ -69,9 +71,12 @@ %input.custom-file-input{ type: 'file', data: { prop: 'pdf-file' }, accept: 'application/pdf' }/ %label.custom-file-label{ for: 'pdf-file' }= t('editor.file.pdf') - .form-group{ data: { editor: { auxiliary: 'a' } } } - %label{ for: 'a-href' }= t('editor.url') - %input.form-control{ type: 'url', data: { prop: 'a-href' } }/ + .form-group{ data: { editor: { auxiliary: 'link' } } } + %label{ for: 'link-href' }= t('editor.url') + %input.form-control{ type: 'url', data: { prop: 'link-href' } }/ + + .editor-aviso-word + %p ¡Alto ahí! ¿Estás pegando de word? ... .editor-content.form-control.h-auto.mt-1{ contenteditable: 'true' } = metadata.value.html_safe