angular-flash-alert - npm Package Compare versions

Comparing version 2.2.7 to 2.3.0

bower.json

 {
     "name": "angular-flash-alert",
-    "version": "2.2.7",
+    "version": "2.3.0",
     "homepage": "https://github.com/sachinchoolur/angular-flash",
     "authors": [
-        "Sachin N <[e-mail]>"
+        "Sachin N <[e-mail]>",
+        "Roope Hakulinen <[e-mail]>",
+        "Nicolas Coden <[e-mail]>"
     ],
@@ -8,0 +10,0 @@ "description": "Flash messages for AngularJS and Bootstrap",

dist/angular-flash.js

@@ -1,2 +0,2 @@
-/*! angular-flash - v2.2.7 - 2016-03-31
+/*! angular-flash - v2.3.0 - 2016-04-24
 * https://github.com/sachinchoolur/angular-flash
@@ -26,2 +26,13 @@ * Copyright (c) 2016 Sachin; Licensed MIT */
 
+app.directive('applytransclude', ['$compile', function ($compile) {
+    return {
+        restrict: 'A',
+        link: function link(scope, ele, attrs) {
+            scope._transclude(scope, function (clone, scope) {
+                ele.empty().append(clone);
+            });
+        }
+    };
+}]);
+
 app.directive('closeFlash', ['$compile', '$rootScope', 'Flash', function ($compile, $rootScope, Flash) {
@@ -47,5 +58,4 @@ return {
         },
-        template: '<div role="alert" ng-repeat="flash in $root.flashes track by $index" id="{{flash.config.id}}" class="alert {{flash.config.class}} alert-{{flash.type}} alert-dismissible alertIn alertOut"><div type="button" class="close" ng-show="flash.showClose" close-flash="{{flash.id}}"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></div> <span dynamic="flash.text"></span> </div>',
-        link: function link(scope, ele, attrs) {
-            Flash.setDefaultTimeout(scope.duration);
+        link: function link(scope, ele, attrs, ctrl, transclude) {
+            Flash.setTimeout(scope.duration);
             Flash.setShowClose(scope.showClose);
@@ -58,77 +68,117 @@ function onDismiss(flash) {
             Flash.setOnDismiss(onDismiss);
-        }
+
+            if (Flash.config.templateTransclude) {
+                scope._transclude = transclude;
+            }
+        },
+        transclude: Flash.config.templateTransclude,
+        template: '\n                <div ng-repeat="flash in $root.flashes track by $index">\n                    ' + Flash.config.template + '\n                </div>\n            '
     };
 }]);
 
-app.factory('Flash', ['$rootScope', '$timeout', function ($rootScope, $timeout) {
-    var dataFactory = {};
-    var counter = 0;
-    dataFactory.setDefaultTimeout = function (timeout) {
+app.provider('Flash', function () {
+    var defaultConfig = {};
+    var templatePresets = {
+        bootstrap: {
+            html: '\n                <div role="alert" id="{{flash.config.id}}"\n                    class="alert {{flash.config.class}} alert-{{flash.type}} alert-dismissible alertIn alertOut">\n                    <div type="button" class="close" ng-show="flash.showClose" close-flash="{{flash.id}}">\n                        <span aria-hidden="true">&times;</span>\n                        <span class="sr-only">Close</span>\n                    </div>\n                    <span dynamic="flash.text"></span>\n                </div>',
+            transclude: false
+        },
+        transclude: {
+            html: '<div applytransclude></div>',
+            transclude: true
+        }
+    };
+
+    this.setTimeout = function (timeout) {
         if (typeof timeout !== 'number') return;
-        dataFactory.defaultTimeout = timeout;
+        defaultConfig.timeout = timeout;
     };
-
-    dataFactory.defaultShowClose = true;
-    dataFactory.setShowClose = function (value) {
+    this.setShowClose = function (value) {
         if (typeof value !== 'boolean') return;
-        dataFactory.defaultShowClose = value;
+        defaultConfig.showClose = value;
     };
-    dataFactory.setOnDismiss = function (callback) {
-        if (typeof callback !== 'function') return;
-        dataFactory.onDismiss = callback;
+    this.setTemplate = function (template) {
+        if (typeof template !== 'string') return;
+        defaultConfig.template = template;
     };
-    dataFactory.create = function (type, text, timeout, config, showClose) {
-        var $this = void 0,
-            flash = void 0;
-        $this = this;
-        flash = {
-            type: type,
-            text: text,
-            config: config,
-            id: counter++
-        };
-        flash.showClose = typeof showClose !== 'undefined' ? showClose : dataFactory.defaultShowClose;
-        if (dataFactory.defaultTimeout && typeof timeout === 'undefined') {
-            flash.timeout = dataFactory.defaultTimeout;
-        } else if (timeout) {
-            flash.timeout = timeout;
-        }
-        $rootScope.flashes.push(flash);
-        if (flash.timeout) {
-            flash.timeoutObj = $timeout(function () {
-                $this.dismiss(flash.id);
-            }, flash.timeout);
-        }
-        return flash.id;
+    this.setTemplatePreset = function (preset) {
+        if (typeof preset !== 'string' || !(preset in templatePresets)) return;
+
+        var template = templatePresets[preset];
+        this.setTemplate(template.html);
+        defaultConfig.templateTransclude = template.transclude;
     };
-    dataFactory.pause = function (index) {
-        if ($rootScope.flashes[index].timeoutObj) {
-            $timeout.cancel($rootScope.flashes[index].timeoutObj);
-        }
+    this.setOnDismiss = function (callback) {
+        if (typeof callback !== 'function') return;
+        defaultConfig.onDismiss = callback;
     };
-    dataFactory.dismiss = function (id) {
-        var index = findIndexById(id);
-        if (index !== -1) {
-            var flash = $rootScope.flashes[index];
-            dataFactory.pause(index);
-            $rootScope.flashes.splice(index, 1);
-            if (typeof dataFactory.onDismiss === 'function') {
-                dataFactory.onDismiss(flash);
+
+    this.setTimeout(5000);
+    this.setShowClose(true);
+    this.setTemplatePreset('bootstrap');
+
+    this.$get = ['$rootScope', '$timeout', function ($rootScope, $timeout) {
+        var dataFactory = {};
+        var counter = 0;
+
+        dataFactory.setTimeout = this.setTimeout;
+        dataFactory.setShowClose = this.setShowClose;
+        dataFactory.setOnDismiss = this.setOnDismiss;
+        dataFactory.config = defaultConfig;
+
+        dataFactory.create = function (type, text, timeout, config, showClose) {
+            var $this = void 0,
+                flash = void 0;
+            $this = this;
+            flash = {
+                type: type,
+                text: text,
+                config: config,
+                id: counter++
+            };
+            flash.showClose = typeof showClose !== 'undefined' ? showClose : defaultConfig.showClose;
+            if (defaultConfig.timeout && typeof timeout === 'undefined') {
+                flash.timeout = defaultConfig.timeout;
+            } else if (timeout) {
+                flash.timeout = timeout;
             }
+            $rootScope.flashes.push(flash);
+            if (flash.timeout) {
+                flash.timeoutObj = $timeout(function () {
+                    $this.dismiss(flash.id);
+                }, flash.timeout);
+            }
+            return flash.id;
+        };
+        dataFactory.pause = function (index) {
+            if ($rootScope.flashes[index].timeoutObj) {
+                $timeout.cancel($rootScope.flashes[index].timeoutObj);
+            }
+        };
+        dataFactory.dismiss = function (id) {
+            var index = findIndexById(id);
+            if (index !== -1) {
+                var flash = $rootScope.flashes[index];
+                dataFactory.pause(index);
+                $rootScope.flashes.splice(index, 1);
+                if (typeof defaultConfig.onDismiss === 'function') {
+                    defaultConfig.onDismiss(flash);
+                }
+            }
+        };
+        dataFactory.clear = function () {
+            while ($rootScope.flashes.length > 0) {
+                dataFactory.dismiss($rootScope.flashes[0].id);
+            }
+        };
+        dataFactory.reset = dataFactory.clear;
+        function findIndexById(id) {
+            return $rootScope.flashes.map(function (flash) {
+                return flash.id;
+            }).indexOf(id);
         }
-    };
-    dataFactory.clear = function () {
-        while ($rootScope.flashes.length > 0) {
-            dataFactory.dismiss($rootScope.flashes[0].id);
-        }
-    };
-    dataFactory.reset = dataFactory.clear;
-    function findIndexById(id) {
-        return $rootScope.flashes.map(function (flash) {
-            return flash.id;
-        }).indexOf(id);
-    }
 
-    return dataFactory;
-}]);
+        return dataFactory;
+    }];
+});
 //# sourceMappingURL=angular-flash.js.map

dist/angular-flash.min.js

@@ -1,8 +0,6 @@
-/*! angular-flash - v2.2.7 - 2016-03-31
+/*! angular-flash - v2.3.0 - 2016-04-24
 * https://github.com/sachinchoolur/angular-flash
 * Copyright (c) 2016 Sachin; Licensed MIT */
 
-/*! angular-flash - v2.2.7 - 2016-03-31
-* https://github.com/sachinchoolur/angular-flash
-* Copyright (c) 2016 Sachin; Licensed MIT */
-"use strict";var app=angular.module("ngFlash",[]);app.run(["$rootScope",function(a){return a.flashes=[]}]),app.directive("dynamic",["$compile",function(a){return{restrict:"A",replace:!0,link:function(b,c,d){return b.$watch(d.dynamic,function(d){return c.html(d),a(c.contents())(b)})}}}]),app.directive("closeFlash",["$compile","$rootScope","Flash",function(a,b,c){return{link:function(a,d,e){return d.on("click",function(){var a=parseInt(e.closeFlash,10);c.dismiss(a),b.$apply()})}}}]),app.directive("flashMessage",["Flash",function(a){return{restrict:"E",scope:{duration:"=",showClose:"=",onDismiss:"&"},template:'<div role="alert" ng-repeat="flash in $root.flashes track by $index" id="{{flash.config.id}}" class="alert {{flash.config.class}} alert-{{flash.type}} alert-dismissible alertIn alertOut"><div type="button" class="close" ng-show="flash.showClose" close-flash="{{flash.id}}"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></div> <span dynamic="flash.text"></span> </div>',link:function(b,c,d){function e(a){"function"==typeof b.onDismiss&&b.onDismiss({flash:a})}a.setDefaultTimeout(b.duration),a.setShowClose(b.showClose),a.setOnDismiss(e)}}}]),app.factory("Flash",["$rootScope","$timeout",function(a,b){function c(b){return a.flashes.map(function(a){return a.id}).indexOf(b)}var d={},e=0;return d.setDefaultTimeout=function(a){"number"==typeof a&&(d.defaultTimeout=a)},d.defaultShowClose=!0,d.setShowClose=function(a){"boolean"==typeof a&&(d.defaultShowClose=a)},d.setOnDismiss=function(a){"function"==typeof a&&(d.onDismiss=a)},d.create=function(c,f,g,h,i){var j=void 0,k=void 0;return j=this,k={type:c,text:f,config:h,id:e++},k.showClose="undefined"!=typeof i?i:d.defaultShowClose,d.defaultTimeout&&"undefined"==typeof g?k.timeout=d.defaultTimeout:g&&(k.timeout=g),a.flashes.push(k),k.timeout&&(k.timeoutObj=b(function(){j.dismiss(k.id)},k.timeout)),k.id},d.pause=function(c){a.flashes[c].timeoutObj&&b.cancel(a.flashes[c].timeoutObj)},d.dismiss=function(b){var e=c(b);if(-1!==e){var f=a.flashes[e];d.pause(e),a.flashes.splice(e,1),"function"==typeof d.onDismiss&&d.onDismiss(f)}},d.clear=function(){for(;a.flashes.length>0;)d.dismiss(a.flashes[0].id)},d.reset=d.clear,d}]);
+"use strict";var app=angular.module("ngFlash",[]);app.run(["$rootScope",function(a){return a.flashes=[]}]),app.directive("dynamic",["$compile",function(a){return{restrict:"A",replace:!0,link:function(b,c,d){return b.$watch(d.dynamic,function(d){return c.html(d),a(c.contents())(b)})}}}]),app.directive("applytransclude",["$compile",function(a){return{restrict:"A",link:function(a,b,c){a._transclude(a,function(a,c){b.empty().append(a)})}}}]),app.directive("closeFlash",["$compile","$rootScope","Flash",function(a,b,c){return{link:function(a,d,e){return d.on("click",function(){var a=parseInt(e.closeFlash,10);c.dismiss(a),b.$apply()})}}}]),app.directive("flashMessage",["Flash",function(a){return{restrict:"E",scope:{duration:"=",showClose:"=",onDismiss:"&"},link:function(b,c,d,e,f){function g(a){"function"==typeof b.onDismiss&&b.onDismiss({flash:a})}a.setTimeout(b.duration),a.setShowClose(b.showClose),a.setOnDismiss(g),a.config.templateTransclude&&(b._transclude=f)},transclude:a.config.templateTransclude,template:'\n                <div ng-repeat="flash in $root.flashes track by $index">\n                    '+a.config.template+"\n                </div>\n            "}}]),app.provider("Flash",function(){var a={},b={bootstrap:{html:'\n                <div role="alert" id="{{flash.config.id}}"\n                    class="alert {{flash.config.class}} alert-{{flash.type}} alert-dismissible alertIn alertOut">\n                    <div type="button" class="close" ng-show="flash.showClose" close-flash="{{flash.id}}">\n                        <span aria-hidden="true">&times;</span>\n                        <span class="sr-only">Close</span>\n                    </div>\n                    <span dynamic="flash.text"></span>\n                </div>',transclude:!1},transclude:{html:"<div applytransclude></div>",transclude:!0}};this.setTimeout=function(b){"number"==typeof b&&(a.timeout=b)},this.setShowClose=function(b){"boolean"==typeof b&&(a.showClose=b)},this.setTemplate=function(b){"string"==typeof b&&(a.template=b)},this.setTemplatePreset=function(c){if("string"==typeof c&&c in b){var d=b[c];this.setTemplate(d.html),a.templateTransclude=d.transclude}},this.setOnDismiss=function(b){"function"==typeof b&&(a.onDismiss=b)},this.setTimeout(5e3),this.setShowClose(!0),this.setTemplatePreset("bootstrap"),this.$get=["$rootScope","$timeout",function(b,c){function d(a){return b.flashes.map(function(a){return a.id}).indexOf(a)}var e={},f=0;return e.setTimeout=this.setTimeout,e.setShowClose=this.setShowClose,e.setOnDismiss=this.setOnDismiss,e.config=a,e.create=function(d,e,g,h,i){var j=void 0,k=void 0;return j=this,k={type:d,text:e,config:h,id:f++},k.showClose="undefined"!=typeof i?i:a.showClose,a.timeout&&"undefined"==typeof g?k.timeout=a.timeout:g&&(k.timeout=g),b.flashes.push(k),k.timeout&&(k.timeoutObj=c(function(){j.dismiss(k.id)},k.timeout)),k.id},e.pause=function(a){b.flashes[a].timeoutObj&&c.cancel(b.flashes[a].timeoutObj)},e.dismiss=function(c){var f=d(c);if(-1!==f){var g=b.flashes[f];e.pause(f),b.flashes.splice(f,1),"function"==typeof a.onDismiss&&a.onDismiss(g)}},e.clear=function(){for(;b.flashes.length>0;)e.dismiss(b.flashes[0].id)},e.reset=e.clear,e}]});
+//# sourceMappingURL=angular-flash.min.js.map

Gruntfile.js

@@ -45,3 +45,3 @@ module.exports = function (grunt) {
             options: {
-                banner: '<%= banner %>'
+                sourceMap: true
             },
@@ -48,0 +48,0 @@ dist: {

package.json

 {
   "name": "angular-flash-alert",
-  "version": "2.2.7",
+  "version": "2.3.0",
   "description": "Flash message for AngularJS and Bootstrap",
@@ -28,2 +28,7 @@ "keywords": [
       "url": "https://github.com/RoopeHakulinen"
+    },
+    {
+      "name": "Nicolas Coden",
+      "email": "[e-mail]",
+      "url": "https://github.com/ncoden"
     }
@@ -30,0 +35,0 @@ ],

README.md

@@ -9,4 +9,3 @@ ![license](https://img.shields.io/npm/l/angular-flash-alert.svg)
 
-Demo
-----------------
+## Demo
 [angular-flash](http://sachinchoolur.github.io/angular-flash/) | [jsfiddle](http://jsfiddle.net/roopehakulinen/uxeg4nze/) | [codepen](http://codepen.io/RoopeHakulinen/pen/QyZjxm)
@@ -16,4 +15,3 @@
 
-How to use 
----
+## Install
 
@@ -50,3 +48,15 @@ #### npm
 ```html
-<flash-message duration="5000" show-close="true" on-dismiss="myCallback(flash);"></flash-message> 
+<flash-message></flash-message> 
+```
+
+## Configure
+You can configure angular-flash by two ways:
+
+Add attributes on the `<flash-message>` directive.
+```html
+<flash-message
+    duration="5000"
+    show-close="true"
+    on-dismiss="myCallback(flash);"
+></flash-message> 
 <!-- 
@@ -58,2 +68,38 @@ 5000ms as the default duration to show flash message.
 ```
+
+Set configuration with `flashProvider`.
+```javascript
+app.config((FlashProvider) => {
+    FlashProvider.setTimeout(5000);
+    FlashProvider.setShowClose(true);
+    FlashProvider.setOnDismiss(myCallback);
+});
+```
+
+#### Use a custom template
+
+By default, angular-flash use the Bootstrap flash standard template, but you can set your own template.
+
+**By giving it in the Js**: use `.setTemplate(...)` with the template in parameter.
+```javascript
+app.config((FlashProvider) => {
+    FlashProvider.setTemplate(`
+        <div class="my-flash">{{ flash.text }}</div>
+    `);
+});
+```
+
+**By giving it in the HTML**: use `.setTemplatePreset('transclude')` with the template transcluded in the `<flash-message>` directive.
+```javascript
+app.config((FlashProvider) => {
+    FlashProvider.setTemplatePreset('transclude');
+});
+```
+```html
+<flash-message>
+    <div class="my-flash">{{ flash.text }}</div>
+</flash-message>
+```
+
+## How to use
 Inject the `Flash` factory in your controller
@@ -118,4 +164,5 @@ ```javascript
 * [Roope Hakulinen](https://github.com/RoopeHakulinen) (Version 2)
+* [Nicolas Coden](https://github.com/ncoden)
 
 #### License
 MIT © [Sachin Choluur](https://twitter.com/sachinchoolur)

src/angular-flash.js

@@ -24,2 +24,15 @@ const app = angular.module('ngFlash', []);
 
+app.directive('applytransclude', [
+    '$compile', function($compile) {
+        return {
+            restrict: 'A',
+            link: function(scope, ele, attrs) {
+                scope._transclude(scope, function(clone, scope) {
+                    ele.empty().append(clone);
+                });
+            }
+        };
+    }
+]);
+
 app.directive('closeFlash', [
@@ -48,5 +61,4 @@ '$compile', '$rootScope', 'Flash', function($compile, $rootScope, Flash) {
             },
-            template: '<div role="alert" ng-repeat="flash in $root.flashes track by $index" id="{{flash.config.id}}" class="alert {{flash.config.class}} alert-{{flash.type}} alert-dismissible alertIn alertOut"><div type="button" class="close" ng-show="flash.showClose" close-flash="{{flash.id}}"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></div> <span dynamic="flash.text"></span> </div>',
-            link: function(scope, ele, attrs) {
-                Flash.setDefaultTimeout(scope.duration);
+            link: function(scope, ele, attrs, ctrl, transclude) {
+                Flash.setTimeout(scope.duration);
                 Flash.setShowClose(scope.showClose);
@@ -59,3 +71,13 @@ function onDismiss(flash) {
                 Flash.setOnDismiss(onDismiss);
-            }
+
+                if (Flash.config.templateTransclude) {
+                    scope._transclude = transclude;
+                }
+            },
+            transclude: Flash.config.templateTransclude,
+            template: `
+                <div ng-repeat="flash in $root.flashes track by $index">
+                    ` + Flash.config.template + `
+                </div>
+            `
         };
@@ -65,20 +87,61 @@ }
 
-app.factory('Flash', [
-    '$rootScope', '$timeout', function($rootScope, $timeout) {
+app.provider('Flash', function() {
+    let defaultConfig = {};
+    let templatePresets = {
+        bootstrap: {
+            html: `
+                <div role="alert" id="{{flash.config.id}}"
+                    class="alert {{flash.config.class}} alert-{{flash.type}} alert-dismissible alertIn alertOut">
+                    <div type="button" class="close" ng-show="flash.showClose" close-flash="{{flash.id}}">
+                        <span aria-hidden="true">&times;</span>
+                        <span class="sr-only">Close</span>
+                    </div>
+                    <span dynamic="flash.text"></span>
+                </div>`,
+            transclude: false
+        },
+        transclude: {
+            html: `<div applytransclude></div>`,
+            transclude: true
+        }
+    };
+
+    this.setTimeout = function(timeout) {
+        if (typeof timeout !== 'number') return;
+        defaultConfig.timeout = timeout;
+    };
+    this.setShowClose = function(value) {
+        if (typeof value !== 'boolean') return;
+        defaultConfig.showClose = value;
+    };
+    this.setTemplate = function(template) {
+        if (typeof template !== 'string') return;
+        defaultConfig.template = template;
+    };
+    this.setTemplatePreset = function(preset) {
+        if (typeof preset !== 'string'
+            || !(preset in templatePresets)) return;
+
+        let template = templatePresets[preset];
+        this.setTemplate(template.html);
+        defaultConfig.templateTransclude = template.transclude;
+    };
+    this.setOnDismiss = function(callback) {
+        if (typeof callback !== 'function') return;
+        defaultConfig.onDismiss = callback;
+    };
+
+    this.setTimeout(5000);
+    this.setShowClose(true);
+    this.setTemplatePreset('bootstrap');
+
+    this.$get = ['$rootScope', '$timeout', function($rootScope, $timeout) {
         const dataFactory = {};
         let counter = 0;
-        dataFactory.setDefaultTimeout = function(timeout) {
-            if (typeof timeout !== 'number') return;
-            dataFactory.defaultTimeout = timeout;
-        };
 
-        dataFactory.defaultShowClose = true;
-        dataFactory.setShowClose = function(value) {
-            if (typeof value !== 'boolean') return;
-            dataFactory.defaultShowClose = value;
-        };
-        dataFactory.setOnDismiss = function(callback) {
-            if (typeof callback !== 'function') return;
-            dataFactory.onDismiss = callback;
-        };
+        dataFactory.setTimeout = this.setTimeout;
+        dataFactory.setShowClose = this.setShowClose;
+        dataFactory.setOnDismiss = this.setOnDismiss;
+        dataFactory.config = defaultConfig;
+
         dataFactory.create = function(type, text, timeout, config, showClose) {
@@ -95,5 +158,5 @@ let $this, flash;
                 typeof showClose !== 'undefined' ?
-                    showClose : dataFactory.defaultShowClose;
-            if (dataFactory.defaultTimeout && typeof timeout === 'undefined') {
-                flash.timeout = dataFactory.defaultTimeout;
+                    showClose : defaultConfig.showClose;
+            if (defaultConfig.timeout && typeof timeout === 'undefined') {
+                flash.timeout = defaultConfig.timeout;
             }
@@ -122,4 +185,4 @@ else if (timeout) {
                 $rootScope.flashes.splice(index, 1);
-                if (typeof dataFactory.onDismiss === 'function') {
-                    dataFactory.onDismiss(flash);
+                if (typeof defaultConfig.onDismiss === 'function') {
+                    defaultConfig.onDismiss(flash);
                 }
@@ -139,3 +202,3 @@ }
         return dataFactory;
-    }
-]);
+    }];
+});

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

157770

increased by9.46%

Number of package files

38

increased by2.7%

Lines of code

1586

increased by6.51%

Number of lines in readme file

164

increased by40.17%

No dependency changes