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