https://www.briscadieu-bordeaux.com/assets/jquery_toast/jquery.toast-e6f482ca469096468b65a10857d19fa6.js

1// jQuery toast plugin created by Kamran Ahmed copyright MIT license 2015
2if ( typeof Object.create !== 'function' ) {
3    Object.create = function( obj ) {
4        function F() {}
5        F.prototype = obj;
6        return new F();
7    };
8}
9
10(function( $, window, document, undefined ) {
11
12    "use strict";
13    
14    var Toast = {
15
16        _positionClasses : ['bottom-left', 'bottom-right', 'top-right', 'top-left', 'bottom-center', 'top-center', 'mid-center'],
17        _defaultIcons : ['success', 'error', 'info', 'warning'],
18
19        init: function (options, elem) {
20            this.prepareOptions(options, $.toast.options);
21            this.process();
22        },
23
24        prepareOptions: function(options, options_to_extend) {
25            var _options = {};
26            if ( ( typeof options === 'string' ) || ( options instanceof Array ) ) {
27                _options.text = options;
28            } else {
29                _options = options;
30            }
31            this.options = $.extend( {}, options_to_extend, _options );
32        },
33
34        process: function () {
35            this.setup();
36            this.addToDom();
37            this.position();
38            this.bindToast();
39            this.animate();
40        },
41
42        setup: function () {
43            
44            var _toastContent = '';
45            
46            this._toastEl = this._toastEl || $('<div></div>', {
47                class : 'jq-toast-single'
48            });
49
50            // For the loader on top
51            _toastContent += '<span class="jq-toast-loader"></span>';            
52
53            if ( this.options.allowToastClose ) {
54                _toastContent += '<span class="close-jq-toast-single">&times;</span>';
55            };
56
57            if ( this.options.text instanceof Array ) {
58
59                if ( this.options.heading ) {
60                    _toastContent +='<h2 class="jq-toast-heading">' + this.options.heading + '</h2>';
61                };
62
63                _toastContent += '<ul class="jq-toast-ul">';
64                for (var i = 0; i < this.options.text.length; i++) {
65                    _toastContent += '<li class="jq-toast-li" id="jq-toast-item-' + i + '">' + this.options.text[i] + '</li>';
66                }
67                _toastContent += '</ul>';
68
69            } else {
70                if ( this.options.heading ) {
71                    _toastContent +='<h2 class="jq-toast-heading">' + this.options.heading + '</h2>';
72                };
73                _toastContent += this.options.text;
74            }
75
76            this._toastEl.html( _toastContent );
77
78            if ( this.options.bgColor !== false ) {
79                this._toastEl.css("background-color", this.options.bgColor);
80            };
81
82            if ( this.options.textColor !== false ) {
83                this._toastEl.css("color", this.options.textColor);
84            };
85
86            if ( this.options.textAlign ) {
87                this._toastEl.css('text-align', this.options.textAlign);
88            }
89
90            if ( this.options.icon !== false ) {
91                this._toastEl.addClass('jq-has-icon');
92
93                if ( $.inArray(this.options.icon, this._defaultIcons) !== -1 ) {
94                    this._toastEl.addClass('jq-icon-' + this.options.icon);
95                };
96            };
97
98            if ( this.options.class !== false ){
99                this._toastEl.addClass(this.options.class)
100            }
101        },
102
103        position: function () {
104            if ( ( typeof this.options.position === 'string' ) && ( $.inArray( this.options.position, this._positionClasses) !== -1 ) ) {
105
106                if ( this.options.position === 'bottom-center' ) {
107                    this._container.css({
108                        left: ( $(window).outerWidth() / 2 ) - this._container.outerWidth()/2,
109                        bottom: 20
110                    });
111                } else if ( this.options.position === 'top-center' ) {
112                    this._container.css({
113                        left: ( $(window).outerWidth() / 2 ) - this._container.outerWidth()/2,
114                        top: 20
115                    });
116                } else if ( this.options.position === 'mid-center' ) {
117                    this._container.css({
118                        left: ( $(window).outerWidth() / 2 ) - this._container.outerWidth()/2,
119                        top: ( $(window).outerHeight() / 2 ) - this._container.outerHeight()/2
120                    });
121                } else {
122                    this._container.addClass( this.options.position );
123                }
124
125            } else if ( typeof this.options.position === 'object' ) {
126                this._container.css({
127                    top : this.options.position.top ? this.options.position.top : 'auto',
128                    bottom : this.options.position.bottom ? this.options.position.bottom : 'auto',
129                    left : this.options.position.left ? this.options.position.left : 'auto',
130                    right : this.options.position.right ? this.options.position.right : 'auto'
131                });
132            } else {
133                this._container.addClass( 'bottom-left' );
134            }
135        },
136
137        bindToast: function () {
138
139            var that = this;
140
141            this._toastEl.on('afterShown', function () {
142                that.processLoader();
143            });
144
145            this._toastEl.find('.close-jq-toast-single').on('click', function ( e ) {
146
147                e.preventDefault();
148
149                if( that.options.showHideTransition === 'fade') {
150                    that._toastEl.trigger('beforeHide');
151                    that._toastEl.fadeOut(function () {
152                        that._toastEl.trigger('afterHidden');
153                    });
154                } else if ( that.options.showHideTransition === 'slide' ) {
155                    that._toastEl.trigger('beforeHide');
156                    that._toastEl.slideUp(function () {
157                        that._toastEl.trigger('afterHidden');
158                    });
159                } else {
160                    that._toastEl.trigger('beforeHide');
161                    that._toastEl.hide(function () {
162                        that._toastEl.trigger('afterHidden');
163                    });
164                }
165            });
166
167            if ( typeof this.options.beforeShow == 'function' ) {
168                this._toastEl.on('beforeShow', function () {
169                    that.options.beforeShow(that._toastEl);
170                });
171            };
172
173            if ( typeof this.options.afterShown == 'function' ) {
174                this._toastEl.on('afterShown', function () {
175                    that.options.afterShown(that._toastEl);
176                });
177            };
178
179            if ( typeof this.options.beforeHide == 'function' ) {
180                this._toastEl.on('beforeHide', function () {
181                    that.options.beforeHide(that._toastEl);
182                });
183            };
184
185            if ( typeof this.options.afterHidden == 'function' ) {
186                this._toastEl.on('afterHidden', function () {
187                    that.options.afterHidden(that._toastEl);
188                });
189            };
190
191            if ( typeof this.options.onClick == 'function' ) {
192                this._toastEl.on('click', function () {
193                    that.options.onClick(that._toastEl);
194                });
195            };    
196        },
197
198        addToDom: function () {
199
200             var _container = $('.jq-toast-wrap');
201             

202             if ( _container.length === 0 ) {
203                
204                _container = $('<div></div>',{
205                    class: "jq-toast-wrap",
206                    role: "alert",
207                    "aria-live": "polite"
208                });
209
210                $('body').append( _container );
211
212             } else if ( !this.options.stack || isNaN( parseInt(this.options.stack, 10) ) ) {
213                _container.empty();
214             }
215
216             _container.find('.jq-toast-single:hidden').remove();
217
218             _container.append( this._toastEl );
219
220            if ( this.options.stack && !isNaN( parseInt( this.options.stack ), 10 ) ) {
221                
222                var _prevToastCount = _container.find('.jq-toast-single').length,
223                    _extToastCount = _prevToastCount - this.options.stack;
224
225                if ( _extToastCount > 0 ) {
226                    $('.jq-toast-wrap').find('.jq-toast-single').slice(0, _extToastCount).remove();
227                };
228
229            }
230
231            this._container = _container;
232        },
233
234        canAutoHide: function () {
235            return ( this.options.hideAfter !== false ) && !isNaN( parseInt( this.options.hideAfter, 10 ) );
236        },
237
238        processLoader: function () {
239            // Show the loader only, if auto-hide is on and loader is demanded
240            if (!this.canAutoHide() || this.options.loader === false) {
241                return false;
242            }
243
244            var loader = this._toastEl.find('.jq-toast-loader');
245
246            // 400 is the default time that jquery uses for fade/slide
247            // Divide by 1000 for milliseconds to seconds conversion
248            var transitionTime = (this.options.hideAfter - 400) / 1000 + 's';
249            var loaderBg = this.options.loaderBg;
250
251            var style = loader.attr('style') || '';
252            style = style.substring(0, style.indexOf('-webkit-transition')); // Remove the last transition definition
253
254            style += '-webkit-transition: width ' + transitionTime + ' ease-in; \
255                      -o-transition: width ' + transitionTime + ' ease-in; \
256                      transition: width ' + transitionTime + ' ease-in; \
257                      background-color: ' + loaderBg + ';';
258
259
260            loader.attr('style', style).addClass('jq-toast-loaded');
261        },
262
263        animate: function () {
264
265            var that = this;
266
267            this._toastEl.hide();
268
269            this._toastEl.trigger('beforeShow');
270
271            if ( this.options.showHideTransition.toLowerCase() === 'fade' ) {
272                this._toastEl.fadeIn(function ( ){
273                    that._toastEl.trigger('afterShown');
274                });
275            } else if ( this.options.showHideTransition.toLowerCase() === 'slide' ) {
276                this._toastEl.slideDown(function ( ){
277                    that._toastEl.trigger('afterShown');
278                });
279            } else {
280                this._toastEl.show(function ( ){
281                    that._toastEl.trigger('afterShown');
282                });
283            }
284
285            if (this.canAutoHide()) {
286
287                var that = this;
288
289                window.setTimeout(function(){
290                    
291                    if ( that.options.showHideTransition.toLowerCase() === 'fade' ) {
292                        that._toastEl.trigger('beforeHide');
293                        that._toastEl.fadeOut(function () {
294                            that._toastEl.trigger('afterHidden');
295                        });
296                    } else if ( that.options.showHideTransition.toLowerCase() === 'slide' ) {
297                        that._toastEl.trigger('beforeHide');
298                        that._toastEl.slideUp(function () {
299                            that._toastEl.trigger('afterHidden');
300                        });
301                    } else {
302                        that._toastEl.trigger('beforeHide');
303                        that._toastEl.hide(function () {
304                            that._toastEl.trigger('afterHidden');
305                        });
306                    }
307
308                }, this.options.hideAfter);
309            };
310        },
311
312        reset: function ( resetWhat ) {
313
314            if ( resetWhat === 'all' ) {
315                $('.jq-toast-wrap').remove();
316            } else {
317                this._toastEl.remove();
318            }
319
320        },
321
322        update: function(options) {
323            this.prepareOptions(options, this.options);
324            this.setup();
325            this.bindToast();
326        },
327        
328        close: function() {
329            this._toastEl.find('.close-jq-toast-single').click();
330        }
331    };
332    
333    $.toast = function(options) {
334        var toast = Object.create(Toast);
335        toast.init(options, this);
336
337        return {
338            
339            reset: function ( what ) {
340                toast.reset( what );
341            },
342
343            update: function( options ) {
344                toast.update( options );
345            },
346            
347            close: function( ) {
348            	toast.close( );
349            }
350        }
351    };
352
353    $.toast.options = {
354        text: '',
355        heading: '',
356        showHideTransition: 'fade',
357        allowToastClose: true,
358        hideAfter: 3000,
359        loader: true,
360        loaderBg: '#9EC600',
361        stack: 5,
362        position: 'bottom-left',
363        bgColor: false,
364        textColor: false,
365        textAlign: 'left',
366        icon: false,
367        beforeShow: function () {},
368        afterShown: function () {},
369        beforeHide: function () {},
370        afterHidden: function () {},
371        onClick: function () {}
372    };
373
374})( jQuery, window, document );
375