X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/a70b61315c2331c18123a0b36782d6ef6bb3ab3e..2315885586efd5c0b43311bf49e801302750e77b:/app/assets/javascripts/index/search.js diff --git a/app/assets/javascripts/index/search.js b/app/assets/javascripts/index/search.js index 61f4a3558..94bb52a1b 100644 --- a/app/assets/javascripts/index/search.js +++ b/app/assets/javascripts/index/search.js @@ -1,117 +1,153 @@ -//= require jquery.simulate - -OSM.Search = function(map) { - $(".search_form input[name=query]") - .on("input", function(e) { - if ($(e.target).val() == "") { - $(".describe_location").fadeIn(100); - } else { - $(".describe_location").fadeOut(100); - } - }) +//= require qs/dist/qs + +OSM.Search = function (map) { + $(".search_form input[name=query]").on("input", function (e) { + if ($(e.target).val() === "") { + $(".describe_location").fadeIn(100); + } else { + $(".describe_location").fadeOut(100); + } + }); + + $(".search_form a.btn.switch_link").on("click", function (e) { + e.preventDefault(); + var query = $(this).closest("form").find("input[name=query]").val(); + if (query) { + OSM.router.route("/directions?from=" + encodeURIComponent(query) + OSM.formatHash(map)); + } else { + OSM.router.route("/directions" + OSM.formatHash(map)); + } + }); + + $(".search_form").on("submit", function (e) { + e.preventDefault(); + $("header").addClass("closed"); + var query = $(this).find("input[name=query]").val(); + if (query) { + OSM.router.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map)); + } else { + OSM.router.route("/" + OSM.formatHash(map)); + } + }); + + $(".describe_location").on("click", function (e) { + e.preventDefault(); + var center = map.getCenter().wrap(), + precision = OSM.zoomPrecision(map.getZoom()); + OSM.router.route("/search?whereami=1&query=" + encodeURIComponent( + center.lat.toFixed(precision) + "," + center.lng.toFixed(precision) + )); + }); $("#sidebar_content") .on("click", ".search_more a", clickSearchMore) - .on("mouseover", "p.search_results_entry:has(a.set_position)", showSearchResult) - .on("mouseout", "p.search_results_entry:has(a.set_position)", hideSearchResult) - .on("mousedown", "p.search_results_entry:has(a.set_position)", function () { - var moved = false; - $(this).one("click", function (e) { - if (!moved && !$(e.target).is('a')) { - clickSearchResult(this, e); - } - }).one("mousemove", function () { - moved = true; - }); - }); + .on("click", ".search_results_entry a.set_position", clickSearchResult) + .on("mouseover", "li.search_results_entry:has(a.set_position)", showSearchResult) + .on("mouseout", "li.search_results_entry:has(a.set_position)", hideSearchResult); + + var markers = L.layerGroup().addTo(map); function clickSearchMore(e) { e.preventDefault(); e.stopPropagation(); - var div = $(this).parents(".search_more"); + var div = $(this).parents(".search_more"), + csrf_param = $("meta[name=csrf-param]").attr("content"), + csrf_token = $("meta[name=csrf-token]").attr("content"), + params = {}; $(this).hide(); div.find(".loader").show(); - $.get($(this).attr("href"), function(data) { - div.replaceWith(data); + params[csrf_param] = csrf_token; + + $.ajax({ + url: $(this).attr("href"), + method: "POST", + data: params, + success: function (data) { + div.replaceWith(data); + } }); } - function showSearchResult(e) { + function showSearchResult() { var marker = $(this).data("marker"); if (!marker) { var data = $(this).find("a.set_position").data(); - marker = L.marker([data.lat, data.lon]); + marker = L.marker([data.lat, data.lon], { icon: OSM.getUserIcon() }); $(this).data("marker", marker); } - map.addLayer(marker); - - $(this).closest("li").addClass("selected"); + markers.addLayer(marker); } - function hideSearchResult(e) { + function hideSearchResult() { var marker = $(this).data("marker"); if (marker) { - map.removeLayer(marker); + markers.removeLayer(marker); } - - $(this).closest("li").removeClass("selected"); } - function clickSearchResult(result, e) { - var link = $(result).find("a.set_position"), - data = link.data(), - center = L.latLng(data.lat, data.lon); - + function panToSearchResult(data) { if (data.minLon && data.minLat && data.maxLon && data.maxLat) { map.fitBounds([[data.minLat, data.minLon], [data.maxLat, data.maxLon]]); } else { - map.setView(center, data.zoom); + map.setView([data.lat, data.lon], data.zoom); } + } - e.preventDefault(); - e.stopPropagation(); + function clickSearchResult(e) { + var data = $(this).data(); + + panToSearchResult(data); // Let clicks to object browser links propagate. - if (data.type && data.id) { - link.simulate("click", e); - } else { - marker.setLatLng(center).addTo(map); - } - } + if (data.type && data.id) return; - var marker = L.marker([0, 0], {icon: getUserIcon()}); + e.preventDefault(); + e.stopPropagation(); + } var page = {}; - page.pushstate = page.popstate = function(path) { - var params = querystring.parse(path.substring(path.indexOf('?') + 1)); + page.pushstate = page.popstate = function (path) { + var params = Qs.parse(path.substring(path.indexOf("?") + 1)); $(".search_form input[name=query]").val(params.query); + $(".describe_location").hide(); OSM.loadSidebarContent(path, page.load); }; - page.load = function() { - $(".search_results_entry").each(function() { - var entry = $(this); + page.load = function () { + $(".search_results_entry").each(function (index) { + var entry = $(this), + csrf_param = $("meta[name=csrf-param]").attr("content"), + csrf_token = $("meta[name=csrf-token]").attr("content"), + params = { + zoom: map.getZoom(), + minlon: map.getBounds().getWest(), + minlat: map.getBounds().getSouth(), + maxlon: map.getBounds().getEast(), + maxlat: map.getBounds().getNorth() + }; + params[csrf_param] = csrf_token; $.ajax({ url: entry.data("href"), - method: 'GET', - data: { - zoom: map.getZoom(), - minlon: map.getBounds().getWest(), - minlat: map.getBounds().getSouth(), - maxlon: map.getBounds().getEast(), - maxlat: map.getBounds().getNorth() - }, - success: function(html) { + method: "POST", + data: params, + success: function (html) { entry.html(html); + // go to first result of first geocoder + if (index === 0) { + var firstResult = entry.find("*[data-lat][data-lon]:first").first(); + if (firstResult.length) { + panToSearchResult(firstResult.data()); + } + } } }); }); @@ -119,9 +155,8 @@ OSM.Search = function(map) { return map.getState(); }; - page.unload = function() { - map.removeLayer(marker); - map.removeObject(); + page.unload = function () { + markers.clearLayers(); $(".search_form input[name=query]").val(""); $(".describe_location").fadeIn(100); };