Implement event handling for CKEditor plugins to improve responsiveness
This commit is contained in:
parent
38b0b87644
commit
64b53fbf51
53
service.js
53
service.js
@ -180,7 +180,7 @@ class BesService {
|
||||
}
|
||||
if (isInitialCall) {
|
||||
// TODO: Check count in 'makrofinančno' case.
|
||||
const count = this.children.reduce(
|
||||
const count = this.children?.reduce(
|
||||
(total, child) => total + child.matches.length,
|
||||
0
|
||||
)
|
||||
@ -283,7 +283,7 @@ class BesService {
|
||||
* @returns {Boolean} true if the element has already been grammar-proofed; false otherwise.
|
||||
*/
|
||||
isProofed(el) {
|
||||
return this.children.find(child => child.element === el)?.isProofed
|
||||
return this.children?.find(child => child.element === el)?.isProofed
|
||||
}
|
||||
|
||||
/**
|
||||
@ -320,7 +320,7 @@ class BesService {
|
||||
* @param {Element} el DOM element that we should re-grammar-proof
|
||||
*/
|
||||
clearMistakeMarkup(el) {
|
||||
let child = this.children.find(child => child.element === el)
|
||||
let child = this.children?.find(child => child.element === el)
|
||||
if (!child) return
|
||||
child.matches.forEach(match => {
|
||||
if (match?.highlights) {
|
||||
@ -336,7 +336,7 @@ class BesService {
|
||||
* @param {Element} el DOM element for removal
|
||||
*/
|
||||
removeChild(el) {
|
||||
this.children = this.children.filter(child => child.element !== el)
|
||||
this.children = this.children?.filter(child => child.element !== el)
|
||||
}
|
||||
|
||||
/**
|
||||
@ -663,6 +663,47 @@ class BesCKService extends BesService {
|
||||
e => this.handleBeforeCKInput(e),
|
||||
false
|
||||
)
|
||||
this.ckEditorInstance.model.document.on('change:data', () => {
|
||||
const differ = this.ckEditorInstance.model.document.differ
|
||||
const changes = Array.from(differ.getChanges())
|
||||
// TODO: on font style changes etc.
|
||||
for (const entry of changes) {
|
||||
if (entry.type === 'insert' || entry.type === 'remove') {
|
||||
const insertedElement = entry.name
|
||||
|
||||
if (['paragraph', 'blockQuote'].includes(insertedElement)) {
|
||||
if (
|
||||
entry.attributes.has('listIndent') ||
|
||||
entry.name === 'blockQuote'
|
||||
) {
|
||||
setTimeout(() => {
|
||||
this.proof(hostElement)
|
||||
window.dispatchEvent(new Event('resize'))
|
||||
}, 500)
|
||||
return
|
||||
}
|
||||
}
|
||||
if (['table'].includes(insertedElement)) {
|
||||
setTimeout(() => {
|
||||
this.repositionMistakes()
|
||||
window.dispatchEvent(new Event('resize'))
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
this.ckEditorInstance.commands.get('undo').on('execute', () => {
|
||||
this.clearAllMistakes(this.scrollPanel)
|
||||
setTimeout(() => {
|
||||
this.proof(hostElement)
|
||||
}, 500)
|
||||
})
|
||||
this.ckEditorInstance.commands.get('redo').on('execute', () => {
|
||||
this.clearAllMistakes(this.scrollPanel)
|
||||
setTimeout(() => {
|
||||
this.proof(hostElement)
|
||||
}, 500)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
@ -687,7 +728,6 @@ class BesCKService extends BesService {
|
||||
let blockElements = new Set()
|
||||
event.getTargetRanges().forEach(range => {
|
||||
BesService.getNodesInRange(range).forEach(el => {
|
||||
console.log(el)
|
||||
if (
|
||||
el === hostElement ||
|
||||
Array.from(hostElement.childNodes).includes(el)
|
||||
@ -696,7 +736,6 @@ class BesCKService extends BesService {
|
||||
}
|
||||
})
|
||||
})
|
||||
console.log(blockElements)
|
||||
blockElements.forEach(block => {
|
||||
service.clearMistakeMarkup(block)
|
||||
service.removeChild(block)
|
||||
@ -786,7 +825,7 @@ class BesCKService extends BesService {
|
||||
* @param {Element} el DOM element for removal
|
||||
*/
|
||||
removeChild(el) {
|
||||
this.children = this.children.filter(child => child.element !== el)
|
||||
this.children = this.children?.filter(child => child.element !== el)
|
||||
}
|
||||
|
||||
/**
|
||||
|
Loading…
x
Reference in New Issue
Block a user