Roar - Notifications (v1.0)
Roar is a notification widget that streamlines incoming messages, such as updates or errors, without
distracting the user from their browser experience or breaking their work-flow by displaying obtrusive
alerts. Roar is inspired by Growl, the notification system for Mac OS X and
is realised with MooTools.
Showcases
- Never-ending Feed Showing feed items with link but without end.
- Random Alerts Random notifications for all 4 corners of the document.
- Update Ticker Timed updates on events.
Features
- Show any informations you want and style them with class-names.
- Messages are queued and interactive
- Hover them to read them longer
- Add optional click-interaction to provide more information
- Customize them via external CSS to your own needs.
How to use
// Wait for the content ... window.addEvent('domready', { // Default options, reuse this Roar var queue = new Roar(); });
Compatibility
Fully compatible with all A-Grade Browsers (Internet Explorer 6+, Opera 9, Firefox 1.5+ and Safari 2+)
Planned
- Support for centered position
- More notification types and easier customization
Requirements
MooTools JavaScript Framework
Download MooTools 1.2 with at least these modules:
- Element.Dimensions
- Fx.Tween
- Fx.Morph
- Selectors
- DomReady (facultative)
Download
Changelog
- 1.0.1 (2008-04-26)
- Added: Roar::inject which contains all the basic create-notification logic, alert only builds the elements. Add more handlers (images, mp3-player like, whatever) on your own and send the cool ones to me!
- Added: Added queued demo and improved ticker demo
- Added: Roar::empty to remove all open items
- Changed: Removed handler argument for alert, just get the last item from Roar::items and add custom events.
- Changed: Removed orphaned title option, no default title possible
- 1.0 (2008-01-19)
- Added: New Events onShow, onHide (arguments element and index) and onRender
- Fixed: Adapted new MooTools Dimensions, follows window scrolling again.
- Fixed: Added fallback for IE regarding opaque background.
- 1.0 pre (2008-01-03)
- Initial working version for MooTools 1.2
License
All files are © 2008-2009 by Harald Kirschner and available under the MIT License.
Contact & Discussion
For asking questions, requesting features, filing bugs or contributing other thoughts on this project use the support forum below. Before posting a new question, read through the documentation and the contributed notes for an answer. For problem reports make sure to add enough details like browser, version and a link or the relevant code.
You can contact me for non-support related notes.
Professional Support
I am available for hire if you look for professional and swift help. I can come to your rescue for installation, customization or extending the existing source for your needs.
61 Comments
Please use the support forums for discussing the project, asking questions or posting bug-fixes!
-
Support and discussions moved to http://digitarald.de/forums/. If you already commented it here, please repost your question or bug report in the forum to get support.
-
thank you admınn
-
Got it working. Nice thing, gonna mention it on www.apfelkuh.de and I would love to trackback it, but actually i dunno where to get the trackback url :P I will just try wordpress default /trackback..
maybe you could pay me a visit and post it ;) -
actually, doesnt work for me. I just have to figure out how to implement because the snippet isn't working.
-
Sometimes, when the message appeared, scrolls are appearing too if page content less than render area. it happens at FF, because FF doesn't show the scrolls if page content fits the area
-
Hi Harald, have you ever worked with Roar to show partly above a Flash object . Had a short look at your CSS and the z-index, position values in combination with flash´s wMode setting to "transparent" it should work ?! But it doesnt for me. Is it possible in general Any idea ? Great work btw
-
I can't seem to make it work with the code you use! Nothing shows up... :( Am I missing something here?
-
How could i make a confirmation box with roar?? may be possible?
-
how could I fire growl.smoke when page loads??
-
Hola amigo!
Como veo es un poco complicado que los bordes en IE sirva. Por lo tanto, si se coloca una imagen de fondo como lo haria.
Gracias!
-
Thanks a lot for ROAR.
I may need it for a project I'm currently working on for my Rodizio Restaurant.
I'm trying to get my own browser based POS system running via WLAN. -
For those interested in different notification API's, one alternative is Stitcho.com (http://www.stitcho.com).
Stitcho is a notification platform that allows web applications to send alerts through the internet to be displayed on a user's desktop, with clients for Windows and Mac.
-
tthank youu
-
Is the demo broken? I'm on the Random Alerts page, and nothing happens when I click any of the four corner links. Maybe I'm just missing something...
Thanks
-
Great work!
-
Very nice script, keep up your great work, Harald.
I like to much Update Ticker variant, is it possible to add a "loop" in it (show notifications in order (not randomly)) and when last item is showed start it showing again..? Is it difficult to implement?
Another great thing would be to have the possibility to read messages to show remotely via Ajax, from database using simple php file which queries database for example..
Thanks in advance for your replies,
Best regards and sorry for my english - i'm italian.
-
This is nice. I noticed you have a "centered position" listed as a planned feature... any word on when we might expect that.
Thanks again for all the awesome tools.
-
thanxx
-
Great JavaScript tool. Thanks for this.
Post your comment
Please use the support forums for discussing the project, asking questions or posting bug-fixes!
i love your roar notification widget. !!! i could kiss you!!!!!! lol. I cant wait for the update!!