vínculos

This commit is contained in:
f 2020-11-18 13:37:15 -03:00
parent 28afa046a3
commit aabd6f1a5b
5 changed files with 33 additions and 3 deletions

View file

@ -31,6 +31,10 @@ const marks = {
selector: "mark", selector: "mark",
createFn: () => document.createElement("MARK"), createFn: () => document.createElement("MARK"),
}, },
a: {
selector: "a",
createFn: () => document.createElement("A"),
}
} }
const tagNameSetFn = tagName => el => { const tagNameSetFn = tagName => el => {
@ -174,6 +178,28 @@ function rgb2hex(rgb) {
const getSelected = contentEl => contentEl.querySelector(".selected") const getSelected = contentEl => contentEl.querySelector(".selected")
const typesWithProperties = { const typesWithProperties = {
a: {
selector: marks.a.selector,
updateInput (el, editorEl) {
setAuxiliaryToolbar(editorEl, "a")
const markAInputEl = editorEl.querySelector(`*[data-prop="a-href"]`)
markAInputEl.disabled = false
markAInputEl.value = el.href
},
disableInput (editorEl) {
const markAInputEl = editorEl.querySelector(`*[data-prop="a-href"]`)
markAInputEl.disabled = true
markAInputEl.value = ""
},
setupInput (editorEl, contentEl) {
const markAInputEl = editorEl.querySelector(`*[data-prop="a-href"]`)
markAInputEl.addEventListener("change", event => {
const markEl = contentEl.querySelector(marks.a.selector + ".selected")
if (markEl) markEl.href = markAInputEl.value
}, false)
}
},
mark: { mark: {
selector: marks.mark.selector, selector: marks.mark.selector,
updateInput (el, editorEl) { updateInput (el, editorEl) {

View file

@ -461,6 +461,7 @@ function setupEditor (editorEl) {
document.addEventListener(editorBtn("audio"), () => setAuxiliaryToolbar(editorEl, "audio")) document.addEventListener(editorBtn("audio"), () => setAuxiliaryToolbar(editorEl, "audio"))
document.addEventListener(editorBtn("video"), () => setAuxiliaryToolbar(editorEl, "video")) document.addEventListener(editorBtn("video"), () => setAuxiliaryToolbar(editorEl, "video"))
document.addEventListener(editorBtn("pdf"), () => setAuxiliaryToolbar(editorEl, "pdf")) document.addEventListener(editorBtn("pdf"), () => setAuxiliaryToolbar(editorEl, "pdf"))
document.addEventListener(editorBtn("a"), () => setAuxiliaryToolbar(editorEl, "a"))
for (const video of document.querySelectorAll('.editor .editor-content video')) { for (const video of document.querySelectorAll('.editor .editor-content video')) {
video.addEventListener('click', event => event.target.controls = true) video.addEventListener('click', event => event.target.controls = true)

View file

@ -18,6 +18,7 @@
%button.btn{ data: { button: 'deleted' } }= t('editor.deleted') %button.btn{ data: { button: 'deleted' } }= t('editor.deleted')
%button.btn{ data: { button: 'underline' } }= t('editor.underline') %button.btn{ data: { button: 'underline' } }= t('editor.underline')
%button.btn{ data: { button: 'mark' } }= t('editor.mark') %button.btn{ data: { button: 'mark' } }= t('editor.mark')
%button.btn{ data: { button: 'a' } }= t('editor.a')
%button.btn{ data: { button: 'h1' } }= t('editor.h1') %button.btn{ data: { button: 'h1' } }= t('editor.h1')
%button.btn{ data: { button: 'h2' } }= t('editor.h2') %button.btn{ data: { button: 'h2' } }= t('editor.h2')
%button.btn{ data: { button: 'h3' } }= t('editor.h3') %button.btn{ data: { button: 'h3' } }= t('editor.h3')
@ -68,9 +69,9 @@
%input.custom-file-input{ type: 'file', data: { prop: 'pdf-file' }, accept: 'application/pdf' }/ %input.custom-file-input{ type: 'file', data: { prop: 'pdf-file' }, accept: 'application/pdf' }/
%label.custom-file-label{ for: 'pdf-file' }= t('editor.file.pdf') %label.custom-file-label{ for: 'pdf-file' }= t('editor.file.pdf')
.form-group{ data: { editor: { auxiliary: 'link' } } } .form-group{ data: { editor: { auxiliary: 'a' } } }
%label{ for: 'link-href' }= t('editor.url') %label{ for: 'a-href' }= t('editor.url')
%input.form-control{ type: 'url', data: { prop: 'link-href' } }/ %input.form-control{ type: 'url', data: { prop: 'a-href' } }/
.editor-content.form-control.h-auto.mt-1{ contenteditable: 'true' } .editor-content.form-control.h-auto.mt-1{ contenteditable: 'true' }
= metadata.value.html_safe = metadata.value.html_safe

View file

@ -560,6 +560,7 @@ en:
deleted: Strikethrough deleted: Strikethrough
underline: Underline underline: Underline
mark: Mark mark: Mark
a: Link
h1: Heading 1 h1: Heading 1
h2: Heading 2 h2: Heading 2
h3: Heading 3 h3: Heading 3

View file

@ -579,6 +579,7 @@ es:
deleted: Tachado deleted: Tachado
underline: Subrayado underline: Subrayado
mark: Resaltado mark: Resaltado
a: Vínculo
h1: Título 1 h1: Título 1
h2: Título 2 h2: Título 2
h3: Título 3 h3: Título 3