diff --git a/umap/static/umap/js/modules/ui/base.js b/umap/static/umap/js/modules/ui/base.js index 4f0c176c..50b55487 100644 --- a/umap/static/umap/js/modules/ui/base.js +++ b/umap/static/umap/js/modules/ui/base.js @@ -63,6 +63,22 @@ export class Positioned { else this.container.style.bottom = 'initial' } + computePosition([x, y]) { + let left + let top + if (x < window.innerWidth / 2) { + left = x + } else { + left = x - this.container.offsetWidth + } + if (y < window.innerHeight / 2) { + top = y + } else { + top = y - this.container.offsetHeight + } + this.setPosition({ left, top }) + } + getDocHeight() { const D = document return Math.max( diff --git a/umap/static/umap/js/modules/ui/contextmenu.js b/umap/static/umap/js/modules/ui/contextmenu.js index 65516055..1ff33a5d 100644 --- a/umap/static/umap/js/modules/ui/contextmenu.js +++ b/umap/static/umap/js/modules/ui/contextmenu.js @@ -1,7 +1,9 @@ import { loadTemplate } from '../utils.js' +import { Positioned } from './base.js' -export default class ContextMenu { +export default class ContextMenu extends Positioned { constructor(options = {}) { + super() this.options = options this.container = document.createElement('ul') this.container.className = 'umap-contextmenu' @@ -26,7 +28,7 @@ export default class ContextMenu { this.container.appendChild(li) } document.body.appendChild(this.container) - this.setPosition([x, y], this.container) + this.computePosition([x, y]) this.container.querySelector('button').focus() this.container.addEventListener('keydown', (event) => { if (event.key === 'Escape') { @@ -36,19 +38,6 @@ export default class ContextMenu { }) } - setPosition([x, y], element) { - if (x < window.innerWidth / 2) { - this.container.style.left = `${x}px` - } else { - this.container.style.left = `${x - element.offsetWidth}px` - } - if (y < window.innerHeight / 2) { - this.container.style.top = `${y}px` - } else { - this.container.style.top = `${y - element.offsetHeight}px` - } - } - close() { try { this.container.remove()