Add notes sidebar interaction

[rails.git] / app / assets / javascripts / index / note.js.erb

diff --git a/app/assets/javascripts/index/note.js.erb b/app/assets/javascripts/index/note.js.erb
new file mode 100644 (file)
index 0000000..74b8e85
--- /dev/null
+++ b/app/assets/javascripts/index/note.js.erb
@@ -0,0 +1,83 @@
+//= require templates/notes/show
+//= require templates/notes/new
+
+OSM.Note = function(map) {
+    var noteLayer = map.noteLayer,
+        content = $('#sidebar_content'),
+        page = {};
+
+    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]
+        })
+    };
+
+    function updateNote(marker, form, method, url) {
+        $(form).find("input[type=submit]").prop("disabled", true);
+
+        $.ajax({
+            url: url,
+            type: method,
+            oauth: true,
+            data: {text: $(form.text).val()},
+            success: function (feature) {
+                marker = noteLayer.getLayer(marker);
+                if (feature.properties.status == "hidden") {
+                    noteLayer.removeLayer(marker);
+                } else {
+                    marker.setIcon(noteIcons[feature.properties.status]);
+                    page.load();
+                }
+            }
+        });
+    }
+
+    function bind() {
+        content.find("input[type=submit]").on("click", function (e) {
+            e.preventDefault();
+            var data = $(e.target).data();
+            updateNote(data.noteId, e.target.form, data.method, data.url);
+        });
+
+        content.find("textarea").on("input", function (e) {
+            var form = e.target.form;
+
+            if ($(e.target).val() == "") {
+                $(form.close).val(I18n.t("javascripts.notes.show.resolve"));
+                $(form.comment).prop("disabled", true);
+            } else {
+                $(form.close).val(I18n.t("javascripts.notes.show.comment_and_resolve"));
+                $(form.comment).prop("disabled", false);
+            }
+        });
+
+        content.find("textarea").val('').trigger("input");
+    }
+
+    page.pushstate = page.popstate = function(path) {
+        page.load();
+    };
+
+    page.load = function() {
+        $('#sidebar_content').load(window.location.pathname + "?xhr=1", function(a, b, xhr) {
+            if (xhr.getResponseHeader('X-Page-Title')) {
+                document.title = xhr.getResponseHeader('X-Page-Title');
+            }
+            bind();
+        });
+    };
+
+    return page;
+};