auto-sync: 2026-05-06 09:40:01

This commit is contained in:
Stream
2026-05-06 09:40:01 +03:00
parent 9d91792871
commit c8d37b246c

View File

@@ -1622,22 +1622,21 @@ let rulerMarkers = [];
let rulerTotal = 0;
function toggleRuler() {
rulerMode = !rulerMode;
const btn = document.getElementById('tb-ruler');
if (rulerMode) {
if (!rulerMode && rulerPoints.length === 0) {
// Enter ruler mode fresh
deactivateAllModes();
rulerMode = true;
btn.classList.add('active');
window._map.getCanvas().style.cursor = 'crosshair';
clearRuler();
document.getElementById('ruler-info').classList.add('visible');
// Fix 4: Show toast hint on activation
// Fix 4: do NOT show panel yet — show only after first point
showRulerToast();
} else if (rulerMode) {
// Bug 1: toolbar button = "Завершить" (exit mode, keep points)
exitRulerMode();
} else {
btn.classList.remove('active');
window._map.getCanvas().style.cursor = '';
clearRuler();
document.getElementById('ruler-info').classList.remove('visible');
// rulerMode=false but points exist — just show the panel
document.getElementById('ruler-info').classList.add('visible');
}
updateMapModeClass();
}
@@ -1756,26 +1755,30 @@ function addRulerPoint(lngLat) {
rulerTotal += segDist;
}
// Hide toast on first tap
// Bug 3: hide toast on ANY tap, not just the first
const toast = document.getElementById('ruler-toast');
if (toast) toast.classList.remove('visible');
// Bug 4: show ruler-info panel after first point is added
if (idx === 0) {
const toast = document.getElementById('ruler-toast');
if (toast) toast.classList.remove('visible');
document.getElementById('ruler-info').classList.add('visible');
}
// Wrapper element for dot + label row
// Bug 6: wrapper is flex-column; label is absolute below dot so anchor:'center' hits the dot
const wrapper = document.createElement('div');
wrapper.style.cssText = 'position:relative;display:flex;flex-direction:column;align-items:center;';
// Dot - Fix 5: first point green
// Dot - first point green
const dot = document.createElement('div');
dot.className = 'ruler-dot';
const dotColor = idx === 0 ? '#2EA043' : '#0088ff';
dot.style.cssText = `width:10px;height:10px;background:${dotColor};border:2px solid #fff;border-radius:50%;box-shadow:0 0 4px rgba(0,0,0,0.3);display:block;flex-shrink:0;`;
// Label row: [distance text][× button] in one line
// Label row: [distance text][× button] — absolutely positioned below dot
const label = document.createElement('div');
label.className = 'ruler-label';
label.style.cssText = 'margin-top:3px;display:flex;align-items:center;gap:4px;background:rgba(20,20,20,0.75);color:#fff;font-size:10px;padding:2px 6px;border-radius:3px;white-space:nowrap;';
label.style.cssText = 'position:absolute;top:100%;margin-top:3px;display:flex;align-items:center;gap:4px;background:rgba(20,20,20,0.75);color:#fff;font-size:10px;padding:2px 6px;border-radius:3px;white-space:nowrap;';
const labelText = document.createElement('span');
if (idx === 0) {
@@ -1786,11 +1789,12 @@ function addRulerPoint(lngLat) {
: Math.round(segDist * 1000) + ' м';
}
// Remove button × inline with label - Fix 1: bigger tap target
const btn = document.createElement('span');
// Bug 5: use button element for better tap target and semantics
const btn = document.createElement('button');
btn.type = 'button';
btn.className = 'ruler-remove-btn';
btn.textContent = '×';
btn.style.cssText = 'cursor:pointer;font-size:16px;line-height:1;opacity:0.85;padding:4px 8px;min-width:32px;min-height:32px;display:flex;align-items:center;justify-content:center;margin:-2px -6px -2px 0;';
btn.style.cssText = 'background:none;border:none;cursor:pointer;font-size:16px;line-height:1;opacity:0.85;padding:4px 8px;min-width:32px;min-height:32px;display:flex;align-items:center;justify-content:center;margin:-2px -6px -2px 0;color:#fff;';
btn.onclick = (e) => { e.stopPropagation(); removeRulerPoint(idx); };
label.appendChild(labelText);
@@ -1799,7 +1803,19 @@ function addRulerPoint(lngLat) {
wrapper.appendChild(dot);
wrapper.appendChild(label);
const dotMarker = new maplibregl.Marker({ element: wrapper, anchor: 'top' })
// Bug 2: tap on marker wrapper resumes ruler mode
wrapper.addEventListener('click', (e) => {
e.stopPropagation();
if (!rulerMode && rulerPoints.length > 0) {
rulerMode = true;
document.getElementById('tb-ruler').classList.add('active');
window._map.getCanvas().style.cursor = 'crosshair';
updateMapModeClass();
}
document.getElementById('ruler-info').classList.add('visible');
});
const dotMarker = new maplibregl.Marker({ element: wrapper, anchor: 'center' })
.setLngLat([lngLat.lng, lngLat.lat])
.addTo(map);
rulerMarkers.push(dotMarker);