- {{ statusBarIcon }}
+ mdi-information
- {{ statusBarMessage }}
+ Camera grouping is on for performance at this zoom level.
mdi-close
@@ -87,9 +82,6 @@ const isFullScreen = computed(() => route.query.fullscreen === 'true');
// Clustering Control
const clusteringEnabled = ref(true);
const currentZoom = ref(0);
-const userHasInteractedWithClustering = ref(false);
-const recentZoomActions = ref<{ timestamp: number; zoom: number; action: 'in' | 'out' }[]>([]);
-const mapInteractionCount = ref(0);
const zoomWarningDismissed = ref(false);
// Computed property to determine if clustering should be active based on zoom and user preference
@@ -107,51 +99,6 @@ const showAutoDisabledStatus = computed(() => {
return !clusteringEnabled.value && currentZoom.value < 12 && !zoomWarningDismissed.value;
});
-// Detect when user might want to see individual markers
-const shouldSuggestDeclustering = computed(() => {
- if (userHasInteractedWithClustering.value || currentZoom.value < 12) {
- return false;
- }
-
- // Check for rapid zoom-in behavior (suggests user wants detail)
- const now = Date.now();
- const recentZooms = recentZoomActions.value.filter(action => now - action.timestamp < 10000); // Last 10 seconds
- const rapidZoomIns = recentZooms.filter(action => action.action === 'in').length;
-
- // Suggest if user has zoomed in multiple times and is at a level where they can see individual markers
- return rapidZoomIns >= 2 && currentZoom.value >= 14 && clusteringEnabled.value;
-});
-
-// Unified status bar logic
-const showStatusBar = computed(() => {
- return showAutoDisabledStatus.value || shouldSuggestDeclustering.value;
-});
-
-const statusBarIcon = computed(() => {
- if (showAutoDisabledStatus.value) return 'mdi-information';
- if (shouldSuggestDeclustering.value) return 'mdi-lightbulb-on';
- return 'mdi-information';
-});
-
-const statusBarMessage = computed(() => {
- if (showAutoDisabledStatus.value) {
- return 'Camera grouping is on for performance at this zoom level.';
- }
- if (shouldSuggestDeclustering.value) {
- return 'Want to see individual cameras? Try the grouping button.';
- }
- return '';
-});
-
-const statusBarCanDismiss = computed(() => {
- return shouldSuggestDeclustering.value || showAutoDisabledStatus.value;
-});
-
-// Show button glow when status bar is giving hints about the button
-const shouldGlowButton = computed(() => {
- return shouldSuggestDeclustering.value;
-});
-
const props = defineProps({
center: {
type: Object as PropType,
@@ -393,58 +340,12 @@ function updateClusteringBehavior(): void {
map.addLayer(clusterLayer);
}
-// User Interaction Functions
-function onToggleChange(): void {
- userHasInteractedWithClustering.value = true;
- // Persist user preference
- localStorage.setItem('deflock-clustering-preference', clusteringEnabled.value.toString());
-}
-
-function dismissSuggestion(): void {
- userHasInteractedWithClustering.value = true;
- // Don't show suggestions for the rest of this session
- localStorage.setItem('deflock-clustering-preference', clusteringEnabled.value.toString());
-}
-
function dismissZoomWarning(): void {
zoomWarningDismissed.value = true;
}
-function dismissStatusBar(): void {
- if (shouldSuggestDeclustering.value) {
- dismissSuggestion();
- } else if (showAutoDisabledStatus.value) {
- dismissZoomWarning();
- }
-}
-
-function trackZoomAction(action: 'in' | 'out'): void {
- const now = Date.now();
- recentZoomActions.value.push({
- timestamp: now,
- zoom: currentZoom.value,
- action
- });
-
- // Keep only recent actions (last 30 seconds)
- recentZoomActions.value = recentZoomActions.value.filter(
- actionItem => now - actionItem.timestamp < 30000
- );
-}
-
-function trackMapInteraction(): void {
- mapInteractionCount.value++;
-}
-
// Lifecycle Hooks
onMounted(() => {
- // Initialize clustering preference from localStorage if available
- const storedPreference = localStorage.getItem('deflock-clustering-preference');
- if (storedPreference !== null) {
- clusteringEnabled.value = storedPreference === 'true';
- userHasInteractedWithClustering.value = true;
- }
-
initializeMap();
// Watch for clustering toggle
@@ -498,7 +399,6 @@ function registerMapEvents() {
emit('update:center', map.getCenter());
emit('update:zoom', map.getZoom());
emit('update:bounds', map.getBounds());
- trackMapInteraction();
}
});
@@ -512,21 +412,8 @@ function registerMapEvents() {
if (newZoom >= 12) {
zoomWarningDismissed.value = false;
}
-
- // Track zoom direction for behavioral inference
- if (newZoom > oldZoom) {
- trackZoomAction('in');
- } else if (newZoom < oldZoom) {
- trackZoomAction('out');
- }
-
- trackMapInteraction();
}
});
-
- // Track general map interactions
- map.on('click', trackMapInteraction);
- map.on('drag', trackMapInteraction);
}