$(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);
- });
});