Loading indicator for notes
[rails.git] / app / assets / javascripts / index / note.js.erb
1 OSM.Note = function(map) {
2     var noteLayer = map.noteLayer,
3         content = $('#sidebar_content'),
4         page = {};
5
6     var noteIcons = {
7         "new": L.icon({
8             iconUrl: "<%= image_path('new_note_marker.png') %>",
9             iconSize: [25, 40],
10             iconAnchor: [12, 40]
11         }),
12         "open": L.icon({
13             iconUrl: "<%= image_path('open_note_marker.png') %>",
14             iconSize: [25, 40],
15             iconAnchor: [12, 40]
16         }),
17         "closed": L.icon({
18             iconUrl: "<%= image_path('closed_note_marker.png') %>",
19             iconSize: [25, 40],
20             iconAnchor: [12, 40]
21         })
22     };
23
24     function updateNote(marker, 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 (feature) {
33                 marker = noteLayer.getLayer(marker);
34                 if (feature.properties.status == "hidden") {
35                     noteLayer.removeLayer(marker);
36                 } else {
37                     marker.setIcon(noteIcons[feature.properties.status]);
38                     page.load();
39                 }
40             }
41         });
42     }
43
44     function bind() {
45         content.find("input[type=submit]").on("click", function (e) {
46             e.preventDefault();
47             var data = $(e.target).data();
48             updateNote(data.noteId, e.target.form, data.method, data.url);
49         });
50
51         content.find("textarea").on("input", function (e) {
52             var form = e.target.form;
53
54             if ($(e.target).val() == "") {
55                 $(form.close).val(I18n.t("javascripts.notes.show.resolve"));
56                 $(form.comment).prop("disabled", true);
57             } else {
58                 $(form.close).val(I18n.t("javascripts.notes.show.comment_and_resolve"));
59                 $(form.comment).prop("disabled", false);
60             }
61         });
62
63         content.find("textarea").val('').trigger("input");
64     }
65
66     page.pushstate = page.popstate = function() {
67         page.load();
68     };
69
70     page.load = function() {
71         var loadTimer = setTimeout(setLoading, 250);
72         $('#sidebar_content').load(window.location.pathname + "?xhr=1", function(a, b, xhr) {
73             if (xhr.getResponseHeader('X-Page-Title')) {
74                 document.title = xhr.getResponseHeader('X-Page-Title');
75             }
76             bind();
77             clearTimeout(loadTimer);
78             clearLoading();
79         });
80     };
81
82     function setLoading() {
83       if($('#browse_status').is(':empty')) {
84         $('#browse_status').append($('<p></p>').text(I18n.t('browse.start_rjs.loading')));
85       }
86     }
87
88     function clearLoading() {
89       $('#browse_status').empty();
90     }
91
92     return page;
93 };