Skip to content

Commit c3e5697

Browse files
committed
docs() prettier tabbing, add provider call chaining doc
1 parent 0200be6 commit c3e5697

File tree

2 files changed

+293
-240
lines changed

2 files changed

+293
-240
lines changed

README.md

Lines changed: 83 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,19 @@ This service provides several helper methods to display notifications on web app
66

77
A PNotify 2.0 port heavily based on [angular-pines-notify](https://github.com/mykabam/angular-pines-notify) project.
88

9-
### Requirements
9+
### Dependencies
1010

1111
- [JQuery](http://jquery.com/)
1212
- [PNotify](http://sciactive.com/pnotify/)
1313
- [AngularJS](http://angularjs.org/)
14+
15+
#### Optional
16+
17+
Need to use at least Bootstrap 3 or jQuery UI to make pretty notifications.
18+
1419
- [Bootstrap 3](http://getbootstrap.com)
20+
- [jQuery UI](http://http://jqueryui.com)
21+
- [FontAwesome](http://http://fontawesome.io)
1522

1623
### Demo
1724

@@ -26,6 +33,8 @@ A PNotify 2.0 port heavily based on [angular-pines-notify](https://github.com/my
2633
Include PNotify related assets. You need to include at least pnotify.core.css and pnotify.core.js.
2734
Don't forget pnotify.confirm.js if you need confirmation dialogs.
2835

36+
Include at least Bootstrap 3 or jQuery UI.
37+
2938
Then add angular-pnotify.js.
3039

3140
```html
@@ -94,18 +103,56 @@ Sometimes you want to set defaults for the whole application. You can do so in y
94103

95104
```javascript
96105
angular.module('MyApp')
97-
.config(['notificationServiceProvider', function(notificationServiceProvider) {
106+
.config(['notificationServiceProvider', function(notificationServiceProvider) {
98107

99-
notificationServiceProvider.setDefaults({
100-
history: false,
101-
delay: 4000,
102-
closer: false,
103-
closer_hover: false
104-
});
108+
notificationServiceProvider.setDefaults({
109+
history: false,
110+
delay: 4000,
111+
closer: false,
112+
closer_hover: false
113+
});
105114

106-
}]);
115+
}])
116+
;
117+
```
118+
119+
You can also chain configuration calls:
120+
121+
```javascript
122+
angular.module('MyApp')
123+
.config(['notificationServiceProvider', function(notificationServiceProvider) {
124+
125+
notificationServiceProvider
126+
127+
.setDefaults({
128+
history: false,
129+
delay: 4000,
130+
closer: false,
131+
closer_hover: false
132+
})
133+
134+
// Configure a stack named 'bottom_right' that append a call 'stack-bottomright'
135+
.setStack('bottom_right', 'stack-bottomright', {
136+
dir1: 'up',
137+
dir2: 'left',
138+
firstpos1: 25,
139+
firstpos2: 25
140+
})
141+
142+
// Configure a stack named 'top_left' that append a call 'stack-topleft'
143+
.setStack('top_left', 'stack-topleft', {
144+
dir1: 'down',
145+
dir2: 'right',
146+
push: 'top'
147+
})
148+
149+
;
150+
151+
}])
152+
;
107153
```
108154

155+
109156
### PNotify Stacks
110157

111158
You can set the position and direction of notifications by using PNotify stacks. You can add stack information to the following methods:
@@ -119,16 +166,17 @@ You need to define the stacks in the config section before:
119166

120167
```javascript
121168
angular.module('MyApp')
122-
.config(['notificationServiceProvider', function(notificationServiceProvider) {
169+
.config(['notificationServiceProvider', function(notificationServiceProvider) {
123170

124-
// Configure a stack named 'top_left' that append a call 'stack-topleft'
125-
notificationServiceProvider.setStack('top_left', 'stack-topleft', {
126-
dir1: 'down',
127-
dir2: 'right',
128-
push: 'top'
129-
});
171+
// Configure a stack named 'top_left' that append a call 'stack-topleft'
172+
notificationServiceProvider.setStack('top_left', 'stack-topleft', {
173+
dir1: 'down',
174+
dir2: 'right',
175+
push: 'top'
176+
});
130177

131-
}]);
178+
}])
179+
;
132180
```
133181

134182
Later, in a controller:
@@ -147,23 +195,24 @@ notificationServiceProvider.setDefaultStack('top_left');
147195

148196
```javascript
149197
angular.module('MyApp')
150-
.controller('MyCtrl', ['$scope', 'notificationService', function($scope, notificationService) {
151-
152-
$scope.action = function() {
153-
// This is a sample using the success helper method
154-
notificationService.success('This is a success notification');
155-
};
156-
157-
$scope.anotherAction = function() {
158-
// This is a sample using the generic PNotify notification object
159-
notificationService.notify({
160-
title: 'Notice Title',
161-
text: 'Notice Text',
162-
hide: false
163-
});
164-
};
165-
166-
}]);
198+
.controller('MyCtrl', ['$scope', 'notificationService', function($scope, notificationService) {
199+
200+
$scope.action = function() {
201+
// This is a sample using the success helper method
202+
notificationService.success('This is a success notification');
203+
};
204+
205+
$scope.anotherAction = function() {
206+
// This is a sample using the generic PNotify notification object
207+
notificationService.notify({
208+
title: 'Notice Title',
209+
text: 'Notice Text',
210+
hide: false
211+
});
212+
};
213+
214+
}])
215+
;
167216
```
168217

169218
### Options

0 commit comments

Comments
 (0)