Add Growl style notifications

raulgomis commented 12 years ago

Hi!! It would be nice to have a growl-like notification component within bootstrap :)

Here are the most important jquery scripts: http://webtoolkit4.me/2009/08/13/jquery-growl-likenotification-systems/

Personally I like jquery Purr http://kitchen.net-perspective.com/purr-example-4.html

What do you think about that?

Thanks for all! Raúl

olivierlesnicki commented 12 years ago

Discovered this tread few days ago while browsing the internet regarding this exact issue. Came up with a simple, minimalistic approach to the solution: https://github.com/olivierlesnicki/colibri.js.

JpEncausse commented 12 years ago

+1 for Noty Growl like components are good UX for some Action's Feedback

pixelyunicorn commented 12 years ago

:+1: for the overall idea. Just make sure that it is IE7-compatible.

thomasfr commented 12 years ago

+1 for Noty

al6x commented 12 years ago

+1 for Grolw like notification but not for Noty, Noty looks very ugly.

pixelyunicorn commented 12 years ago

I believe that the notifications should be styled just like alerts, but also offering a white and black flavor.

bradley-r-martin commented 12 years ago

I did a mock up of what i think would be cool for growl style notifications.

http://jsfiddle.net/TM9Ab/

Mind the code as its just a mockup.

Used css3 animations via animate.css

pokonski commented 12 years ago

@bradley-r-martin nice! I like the scrolling :)

bradley-r-martin commented 12 years ago

Thanks, My thinking was that most growl notifications that have fair bit of information to display end up taking up a large amount of the screen up especially if there is more then one at once.

Some of the growl plugins out there just take up to much screen space for my liking.

ShaunR commented 12 years ago

We need a dark/inverted style alert for this.

bradley-r-martin commented 12 years ago

@ShaunR why dark / inverted ?

ShaunR commented 12 years ago

@bradley-r-martin because a lot of the growl notifications you see these days are dark and semi transparent. They look good in my opinion. I'm not 100% on the looks of tb's alerts though either, they are missing something, just don't know what. :)

Just a few examples http://jquery.malsup.com/block/#demos http://www.erichynds.com/jquery/a-jquery-ui-growl-ubuntu-notification-widget/ http://cssdeck.com/item/174/pure-css-3d-animated-growl-notification http://boedesign.com/demos/gritter/

bradley-r-martin commented 12 years ago

@ShaunR The only one out of those examples i like is the cssdeck.com one but i hate the animation of it.

I think whatever the growl feature ends up looking like it should have a few different colour styles like the alerts and buttons do.

But i personally don't think black as a default looks good. Much prefer a light background for the growl with a pop out shadow.

I think a light background would also fit better into the current bs style.

add1ct3dd commented 12 years ago

I personally don't think there is a need to create one, with so many out there as shown that are actually compatible with bootstrap, is there really any need to incorporate it? It's not as if it's a core item in website design to be honest!

ShaunR commented 12 years ago

@add1ct3dd Alerts are pretty much a feature I use in every site I develop, sure alerts already exist but growl would be nice too. Also if we didn't incorporate anything that didn't have a million copies out there bootstrap wouldn't exist. The idea, at least in my opinion, with the tb framework is to make it as complete as possible with out bloating it to high hell so that you don't have to bring in a million other hacks. Seeing how it's modular already, one can pick and choose what they want and don't want.

add1ct3dd commented 12 years ago

@ShaunR True, but that's exactly the point - What one user finds useful another user may not, that was merely my opinion as it's not something I use at all. In this instance, you do.

I merely echo my opinion, from my point of view I consider it bloat-worthy as It's not something I'd use or call "normal" within website design (sure it's used, but it's not a vast & widely adopted item).

We shall have to see what's decided :)

ShaunR commented 12 years ago

@add1ct3dd No waiting needed, this issue is a milestone for 2.1.0 so I believe it's already planned!

ahmadalfy commented 12 years ago

NOTY FTW!!!

hperrin commented 12 years ago

I just released a version of Pines Notify with Bootstrap support:

http://pinesframework.org/pnotify/

tonyouyang commented 12 years ago

@hperrin excellent!

ahmadalfy commented 12 years ago

@hperrin I am in <3

al6x commented 12 years ago

@hperrin very nice, thanks!

MechanisM commented 12 years ago

Why don't you using this one http://nijikokun.github.com/bootstrap-notify/ ? Doesn't requires jquery ui. Also long time ago I did styles and mods here: http://mechanism.github.com/bootstrap-addons/#sticky need to be finished and upgraded to latest bootstrap.