editing for profile comments

app.rb

@@ -869,10 +869,20 @@ post '/event/:event_id/comment' do |event_id|
   require_login
   content_type :json
   event = Event[id: event_id]
-  event.add_site_comment current_site, params[:comment]
+  event.add_site_comment current_site, params[:message]
   {result: 'ok'}.to_json
 end
 
+post '/event/:event_id/update_profile_comment' do |event_id|
+  require_login
+  content_type :json
+  event = Event[id: event_id]
+  return {result: 'error'}.to_json unless current_site.id == event.profile_comment.actioning_site_id
+
+  event.profile_comment.update message: params[:message]
+  return {result: 'ok'}.to_json
+end
+
 def require_admin
   redirect '/' unless signed_in? && current_site.is_admin
 end

models/event.rb

@@ -8,6 +8,11 @@ class Event < Sequel::Model
   one_to_many :likes
   one_to_many :comments
 
+  def created_by?(site)
+    return true if profile_comment && profile_comment.actioning_site_id == site.id
+    false
+  end
+
   def liking_site_names
     likes.collect {|like| like.actioning_site.username }
   end

public/assets/css/_base-sass/_base-Form.scss

@@ -26,4 +26,4 @@ input[type='search']::-webkit-search-decoration{-webkit-appearance:none}
 buton::-moz-focus-inner, input::-moz-focus-inner{border:0; padding:0}
 
 // Makes sure that overflow shows and text is aligned to top of area
