notie

notie - a clean and simple notification suite for javascript, with no dependencies

3.0.0
Source
npm

Version published: 9 years ago

Maintainers: 1

Created: 9 years ago

Source

notie

notie is a clean and simple notification suite for javascript, with no dependencies. demo: https://jaredreich.com/projects/notie

With notie you can:

Alert users
Confirm user choices
Input user information

Alt text

Features

Pure JavaScript, no dependencies
Works in all modern browsers (Chrome, Firefox, Safari, IE 9+, Edge, Opera)
Easily customizable
Change colors to match your style/brand
Modify styling with the sass file (notie.scss)
Font size auto-adjusts based on screen size

Installation

HTML:

<head>
	...
	<link rel="stylesheet" type="text/css" href="/path/to/notie.css">
</head>
<body>
  ...
  <!-- Bottom of body -->
  <script src="/path/to/notie.js"></script>
</body>

npm:

npm install notie

Bower:

bower install notie

Usage

notie.alert(alertType(Number), message(String, timeInSeconds);

notie.confirm(title(String), yesText(String), noText(String), yesCallback(Function), noCallbackOptional(Function));

notie.input(options(JSON), title(String), submitText(String), cancelText(String), submitCallback(Function), cancelCallbackOptional(Function));

For example:

notie.alert(1, 'Success!', 1.5);
notie.alert(2, 'Warning<br><b>with</b><br><i>HTML</i><br><u>included.</u>', 2);
notie.alert(3, 'Error.', 2.5);
notie.alert(4, 'Information.', 2);

notie.confirm('Are you sure you want to do that?', 'Yes', 'Cancel', function() {
    notie.alert(1, 'Good choice!', 2);
});
notie.confirm('Are you sure?', 'Yes', 'Cancel', function() {
    notie.confirm('Are you <b>really</b> sure?', 'Yes', 'Cancel', function() {
        notie.confirm('Are you <b>really</b> <i>really</i> sure?', 'Yes', 'Cancel', function() {
            notie.alert(1, 'Okay, jeez...', 2);
        });
    });
});

notie.input({
	type: 'email'
	placeholder: 'name@example.com',
	prefilledValue: 'jane@doe.com'
},'Please enter your email address:', 'Submit', 'Cancel', 'email', 'name@example.com', function(value_entered) {
    notie.alert(1, 'You entered: ' + value_entered, 2);
});
notie.input({
	type: 'password',
	placeholder: 'Enter your password'
}, 'Please enter your password:', 'Submit', 'Cancel', function(valueEntered) {
	notie.alert(1, 'You entered: ' + valueEntered, 2);
}, function(valueEntered) {
	notie.alert(3, 'You cancelled with this value: ' + valueEntered, 2);
});

Options

notie.setOptions({
	animationDelay: 300, // Be sure to also change "transition: all 0.3s ease" variable in .scss file
	backgroundClickDismiss: true
});

License

MIT

Keywords

FAQs

What is notie?

Is notie well maintained?

Package last updated on 26 Mar 2016

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install