mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-02-01 21:47:16 +00:00
When query changed (typing or autocomplete), update URL. When page loads, perform query search.
This commit is contained in:
@@ -1,23 +1,33 @@
|
||||
Darkswarm.directive 'mapSearch', ($timeout) ->
|
||||
Darkswarm.directive 'mapSearch', ($timeout, Search) ->
|
||||
# Install a basic search field in a map
|
||||
restrict: 'E'
|
||||
require: '^googleMap'
|
||||
require: ['^googleMap', 'ngModel']
|
||||
replace: true
|
||||
template: '<input id="pac-input" placeholder="' + t('location_placeholder') + '"></input>'
|
||||
template: '<input id="pac-input" ng-model="query" placeholder="' + t('location_placeholder') + '"></input>'
|
||||
scope: {}
|
||||
link: (scope, elem, attrs, ctrl) ->
|
||||
|
||||
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) ->
|
||||
input = document.getElementById("pac-input")
|
||||
map.controls[google.maps.ControlPosition.TOP_LEFT].push input
|
||||
return new google.maps.places.SearchBox(input)
|
||||
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", =>
|
||||
@@ -30,6 +40,12 @@ Darkswarm.directive 'mapSearch', ($timeout) ->
|
||||
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.addListener map, "tilesloaded", =>
|
||||
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) ->
|
||||
|
||||
Reference in New Issue
Block a user