angular-ui-notifications

Angular UI Notifications

This is a package designed to allow you to produce notifications on your website. To get started run

npm install angular-ui-notifications --save

Once installed link your application to the following path.

<script src='node_modules/angular-ui-notifications/dist/angular-ui-notifications.min.js'></script>

In order for the icons to display properly ensure you require in the css file provided with the package.

<link rel='stylesheet' href='node_modules/angular-ui-notifications/dist/css/main.min.css'>

Usage

//Firstly we need to inject the angular-ui-notifications service into our application
angular.module("exampleApp", ['angular-ui-notifications'])
			
			// once we've done that we have access to the popups service which 
			// provides our main functionality.  

            .controller("main", ['$scope', 'popups',  function($scope, popups){
                
                $scope.info = function(msg){
                	// we can pass two parameters into the popups functionality
                	// msg - the message we want to display
                	// true / false - this boolean indicates whether we want the message
                	// to stay on the page indefinitely or not.
                    return popups.info(msg, true);
                };
				// Examples with the other function types
                $scope.success = function(msg){
                    return popups.success(msg);
                };
                $scope.warning = function(msg){
                    return popups.warning(msg);
                };
                $scope.error = function(msg){
                    return popups.error(msg)
                };

            }])		

Methods

• info - this produces an info style notification

• success - this produces a success style notification

• warning - this produces a warning style notification

• error - this produces an error style notification

• destroy - this removes the notification from the DOM with a fade effect. It takes place over 400ms

ToDo

New Methods

• setNotificationTimer - a method to allow you to to increase / decrease the time notifications are shown for

• setIconClasses - a method to allow you to replace the default icons.

Improvements

• Better SCSS support for the alert disappearing / appearing and moving effects

• Better animation effects