]> git.openstreetmap.org Git - rails.git/blob - app/assets/javascripts/index/note.js
Avoid using inline javascript to update message list
[rails.git] / app / assets / javascripts / index / note.js
1 OSM.Note = function (map) {
2   var content = $('#sidebar_content'),
3     page = {},
4     halo, currentNote;
5
6   var noteIcons = {
7     "new": L.icon({
8       iconUrl: OSM.NEW_NOTE_MARKER,
9       iconSize: [25, 40],
10       iconAnchor: [12, 40]
11     }),
12     "open": L.icon({
13       iconUrl: OSM.OPEN_NOTE_MARKER,
14       iconSize: [25, 40],
15       iconAnchor: [12, 40]
16     }),
17     "closed": L.icon({
18       iconUrl: OSM.CLOSED_NOTE_MARKER,
19       iconSize: [25, 40],
20       iconAnchor: [12, 40]
21     })
22   };
23
24   function updateNote(form, method, url) {
25     $(form).find("input[type=submit]").prop("disabled", true);
26
27     $.ajax({
28       url: url,
29       type: method,
30       oauth: true,
31       data: {text: $(form.text).val()},
32       success: function () {
33         OSM.loadSidebarContent(window.location.pathname, page.load);
34       }
35     });
36   }
37
38   page.pushstate = page.popstate = function (path) {
39     OSM.loadSidebarContent(path, function() {
40       initialize(function() {
41         var data = $('.details').data(),
42           latLng = L.latLng(data.coordinates.split(','));
43         if (!map.getBounds().contains(latLng)) moveToNote();        
44       });
45     });
46   };
47
48   page.load = function() {
49     initialize(moveToNote);
50   };
51
52   function initialize(callback) {
53     content.find("input[type=submit]").on("click", function (e) {
54       e.preventDefault();
55       var data = $(e.target).data();
56       updateNote(e.target.form, data.method, data.url);
57     });
58
59     content.find("textarea").on("input", function (e) {
60       var form = e.target.form;
61
62       if ($(e.target).val() === "") {
63         $(form.close).val(I18n.t("javascripts.notes.show.resolve"));
64         $(form.comment).prop("disabled", true);
65       } else {
66         $(form.close).val(I18n.t("javascripts.notes.show.comment_and_resolve"));
67         $(form.comment).prop("disabled", false);
68       }
69     });
70
71     content.find("textarea").val('').trigger("input");
72
73     var data = $('.details').data(),
74       latLng = L.latLng(data.coordinates.split(','));
75
76     if (!map.hasLayer(halo)) {
77       halo = L.circleMarker(latLng, {
78         weight: 2.5,
79         radius: 20,
80         fillOpacity: 0.5,
81         color: "#FF6200"
82       });
83       map.addLayer(halo);
84     }
85
86     if (map.hasLayer(currentNote)) map.removeLayer(currentNote);
87     currentNote = L.marker(latLng, {
88       icon: noteIcons[data.status],
89       opacity: 1,
90       interactive: true
91     });
92
93     map.addLayer(currentNote);
94
95     if (callback) callback();
96   }
97
98   function moveToNote() {
99     var data = $('.details').data(),
100       latLng = L.latLng(data.coordinates.split(','));
101
102     if (!window.location.hash || window.location.hash.match(/^#?c[0-9]+$/)) {
103       OSM.router.withoutMoveListener(function () {
104         map.setView(latLng, 15, {reset: true});
105       });
106     }
107   }
108
109   page.unload = function () {
110     if (map.hasLayer(halo)) map.removeLayer(halo);
111     if (map.hasLayer(currentNote)) map.removeLayer(currentNote);
112   };
113
114   return page;
115 };