2021-02-13 01:14:36 +00:00
|
|
|
import { Editor } from 'editor/editor'
|
|
|
|
import { EditorNode } from 'editor/types'
|
2021-03-22 20:54:26 +00:00
|
|
|
import { markNames, setAuxiliaryToolbar, clearSelected } from 'editor/utils'
|
|
|
|
|
|
|
|
function select (editor: Editor, el: HTMLAnchorElement): void {
|
|
|
|
clearSelected(editor)
|
|
|
|
el.dataset.editorSelected = ''
|
|
|
|
editor.toolbar.auxiliary.link.urlEl.value = el.href
|
|
|
|
setAuxiliaryToolbar(editor, editor.toolbar.auxiliary.link.parentEl)
|
|
|
|
}
|
2021-02-13 01:14:36 +00:00
|
|
|
|
|
|
|
export const link: EditorNode = {
|
|
|
|
selector: 'a',
|
|
|
|
allowedChildren: [...markNames.filter(n => n !== 'link'), 'text'],
|
|
|
|
handleEmpty: 'remove',
|
|
|
|
create: () => document.createElement('a'),
|
|
|
|
onClick (editor, el) {
|
|
|
|
if (!(el instanceof HTMLAnchorElement))
|
|
|
|
throw new Error('oh no')
|
2021-03-22 20:54:26 +00:00
|
|
|
select(editor, el)
|
2021-02-14 00:07:38 +00:00
|
|
|
},
|
2021-02-13 01:14:36 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export function setupAuxiliaryToolbar (editor: Editor): void {
|
|
|
|
editor.toolbar.auxiliary.link.urlEl.addEventListener('input', event => {
|
|
|
|
const url = editor.toolbar.auxiliary.link.urlEl.value
|
|
|
|
const selectedEl = editor.contentEl
|
|
|
|
.querySelector<HTMLAnchorElement>('a[data-editor-selected]')
|
|
|
|
if (!selectedEl)
|
|
|
|
throw new Error('No pude encontrar el link para setear el enlace')
|
|
|
|
|
|
|
|
selectedEl.href = url
|
|
|
|
})
|
|
|
|
editor.toolbar.auxiliary.link.urlEl.addEventListener('keydown', event => {
|
|
|
|
if (event.keyCode == 13) event.preventDefault()
|
|
|
|
})
|
|
|
|
}
|