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