Fix some nitpicks

This commit is contained in:
Eugene Burmakin 2025-08-01 18:39:01 +02:00
parent 0e8baf493e
commit c4c829b4b0
7 changed files with 72 additions and 63 deletions

View file

@ -81,7 +81,7 @@ export default class extends BaseController {
this.userSettings = {};
}
this.clearFogRadius = parseInt(this.userSettings.fog_of_war_meters) || 50;
this.fogLinethreshold = parseInt(this.userSettings.fog_of_war_threshold) || 90;
this.fogLineThreshold = parseInt(this.userSettings.fog_of_war_threshold) || 90;
// Store route opacity as decimal (0-1) internally
this.routeOpacity = parseFloat(this.userSettings.route_opacity) || 0.6;
this.distanceUnit = this.userSettings.maps?.distance_unit || "km";
@ -119,9 +119,6 @@ export default class extends BaseController {
const div = L.DomUtil.create('div', 'leaflet-control-stats');
let distance = parseInt(this.element.dataset.distance) || 0;
const pointsNumber = this.element.dataset.points_number || '0';
// Original stats data loading disabled:
// let distance = parseInt(this.element.dataset.distance) || 0;
// const pointsNumber = this.element.dataset.points_number || '0';
// Convert distance to miles if user prefers miles (assuming backend sends km)
if (this.distanceUnit === 'mi') {
@ -330,7 +327,7 @@ export default class extends BaseController {
distanceUnit: this.distanceUnit,
userSettings: this.userSettings,
clearFogRadius: this.clearFogRadius,
fogLinethreshold: this.fogLinethreshold,
fogLineThreshold: this.fogLineThreshold,
// Pass existing data to LiveMapHandler
existingMarkers: this.markers || [],
existingMarkersArray: this.markersArray || [],
@ -601,7 +598,7 @@ export default class extends BaseController {
// Enable fog of war when layer is added
this.fogOverlay = event.layer;
if (this.markers && this.markers.length > 0) {
this.updateFog(this.markers, this.clearFogRadius, this.fogLinethreshold);
this.updateFog(this.markers, this.clearFogRadius, this.fogLineThreshold);
}
}
@ -718,7 +715,7 @@ export default class extends BaseController {
// Update fog if enabled
if (this.map.hasLayer(this.fogOverlay)) {
this.updateFog(this.markers, this.clearFogRadius, this.fogLinethreshold);
this.updateFog(this.markers, this.clearFogRadius, this.fogLineThreshold);
}
})
.catch(error => {
@ -756,12 +753,12 @@ export default class extends BaseController {
return null;
}
updateFog(markers, clearFogRadius, fogLinethreshold) {
updateFog(markers, clearFogRadius, fogLineThreshold) {
const fog = document.getElementById('fog');
if (!fog) {
initializeFogCanvas(this.map);
}
requestAnimationFrame(() => drawFogCanvas(this.map, markers, clearFogRadius, fogLinethreshold));
requestAnimationFrame(() => drawFogCanvas(this.map, markers, clearFogRadius, fogLineThreshold));
}
initializeDrawControl() {
@ -1388,7 +1385,7 @@ export default class extends BaseController {
// Initialize fog of war if enabled in settings
if (this.userSettings.fog_of_war_enabled) {
this.updateFog(this.markers, this.clearFogRadius, this.fogLinethreshold);
this.updateFog(this.markers, this.clearFogRadius, this.fogLineThreshold);
}
// Initialize visits manager functionality

View file

@ -7,8 +7,8 @@ import BaseController from "./base_controller"
import L from "leaflet"
import { createAllMapLayers } from "../maps/layers"
import { createPopupContent } from "../maps/popups"
import { showFlashMessage } from '../maps/helpers';
import { fetchAndDisplayPhotos } from '../maps/photos';
import { showFlashMessage } from "../maps/helpers"
import { fetchAndDisplayPhotos } from "../maps/photos"
export default class extends BaseController {
static targets = ["container", "startedAt", "endedAt"]

View file

@ -23,7 +23,7 @@ export function initializeFogCanvas(map) {
return fog;
}
export function drawFogCanvas(map, markers, clearFogRadius, fogLinethreshold) {
export function drawFogCanvas(map, markers, clearFogRadius, fogLineThreshold) {
const fog = document.getElementById('fog');
// Return early if fog element doesn't exist or isn't a canvas
if (!fog || !(fog instanceof HTMLCanvasElement)) return;
@ -55,7 +55,7 @@ export function drawFogCanvas(map, markers, clearFogRadius, fogLinethreshold) {
// 4) Mark which pts are part of a line
const connected = new Array(pts.length).fill(false);
for (let i = 0; i < pts.length - 1; i++) {
if (pts[i + 1].time - pts[i].time <= fogLinethreshold) {
if (pts[i + 1].time - pts[i].time <= fogLineThreshold) {
connected[i] = true;
connected[i + 1] = true;
}
@ -78,7 +78,7 @@ export function drawFogCanvas(map, markers, clearFogRadius, fogLinethreshold) {
ctx.strokeStyle = 'rgba(255,255,255,1)';
for (let i = 0; i < pts.length - 1; i++) {
if (pts[i + 1].time - pts[i].time <= fogLinethreshold) {
if (pts[i + 1].time - pts[i].time <= fogLineThreshold) {
ctx.beginPath();
ctx.moveTo(pts[i].pixel.x, pts[i].pixel.y);
ctx.lineTo(pts[i + 1].pixel.x, pts[i + 1].pixel.y);
@ -119,7 +119,7 @@ export function createFogOverlay() {
// Draw initial fog if we have markers
if (controller.markers && controller.markers.length > 0) {
drawFogCanvas(map, controller.markers, controller.clearFogRadius, controller.fogLinethreshold);
drawFogCanvas(map, controller.markers, controller.clearFogRadius, controller.fogLineThreshold);
}
}
}
@ -134,7 +134,7 @@ export function createFogOverlay() {
// Redraw fog after resize
if (this._controller && this._controller.markers) {
drawFogCanvas(map, this._controller.markers, this._controller.clearFogRadius, this._controller.fogLinethreshold);
drawFogCanvas(map, this._controller.markers, this._controller.clearFogRadius, this._controller.fogLineThreshold);
}
}
};
@ -155,9 +155,9 @@ export function createFogOverlay() {
},
// Method to update fog when markers change
updateFog: function(markers, clearFogRadius, fogLinethreshold) {
updateFog: function(markers, clearFogRadius, fogLineThreshold) {
if (this._map) {
drawFogCanvas(this._map, markers, clearFogRadius, fogLinethreshold);
drawFogCanvas(this._map, markers, clearFogRadius, fogLineThreshold);
}
}
});

View file

@ -33,7 +33,7 @@ export class LiveMapHandler {
this.distanceUnit = options.distanceUnit || 'km';
this.userSettings = options.userSettings || {};
this.clearFogRadius = options.clearFogRadius || 100;
this.fogLinethreshold = options.fogLinethreshold || 10;
this.fogLineThreshold = options.fogLineThreshold || 10;
// State tracking
this.isEnabled = false;

View file

@ -1,5 +1,16 @@
import { createPopupContent } from "./popups";
const MARKER_DATA_INDICES = {
LATITUDE: 0,
LONGITUDE: 1,
BATTERY: 2,
ALTITUDE: 3,
TIMESTAMP: 4,
VELOCITY: 5,
ID: 6,
COUNTRY: 7
};
/**
* MarkerFactory - Centralized marker creation with consistent styling
*
@ -231,12 +242,12 @@ function addDragHandlers(marker, apiKey, userSettings) {
const updatedMarkerData = [
parseFloat(data.latitude),
parseFloat(data.longitude),
originalMarkerData[2], // battery
originalMarkerData[3], // altitude
originalMarkerData[4], // timestamp
originalMarkerData[5], // velocity
data.id, // id
originalMarkerData[7] // country
originalMarkerData[MARKER_DATA_INDICES.BATTERY],
originalMarkerData[MARKER_DATA_INDICES.ALTITUDE],
originalMarkerData[MARKER_DATA_INDICES.TIMESTAMP],
originalMarkerData[MARKER_DATA_INDICES.VELOCITY],
data.id,
originalMarkerData[MARKER_DATA_INDICES.COUNTRY]
];
// Update the marker's stored data

View file

@ -1,4 +1,5 @@
import { createInteractiveMarker, createSimplifiedMarker } from "./marker_factory";
import { haversineDistance } from "./helpers";
export function createMarkersArray(markersData, userSettings, apiKey) {
// Create a canvas renderer
@ -29,11 +30,8 @@ export function createSimplifiedMarkers(markersData, renderer, userSettings) {
const [prevLat, prevLon, , , prevTimestamp] = previousMarker;
const timeDiff = currTimestamp - prevTimestamp;
// Note: haversineDistance function would need to be imported or implemented
// For now, using simple distance calculation
const latDiff = currLat - prevLat;
const lngDiff = currLon - prevLon;
const distance = Math.sqrt(latDiff * latDiff + lngDiff * lngDiff) * 111000; // Rough conversion to meters
// Use haversineDistance for accurate distance calculation
const distance = haversineDistance(prevLat, prevLon, currLat, currLon, 'km') * 1000; // Convert to meters
// Keep the marker if it's far enough in distance or time
if (distance >= distanceThreshold || timeDiff >= timeThreshold) {

View file

@ -491,11 +491,14 @@ export class VisitsManager {
// Update the drawer content if it's being opened - but don't fetch visits automatically
if (this.drawerOpen) {
console.log('Drawer opened - showing placeholder message');
// Just show a placeholder message in the drawer, don't fetch visits
const container = document.getElementById('visits-list');
if (container) {
container.innerHTML = '<p class="text-gray-500">Enable "Suggested Visits" or "Confirmed Visits" layers to see visits data</p>';
container.innerHTML = `
<div class="text-gray-500 text-center p-4">
<p class="mb-2">No visits data loaded</p>
<p class="text-sm">Enable "Suggested Visits" or "Confirmed Visits" layers from the map controls to view visits.</p>
</div>
`;
}
}
// Note: Layer visibility is now controlled by the layer control, not the drawer state