Library of The Week: Humane.js

Having covered Vex and SweetAlert, this week's topic is yet another notification library: Humane.js. Humane has a slightly different purpose from the other two, which are relatively similar to each other. Whereas Vex and SweetAlert create modal dialogs, Humane is focused on non-blocking notifications similar to classic desktop notifications. It's no coincidence that the basic theme is named libnotify after the GNOME notification library.

Like desktop notifications, Humane can also queue messages and display them one at a time. The API couldn't be easier:

humane.log(message, options);

options has only few valid choices, mostly to control how notifications are dismissed: timeout, clickToClose, waitForMove (which waits for user activity), timeoutAfterMove (waits for user activity and a specified timeout).

The default for all these options can be set globally on the Humane instance itself.

humane.timeout = 6000;

Most of the remaining options are related to theming. Each theme is implemented with one CSS class and is technically just a single CSS file. The global baseCls option sets a default notification CSS class (theme), and the addnCls option allows you to put an extra class on a specific message.

With that, we've covered almost the whole Humane API. I've only neglected a few edge-case methods: create, which allows you to have multiple notification queues in parallel, spawn to create a new Humane instance with different default options and remove to hide notifications instantly. For more details, refer to the official documentation and demo page.