# humane.js

A simple, modern, framework-independent, well-tested, unobtrusive, notification system.
Utilizes CSS transitions when available, falls back to JS animation when not. Includes mobile support.

### Select a theme:

Click a code sample below to see it in action:

    humane.log("Welcome Back")

    humane.log("Record 392 has been updated")

    humane.log(["List","of","Items"])

    humane.log("Callback when finished", function(){ document.body.style.backgroundColor="#a66000" })

    humane.log("Options can be passed", { timeout: 4000, clickToClose: true, addnCls: 'humane-error' })

### Options

Options can be specified in a variety of ways. Either by the entire instance as shown below, or per notification, as shown above:

    humane.timeout = 5000 // default: 2500

> Sets the delay before a message fades out (set to 0 for no timeout).

    humane.waitForMove = true // default: false

> Wait for mouse, keyboard, or touch action to be taken before clearing message (after timeout)

    humane.clickToClose = true // default: false

> Click or touch the notification to close

    humane.timeoutAfterMove = 2000 // default: 0

> Delay before notification disappears (useful in conjunction with waitForMove)

    humane.addnCls = 'humane-info' // default: ''

> Specify an additional class to apply when notifying (nice when you only want to change just a little bit of the style)

### Create instances with humane.create

Create a completely new instance of humane using humane.create().

    var notify = humane.create({ timeout: 4000, baseCls: 'humane-bigbox' })
    notify.log('Custom Notifier')

There are a options that can also be applied when creating an instance:

    humane.baseCls = 'humane' // default: 'humane'

> Specify an base class

### Spawn notifiers with humane.spawn

Create a custom notifier using humane.spawn().

    humane.info = humane.spawn({ addnCls: 'humane-libnotify-info', timeout: 1000 })
    humane.info('Info Themed Notifier')

    humane.error = humane.spawn({ addnCls: 'humane-libnotify-error', timeout: 1000 })
    humane.error('Error Themed Notifier')

### Force remove current notification

    humane.remove(function(){ alert('removed') })

> Force remove current notification, takes an optional callback fired when finished (note each instance has its own remove)

### Go crazy

With all this power, you are bound to go CRAZY! Click the sample below to go crazy:

    var bigbox = humane.create({baseCls: 'humane-bigbox', timeout: 1000})
    bigbox.error = bigbox.spawn({addnCls: 'humane-bigbox-error'})
    bigbox.log('Oh!').error('No!')

    var libnotify = humane.create({baseCls: 'humane-libnotify', addnCls: 'humane-libnotify-info'})
    libnotify.log('Notified')

    var jacked = humane.create({baseCls: 'humane-jackedup', addnCls: 'humane-jackedup-success'})
    jacked.log("What's up here!")

### Browser Support

Uses CSS Transitions where available otherwise falls back to JS animation, degrades gracefully.

- Internet Explorer 7+
- Firefox 3+
- Chrome 9+
- Safari 3+
- Opera 10+
- iOS 4+
- Android 2+

### Create A Custom Theme

Humane is easily themable using Stylus. There are currently a few themes, but I hope this grows. Send me a pull request and update the wiki with your favorite look and feel.

### Download and Usage

Visit github page to download and get more details.