X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/59f1a6d49644143bfe643e0cabaaea72792fa5db..a3eb48385bcf1465339d473c0c1657e075cd507d:/app/assets/javascripts/index/search.js diff --git a/app/assets/javascripts/index/search.js b/app/assets/javascripts/index/search.js index fde4c2499..46f756f3b 100644 --- a/app/assets/javascripts/index/search.js +++ b/app/assets/javascripts/index/search.js @@ -1,15 +1,48 @@ +//= require jquery.simulate + OSM.Search = function(map) { - $(".search_form input[name=query]") - .on("focus", function() { - $(".describe_location").fadeOut(100); - }) - .on("blur", function() { + $(".search_form input[name=query]").on("input", function(e) { + if ($(e.target).val() == "") { $(".describe_location").fadeIn(100); - }); + } else { + $(".describe_location").fadeOut(100); + } + }); + + $(".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 precision = OSM.zoomPrecision(map.getZoom()); + OSM.router.route("/search?query=" + encodeURIComponent( + map.getCenter().lat.toFixed(precision) + "," + + map.getCenter().lng.toFixed(precision))); + }); $("#sidebar_content") .on("click", ".search_more a", clickSearchMore) - .on("click", ".search_results_entry a.set_position", clickSearchResult); + .on("click", ".search_results_entry a.set_position", clickSearchResult) + .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')) { + $(this).find("a.set_position").simulate("click", e); + } + }).one("mousemove", function () { + moved = true; + }); + }); function clickSearchMore(e) { e.preventDefault(); @@ -25,37 +58,57 @@ OSM.Search = function(map) { }); } + function showSearchResult(e) { + var marker = $(this).data("marker"); + + if (!marker) { + var data = $(this).find("a.set_position").data(); + + marker = L.marker([data.lat, data.lon], {icon: getUserIcon()}); + + $(this).data("marker", marker); + } + + markers.addLayer(marker); + + $(this).closest("li").addClass("selected"); + } + + function hideSearchResult(e) { + var marker = $(this).data("marker"); + + if (marker) { + markers.removeLayer(marker); + } + + $(this).closest("li").removeClass("selected"); + } + function clickSearchResult(e) { var data = $(this).data(), center = L.latLng(data.lat, data.lon); - if (data.type && data.id) return; // Browse link - - e.preventDefault(); - e.stopPropagation(); - if (data.minLon && data.minLat && data.maxLon && data.maxLat) { - map.fitBounds([[data.minLat, data.minLon], - [data.maxLat, data.maxLon]]); + map.fitBounds([[data.minLat, data.minLon], [data.maxLat, data.maxLon]]); } else { map.setView(center, data.zoom); } + + // Let clicks to object browser links propagate. + if (data.type && data.id) return; + + e.preventDefault(); + e.stopPropagation(); } - var marker = L.marker([0, 0], {icon: getUserIcon()}); + var markers = L.layerGroup().addTo(map); var page = {}; page.pushstate = page.popstate = function(path) { var params = querystring.parse(path.substring(path.indexOf('?') + 1)); $(".search_form input[name=query]").val(params.query); - map.invalidateSize(); - $("#sidebar_content").load(path, function(a, b, xhr) { - if (xhr.getResponseHeader('X-Page-Title')) { - document.title = xhr.getResponseHeader('X-Page-Title'); - } - page.load(); - }); + OSM.loadSidebarContent(path, page.load); }; page.load = function() { @@ -76,12 +129,14 @@ OSM.Search = function(map) { } }); }); + + return map.getState(); }; page.unload = function() { - map.removeLayer(marker); - map.removeObject(); + markers.clearLayers(); $(".search_form input[name=query]").val(""); + $(".describe_location").fadeIn(100); }; return page;