add resizeobserver to floating menu, fix #358

This commit is contained in:
Philipp Kühn 2019-06-12 21:25:42 +02:00
parent 1bc15871d5
commit 0bb5ab6d9b

View File

@ -5,6 +5,7 @@ class Menu {
constructor({ options, editorView }) { constructor({ options, editorView }) {
this.options = { this.options = {
...{ ...{
resizeObserver: true,
element: null, element: null,
onUpdate: () => false, onUpdate: () => false,
}, },
@ -20,9 +21,21 @@ class Menu {
this.options.editor.on('focus', ({ view }) => { this.options.editor.on('focus', ({ view }) => {
this.update(view) this.update(view)
}) })
this.options.editor.on('blur', ({ event }) => { this.options.editor.on('blur', ({ event }) => {
this.hide(event) this.hide(event)
}) })
// sometimes we have to update the position
// because of a loaded images for example
if (this.options.resizeObserver && ResizeObserver) {
this.resizeObserver = new ResizeObserver(() => {
if (this.isActive) {
this.update(this.editorView)
}
})
this.resizeObserver.observe(this.editorView.dom)
}
} }
handleClick(event) { handleClick(event) {
@ -81,6 +94,10 @@ class Menu {
destroy() { destroy() {
this.options.element.removeEventListener('mousedown', this.handleClick) this.options.element.removeEventListener('mousedown', this.handleClick)
if (this.resizeObserver) {
this.resizeObserver.unobserve(this.editorView.dom)
}
} }
} }