Post like/unlike actions

app/assets/javascripts/posts.js.coffee

@@ -2,6 +2,12 @@ campo.Posts =
   init: ->
     $(document).on 'click', '[data-post-reply-to]', @replyTo
 
+  updateLikes: (ids) ->
+    for id in ids
+      console.log $("#post_#{id} .post-like")
+      $("#post_#{id} .post-like").addClass('active').attr('data-method', 'delete')
+
+
   replyTo: ->
     $textarea = $('#new_post').find('textarea')
     $textarea.focus()

app/assets/stylesheets/posts.css.scss

@@ -42,6 +42,11 @@
       }
     }
 
+    .post-like.active {
+      color: $brand-danger;
+      @include box-shadow(none);
+    }
+
     .pull-left {
       margin-left: -12px;
     }

app/controllers/posts_controller.rb

@@ -35,9 +35,27 @@ class PostsController < ApplicationController
     end
   end
 
+  def like
+    @post = Post.find params[:id]
+    @post.like_users.push current_user
+
+    respond_to do |format|
+      format.js
+    end
+  end
+
+  def unlike
+    @post = Post.find params[:id]
+    @post.like_users.delete current_user
+  end
+
   def preview
     @content = params[:content]
     render layout: false
+
+    respond_to do |format|
+      format.js
+    end
   end
 
   private

app/helpers/posts_helper.rb

@@ -1,4 +1,8 @@
 module PostsHelper
+  def like_post_ids(user, posts)
+    user.like_posts.where(id: posts.pluck(:id)).pluck(:id)
+  end
+
   def format_post(text)
     sanitize(link_post_content(markdown(text)),
              tags: %w(p br img h1 h2 h3 h4 blockquote pre code strong em a ul ol li span),

app/views/posts/_post.html.slim

@@ -19,5 +19,10 @@ li.list-group-item-campo id="post_#{post.id}" data-post-id=post.id data-creator-
         - else
           a.btn href=edit_post_path(post) data-remote='true' data-visible-to="creator"
             i.fa.fa-edit
+        a.btn.post-like href=like_post_path(post) data-remote='true' data-method="post"
+          i.fa.fa-heart
+          '
+          span.count
+            = post.like_users_count
         a.btn data-visible-to="user" data-post-reply-to="@#{post.user.username} ##{post.post_number}"
           i.fa.fa-reply

app/views/posts/like.js.erb

@@ -0,0 +1,2 @@
+$('#post_<%= @post.id %> .post-like .count').text('<%= @post.like_users_count %>');
+$('#post_<%= @post.id %> .post-like').addClass('active').data('method', 'delete');

app/views/posts/unlike.js.erb

@@ -0,0 +1,2 @@
+$('#post_<%= @post.id %> .post-like .count').text('<%= @post.like_users_count %>');
+$('#post_<%= @post.id %> .post-like').removeClass('active').data('method', 'post');

app/views/topics/show.html.slim

@@ -25,3 +25,7 @@
     - else
       a.btn.btn-default href=login_path(return_to: url_for) Login to Reply
   .col-md-3
+
+- if login?
+  javascript:
+    campo.Posts.updateLikes(#{like_post_ids(current_user, @posts)});

config/routes.rb

@@ -16,7 +16,12 @@ Rails.application.routes.draw do
 
   resources :posts, only: [:show, :create, :edit, :update] do
     collection do
-      post 'preview'
+      post :preview
+    end
+
+    member do
+      post :like
+      delete :like, action: 'unlike'
     end
   end
 

test/controllers/posts_controller_test.rb

@@ -34,4 +34,24 @@ class PostsControllerTest < ActionController::TestCase
     assert_response :success, @response.body
     assert_equal 'change', topic_post.reload.content
   end
+
+  test "should like post" do
+    topic_post = create(:post)
+    assert_login_required do
+      xhr :post, :like, id: topic_post
+    end
+    assert_response :success, @response.body
+    assert_equal 1, topic_post.reload.like_users_count
+  end
+
+  test "should unlike post" do
+    topic_post = create(:post)
+    user = create(:user)
+    topic_post.like_users << user
+    assert_login_required(user) do
+      xhr :delete, :unlike, id: topic_post
+    end
+    assert_response :success, @response.body
+    assert_equal 0, topic_post.reload.like_users_count
+  end
 end

test/helpers/posts_helper_test.rb

@@ -1,6 +1,18 @@
 require 'test_helper'
 
 class PostsHelperTest < ActionView::TestCase
+  test "should ouput post_likes data" do
+    post1 = create(:post)
+    post2 = create(:post)
+    create(:post)
+    user = create(:user)
+
+    post1.like_users.push user
+    post2.like_users.push user
+
+    assert_equal [post1.id, post2.id].sort, like_post_ids(user, Post.all).sort
+  end
+
   test "should link mentions" do
     assert_equal %q|<p><a href="/~username">@username</a></p>|, link_post_content('<p>@username</p>')
     assert_equal %q|<a href="http://example.org/">@username</a>|, link_post_content(%q|<a href="http://example.org/">@username</a>|)

test/javascripts/posts_test.js.coffee

@@ -1,5 +1,28 @@
 module('Posts')
 
+test 'should update liks by ids', ->
+  $fixture = $('#qunit-fixture')
+  $fixture.append("""
+  <div id="post_1">
+    <a class="post-like" data-method="post"></a>
+  </div>
+  <div id="post_2">
+    <a class="post-like" data-method="post"></a>
+  </div>
+  <div id="post_3">
+    <a class="post-like" data-method="post"></a>
+  </div>
+  """)
+  campo.Posts.updateLikes([1,2])
+  ok($fixture.find('#post_1 .post-like').hasClass('active'))
+  equal($fixture.find('#post_1 .post-like').data('method'), 'delete')
+  ok($fixture.find('#post_2 .post-like').hasClass('active'))
+  equal($fixture.find('#post_2 .post-like').data('method'), 'delete')
+  ok(!$fixture.find('#post_3 .post-like').hasClass('active'))
+  equal($fixture.find('#post_3 .post-like').data('method'), 'post')
+
+
+
 test 'should acitve reply-to button', ->
   $fixture = $('#qunit-fixture')
   $fixture.append("""