X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/030b7c4052554d78b142daf4dac7fbf200ab73ad..a7ba87340d91a6eeef096783b04a9b0a963bfa99:/app/assets/javascripts/index/browse.js?ds=sidebyside diff --git a/app/assets/javascripts/index/browse.js b/app/assets/javascripts/index/browse.js index e151a2dc3..69d625eca 100644 --- a/app/assets/javascripts/index/browse.js +++ b/app/assets/javascripts/index/browse.js @@ -1,330 +1,124 @@ -//= require templates/browse/feature -//= require templates/browse/feature_list -//= require templates/browse/feature_history - -$(document).ready(function () { - $("#show_data").click(function (e) { - $.ajax({ url: $(this).attr('href'), success: function (sidebarHtml) { - startBrowse(sidebarHtml); - }}); - e.preventDefault(); +OSM.initializeBrowse = function (map) { + var browseBounds; + var dataLayer = map.dataLayer; + + dataLayer.setStyle({ + way: { + weight: 3, + color: "#000000", + opacity: 0.4 + }, + area: { + weight: 3, + color: "#ff0000" + }, + node: { + color: "#00ff00" + } }); - function startBrowse(sidebarHtml) { - var browseMode = "auto"; - var browseBounds; - var layersById; - var selectedLayer; - var browseObjectList; - var areasHidden = false; - - var dataLayer = new L.OSM.DataLayer(null, { - styles: { - way: { - weight: 3, - color: "#000000", - opacity: 0.4 - }, - area: { - weight: 3, - color: "#ff0000" - }, - node: { - color: "#00ff00" - } - } - }); - - dataLayer.addTo(map); - - dataLayer.isWayArea = function () { - return !areasHidden && L.OSM.DataLayer.prototype.isWayArea.apply(this, arguments); - }; - - var drawHandler = new L.Rectangle.Draw(map, {title: I18n.t('browse.start_rjs.drag_a_box')}); - map.on('draw:rectangle-created', endDrag); - - $("#sidebar_title").html(I18n.t('browse.start_rjs.data_frame_title')); - $("#sidebar_content").html(sidebarHtml); - - openSidebar(); - - map.on("moveend", updateData); - updateData(); + dataLayer.isWayArea = function () { + return false; + }; - $("#browse_select_view").click(useMap); - - $("#browse_hide_areas_box").html(I18n.t('browse.start_rjs.hide_areas')); - $("#browse_hide_areas_box").toggle(hideAreas, showAreas); + dataLayer.on("click", function (e) { + onSelect(e.layer); + }); - function updateData() { - if (browseMode == "auto") { - if (map.getZoom() >= 15) { - useMap(); - } else { - setStatus(I18n.t('browse.start_rjs.zoom_or_select')); - } - } + map.on("layeradd", function (e) { + if (e.layer === dataLayer) { + map.on("moveend", updateData); + updateData(); } + }); - $("#sidebar").one("closed", function () { - map.removeLayer(dataLayer); + map.on("layerremove", function (e) { + if (e.layer === dataLayer) { map.off("moveend", updateData); - map.off('draw:rectangle-created', endDrag); - drawHandler.disable(); - }); - - $("#browse_select_box").click(function () { - $("#browse_select_box").html(I18n.t('browse.start_rjs.drag_a_box')); - - drawHandler.enable(); - - return false; - }); - - function useMap() { - var bounds = map.getBounds(); - - if (!browseBounds || !browseBounds.contains(bounds)) { - browseBounds = bounds; - browseMode = "auto"; - - getData(); - - $("#browse_select_view").hide(); - } - - return false; - } - - function hideAreas() { - $("#browse_hide_areas_box").html(I18n.t('browse.start_rjs.show_areas')); - - areasHidden = true; - - getData(); + $("#browse_status").empty(); } + }); - function showAreas() { - $("#browse_hide_areas_box").html(I18n.t('browse.start_rjs.hide_areas')); - - areasHidden = false; - + function updateData() { + var bounds = map.getBounds(); + if (!browseBounds || !browseBounds.contains(bounds)) { getData(); } + } - function endDrag(e) { - browseBounds = e.rect.getBounds(); - browseMode = "manual"; - - getData(); - - $("#browse_select_box").html(I18n.t('browse.start_rjs.manually_select')); - $("#browse_select_view").show(); - - drawHandler.disable(); - } - - function displayFeatureWarning(count, limit, callback) { - clearStatus(); - - var div = document.createElement("div"); - - var p = document.createElement("p"); - p.appendChild(document.createTextNode(I18n.t("browse.start_rjs.loaded_an_area_with_num_features", { num_features: count, max_features: limit }))); - div.appendChild(p); + function displayFeatureWarning(count, limit, add, cancel) { + $("#browse_status").html( + $("
").append( + $("
").append( + $("

") + .text(I18n.t("browse.start_rjs.load_data")), + $("
").append( + $("