]> git.openstreetmap.org Git - rails.git/blob - app/assets/javascripts/index/search.js
Merge remote-tracking branch 'upstream/pull/2509'
[rails.git] / app / assets / javascripts / index / search.js
1 //= require jquery.simulate
2 //= require querystring
3
4 OSM.Search = function (map) {
5   var querystring = require("querystring-component");
6
7   $(".search_form input[name=query]").on("input", function (e) {
8     if ($(e.target).val() === "") {
9       $(".describe_location").fadeIn(100);
10     } else {
11       $(".describe_location").fadeOut(100);
12     }
13   });
14
15   $(".search_form a.button.switch_link").on("click", function (e) {
16     e.preventDefault();
17     var query = $(e.target).parent().parent().find("input[name=query]").val();
18     if (query) {
19       OSM.router.route("/directions?from=" + encodeURIComponent(query) + OSM.formatHash(map));
20     } else {
21       OSM.router.route("/directions" + OSM.formatHash(map));
22     }
23   });
24
25   $(".search_form").on("submit", function (e) {
26     e.preventDefault();
27     $("header").addClass("closed");
28     var query = $(this).find("input[name=query]").val();
29     if (query) {
30       OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
31     } else {
32       OSM.router.route("/" + OSM.formatHash(map));
33     }
34   });
35
36   $(".describe_location").on("click", function (e) {
37     e.preventDefault();
38     var center = map.getCenter().wrap(),
39         precision = OSM.zoomPrecision(map.getZoom());
40     OSM.router.route("/search?whereami=1&query=" + encodeURIComponent(
41       center.lat.toFixed(precision) + "," + center.lng.toFixed(precision)
42     ));
43   });
44
45   $("#sidebar_content")
46     .on("click", ".search_more a", clickSearchMore)
47     .on("click", ".search_results_entry a.set_position", clickSearchResult)
48     .on("mouseover", "li.search_results_entry:has(a.set_position)", showSearchResult)
49     .on("mouseout", "li.search_results_entry:has(a.set_position)", hideSearchResult)
50     .on("mousedown", "li.search_results_entry:has(a.set_position)", function () {
51       var moved = false;
52       $(this).one("click", function (e) {
53         if (!moved && !$(e.target).is("a")) {
54           $(this).find("a.set_position").simulate("click", e);
55         }
56       }).one("mousemove", function () {
57         moved = true;
58       });
59     });
60
61   var markers = L.layerGroup().addTo(map);
62
63   function clickSearchMore(e) {
64     e.preventDefault();
65     e.stopPropagation();
66
67     var div = $(this).parents(".search_more");
68
69     $(this).hide();
70     div.find(".loader").show();
71
72     $.get($(this).attr("href"), function (data) {
73       div.replaceWith(data);
74     });
75   }
76
77   function showSearchResult() {
78     var marker = $(this).data("marker");
79
80     if (!marker) {
81       var data = $(this).find("a.set_position").data();
82
83       marker = L.marker([data.lat, data.lon], { icon: OSM.getUserIcon() });
84
85       $(this).data("marker", marker);
86     }
87
88     markers.addLayer(marker);
89
90     $(this).closest("li").addClass("selected");
91   }
92
93   function hideSearchResult() {
94     var marker = $(this).data("marker");
95
96     if (marker) {
97       markers.removeLayer(marker);
98     }
99
100     $(this).closest("li").removeClass("selected");
101   }
102
103   function panToSearchResult(data) {
104     if (data.minLon && data.minLat && data.maxLon && data.maxLat) {
105       map.fitBounds([[data.minLat, data.minLon], [data.maxLat, data.maxLon]]);
106     } else {
107       map.setView([data.lat, data.lon], data.zoom);
108     }
109   }
110
111   function clickSearchResult(e) {
112     var data = $(this).data();
113
114     panToSearchResult(data);
115
116     // Let clicks to object browser links propagate.
117     if (data.type && data.id) return;
118
119     e.preventDefault();
120     e.stopPropagation();
121   }
122
123   var page = {};
124
125   page.pushstate = page.popstate = function (path) {
126     var params = querystring.parse(path.substring(path.indexOf("?") + 1));
127     $(".search_form input[name=query]").val(params.query);
128     $(".describe_location").hide();
129     OSM.loadSidebarContent(path, page.load);
130   };
131
132   page.load = function () {
133     $(".search_results_entry").each(function (index) {
134       var entry = $(this);
135       $.ajax({
136         url: entry.data("href"),
137         method: "GET",
138         data: {
139           zoom: map.getZoom(),
140           minlon: map.getBounds().getWest(),
141           minlat: map.getBounds().getSouth(),
142           maxlon: map.getBounds().getEast(),
143           maxlat: map.getBounds().getNorth()
144         },
145         success: function (html) {
146           entry.html(html);
147           // go to first result of first geocoder
148           if (index === 0) {
149             var firstResult = entry.find("*[data-lat][data-lon]:first").first();
150             if (firstResult.length) {
151               panToSearchResult(firstResult.data());
152             }
153           }
154         }
155       });
156     });
157
158     return map.getState();
159   };
160
161   page.unload = function () {
162     markers.clearLayers();
163     $(".search_form input[name=query]").val("");
164     $(".describe_location").fadeIn(100);
165   };
166
167   return page;
168 };