minpopup

A minimal popup that display a discreet notification to users. Using responsive and material design the popup provide different level of log with colors as metaphor.

Demo

https://seeren.github.io/minpopup/

Features

• Pop color
• Listen interaction
• UMD support

Installation

Can be installed with npm, there is no need to install style sheet because they are embedded.

npm install minpopup

Usage

For display a notification by level, just use the method corresponding. These level are available: emergency, alert, critical, error, warning, notice, info, debug.

minpopup.emergency("Message");

There is three event handler for listen user action, when the popup is closed and when the user confirm or cancel.

minpopup.alert("Message").onabort(
    function () {
        console.log("Triggered when the user abort");
    }
);

A confirmation and cancelation button can be displayed, adding event handler for the user action.

minpopup.debug("Debug message")
        .onconfirm(function () {
             console.log("Triggered when user confirm");
        })
        .oncancel(function () {
             console.log("Triggered when user cancel");
        });

Inspiration

This popup is a transposition of the PHP Psr-3 logger interface but for client side.

Run the tests

Test can be runned in client and server side after install development dependencies.

npm install

Run with Node

./node_modules/.bin/mocha

Run in a browser

start ./test/index.html

Authors

• Cyril Ichti - www.seeren.fr