fix: fix contextmenu positionning when map is not full screen

This commit is contained in:
Yohan Boniface 2024-10-05 08:55:56 +02:00
parent c90618a248
commit cba0af96f6
2 changed files with 9 additions and 6 deletions

View file

@ -63,16 +63,18 @@ export class Positioned {
else this.container.style.bottom = 'initial'
}
computePosition([x, y]) {
computePosition([x, y], parent) {
let left
let top
if (x < window.innerWidth / 2) {
x = x - parent.getBoundingClientRect().left
y = y - parent.getBoundingClientRect().top
if (x < parent.offsetWidth / 2) {
left = x
} else {
left = x - this.container.offsetWidth
}
if (y < window.innerHeight / 2) {
top = Math.min(y, window.innerHeight - this.container.offsetHeight)
if (y < parent.offsetHeight / 2) {
top = Math.min(y, parent.offsetHeight - this.container.offsetHeight)
} else {
top = Math.max(0, y - this.container.offsetHeight)
}

View file

@ -36,11 +36,12 @@ export default class ContextMenu extends Positioned {
this.container.appendChild(li)
}
}
document.body.appendChild(this.container)
const parent = document.elementFromPoint(left, top).closest('.leaflet-container')
parent.appendChild(this.container)
if (this.options.fixed) {
this.setPosition({ left, top })
} else {
this.computePosition([left, top])
this.computePosition([left, top], parent)
}
this.container.querySelector('li > *').focus()
this.container.addEventListener(