diff --git a/CHANGELOG.md b/CHANGELOG.md index b0686776..91cf497f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,19 +7,6 @@ and this project adheres to [Semantic Versioning](http://semver.org/). # [Unreleased] -# Map V2 initial release (Maplibre) - -## Added - -- Places layer to Map V2 with tag filtering support (OR logic) -- "Enable All Tags" toggle for Places layer -- "Untagged" filter option for places without tags -- Visit creation functionality in Map V2 via Tools tab -- Place creation functionality in Map V2 via Tools tab -- Clickable place markers with detailed popups showing tags, notes, and coordinates -- Tag filter persistence via user settings (saved to backend) -- Default behavior: all tags enabled when Places layer is first activated -- E2E tests for Places layer functionality (13 test cases) ## Fixed @@ -30,9 +17,6 @@ and this project adheres to [Semantic Versioning](http://semver.org/). ## Changed - Points on the Map page are now loaded in chunks to improve performance and reduce memory consumption. -- Places tag filtering uses OR logic (shows places with ANY selected tag) -- "Enable All Tags" toggle auto-syncs with individual tag checkbox states -- Empty tag selection shows no places (not all places) # [0.36.0] - 2025-11-24 diff --git a/LOCATION_SEARCH_V2.md b/LOCATION_SEARCH_V2.md deleted file mode 100644 index 1f17b0a7..00000000 --- a/LOCATION_SEARCH_V2.md +++ /dev/null @@ -1,196 +0,0 @@ -# Location Search for Maps V2 - -## Overview - -Location search functionality has been implemented for Maps V2 following the established V2 architecture patterns. - -## Implementation - -### Architecture - -The implementation follows V2's modular design: - -``` -app/javascript/maps_v2/ -├── services/ -│ └── location_search_service.js # API calls for search -├── utils/ -│ └── search_manager.js # Search logic & UI management -└── controllers/ - └── maps_v2_controller.js # Integration (updated) - -app/views/maps_v2/ -└── _settings_panel.html.erb # Search UI (updated) - -e2e/v2/map/ -└── search.spec.js # E2E tests (10 tests) -``` - -### Components - -#### 1. LocationSearchService (`services/location_search_service.js`) -- Handles API calls for location suggestions -- Searches for visits at specific locations -- Creates new visits -- Clean separation of API logic - -#### 2. SearchManager (`utils/search_manager.js`) -- Manages search state and UI -- Debounced search input (300ms) -- Displays search results dropdown -- Handles result selection -- Adds temporary markers on map -- Flies map to selected location -- Dispatches custom events - -#### 3. Settings Panel Integration -- Search tab with input field -- Dropdown results container -- Stimulus data targets: `searchInput`, `searchResults` -- Auto-complete disabled for better UX - -#### 4. Controller Integration -- SearchManager initialized in `connect()` -- Proper cleanup in `disconnect()` -- Integrated with existing map instance - -## Features - -### ✅ Search Functionality -- **Debounced search** - 300ms delay to avoid excessive API calls -- **Minimum query length** - 2 characters required -- **Loading state** - Shows spinner while fetching -- **No results message** - Clear feedback when nothing found -- **Error handling** - Graceful error messages - -### ✅ Map Integration -- **Fly to location** - Smooth animation (1s duration) -- **Temporary marker** - Blue marker with white border -- **Zoom level** - Automatically zooms to level 15 -- **Marker cleanup** - Old markers removed when selecting new location - -### ✅ User Experience -- **Keyboard support** - Enter key selects first result -- **Blur handling** - Results clear after selection (200ms delay) -- **Clear on blur** - Results disappear when clicking away -- **Autocomplete off** - No browser autocomplete interference - -### ✅ Custom Events -- `location-search:selected` - Fired when location selected -- Event bubbles up for other components to listen - -## E2E Tests - -**10 tests created** in `e2e/v2/map/search.spec.js`: - -### Test Coverage -1. ✅ **Search UI** (2 tests) - - Search input visibility - - Results container existence - -2. ✅ **Search Functionality** (4 tests) - - Typing triggers search - - Short queries ignored - - Clearing search clears results - - Results shown/hidden correctly - -3. ✅ **Search Integration** (2 tests) - - Search manager initialization - - Autocomplete disabled - -4. ✅ **Accessibility** (2 tests) - - Keyboard navigation - - Descriptive labels - -**Test Results**: 9/10 passing (1 timing-related test needs adjustment) - -## Usage - -### For Users - -1. Open the map -2. Click settings button (⚙️) -3. Go to "Search" tab (default tab) -4. Type location name (minimum 2 characters) -5. Select from dropdown results -6. Map flies to location with marker - -### For Developers - -```javascript -// Search manager is automatically initialized -// Access via controller: -const controller = application.getControllerForElementAndIdentifier( - element, - 'maps-v2' -) -const searchManager = controller.searchManager - -// Listen for search events -document.addEventListener('location-search:selected', (event) => { - const { location } = event.detail - console.log('Selected:', location.name, location.lat, location.lon) -}) -``` - -## API Endpoints Expected - -The implementation expects these API endpoints: - -### GET `/api/v1/locations/suggestions?q=` -Returns location suggestions: -```json -{ - "suggestions": [ - { - "name": "New York", - "address": "New York, NY, USA", - "lat": 40.7128, - "lon": -74.0060 - } - ] -} -``` - -### GET `/api/v1/locations?lat=&lon=&name=&address=` -Returns location details and visits (if implemented) - -### POST `/api/v1/visits` -Creates a new visit (if implemented) - -## Future Enhancements - -Possible improvements: -- **Recent searches** - Store and display recent searches -- **Search history** - Persist search history in localStorage -- **Categories** - Filter results by type (cities, addresses, POIs) -- **Geocoding fallback** - Use external geocoding if no suggestions -- **Visit creation** - Allow creating visits from search results -- **Advanced search** - Search within date ranges or specific areas - -## Comparison with V1 - -### V1 (Leaflet) -- Single file: `app/javascript/maps/location_search.js` -- Mixed API/UI logic -- Direct DOM manipulation -- Leaflet-specific marker creation - -### V2 (MapLibre) -- **Modular**: Separate service/manager/controller -- **Clean separation**: API vs UI logic -- **Stimulus integration**: Data targets and lifecycle -- **MapLibre GL**: Modern marker API -- **Tested**: Comprehensive E2E coverage -- **Maintainable**: Clear file organization - -## Status - -✅ **Implementation Complete** -- Service layer created -- Manager utility created -- Settings panel updated -- Controller integrated -- E2E tests added (9/10 passing) - -The location search feature is ready for use!