install gritter

Gemfile

@@ -165,3 +165,7 @@ gem 'rails_12factor', group: :production
 gem 'rack-contrib', require: 'rack/contrib'
 
 gem 'meta-tags'
+
+# Growl-like Notification
+# https://github.com/RobinBrouwer/gritter
+gem 'gritter', '1.1.0'

Gemfile.lock

@@ -175,6 +175,7 @@ GEM
     github-markdown (0.6.7)
     gmail_xoauth (0.4.1)
       oauth (>= 0.3.6)
+    gritter (1.1.0)
     guard (2.8.1)
       formatador (>= 0.2.4)
       listen (~> 2.7)
@@ -482,6 +483,7 @@ DEPENDENCIES
   factory_girl_rails
   faraday
   github-markdown
+  gritter (= 1.1.0)
   guard-rspec
   guard-rubocop
   guard-teaspoon

app/assets/javascripts/application.js

@@ -14,6 +14,7 @@
 // require jquery
 //= require jquery_ujs
 // require turbolinks
+//= require gritter
 //= require ./lib/jquery.ui.widget
 //= require_tree ./lib
 //= require_tree ./modules

app/assets/stylesheets/application.css

@@ -9,6 +9,7 @@
  * compiled file, but it's generally better to create a new file per style scope.
  *
  *= require normalize
+ *= require gritter
  *= require_tree ./lib
  *= require_tree ./modules
  *= require_tree .

app/controllers/application_controller.rb

@@ -10,7 +10,7 @@ class ApplicationController < ActionController::Base
   def redirect_unless_signed_in
     return if user_signed_in?
 
-    flash[:alert] = 'You need Login!'
+    gflash alert: 'You need Login!'
     session[:login_redirect_to] = request.url
     redirect_to root_path
   end

app/controllers/posts_controller.rb

@@ -39,11 +39,14 @@ class PostsController < ApplicationController
     current_user.google_oauth_token_refresh! if current_user.google_oauth_token_expired?
 
     compose_mail(@post, user: current_user, to: mail_params[:to]).deliver
-    redirect_to root_path(id: @post.id), flash: { success: 'Mail has sent!' }
+    gflash success: 'Mail has been sent!'
+    redirect_to root_path(id: @post.id)
   rescue ActionGmailer::DeliveryError
-    redirect_to root_path(id: @post.id), flash: { notice: 'Gmail authentication expired.' }
+    gflash error: 'Gmail authentication expired.'
+    redirect_to root_path(id: @post.id)
   rescue ArgumentError => err
-    redirect_to root_path(id: @post.id), flash: { alert: 'Mail format is invalid: ' + err.to_s }
+    gflash error: "Mail format is invalid: #{err.to_s}"
+    redirect_to root_path(id: @post.id)
   end
 
   # GET /posts/1/edit
@@ -61,7 +64,8 @@ class PostsController < ApplicationController
 
     respond_to do |format|
       if @post.save
-        format.html { redirect_to post_path(id: @post.id), flash: { notice: 'Post was successfully created.' } }
+        gflash success: 'Post was successfully created.'
+        format.html { redirect_to post_path(id: @post.id) }
         format.json { render action: 'show', status: :created, location: @post }
       else
         format.html { render action: 'new' }
@@ -77,7 +81,8 @@ class PostsController < ApplicationController
 
     respond_to do |format|
       if @post.update(post_params)
-        format.html { redirect_to post_path(id: @post.id), flash: { notice: 'Post was successfully updated.' } }
+        gflash success: 'Post was successfully updated.'
+        format.html { redirect_to post_path(id: @post.id) }
         format.json { head :no_content }
       else
         format.html { render action: 'edit' }
@@ -91,7 +96,8 @@ class PostsController < ApplicationController
   def destroy
     @post.destroy
     respond_to do |format|
-      format.html { redirect_to flow_url, flash: { success: 'Post successfully deleted.' } }
+      gflash success: 'Post was successfully deleted.'
+      format.html { redirect_to flow_url }
       format.json { head :no_content }
     end
   end
@@ -102,10 +108,12 @@ class PostsController < ApplicationController
     @comment = @post.comments.build(comment_params.merge(author: current_user))
     respond_to do |format|
       if @comment.save
+        gflash success: 'Comment was successfully created.'
         format.html { redirect_to post_path(id: @post.id) }
         format.json { render json: { status: 'ok', comment: @comment }, status: :created }
       else
-        format.html { redirect_to post_path(id: @post.id), flash: { alert: 'Comment is not saved.' } }
+        gflash error: 'Comment is not saved.'
+        format.html { redirect_to post_path(id: @post.id) }
         format.json { render json: @comment.errors, status: :unprocessable_entity }
       end
     end

app/controllers/tags_controller.rb

@@ -19,7 +19,8 @@ class TagsController < ApplicationController
 
     respond_to do |format|
       if @tag.save
-        format.html { redirect_to @tag.show_path, flash: { notice: 'Tag was successfully created.' } }
+        gflash success: 'Tag was successfully created.'
+        format.html { redirect_to @tag.show_path }
         format.json { render action: 'show', status: :created, location: @tag }
       else
         format.html { render action: 'new' }
@@ -31,7 +32,8 @@ class TagsController < ApplicationController
   def update
     respond_to do |format|
       if @tag.update(tag_params)
-        format.html { redirect_to @tag.show_path, flash: { notice: 'Tag was successfully updated.' } }
+        gflash success: 'Tag was successfully updated.'
+        format.html { redirect_to @tag.show_path }
         format.json { head :no_content }
       else
         format.html { render action: 'edit' }
@@ -43,7 +45,8 @@ class TagsController < ApplicationController
   def destroy
     @tag.destroy
     respond_to do |format|
