X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/00375024263970a43ea7d39e3c65dfd0f32e8869..5cf26d0559e303a26a6908a64b8fca012472edd3:/app/assets/javascripts/changeset.js diff --git a/app/assets/javascripts/changeset.js b/app/assets/javascripts/changeset.js index ba6e541b6..6d4881547 100644 --- a/app/assets/javascripts/changeset.js +++ b/app/assets/javascripts/changeset.js @@ -1,83 +1,79 @@ $(document).ready(function () { - var highlight; + var changesets = [], rects = {}; - function highlightChangeset(id) { - var feature = vectors.getFeatureByFid(id); - var bounds = feature.geometry.getBounds(); + var map = L.map("changeset_list_map", { + attributionControl: false, + zoomControl: false + }).addLayer(new L.OSM.Mapnik()); - if (bounds.containsBounds(map.getExtent())) { - bounds = map.getExtent().scale(1.1); - } + L.OSM.zoom() + .addTo(map); - if (highlight) vectors.removeFeatures(highlight); + var group = L.featureGroup().addTo(map); - highlight = new OpenLayers.Feature.Vector(bounds.toGeometry(), {}, { - strokeWidth: 2, - strokeColor: "#ee9900", - fillColor: "#ffff55", - fillOpacity: 0.5 - }); + $("[data-changeset]").each(function () { + var changeset = $(this).data('changeset'); + if (changeset.bbox) { + changeset.bounds = L.latLngBounds([changeset.bbox.minlat, changeset.bbox.minlon], + [changeset.bbox.maxlat, changeset.bbox.maxlon]); + changesets.push(changeset); + } + }); - vectors.addFeatures(highlight); + changesets.sort(function (a, b) { + return b.bounds.getSize() - a.bounds.getSize(); + }); - $("#tr-changeset-" + id).addClass("selected"); + for (var i = 0; i < changesets.length; ++i) { + var changeset = changesets[i], + rect = L.rectangle(changeset.bounds, + {weight: 2, color: "#ee9900", fillColor: "#ffff55", fillOpacity: 0}); + rect.id = changeset.id; + rects[changeset.id] = rect; + rect.addTo(group); } - function unHighlightChangeset(id) { - vectors.removeFeatures(highlight); - - $("#tr-changeset-" + id).removeClass("selected"); + function highlightChangeset(id) { + rects[id].setStyle({fillOpacity: 0.5}); + $("#changeset_" + id).addClass("selected"); } - var map = createMap("changeset_list_map", { - controls: [ - new OpenLayers.Control.Navigation(), - new OpenLayers.Control.Zoom(), - new OpenLayers.Control.SimplePanZoom() - ] - }); - - var bounds = new OpenLayers.Bounds(); - - $("[data-changeset]").each(function () { - var changeset = $(this).data('changeset'); - if (changeset.bbox) { - var bbox = new OpenLayers.Bounds(changeset.bbox.minlon, changeset.bbox.minlat, changeset.bbox.maxlon, changeset.bbox.maxlat); - - bounds.extend(bbox); + function unHighlightChangeset(id) { + rects[id].setStyle({fillOpacity: 0}); + $("#changeset_" + id).removeClass("selected"); + } - addBoxToMap(bbox, changeset.id, true); + group.on({ + mouseover: function (e) { + highlightChangeset(e.layer.id); + }, + mouseout: function (e) { + unHighlightChangeset(e.layer.id); } }); - vectors.events.on({ - "featureselected": function(feature) { - highlightChangeset(feature.feature.fid); + $("[data-changeset]").on({ + mouseover: function () { + highlightChangeset($(this).data("changeset").id); }, - "featureunselected": function(feature) { - unHighlightChangeset(feature.feature.fid); + mouseout: function () { + unHighlightChangeset($(this).data("changeset").id); } }); - var selectControl = new OpenLayers.Control.SelectFeature(vectors, { - multiple: false, - hover: true + $(window).scroll(function() { + if ($(window).scrollTop() > $('.content-heading').outerHeight() + $('#top-bar').outerHeight() ) { + $('#changeset_list_map_wrapper').addClass('scrolled'); + } else { + $('#changeset_list_map_wrapper').removeClass('scrolled'); + } }); - map.addControl(selectControl); - selectControl.activate(); var params = OSM.mapParams(); if (params.bbox) { - map.zoomToExtent(proj(new OpenLayers.Bounds(params.minlon, params.minlat, params.maxlon, params.maxlat))); + map.fitBounds([[params.minlat, params.minlon], + [params.maxlat, params.maxlon]]); } else { - map.zoomToExtent(proj(bounds)); + map.fitBounds(group.getBounds()); } - - $("[data-changeset]").mouseover(function() { - highlightChangeset($(this).data("changeset").id); - }); - - $("[data-changeset]").mouseout(function() { - unHighlightChangeset($(this).data("changeset").id); - }); });