mirror of
https://github.com/Freika/dawarich.git
synced 2026-01-10 01:01:39 -05:00
Fix some nitpicks
This commit is contained in:
parent
0e8baf493e
commit
c4c829b4b0
7 changed files with 72 additions and 63 deletions
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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"]
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Reference in a new issue