From 560229b101fd7b0dff8db6100f6ac55990702545 Mon Sep 17 00:00:00 2001 From: yafeilee Date: Thu, 28 Apr 2016 11:18:53 +0800 Subject: [PATCH] Add new feature #46 --- app/assets/javascripts/application.js | 2 ++ app/assets/javascripts/cable.coffee | 1 + app/assets/javascripts/comment.coffee | 12 ++++++++++++ app/channels/application_cable/channel.rb | 5 +++++ app/channels/application_cable/connection.rb | 5 +++++ app/channels/comment_channel.rb | 6 ++++++ app/controllers/blogs_controller.rb | 1 + app/controllers/comments_controller.rb | 6 ++++++ app/views/blogs/show.html.slim | 2 +- app/views/comments/refresh.js.erb | 1 + app/views/layouts/application.html.slim | 1 + config/cable.yml | 9 +++++++++ config/environments/production.rb | 7 +++++-- config/routes.rb | 8 +++++++- 14 files changed, 62 insertions(+), 4 deletions(-) create mode 100644 app/assets/javascripts/cable.coffee create mode 100644 app/assets/javascripts/comment.coffee create mode 100644 app/channels/application_cable/channel.rb create mode 100644 app/channels/application_cable/connection.rb create mode 100644 app/channels/comment_channel.rb create mode 100644 app/views/comments/refresh.js.erb create mode 100644 config/cable.yml diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 69eacbe..9217973 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -1,9 +1,11 @@ //= require jquery //= require jquery_ujs //= require turbolinks +//= require action_cable //= require foundation //= require js.cookie //= require 'jquery.html5-fileupload' +//= require cable //= require_tree . $(document).on('turbolinks:load', function(){ diff --git a/app/assets/javascripts/cable.coffee b/app/assets/javascripts/cable.coffee new file mode 100644 index 0000000..3f5217c --- /dev/null +++ b/app/assets/javascripts/cable.coffee @@ -0,0 +1 @@ +@App ||= {} diff --git a/app/assets/javascripts/comment.coffee b/app/assets/javascripts/comment.coffee new file mode 100644 index 0000000..9515a7a --- /dev/null +++ b/app/assets/javascripts/comment.coffee @@ -0,0 +1,12 @@ +$(document).on 'turbolinks:load', -> + $('#alert-container .close-button').click ()-> + $('#alert-container').hide() + + if $('#blog-show-page').length > 0 + window.App.cable ||= ActionCable.createConsumer() + if window.App.comment_channel + window.App.comment_channel.unsubscribe() + window.App.comment_channel = window.App.cable.subscriptions.create { channel: "CommentChannel", post_id: $('#blog-show-page').data('post_id') }, + received: (data)-> + if data['not'] != Cookies.get('cable_id') + $.get( $('#blog-show-page').data('url') ) diff --git a/app/channels/application_cable/channel.rb b/app/channels/application_cable/channel.rb new file mode 100644 index 0000000..d56fa30 --- /dev/null +++ b/app/channels/application_cable/channel.rb @@ -0,0 +1,5 @@ +# Be sure to restart your server when you modify this file. Action Cable runs in a loop that does not support auto reloading. +module ApplicationCable + class Channel < ActionCable::Channel::Base + end +end diff --git a/app/channels/application_cable/connection.rb b/app/channels/application_cable/connection.rb new file mode 100644 index 0000000..b4f4138 --- /dev/null +++ b/app/channels/application_cable/connection.rb @@ -0,0 +1,5 @@ +# Be sure to restart your server when you modify this file. Action Cable runs in a loop that does not support auto reloading. +module ApplicationCable + class Connection < ActionCable::Connection::Base + end +end diff --git a/app/channels/comment_channel.rb b/app/channels/comment_channel.rb new file mode 100644 index 0000000..e1f148a --- /dev/null +++ b/app/channels/comment_channel.rb @@ -0,0 +1,6 @@ +# Be sure to restart your server when you modify this file. Action Cable runs in a loop that does not support auto reloading. +class CommentChannel < ApplicationCable::Channel + def subscribed + stream_from "comment_post_#{params[:post_id]}" + end +end diff --git a/app/controllers/blogs_controller.rb b/app/controllers/blogs_controller.rb index 93a1e23..ac1245d 100644 --- a/app/controllers/blogs_controller.rb +++ b/app/controllers/blogs_controller.rb @@ -17,6 +17,7 @@ class BlogsController < ApplicationController end def show + cookies[:cable_id] = SecureRandom.uuid @post = Post.find(params[:id]) @post.visited @prev = Post.where('created_at < ?', @post.created_at).order(created_at: :desc).first diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index cfba707..5ebc592 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -15,12 +15,18 @@ class CommentsController < ApplicationController if @comment.save @comments = @post.comments.order(created_at: :desc) + ActionCable.server.broadcast "comment_post_#{@comment.post.id}", { not: cookies[:cable_id] } render :create_ok else render :create_fail end end + def refresh + @post = Post.find(params[:blog_id]) + @comments = @post.comments.order(created_at: :desc) + end + private def comment_params params.require(:comment).permit(:content, :name, :email) diff --git a/app/views/blogs/show.html.slim b/app/views/blogs/show.html.slim index 9bda14d..b3616f3 100644 --- a/app/views/blogs/show.html.slim +++ b/app/views/blogs/show.html.slim @@ -4,7 +4,7 @@ - content_for(:title) do | #{@post.title} -.row.blog-wrapper +.row.blog-wrapper#blog-show-page data-url=refresh_blog_comments_path(@post) data-post_id=@post.id .small-12.large-9.large-centered.columns = render partial: "post", :locals=> { post: @post } .comment-field diff --git a/app/views/comments/refresh.js.erb b/app/views/comments/refresh.js.erb new file mode 100644 index 0000000..bbcc981 --- /dev/null +++ b/app/views/comments/refresh.js.erb @@ -0,0 +1 @@ +$('.comment-diag').replaceWith('<%= j render partial: 'comment_content', locals: { comments: @comments }%>'); diff --git a/app/views/layouts/application.html.slim b/app/views/layouts/application.html.slim index 1433b14..3048f1e 100644 --- a/app/views/layouts/application.html.slim +++ b/app/views/layouts/application.html.slim @@ -10,6 +10,7 @@ html = favicon_link_tag 'favicon.png', type: 'image/png' = javascript_include_tag "application", 'data-turbolinks-track' => "reload" = csrf_meta_tags + = action_cable_meta_tag body data-whatinput="mouse" - if content_for?(:main) = yield(:main) diff --git a/config/cable.yml b/config/cable.yml new file mode 100644 index 0000000..9b400d1 --- /dev/null +++ b/config/cable.yml @@ -0,0 +1,9 @@ +production: + adapter: redis + url: redis://localhost:6379/wblog_cable + +development: + adapter: async + +test: + adapter: async diff --git a/config/environments/production.rb b/config/environments/production.rb index 979f3ee..db82b7c 100644 --- a/config/environments/production.rb +++ b/config/environments/production.rb @@ -46,7 +46,7 @@ WBlog::Application.configure do config.log_level = :info # Prepend all log lines with the following tags. - # config.log_tags = [ :subdomain, :uuid ] + config.log_tags = [ :request_id ] # Use a different logger for distributed setups. # config.logger = ActiveSupport::TaggedLogging.new(SyslogLogger.new) @@ -59,7 +59,10 @@ WBlog::Application.configure do # Precompile additional assets. # application.js, application.css, and all non-JS/CSS in app/assets folder are already added. - config.assets.precompile += %w( vendor/modernizr.js ) + # config.assets.precompile += %w( ) + + config.action_cable.url = 'wss://example.com/cable' + config.action_cable.allowed_request_origins = [ 'http://example.com', /http:\/\/example.*/ ] # Ignore bad email addresses and do not raise email delivery errors. # Set this to true and configure the email server for immediate delivery to raise delivery errors. diff --git a/config/routes.rb b/config/routes.rb index f340e0e..fc4912c 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -4,7 +4,11 @@ WBlog::Application.routes.draw do collection do get :rss end - resources :comments, only: [:index, :create] + resources :comments, only: [:index, :create] do + collection do + get :refresh + end + end resources :likes, only: [:index, :create, :destroy] do member do get :is_liked @@ -42,4 +46,6 @@ WBlog::Application.routes.draw do get '/mobile' => 'home#mobile' root 'blogs#index' + + mount ActionCable.server => '/cable' end