-      format.html { redirect_to flow_url, flash: { success: 'Tag successfully deleted.' } }
+      gflash success: 'Tag successfully deleted.'
+      format.html { redirect_to flow_url }
       format.json { head :no_content }
     end
   end
@@ -57,7 +60,7 @@ class TagsController < ApplicationController
     @tag.move_all_posts_to!(@merge_to_tag)
     @tag.delete
 
-    flash[:notice] = "「#{@tag.name}」は「#{@merge_to_tag.name}」にmergeされました"
+   gflash success: "「#{@tag.name}」は「#{@merge_to_tag.name}」にmergeされました"
 
     render json: { status: 'OK' }
   end
@@ -68,7 +71,7 @@ class TagsController < ApplicationController
 
     @tag.parent_tag = @move_to_tag
 
-    flash[:notice] = "「#{@tag.name}」は「#{@move_to_tag.name}」の下に移動しました"
+    gflash success: "「#{@tag.name}」は「#{@move_to_tag.name}」の下に移動しました"
 
     render json: { status: 'OK' }
   end

app/controllers/users/omniauth_callbacks_controller.rb

@@ -6,7 +6,8 @@ class Users::OmniauthCallbacksController < Devise::OmniauthCallbacksController
 
     # reject if email is not zigexn nor ventura.
     if email !~ /@zigexn\.co\.jp$/ && email !~ /@zigexn\.vn$/
-      redirect_to root_path, flash: { alert: 'Your email address is not permitted.' }
+      gflash error: 'Your email address is not permitted.'
+      redirect_to root_path
       return
     end
 
@@ -14,7 +15,8 @@ class Users::OmniauthCallbacksController < Devise::OmniauthCallbacksController
     @user = User.find_for_google_oauth2(request.env['omniauth.auth'], current_user)
 
     if @user.persisted?
-      flash[:notice] = I18n.t 'devise.omniauth_callbacks.success', kind: 'Google'
+      gflash success: I18n.t('devise.omniauth_callbacks.success')
+      # flash[:notice] = I18n.t 'devise.omniauth_callbacks.success', kind: 'Google'
       sign_in_and_redirect @user, event: :authentication
     else
       session['devise.google_data'] = request.env['omniauth.auth']

app/controllers/users_controller.rb

@@ -7,7 +7,8 @@ class UsersController < ApplicationController
   def update
     respond_to do |format|
       if @user.update(user_params)
-        format.html { redirect_to edit_user_path, flash: { notice: 'Post was successfully updated.' } }
+        gflash success: 'Post was successfully updated.'
+        format.html { redirect_to edit_user_path }
         format.json { head :no_content }
       else
         format.html { render action: 'edit' }

app/views/layouts/application.html.slim

@@ -17,8 +17,8 @@ html lang="ja"
     = csrf_meta_tags
 
   body class="rails-#{params[:controller]}-#{params[:action]}"
+    = gflash
     .body-padding
-        = render partial: 'partials/header_notifications'
         - if params[:controller] != 'welcome'
           = render partial: 'partials/app_header'
         .container-fluid.container-main#yield

app/views/layouts/edit.html.slim

@@ -16,6 +16,7 @@ html lang="ja"
     = render_style
     = csrf_meta_tags
   body class="rails-#{params[:controller]}-#{params[:action]}"
+    = gflash
     .container-fluid.container-main#yield
       = yield
 

app/views/partials/_app_header.html.slim

@@ -60,7 +60,7 @@ nav.navbar.navbar-fixed-top.navbar-default.navbar-original role="navigation"
               a href=watching_path Watchings
             li.divider
             li
-              a href=destroy_user_session_path data-method="delete" rel="nofollow" SignOut
+              a href=destroy_user_session_path data-method="delete" rel="nofollow" Log Out
 
 script#notification-content type="text/template"
   - if current_user.notifications.unread.recent.any?

app/views/partials/_header_notifications.html.slim

-- if flash[:success]
-  .alert.alert-success.fade.in
-    button.close aria-hidden="true" data-dismiss="alert" type="button"  ×
-    strong Success
-    = flash[:success]
-- if flash[:notice]
-  .alert.alert-warning.fade.in
-    button.close aria-hidden="true" data-dismiss="alert" type="button"  ×
-    strong Notice
-    = flash[:notice]
-- if flash[:alert]
-  .alert.alert-danger.fade.in
-    button.close aria-hidden="true" data-dismiss="alert" type="button"  ×
-    strong Alert
-    = flash[:alert]

config/initializers/assets.rb

@@ -5,4 +5,6 @@ Rails.application.config.assets.version = '1.0'
 
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
-# Rails.application.config.assets.precompile += %w( search.js )
+Rails.application.config.assets.precompile += %w(
+  ie-spacer.gif gritter.png gritter-close.png success.png error.png notice.png progress.gif warning.png
+)

config/initializers/gritter.rb

+if defined?(Gritter)
+  Gritter.rails_flash_fallback = true
+end

config/locales/gflash.en.yml

+en:
+  gflash:
+    #
+    # These are the translations for the different titles.
+    #
+    titles:
+      notice: "Notice"
+      success: "Success"
+      warning: "Warning"
+      error: "Error"
+      progress: "Progress"
+    #
+    # Add default gflash messages:
+    # defaults:
+    #   success: "This is a notification"
+    #   error: "Something went wrong"
+    #   create:
+    #     success: "Successfully created!"
+    #     error: "Something went wrong. Please take a look at the form to see what went wrong."
+    #
+    # Add gflash messages for controller actions:
+    # products:
+    #   create:
+    #     notice: "This is a notification"
+    #     error: "Something went wrong"
+    #
+    # Inside controller: 
+    # gflash :notice, :error
+    #
\ No newline at end of file