openstreetmap-website/app/assets/javascripts/index/notes.js.erb

function initializeNotes(map) {
  var noteLayer = map.noteLayer,
      notes = {};

  var noteIcons = {
    "new": L.icon({
      iconUrl: "<%= image_path 'new_note_marker.png' %>",
      iconSize: [25, 40],
      iconAnchor: [12, 40]
    }),
    "open": L.icon({
      iconUrl: "<%= image_path 'open_note_marker.png' %>",
      iconSize: [25, 40],
      iconAnchor: [12, 40]
    }),
    "closed": L.icon({
      iconUrl: "<%= image_path 'closed_note_marker.png' %>",
      iconSize: [25, 40],
      iconAnchor: [12, 40]
    })
  };

  map.on("layeradd", function (e) {
    if (e.layer == noteLayer) {
      loadNotes();
      map.on("moveend", loadNotes);
    }
  }).on("layerremove", function (e) {
    if (e.layer == noteLayer) {
      map.off("moveend", loadNotes);
      noteLayer.clearLayers();
      notes = {};
    }
  });

  noteLayer.on('click', function(e) {
    OSM.router.route('/note/' + e.layer.id);
  });

  function updateMarker(marker, feature) {
    if (marker) {
      marker.setIcon(noteIcons[feature.properties.status]);
    } else {
      marker = L.marker(feature.geometry.coordinates.reverse(), {
        icon: noteIcons[feature.properties.status],
        opacity: 0.8,
        clickable: true
      });
      marker.id = feature.properties.id;
      marker.addTo(noteLayer);
    }
    return marker;
  }

  noteLayer.getLayerId = function(marker) {
    return marker.id;
  };

  var noteLoader;

  function loadNotes() {
    var bounds = map.getBounds();
    var size = bounds.getSize();

    if (size <= OSM.MAX_NOTE_REQUEST_AREA) {
      var url = "/api/" + OSM.API_VERSION + "/notes.json?bbox=" + bounds.toBBoxString();

      if (noteLoader) noteLoader.abort();

      noteLoader = $.ajax({
        url: url,
        success: success
      });
    }

    function success(json) {
      var oldNotes = notes;
      notes = {};
      json.features.forEach(updateMarkers);

      function updateMarkers(feature) {
        var marker = oldNotes[feature.properties.id];
        delete oldNotes[feature.properties.id];
        notes[feature.properties.id] = updateMarker(marker, feature);
      }

      for (var id in oldNotes) {
        noteLayer.removeLayer(oldNotes[id]);
      }

      noteLoader = null;
    }
  }
}