bootstrap-growl-rails 2.0.0 → 3.0.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 9425af1de196edc669ff1be804e12c388f8e50ba
4
- data.tar.gz: 67fc56ae3f366ba7434c6bb12f754c9140427095
3
+ metadata.gz: 565451508ee3cbedc0d0afc61a4d260606e46049
4
+ data.tar.gz: 1071e6b1fd40e9d421453705512be086cadd0a37
5
5
  SHA512:
6
- metadata.gz: f92bd43d78729117f00d3af794aa74107344e9d9c6d6fc981151cdcee80b7ef488163e16e1bd5f41625d1dba2173b0832f8465a7a0dfc4c9135195fb23a0e6e6
7
- data.tar.gz: 8af7454ee51f08ced115eb1276941e2e241fabfa03244374c08646e761da3c3cbb9e776aa622816aebd1e4ab972605afe78cac23933180732ff001a4b2f486af
6
+ metadata.gz: 70c0bd88a153a99c6ec591a570bb398c3f7cb00da4f699f9888f7166b5523d1ed733bb7ef9bcb475ddb67154a043f32187af8dabbc7cbd08f7e8e8bf6fcb7a3a
7
+ data.tar.gz: d9709a70754400a30c5e08e8a702a737c49ccec8f762557e39851984c848ec64aefcbfc7bf4a6562a7e20c082dab7470e80c5f58231810d0a627490c75da6a45
data/README.md CHANGED
@@ -2,11 +2,11 @@
2
2
 
3
3
  ## Information
4
4
 
