-
Notifications
You must be signed in to change notification settings - Fork 5
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #285 from gtt-project/dkastl/issue98
Reimplements Geocoder/Location Search
- Loading branch information
Showing
15 changed files
with
483 additions
and
151 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,62 @@ | ||
| import ol_ext_element from 'ol-ext/util/element'; | ||
|
|
||
| export function applyCustomButton(searchControl: any, options: any) { | ||
| // Remove the default button if it exists | ||
| const defaultButton = searchControl.element.querySelector('button[type="button"]'); | ||
| if (defaultButton) { | ||
| defaultButton.remove(); | ||
| } | ||
|
|
||
| // Create a custom search button with a custom icon | ||
| searchControl.button = ol_ext_element.create('BUTTON', { | ||
| className: 'ol-search-gtt', | ||
| title: options.title || 'Search', | ||
| html: options.html || '<i class="mdi mdi-map-search-outline"></i>', | ||
| parent: searchControl.element, | ||
| click: function () { | ||
| searchControl.element.classList.toggle('ol-collapsed'); | ||
| if (!searchControl.element.classList.contains('ol-collapsed')) { | ||
| const input = searchControl.element.querySelector('input.search'); | ||
| if (input) { | ||
| input.focus(); | ||
| searchControl.drawList_(); | ||
| } | ||
| } | ||
| }.bind(searchControl) | ||
| }) as HTMLButtonElement; | ||
|
|
||
| // Handle the reverse button if reverse geocoding is enabled | ||
| if (options.providerOptions.reverse) { | ||
| // Remove the default reverse button if it exists | ||
| const defaultReverseButton = searchControl.element.querySelector('button.ol-revers'); | ||
| if (defaultReverseButton) { | ||
| defaultReverseButton.remove(); | ||
| } | ||
|
|
||
| // Create a custom reverse button with a custom icon | ||
| searchControl.reverseButton = ol_ext_element.create('BUTTON', { | ||
| className: 'ol-search-gtt-reverse ol-revers', | ||
| title: options.providerOptions.reverseTitle || 'Click on the map', | ||
| html: options.html_reverse || 'X', | ||
| parent: searchControl.element, | ||
| click: function () { | ||
| if (!searchControl.get('reverse')) { | ||
| searchControl.set('reverse', !searchControl.get('reverse')); | ||
| const input = searchControl.element.querySelector('input.search'); | ||
| if (input) { | ||
| input.focus(); | ||
| searchControl.element.classList.add('ol-revers'); | ||
| } | ||
| } else { | ||
| searchControl.set('reverse', false); | ||
| } | ||
| }.bind(searchControl) | ||
| }) as HTMLButtonElement; | ||
| } | ||
|
|
||
| // Move list to the end | ||
| const ul = searchControl.element.querySelector("ul.autocomplete"); | ||
| if (ul) { | ||
| searchControl.element.appendChild(ul); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| // src/components/gtt-client/geocoding/SearchFactory.ts | ||
| import { applyCustomButton } from './CustomButtonMixin'; | ||
| import SearchGTT from './SearchGTT'; | ||
| import SearchGoogle from './SearchGoogle'; | ||
| import SearchNominatim from 'ol-ext/control/SearchNominatim'; | ||
| import SearchPhoton from 'ol-ext/control/SearchPhoton'; | ||
|
|
||
| export function createSearchControl(options: any): any { | ||
| let searchControl: any; | ||
|
|
||
| // Create search control instance based on the provider | ||
| switch (options.provider) { | ||
| // Apply settings for Nomatim provider | ||
| case 'nominatim': | ||
| options.providerOptions = { | ||
| reverse: true, // Enable reverse geocoding | ||
| typing: -1, // Disable typing delay (see Nominatim policy!) | ||
| ...options.providerOptions, | ||
| }; | ||
| searchControl = new SearchNominatim(options.providerOptions); | ||
| break; | ||
| // Apply settings for Photon provider | ||
| case 'photon': | ||
| options.providerOptions = { | ||
| // lang: 'en', // Force preferred language | ||
| reverse: true, // Enable reverse geocoding | ||
| position: true, // Priority to position | ||
| ...options.providerOptions, | ||
| }; | ||
| searchControl = new SearchPhoton(options.providerOptions); | ||
| break; | ||
| // Apply settings for Google provider | ||
| case 'google': | ||
| options.providerOptions = { | ||
| reverse: true, // Enable reverse geocoding | ||
| ...options.providerOptions, | ||
| }; | ||
| searchControl = new SearchGoogle(options.providerOptions); | ||
| break; | ||
|
|
||
| case 'custom': | ||
| options.providerOptions = { | ||
| ...options.providerOptions, | ||
| }; | ||
| searchControl = new SearchGTT(options.providerOptions); | ||
| break; | ||
| // Add cases for new providers here | ||
| default: | ||
| // Throw an error if the provider is not supported | ||
| throw new Error(`Unsupported provider: ${options.provider}`); | ||
| break; | ||
| } | ||
|
|
||
| // Apply custom button implementation | ||
| applyCustomButton(searchControl, options); | ||
|
|
||
| return searchControl; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| // src/components/gtt-client/geocoding/SearchGTT.ts | ||
| import Search, { Options as SearchOptions } from 'ol-ext/control/Search'; | ||
|
|
||
| interface SearchGTTOptions extends SearchOptions { | ||
| // Add custom options here | ||
| } | ||
|
|
||
| /** | ||
| * Use this as a starting point for supporting a new geocoding service. | ||
| */ | ||
| class SearchGTT extends Search { | ||
| public button: HTMLButtonElement; | ||
|
|
||
| constructor(options: SearchGTTOptions = {}) { | ||
| options = options || {}; | ||
| options.className = options.className || 'ol-search-gtt'; | ||
|
|
||
| super(options); | ||
| } | ||
| } | ||
|
|
||
| export default SearchGTT; |
Oops, something went wrong.