Allow commenting on, and closing of, notes from the web site

app/assets/javascripts/index/notes.js.erb

@@ -53,6 +53,16 @@ $(document).ready(function () {
 
     $(feature.popup.contentDiv).find("textarea").autoGrow();
 
+    $(feature.popup.contentDiv).find("textarea").on("input", function (e) {
+      var form = e.target.form;
+
+      if ($(e.target).val() == "") {
+        $(form.close).val(I18n.t("javascripts.notes.show.close"));
+      } else {
+        $(form.close).val(I18n.t("javascripts.notes.show.comment_and_close"));
+      }
+    });
+
     $(feature.popup.contentDiv).find("input#note-add").click(function (e) {
       var location = unproj(feature.geometry.getBounds().getCenterLonLat());
       var form = e.target.form;
@@ -77,8 +87,46 @@ $(document).ready(function () {
           map.noteMover.deactivate();
         }
       });
+    });
+
+    $(feature.popup.contentDiv).find("input#note-comment").click(function (e) {
+      var form = e.target.form;
 
       e.preventDefault();
+
+      $.ajax(feature.attributes.comment_url, {
+        type: "POST",
+        data: {
+          text: $(form.text).val()
+        },
+        success: function (data) {
+          map.noteSelector.unselect(feature)
+
+          feature.attributes = data.properties;
+
+          map.noteSelector.select(feature)
+        }
+      });
+    });
+
+    $(feature.popup.contentDiv).find("input#note-close").click(function (e) {
+      var form = e.target.form;
+
+      e.preventDefault();
+
+      $.ajax(feature.attributes.close_url, {
+        type: "POST",
+        data: {
+          text: $(form.text).val()
+        },
+        success: function (data) {
+          map.noteSelector.unselect(feature)
+
+          feature.attributes = data.properties;
+
+          map.noteSelector.select(feature)
+        }
+      });
     });
 
     feature.popup.updateSize();

app/assets/javascripts/templates/notes/show.jst.ejs

@@ -2,7 +2,7 @@
 <% note.comments.forEach(function (comment) { %>
 <p>
   <small class="deemphasize">
-    <%- I18n.t('javascripts.notes.show.comment', {
+    <%- I18n.t('javascripts.notes.show.event', {
        action: comment.action, user: comment.user, time: comment.date
     }) %>
   </small>
@@ -10,3 +10,11 @@
   <%- comment.text %>
 </p>
 <% }) %>
+<% if (note.status == "open") { %>
+<form action="#">
+  <textarea name="text" cols="40" rows="5"></textarea>
+  <br/>
+  <input type="submit" name="close" value="<%- I18n.t('javascripts.notes.show.close') %>" id="note-close">
+  <input type="submit" name="comment" value="<%- I18n.t('javascripts.notes.show.comment') %>" id="note-comment">
+</form>
+<% } %>

config/locales/en.yml

@@ -2047,7 +2047,10 @@ en:
         add: Add Note
       show:
         title: Note %{id}
-        comment: "%{action} by %{user} at %{time}"
+        event: "%{action} by %{user} at %{time}"
+        close: Close
+        comment_and_close: Comment & Close
+        comment: Comment
   redaction:
     edit:
       description: "Description"