OSM.NewNote = function(map) {
- var noteLayer = map.noteLayer,
- content = $('#sidebar_content'),
- page = {},
- addNoteButton = $(".control-note .control-button"),
- newNote;
-
- 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]
- })
- };
-
- page.pushstate = page.popstate = function() {
- page.load();
- };
-
- addNoteButton.on("click", function (e) {
- e.preventDefault();
- e.stopPropagation();
-
- OSM.route('/new_note');
+ var noteLayer = map.noteLayer,
+ content = $('#sidebar_content'),
+ page = {},
+ addNoteButton = $(".control-note .control-button"),
+ newNote,
+ halo;
+
+ 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]
+ })
+ };
+
+ addNoteButton.on("click", function (e) {
+ e.preventDefault();
+ e.stopPropagation();
+
+ if ($(this).hasClass('disabled')) return;
+
+ OSM.router.route('/note/new');
+ });
+
+ function createNote(marker, form, url) {
+ var location = marker.getLatLng().wrap();
+
+ marker.options.draggable = false;
+ marker.dragging.disable();
+
+ $(form).find("input[type=submit]").prop("disabled", true);
+
+ $.ajax({
+ url: url,
+ type: "POST",
+ oauth: true,
+ data: {
+ lat: location.lat,
+ lon: location.lng,
+ text: $(form.text).val()
+ },
+ success: function (feature) {
+ noteCreated(feature, marker);
+ }
});
- function createNote(marker, form, url) {
- var location = marker.getLatLng();
-
- marker.options.draggable = false;
- marker.dragging.disable();
-
- $(form).find("input[type=submit]").prop("disabled", true);
-
- $.ajax({
- url: url,
- type: "POST",
- oauth: true,
- data: {
- lat: location.lat,
- lon: location.lng,
- text: $(form.text).val()
- },
- success: function(feature) {
- noteCreated(feature, marker);
- }
+ function noteCreated(feature, marker) {
+ content.find("textarea").val("");
+ updateMarker(feature);
+ newNote = null;
+ noteLayer.removeLayer(marker);
+ addNoteButton.removeClass("active");
+ OSM.router.route('/note/' + feature.properties.id);
+ }
+ }
+
+ function updateMarker(feature) {
+ var marker = L.marker(feature.geometry.coordinates.reverse(), {
+ icon: noteIcons[feature.properties.status],
+ opacity: 0.9,
+ clickable: true
+ });
+ marker.id = feature.properties.id;
+ marker.addTo(noteLayer);
+ return marker;
+ }
+
+ page.pushstate = page.popstate = function (path) {
+ OSM.loadSidebarContent(path, page.load);
+ };
+
+ function newHalo(loc, a) {
+ if (a == 'dragstart' && map.hasLayer(halo)) {
+ map.removeLayer(halo);
+ } else {
+ if (map.hasLayer(halo)) map.removeLayer(halo);
+
+ halo = L.circleMarker(loc, {
+ weight: 2.5,
+ radius: 20,
+ fillOpacity: 0.5,
+ color: "#FF6200"
});
- function noteCreated(feature, marker) {
- content.find("textarea").val("");
- updateMarker(feature);
- newNote = null;
- noteLayer.removeLayer(marker);
- addNoteButton.removeClass("active");
- OSM.route('/browse/note/' + feature.properties.id);
- }
+ map.addLayer(halo);
}
+ }
- function updateMarker(feature) {
- marker = L.marker(feature.geometry.coordinates.reverse(), {
- icon: noteIcons[feature.properties.status],
- opacity: 0.9,
- clickable: true
- });
- marker.id = feature.properties.id;
- marker.addTo(noteLayer);
- return marker;
- }
+ page.load = function () {
+ if (addNoteButton.hasClass("disabled")) return;
+ if (addNoteButton.hasClass("active")) return;
- function initialize() {
- if (addNoteButton.hasClass("disabled")) return;
- if (addNoteButton.hasClass("active")) return;
-
- addNoteButton.addClass("active");
-
- map.addLayer(noteLayer);
-
- var mapSize = map.getSize();
- var markerPosition;
-
- if (mapSize.y > 800) {
- markerPosition = [mapSize.x / 2, mapSize.y / 2];
- } else if (mapSize.y > 400) {
- markerPosition = [mapSize.x / 2, 400];
- } else {
- markerPosition = [mapSize.x / 2, mapSize.y];
- }
-
- newNote = L.marker(map.containerPointToLatLng(markerPosition), {
- icon: noteIcons["new"],
- opacity: 0.9,
- draggable: true
- });
-
- newNote.addTo(noteLayer)
-
- newNote.on("remove", function (e) {
- addNoteButton.removeClass("active");
- }).on("dragstart", function (e) {
- $(newNote).stopTime("removenote");
- }).on("dragend", function (e) {
- content.find("textarea").focus();
- });
-
- content.find("textarea")
- .on("input", disableWhenBlank)
- .focus();
-
- function disableWhenBlank(e) {
- $(e.target.form.add).prop("disabled", $(e.target).val() === "");
- }
-
- content.find('input[type=submit]').on('click', function(e) {
- e.preventDefault();
- createNote(newNote, e.target.form, '/api/0.6/notes.json');
- });
- }
+ addNoteButton.addClass("active");
- page.load = function() {
- content.load(window.location.pathname + "?xhr=1", function(a, b, xhr) {
- if (xhr.getResponseHeader('X-Page-Title')) {
- document.title = xhr.getResponseHeader('X-Page-Title');
- }
- initialize();
- });
+ map.addLayer(noteLayer);
+
+ var mapSize = map.getSize();
+ var markerPosition;
+
+ if (mapSize.y > 800) {
+ markerPosition = [mapSize.x / 2, mapSize.y / 2];
+ } else if (mapSize.y > 400) {
+ markerPosition = [mapSize.x / 2, 400];
+ } else {
+ markerPosition = [mapSize.x / 2, mapSize.y];
}
- page.unload = function() {
- noteLayer.removeLayer(newNote);
- addNoteButton.removeClass("active");
+ newNote = L.marker(map.containerPointToLatLng(markerPosition), {
+ icon: noteIcons["new"],
+ opacity: 0.9,
+ draggable: true
+ });
+
+ newNote.on("dragstart dragend", function(a) {
+ newHalo(newNote.getLatLng(), a.type);
+ });
+
+ newNote.addTo(noteLayer);
+ newHalo(newNote.getLatLng());
+
+ newNote.on("remove", function () {
+ addNoteButton.removeClass("active");
+ }).on("dragstart",function () {
+ $(newNote).stopTime("removenote");
+ }).on("dragend", function () {
+ content.find("textarea").focus();
+ });
+
+ content.find("textarea")
+ .on("input", disableWhenBlank)
+ .focus();
+
+ function disableWhenBlank(e) {
+ $(e.target.form.add).prop("disabled", $(e.target).val() === "");
}
- return page;
-}
+ content.find('input[type=submit]').on('click', function (e) {
+ e.preventDefault();
+ createNote(newNote, e.target.form, '/api/0.6/notes.json');
+ });
+
+ return map.getState();
+ };
+
+ page.unload = function () {
+ noteLayer.removeLayer(newNote);
+ map.removeLayer(halo);
+ addNoteButton.removeClass("active");
+ };
+
+ return page;
+};
projects / rails.git / blobdiff