Adjust right click location, bottom links
This commit is contained in:
parent
7087dea5ab
commit
62c9d92a2c
@ -207,8 +207,6 @@
|
|||||||
|
|
||||||
<div class="auth-links">
|
<div class="auth-links">
|
||||||
<a href="/login">Login</a>
|
<a href="/login">Login</a>
|
||||||
<span>|</span>
|
|
||||||
<a href="/city/salem">View Salem (Default)</a>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -240,17 +238,11 @@
|
|||||||
|
|
||||||
if (user) {
|
if (user) {
|
||||||
addCitySection.style.display = 'block';
|
addCitySection.style.display = 'block';
|
||||||
authLinks.innerHTML = `
|
authLinks.innerHTML = ``;
|
||||||
<a href="/dashboard">Dashboard</a>
|
|
||||||
<span>|</span>
|
|
||||||
<a href="/city/salem">View Salem (Default)</a>
|
|
||||||
`;
|
|
||||||
} else {
|
} else {
|
||||||
addCitySection.style.display = 'none';
|
addCitySection.style.display = 'none';
|
||||||
authLinks.innerHTML = `
|
authLinks.innerHTML = `
|
||||||
<a href="/login">Login</a>
|
<a href="/login">Login</a>
|
||||||
<span>|</span>
|
|
||||||
<a href="/city/salem">View Salem (Default)</a>
|
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -145,7 +145,7 @@
|
|||||||
|
|
||||||
|
|
||||||
.context-menu {
|
.context-menu {
|
||||||
position: absolute;
|
position: fixed;
|
||||||
background: white;
|
background: white;
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
@ -450,9 +450,16 @@
|
|||||||
// Handle right-click context menu
|
// Handle right-click context menu
|
||||||
map.on('contextmenu', function(e) {
|
map.on('contextmenu', function(e) {
|
||||||
e.originalEvent.preventDefault();
|
e.originalEvent.preventDefault();
|
||||||
const clientX = e.originalEvent.clientX || e.originalEvent.pageX;
|
// Use containerPoint relative to map + map container viewport position
|
||||||
const clientY = e.originalEvent.clientY || e.originalEvent.pageY;
|
const containerPoint = e.containerPoint;
|
||||||
showContextMenu(clientX, clientY, e.latlng);
|
const mapContainer = map.getContainer();
|
||||||
|
const mapRect = mapContainer.getBoundingClientRect();
|
||||||
|
const viewportX = mapRect.left + containerPoint.x;
|
||||||
|
const viewportY = mapRect.top + containerPoint.y;
|
||||||
|
console.log('Container point:', containerPoint);
|
||||||
|
console.log('Map rect:', mapRect);
|
||||||
|
console.log('Viewport coordinates:', viewportX, viewportY);
|
||||||
|
showContextMenu(viewportX, viewportY, e.latlng);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Handle long-press for mobile
|
// Handle long-press for mobile
|
||||||
@ -464,7 +471,13 @@
|
|||||||
longPressStarted = true;
|
longPressStarted = true;
|
||||||
longPressTimer = setTimeout(() => {
|
longPressTimer = setTimeout(() => {
|
||||||
if (longPressStarted) {
|
if (longPressStarted) {
|
||||||
showContextMenu(e.originalEvent.clientX, e.originalEvent.clientY, e.latlng);
|
// Use containerPoint relative to map + map container viewport position
|
||||||
|
const containerPoint = e.containerPoint;
|
||||||
|
const mapContainer = map.getContainer();
|
||||||
|
const mapRect = mapContainer.getBoundingClientRect();
|
||||||
|
const viewportX = mapRect.left + containerPoint.x;
|
||||||
|
const viewportY = mapRect.top + containerPoint.y;
|
||||||
|
showContextMenu(viewportX, viewportY, e.latlng);
|
||||||
}
|
}
|
||||||
}, 500); // 500ms for long press
|
}, 500); // 500ms for long press
|
||||||
}
|
}
|
||||||
@ -498,12 +511,18 @@
|
|||||||
const contextMenu = document.getElementById('contextMenu');
|
const contextMenu = document.getElementById('contextMenu');
|
||||||
contextMenuPosition = latlng;
|
contextMenuPosition = latlng;
|
||||||
|
|
||||||
|
console.log('showContextMenu called with coordinates:', x, y);
|
||||||
|
console.log('Mouse event coordinates should be:', x, y);
|
||||||
|
|
||||||
contextMenu.style.display = 'block';
|
contextMenu.style.display = 'block';
|
||||||
contextMenu.style.left = x + 'px';
|
contextMenu.style.left = x + 'px';
|
||||||
contextMenu.style.top = y + 'px';
|
contextMenu.style.top = y + 'px';
|
||||||
|
|
||||||
// Adjust position if menu goes off screen
|
// Check actual position after setting
|
||||||
const rect = contextMenu.getBoundingClientRect();
|
const rect = contextMenu.getBoundingClientRect();
|
||||||
|
console.log('Context menu actual position:', rect.left, rect.top);
|
||||||
|
|
||||||
|
// Adjust position if menu goes off screen
|
||||||
const viewportWidth = window.innerWidth;
|
const viewportWidth = window.innerWidth;
|
||||||
const viewportHeight = window.innerHeight;
|
const viewportHeight = window.innerHeight;
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user