more work on comments for events

app.rb

@@ -865,6 +865,14 @@ post '/event/:event_id/toggle_like' do |event_id|
   {result: liked_response, event_like_count: event.likes_dataset.count}.to_json
 end
 
+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]
+  {result: 'ok'}.to_json
+end
+
 def require_admin
   redirect '/' unless signed_in? && current_site.is_admin
 end

environment.rb

@@ -108,4 +108,12 @@ class Numeric
   def rounddown(nearest=10)
     self % nearest == 0 ? self : self - (self % nearest)
   end
+end
+
+class Time
+  alias_method :ago_original, :ago
+
+  def ago
+   ago_original.downcase.gsub('right now, this very moment.', 'just now')
+  end
 end

models/comment.rb

@@ -1,3 +1,4 @@
 class Comment < Sequel::Model
   many_to_one :event
+  many_to_one :actioning_site, class: :Site
 end

models/event.rb

@@ -6,6 +6,11 @@ class Event < Sequel::Model
   one_to_one  :site_change
   many_to_one :profile_comment
   one_to_many :likes
+  one_to_many :comments
+  
+  def add_site_comment(site, message)
+    add_comment actioning_site_id: site.id, message: message
+  end
   
   def site_likes?(site)
     likes_dataset.filter(actioning_site_id: site.id).count > 0

public/assets/css/_project-sass/_project-Main.scss

@@ -616,6 +616,7 @@ a.tag:hover {
 }
 .news-item .comments .comment {
   font-size: .8em;
+  clear: both;
 }
 .news-item .comments .comment .user {
   margin-right: 5px;

public/assets/scripts/news/comment.js

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

public/assets/scripts/news/like.js

@@ -5,13 +5,8 @@ var Like = function(eventId, csrfToken) {
 }
 
 Like.prototype.toggleLike = function() {
-  console.log('herp?')
   var self = this
   $.post('/event/'+this.eventId+'/toggle_like', {csrf_token: this.csrfToken}, function(res) {
-    console.log(res)
-    
-    console.log(self.link.text('butts'))
-    
     if(res.result == 'liked')
       self.link.text('Unlike ('+res.event_like_count+')')
 

public/assets/scripts/news/template.js

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

views/_news.erb

@@ -1,10 +1,36 @@
+<script src="/assets/scripts/news/template.js"></script>
 <script src="/assets/scripts/news/like.js"></script>
+<script src="/assets/scripts/news/comment.js"></script>
 <% events.each do |event| %>
   <% if event.profile_comment_id %>
-    <%== erb :'_news_profile_comment', layout: false, locals: {profile_comment: event.profile_comment} %>
+    <div class="news-item comment for-me">
+      <%== erb :'_news_profile_comment', layout: false, locals: {profile_comment: event.profile_comment} %>
   <% end %>
+  
+  <%== erb :'_news_actions', layout: false, locals: {event: event} %>
+  
+  <% if event.comments_dataset.count > 0 %>
+    <div class="content">
+      <div class="comments">
+        <% event.comments.each do |comment| %>
+          <div class="comment">
+            <img class="avatar" src="<%= comment.actioning_site.screenshot_url('index.html', '82x62') %>">
+            <a href="" class="user"><%= comment.actioning_site.username %></a>
+            <span class="date"><%= comment.created_at.ago %></span>
+            <p><%= comment.message %></p>
+          </div>
+          <div class="actions"><a href="">Like (1)</a></div>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+
+  </div>
+
 <% end %>
 
+<%== erb :'_news_templates', layout: false %>
+
 <!--
     <div class="news-item follow">
       <div class="title">

views/_news_actions.erb

@@ -7,5 +7,7 @@
       <%= event_like_count %> <%= event_like_count == 1 ? 'like' : 'likes' %>
     <% end %>
   <% end %>
-  <a href="">Reply</a>
+  <% if current_site %>
+    <a id="reply" href="#" onclick="Template.renderComment(<%= event.id %>); return false">Reply</a>
+  <% end %>
 </div>

views/_news_profile_comment.erb

@@ -1,10 +1,6 @@
-<div class="news-item comment for-me">
+<div class="title">
-  <div class="title">
+  <div class="icon" style="background-image:url(<%= profile_comment.actioning_site.screenshot_url('index.html', '82x62') %>);"></div>
-    <div class="icon" style="background-image:url(<%= profile_comment.actioning_site.screenshot_url('index.html', '82x62') %>);"></div>
+  <a href="/site/<%= profile_comment.actioning_site.username %>" class="user"><%= profile_comment.actioning_site.username %></a> 
-    <a href="" class="user"><%= profile_comment.actioning_site.username %></a> 
+  <span class="date"><%= profile_comment.created_at.ago %></span>
-    <span class="date"><%= profile_comment.created_at.ago %></span>
+  <div class="comment"><%= profile_comment.message %></div>
-    <div class="comment"><%= profile_comment.message %></div>
-  </div>
-
-  <%== erb :'_news_actions', layout: false, locals: {event: profile_comment.event} %>
 </div>

views/_news_templates.erb

@@ -0,0 +1,6 @@
+<div id="comment-template" style="display: none">
+  <form onsubmit="new Comment({{ event_id }}, '<%= 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>

views/layout.erb

@@ -51,6 +51,7 @@
     </footer>
 
     <script src="/assets/scripts/jquery-1.11.0.min.js"></script>
+    <script src="/assets/scripts/underscore-min.js"></script>
     <script src="/assets/scripts/nav.min.js"></script>
     <script src="/js/bootstrap.min.js"></script>
   </body>

views/site.erb

@@ -33,7 +33,7 @@
       <div class="post-comment">
         <form method="POST" action="/profile/<%= site.username %>/comment">
           <input name="csrf_token" type="hidden" value="<%= csrf_token %>">
-          <input name="message" type="text" placeholder="Post a message..." maxlength="<%= Site::MAX_COMMENT_SIZE %>">
+          <input name="message" type="text" placeholder="Post a message..." autocomplete="off" maxlength="<%= Site::MAX_COMMENT_SIZE %>">
           <button class="btn-Action">Post</button>
         </form>
       </div>