5
- This gem is just an asset wrapper for bootstrap-growl JavaScript plugin by mouse0270 (https://github.com/mouse0270/bootstrap-growl). Please visit http://bootstrap-growl.remabledesigns.com/ for more details and social media praise.
5
+ This gem is just an asset wrapper for bootstrap-notifiy JavaScript plugin by mouse0270 (https://github.com/mouse0270/bootstrap-growl). Please visit http://bootstrap-growl.remabledesigns.com/ for more details and social media praise.
6
6
 
7
7
  ### Current Version
8
8
 
9
- 2.0.0
9
+ 3.0.0
10
10
 
11
11
  ## Documentation
12
12
 
@@ -34,7 +34,11 @@ Or install it yourself as:
34
34
 
35
35
  Add the following directive to your Javascript manifest file (application.js):
36
36
 
37
- //= require bootstrap-growl
37
+ //= require bootstrap-notify
38
+
39
+ Add the following directive to your Stylesheet manifest file (application.css):
40
+
41
+ *= require animate
38
42
 
39
43
  *Please see the documentation at http://bootstrap-growl.remabledesigns.com/#growl-documentation for plugin usage instructions.*
40
44
 
@@ -1,7 +1,7 @@
1
1
  module Bootstrap
2
2
  module Growl
3
3
  module Rails
4
- VERSION = "2.0.0"
4
+ VERSION = "3.0.0"
5
5
  end
6
6
  end
7
7
  end
@@ -0,0 +1,333 @@
1
+ /*
2
+ * Project: Bootstrap Notify = v3.0.0
3
+ * Description: Turns standard Bootstrap alerts into "Growl-like" notifications.
4
+ * Author: Mouse0270 aka Robert McIntosh
5
+ * License: MIT License
6
+ * Website: https://github.com/mouse0270/bootstrap-growl
7
+ */
8
+ (function (factory) {
9
+ if (typeof define === 'function' && define.amd) {
10
+ // AMD. Register as an anonymous module.
11
+ define(['jquery'], factory);
12
+ } else if (typeof exports === 'object') {
13
+ // Node/CommonJS
14
+ factory(require('jquery'));
15
+ } else {
16
+ // Browser globals
17
+ factory(jQuery);
18
+ }
19
+ }(function ($) {
20
+ // Create the defaults once
21
+ var defaults = {
22
+ element: 'body',
23
+ position: null,
24
+ type: "info",
25
+ allow_dismiss: true,
26
+ newest_on_top: false,
27
+ placement: {
28
+ from: "top",
29
+ align: "right"
30
+ },
31
+ offset: 20,
32
+ spacing: 10,
33
+ z_index: 1031,
34
+ delay: 5000,
35
+ timer: 1000,
36
+ url_target: '_blank',
37
+ mouse_over: null,
38
+ animate: {
39
+ enter: 'animated fadeInDown',
40
+ exit: 'animated fadeOutUp'
41
+ },
42
+ onShow: null,
43
+ onShown: null,
44
+ onClose: null,
45
+ onClosed: null,
46
+ icon_type: 'class',
47
+ template: '<div data-notify="container" class="col-xs-11 col-sm-4 alert alert-{0}" role="alert"><button type="button" aria-hidden="true" class="close" data-notify="dismiss">&times;</button><span data-notify="icon"></span> <span data-notify="title">{1}</span> <span data-notify="message">{2}</span><div class="progress" data-notify="progressbar"><div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div></div><a href="{3}" target="{4}" data-notify="url"></a></div>'
48
+ };
49
+
50
+ String.format = function() {
51
+ var str = arguments[0];
52
+ for (var i = 1; i < arguments.length; i++) {
53
+ str = str.replace(RegExp("\\{" + (i - 1) + "\\}", "gm"), arguments[i]);
54
+ }
55
+ return str;
56
+ };
57
+
58
+ function Notify ( element, content, options ) {
59
+ // Setup Content of Notify
60
+ var content = {
61
+ content: {
62
+ message: typeof content == 'object' ? content.message : content,
63
+ title: content.title ? content.title : '',
64
+ icon: content.icon ? content.icon : '',
65
+ url: content.url ? content.url : '#',
66
+ target: content.target ? content.target : '-'
67
+ }
68
+ };
69
+
70
+ options = $.extend(true, {}, content, options);
71
+ this.settings = $.extend(true, {}, defaults, options);
72
+ this._defaults = defaults;
73
+ if (this.settings.content.target == "-") {
74
+ this.settings.content.target = this.settings.url_target;
75
+ }
76
+ this.animations = {
77
+ start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart',
78
+ end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend'
79
+ }
80
+
81
+ if (typeof this.settings.offset == 'number') {
82
+ this.settings.offset = {
83
+ x: this.settings.offset,
84
+ y: this.settings.offset
85
+ };
86
+ }
87
+
88
+ this.init();
89
+ };
90
+
91
+ $.extend(Notify.prototype, {
92
+ init: function () {
93
+ var self = this;
94
+
95
+ this.buildNotify();
96
+ if (this.settings.content.icon) {
97
+ this.setIcon();
98
+ }
99
+ if (this.settings.content.url != "#") {
100
+ this.styleURL();
101
+ }
102
+ this.placement();
103
+ this.bind();
104
+
105
+ this.notify = {
106
+ $ele: this.$ele,
107
+ update: function(command, update) {
108
+ switch (command) {
109
+ case "type":
110
+ this.$ele.removeClass('alert-' + self.settings.type);
111
+ this.$ele.find('[data-notify="progressbar"] > .progress-bar').removeClass('progress-bar-' + self.settings.type);
112
+ self.settings.type = update;
113
+ this.$ele.addClass('alert-' + update).find('[data-notify="progressbar"] > .progress-bar').addClass('progress-bar-' + update);
114
+ break;
115
+ case "icon":
116
+ var $icon = this.$ele.find('[data-notify="icon"]');
117
+ if (self.settings.icon_type.toLowerCase() == 'class') {
118
+ $icon.removeClass(self.settings.content.icon).addClass(update);
119
+ }else{
120
+ if (!$icon.is('img')) {
121
+ $icon.find('img');
122
+ }
123
+ $icon.attr('src', update);
124
+ }
125
+ break;
126
+ case "url":
127
+ this.$ele.find('[data-notify="url"]').attr('href', update);
128
+ break;
129
+ case "target":
130
+ this.$ele.find('[data-notify="url"]').attr('target', update);
131
+ break;
132
+ default:
133
+ this.$ele.find('[data-notify="' + command +'"]').html(update);
134
+ };
135
+ var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y);
136
+ self.reposition(posX);
137
+ },
138
+ close: function() {
139
+ self.close();
140
+ }
141
+ };
142
+ },
143
+ buildNotify: function () {
144
+ var content = this.settings.content;
145
+ this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target));
146
+ this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align);
147
+ if (!this.settings.allow_dismiss) {
148
+ this.$ele.find('[data-notify="dismiss"]').css('display', 'none');
149
+ }
150
+ if (this.settings.delay <= 0) {
151
+ this.$ele.find('[data-notify="progressbar"]').remove();
152
+ }
153
+ },
154
+ setIcon: function() {
155
+ if (this.settings.icon_type.toLowerCase() == 'class') {
156
+ this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon);
157
+ }else{
158
+ if (this.$ele.find('[data-notify="icon"]').is('img')) {
159
+ this.$ele.find('[data-notify="icon"]').attr('src', this.settings.content.icon);
160
+ }else{
161
+ this.$ele.find('[data-notify="icon"]').append('<img src="'+this.settings.content.icon+'" alt="Notify Icon" />');
162
+ }
163
+ }
164
+ },
165
+ styleURL: function() {
166
+ this.$ele.find('[data-notify="url"]').css({
167
+ backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)',
168
+ height: '100%',
169
+ left: '0px',
170
+ position: 'absolute',
171
+ top: '0px',
172
+ width: '100%',
173
+ zIndex: this.settings.z_index + 1
174
+ });
175
+ this.$ele.find('[data-notify="dismiss"]').css({
176
+ position: 'absolute',
177
+ right: '10px',
178
+ top: '5px',
179
+ zIndex: this.settings.z_index + 2
180
+ });
181
+ },
182
+ placement: function() {
183
+ var self = this,
184
+ offsetAmt = this.settings.offset.y,
185
+ css = {
186
+ display: 'inline-block',
187
+ margin: '0px auto',
188
+ position: this.settings.position ? this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'),
189
+ transition: 'all .5s ease-in-out',
190
+ zIndex: this.settings.z_index
191
+ },
192
+ hasAnimation = false,
193
+ settings = this.settings;
194
+
195
+ $('[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])').each(function() {
196
+ return offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) + parseInt($(this).outerHeight()) + parseInt(settings.spacing));
197
+ });
198
+ if (this.settings.newest_on_top == true) {
199
+ offsetAmt = this.settings.offset.y;
200
+ }
201
+ css[this.settings.placement.from] = offsetAmt+'px';
202
+
203
+ switch (this.settings.placement.align) {
204
+ case "left":
205
+ case "right":
206
+ css[this.settings.placement.align] = this.settings.offset.x+'px';
207
+ break;
208
+ case "center":
209
+ css.left = 0;
210
+ css.right = 0;
211
+ break;
212
+ }
213
+ this.$ele.css(css).addClass(this.settings.animate.enter);
214
+
215
+ $(this.settings.element).append(this.$ele);
216
+
217
+ if (this.settings.newest_on_top == true) {
218
+ offsetAmt = (parseInt(offsetAmt)+parseInt(this.settings.spacing)) + this.$ele.outerHeight();
219
+ this.reposition(offsetAmt);
220
+ }
221
+
222
+ if ($.isFunction(self.settings.onShow)) {
223
+ self.settings.onShow.call(this.$ele);
224
+ }
225
+
226
+ this.$ele.one(this.animations.start, function(event) {
227
+ hasAnimation = true;
228
+ }).one(this.animations.end, function(event) {
229
+ if ($.isFunction(self.settings.onShown)) {
230
+ self.settings.onShown.call(this);
231
+ }
232
+ });
233
+
234
+ setTimeout(function() {
235
+ if (!hasAnimation) {
236
+ if ($.isFunction(self.settings.onShown)) {
237
+ self.settings.onShown.call(this);
238
+ }
239
+ }
240
+ }, 600);
241
+ },
242
+ bind: function() {
243
+ var self = this;
244
+
245
+ this.$ele.find('[data-notify="dismiss"]').on('click', function() {
246
+ self.close();
247
+ })
248
+
249
+ this.$ele.mouseover(function(e) {
250
+ $(this).data('data-hover', "true");
251
+ }).mouseout(function(e) {
252
+ $(this).data('data-hover', "false");
253
+ });
254
+ this.$ele.data('data-hover', "false");
255
+
256
+ if (this.settings.delay > 0) {
257
+ self.$ele.data('notify-delay', self.settings.delay);
258
+ var timer = setInterval(function() {
259
+ var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer;
260
+ if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over == "pause") || self.settings.mouse_over != "pause") {
261
+ var percent = ((self.settings.delay - delay) / self.settings.delay) * 100;
262
+ self.$ele.data('notify-delay', delay);
263
+ self.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', percent).css('width', percent + '%');
264
+ }
265
+ if (delay <= -(self.settings.timer)) {
266
+ clearInterval(timer);
267
+ self.close();
268
+ }
269
+ }, self.settings.timer);
270
+ }
271
+ },
272
+ close: function() {
273
+ var self = this,
274
+ $successors = null,
275
+ posX = parseInt(this.$ele.css(this.settings.placement.from)),
276
+ hasAnimation = false;
277
+
278
+ this.$ele.data('closing', 'true').addClass(this.settings.animate.exit);
279
+ self.reposition(posX);
280
+
281
+ if ($.isFunction(self.settings.onClose)) {
282
+ self.settings.onClose.call(this.$ele);
283
+ }
284
+
285
+ this.$ele.one(this.animations.start, function(event) {
286
+ hasAnimation = true;
287
+ }).one(this.animations.end, function(event) {
288
+ $(this).remove();
289
+ if ($.isFunction(self.settings.onClosed)) {
290
+ self.settings.onClosed.call(this);
291
+ }
292
+ });
293
+
294
+ setTimeout(function() {
295
+ if (!hasAnimation) {
296
+ self.$ele.remove();
297
+ if (self.settings.onClosed) {
298
+ self.settings.onClosed(self.$ele);
299
+ }
300
+ }
301
+ }, 600);
302
+ },
303
+ reposition: function(posX) {
304
+ var self = this,
305
+ notifies = '[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])',
306
+ $elements = this.$ele.nextAll(notifies);
307
+ if (this.settings.newest_on_top == true) {
308
+ $elements = this.$ele.prevAll(notifies);
309
+ }
310
+ $elements.each(function() {
311
+ $(this).css(self.settings.placement.from, posX);
312
+ posX = (parseInt(posX)+parseInt(self.settings.spacing)) + $(this).outerHeight();
313
+ });
314
+ }
315
+ });
316
+
317
+ $.notify = function ( content, options ) {
318
+ var plugin = new Notify( this, content, options );
319
+ return plugin.notify;
320
+ };
321
+ $.notifyDefaults = function( options ) {
322
+ defaults = $.extend(true, {}, defaults, options);
323
+ return defaults;
324
+ };
325
+ $.notifyClose = function( command ) {
326
+ if (typeof command === "undefined" || command == "all") {
327
+ $('[data-notify]').find('[data-notify="dismiss"]').trigger('click');
328
+ }else{
329
+ $('[data-notify-position="'+command+'"]').find('[data-notify="dismiss"]').trigger('click');
330
+ }
331
+ };
332
+
333
+ }));