mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-01-28 21:07:16 +00:00
On the map page, when we search a location and than want to search for another, we would have to delete letter by letter of the previous search text. Now, when we click on the search input to type another search text, the previous text will be all selected and we can remove everything with just hitting the backspace once
55 lines
1.9 KiB
CoffeeScript
55 lines
1.9 KiB
CoffeeScript
angular.module('Darkswarm').directive 'mapSearch', ($timeout, Search) ->
|
|
# Install a basic search field in a map
|
|
restrict: 'E'
|
|
require: ['^uiGmapGoogleMap', 'ngModel']
|
|
replace: true
|
|
template: '<input id="pac-input" ng-model="query" placeholder="' + t('location_placeholder') + '" onfocus="this.select()"></input>'
|
|
scope: {}
|
|
|
|
controller: ($scope) ->
|
|
$scope.query = Search.search()
|
|
|
|
$scope.$watch 'query', (query) ->
|
|
Search.search query
|
|
|
|
|
|
link: (scope, elem, attrs, ctrls) ->
|
|
[ctrl, model] = ctrls
|
|
scope.input = document.getElementById("pac-input")
|
|
|
|
$timeout =>
|
|
map = ctrl.getMap()
|
|
|
|
searchBox = scope.createSearchBox map
|
|
scope.bindSearchResponse map, searchBox
|
|
scope.biasResults map, searchBox
|
|
scope.performUrlSearch map
|
|
|
|
scope.createSearchBox = (map) ->
|
|
map.controls[google.maps.ControlPosition.TOP_LEFT].push scope.input
|
|
return new google.maps.places.SearchBox(scope.input)
|
|
|
|
scope.bindSearchResponse = (map, searchBox) ->
|
|
google.maps.event.addListener searchBox, "places_changed", =>
|
|
scope.showSearchResult map, searchBox
|
|
|
|
scope.showSearchResult = (map, searchBox) ->
|
|
places = searchBox.getPlaces()
|
|
for place in places when place.geometry.viewport?
|
|
map.fitBounds place.geometry.viewport
|
|
scope.$apply ->
|
|
model.$setViewValue elem.val()
|
|
|
|
# When the map loads, and we have a search from ?query, perform that search
|
|
scope.performUrlSearch = (map) ->
|
|
google.maps.event.addListenerOnce map, "idle", =>
|
|
google.maps.event.trigger(scope.input, 'focus',{});
|
|
google.maps.event.trigger(scope.input, 'keydown', {keyCode: 13});
|
|
|
|
# Bias the SearchBox results towards places that are within the bounds of the
|
|
# current map's viewport.
|
|
scope.biasResults = (map, searchBox) ->
|
|
google.maps.event.addListener map, "bounds_changed", ->
|
|
bounds = map.getBounds()
|
|
searchBox.setBounds bounds
|