-textarea{overflow:auto; vertical-align:top}
+textarea{overflow:auto; vertical-align:top; border: 2px solid #DCE4EC;}

public/assets/css/neo.css

@@ -174,7 +174,8 @@ buton::-moz-focus-inner, input::-moz-focus-inner {
 
 textarea {
   overflow: auto;
-  vertical-align: top; }
+  vertical-align: top;
+  border: 2px solid #DCE4EC; }
 
 .tooltip-inner {
   white-space: pre-wrap; }

public/assets/scripts/news/comment.js

@@ -9,7 +9,7 @@ Comment.prototype.create = function(form) {
   var comment = form.find('[name="comment"]').val()
   form.remove()
 
-  $.post('/event/'+this.eventId+'/comment', {csrf_token: this.csrfToken, comment: comment}, function(res) {
+  $.post('/event/'+this.eventId+'/comment', {csrf_token: this.csrfToken, message: comment}, function(res) {
     console.log(res)
   })
   

public/assets/scripts/news/profile_comment.js

@@ -0,0 +1,32 @@
+var ProfileComment = {
+  displayEditor: function(eventId) {
+    var commentDiv = $('#event_'+eventId+' div.title div.comment')
+    var eventActions = $('#event_'+eventId+'_actions')
+    
+    eventActions.find('a#editLink').css('display', 'none')
+    
+    commentDiv.html(Template.template($('#comment-edit-template').html(), {eventId: eventId, content: commentDiv.text()}))
+    $('#event_'+eventId+' div.title div.comment').text()
+  },
+  
+  cancelEditor: function(eventId) {
+    var eventActions = $('#event_'+eventId+'_actions')
+    var commentDiv = $('#event_'+eventId+' div.title div.comment')
+    eventActions.find('a#editLink').css('display', 'inline')
+    commentDiv.text(commentDiv.find('textarea').text())
+  },
+  
+  update: function(eventId, csrfToken) {
+    var eventActions = $('#event_'+eventId+'_actions')
+    var commentDiv = $('#event_'+eventId+' div.title div.comment')
+    var self = this
+    console.log(commentDiv.find('textarea').val())
+    $.post('/event/'+eventId+'/update_profile_comment', {
+      csrf_token: csrfToken,
+      message: commentDiv.find('textarea').val()
+    }, function(res) {
+      commentDiv.find('textarea').text(commentDiv.find('textarea').val())
+      self.cancelEditor(eventId)
+    })
+  }
+}

public/assets/scripts/news/template.js

@@ -1,12 +1,15 @@
 var Template = {
   template: function(templateString, data) {
     var data = data || {}
-    return _.template(templateString, data, {interpolate: /\{\{(.+?)\}\}/g})
+    return _.template(templateString, data, {
+      interpolate: /\{\{-(.+?)\}\}/g,
+      escape: /\{\{(.+?)\}\}/g
+    })
   },
   
-  renderComment: function(event_id) {
+  renderComment: function(eventId) {
-    var event = $('#event_'+event_id+'_actions')
+    var event = $('#event_'+eventId+'_actions')
-    var rendered = this.template($('#comment-template').html(), {event_id: event_id})
+    var rendered = this.template($('#comment-template').html(), {eventId: eventId})
     event.find('a#reply').css('display', 'none')
     event.append(rendered)
   }

views/_news.erb

@@ -1,9 +1,10 @@
 <script src="/assets/scripts/news/template.js"></script>
 <script src="/assets/scripts/news/like.js"></script>
 <script src="/assets/scripts/news/comment.js"></script>
+<script src="/assets/scripts/news/profile_comment.js"></script>
 <% events.each do |event| %>
   <% if event.profile_comment_id %>
-    <div class="news-item comment for-me">
+    <div class="news-item comment for-me" id="event_<%= event.id %>">
       <%== erb :'_news_profile_comment', layout: false, locals: {profile_comment: event.profile_comment} %>
   <% end %>
   

views/_news_actions.erb

@@ -10,4 +10,12 @@
   <% if current_site %>
     <a id="reply" href="#" onclick="Template.renderComment(<%= event.id %>); return false">Reply</a>
   <% end %>
+  <% if event.created_by? current_site %>
+    <% if event.profile_comment_id %>
+      <a id="editLink" href="#" onclick="ProfileComment.displayEditor('<%= event.id %>'); return false">Edit</a>
+    <% end %>
+  <% end %>
+  <% if event.created_by?(current_site) || event.site_id == current_site.id %>
+    <a href="#">Delete</a>
+  <% end %>
 </div>

views/_news_templates.erb

@@ -1,6 +1,13 @@
 <div id="comment-template" style="display: none">
-  <form onsubmit="new Comment({{ event_id }}, '<%= csrf_token %>').create(this); location.reload(); return false">
+  <form onsubmit="new Comment({{ eventId }}, '<%= csrf_token %>').create(this); location.reload(); return false">
     <input name="comment" type="text" autocomplete="off" maxlength="<%= Site::MAX_COMMENT_SIZE %>" style="width: 100%" placeholder="Comment on this...">
     <button class="btn-Action">Post</button>
   </form>
+</div>
+
+<div id="comment-edit-template" style="display: none">
+  <form onsubmit="ProfileComment.update({{ eventId }}, '<%= csrf_token %>'); return false">
+      <textarea rows="5" style="width: 100%" maxlength="<%= Site::MAX_COMMENT_SIZE %>">{{ content }}</textarea>
+      <button class="btn-Action">Save</button> <a href="#" onclick="ProfileComment.cancelEditor({{ eventId }}); return false">Cancel</a>
+  </form>
 </div>

views/site.erb

@@ -31,7 +31,7 @@
   <div class="col col-66">
     <% if current_site %>
       <div class="post-comment">
-        <form method="POST" action="/profile/<%= site.username %>/comment">
+        <form method="POST" action="/site/<%= site.username %>/comment">
           <input name="csrf_token" type="hidden" value="<%= csrf_token %>">
           <input name="message" type="text" placeholder="Post a message..." autocomplete="off" maxlength="<%= Site::MAX_COMMENT_SIZE %>">
           <button class="btn-Action">Post</button>
@@ -44,7 +44,7 @@
         <p>No activity yet.</p>
       </div>
     <% else %>
-      <%== erb :'_news', layout: false, locals: {site: site, events: site.events} %>
+      <%== erb :'_news', layout: false, locals: {site: site, events: site.events_dataset.order(:id.desc).all} %>
     <% end %>
     
   </div>