Latest Comment by Ben ~ Thu Jan 28 on Git stash

Rails plugin for pretty flash messages

Displaying flash messages is, for the most part, pretty consistent across all of my applications. I usually make use of three: notice, warning, and error. The notices are typically some shade of green, warnings are usually yellow-ish, and errors are always some form of red.

It’s tedious to keep doing the same “flash” stuff in every application. So I wrote a plugin that will hopefully take that pain away. It’s called pretty_flash, and can be found on GitHub. It’s really just for me, but generic enough to share.

Once setup, by default the three flash messages will look like:

Not too bad, but feel free to change it if you aren’t into pastels :-)

I’m not fond of setting flash messages via:

1
flash[:whatever] = "This is the whatever message."

So I’ve added a couple of convenience methods to replace that. Now, in your controller you can set flash messages like this:

1
2
3
notice "This is a notice"
warning "This is a warning"
error "This is an error"

And to display them to the world, somewhere in your view/layout, just call:

1
<%= display_flash_messages %>

It will loop through all the messages set and display each one.

Since this plugin involves CSS and a few images, I’ve provided a rake task that will put those things in their proper places. You can simply copy what you need if you’re not lazy.

1
$ rake pretty_flash:install

But!

You may want to check the assets/ folder in the plugin directory first, just to make sure you don’t have any files with the same name (the rake task will overwrite them if so).

Oh, and another thing. I always fade my flash messages after so long. I typically use either jQuery or Prototype to handle this, so I’ve added a flash.js file that covers both. If you so desire, just copy whichever snippet into your application.js file, and your flash messages will start fading after so many seconds.

Again, this plugin is really just for me, but I figured someone else might find it useful.

Comments

01

Doug V on Tue Jan 27 at 10:47AM

Nice little plugin. Just what I was looking for – Thanks!

02

spacejunky on Fri Feb 20 at 06:06PM

Plugin looks good but having trouble getting the rake task to work. When I run the command I get the following error; /Users/petew/Web/welcome/config/boot.rb:20:Warning: Gem::SourceIndex#search support for String patterns is deprecated

I’m using rails 1.2.6 ? I’ve tried manually copying the files to the right spots in the public directory but no luck. Do I also have to include the required ‘pretty_flash’ at the top of my class?

03

OktaEndy on Sat Aug 01 at 01:55AM

i can’t see the fade effect, what’s wrong?

i have:

1
2
3
<%= javascript_include_tag 'prototype' %>
<%= javascript_include_tag 'effects' %>
<%= javascript_include_tag 'application' %>

and adding this line to application.js

1
2
3
4
5
6
7
8
9
10
11
// Place your application-specific JavaScript functions and classes here 
// This file is automatically included by javascript_include_tag :defaults
document.observe('dom:loaded', function() {
  setTimeout(hideFlashes, 25000);
});
  
var hideFlashes = function() {
  $$('.notice', '.warning', '.error').each(function(e) {
    if (e) Effect.Fade(e, { duration: 1.5 });
  })
}

and fade effect still not showing

and i put this to application.html.erb

1
<%= display_flash_messages %>

can you help me..

04

Mike Subelsky on Mon Aug 10 at 08:34PM

This is perfect for a little project I am ginning up; what is it licensed under? I tried it out and it’s working great. thanks!

05

Ryan on Mon Aug 10 at 09:52PM

OktaEndy – I don’t see anything wrong with your javascript, other than what I’m guessing was a minor typo when posting the comment. You have <= instead of <%= when including the effects and application files, which clearly wouldn’t actually do anything. Without those, the flash messages won’t fade out. Let me know if you’re still having trouble.

Mike – It’s under the MIT license, the same license as Rails. So feel free to use it in any/all of your projects. And thanks, glad you like it :-)

06

Edd Morgan on Tue Aug 11 at 04:03PM

Very nice :)

I also have face the same problem of repeating the same flash stylisation for each project. You seem to have a better eye for design than me, so I’ll just be using yours ;)

07

Andy Marks on Thu Sep 17 at 01:18AM

Very cool and very simple. Thanks very much for creating the plugin.

BTW, “rake pretty_flash:install” failed for me on my Windows box, but I just hand-copied the files and everything was hunky-dory.

08

nuks on Wed Sep 23 at 04:31AM

I also wrote a partly similar plugin → http://nuks88.wordpress.com/2009/09/17/ymlized-and-styled-flash-messages-ysfm-in-rails/

09

Raghavendra on Tue Oct 27 at 09:25AM

Good Job,

This is an impressive way of showing flash messages, I really loved the images…

Good work Thanks.

10

amal on Fri Jan 15 at 05:44AM

Hi,

1) I install the plugin.

2) Added these to my controller

notice "This is a notice"
warning "This is a warning"
error "This is an error"

3) In my layout

1
<%= display_flash_messages %>

4) Copied the images/javascript/css

5) Added the below to application.js

1
2
3
4
5
6
7
8
9
document.observe('dom:loaded', function() {
  setTimeout(hideFlashes, 25000);
});
  
var hideFlashes = function() {
  $$('.notice', '.warning', '.error').each(function(e) {
    if (e) Effect.Fade(e, { duration: 1.5 });
  })
}

7) Included this in layout

1
2
3
4
5
<%= javascript_include_tag 'prototype' %>
<%= javascript_include_tag 'effects' %>
<%= javascript_include_tag 'application' %>
<%= javascript_include_tag 'flash' %>
<%= stylesheet_link_tag 'flash' %>

But i couldn’t get the messages displayed. My machine is windows. What could be issue.

Thanks in advance.

11

Ryan on Fri Jan 15 at 11:15AM

amal – You don’t need to include the ‘flash’ javascript library if you’ve copied over the prototype-based js to your application.js file. That was there for reference. Everything else looks fine to me… did you restart Rails? When you install a new plugin, you need to restart your local development server so that the plugin gets loaded.

Have something to say?
Protected by Defensio Formatting Tips

or

Copyright © 2010 Ryan Heath | Site Management A Ruby on Rails production.

This site is a Formed Function. Formed Function LLC | @formedfunction | Get in Touch