Skip to content

Instantly share code, notes, and snippets.

@csasbach
Last active February 16, 2016 17:25
Show Gist options
  • Save csasbach/8c6104cce016783832ce to your computer and use it in GitHub Desktop.
Save csasbach/8c6104cce016783832ce to your computer and use it in GitHub Desktop.
An Angular Service for Queueing Alerts
/**
* An angular service for managing alerts.
* Alerts reference the action from which they were generated
* via an actionID. Alerts can be closed individualy, in
* groups by action ID, or all of them can be cleared at once.
*
* Designed primarily to work with Bootrstrap UI alerts but
* could easily be used with other alert paradigms.
*/
app.factory("alertService", function () {
// stores arrays of alerts indexed by action ID
var alertGroups = {};
return {
// Get a reference to the alertGroups object
getAlerts: function () {
return alertGroups;
},
// generic method for adding an alert
addAlert: function (type, actionID, message) {
if (alertGroups[actionID] == undefined)
alertGroups[actionID] = [];
alertGroups[actionID].push({ type: type, message: message });
},
// adds an info alert
addInfo : function (actionID, message) {
this.addAlert('info',actionID,message);
},
// adds a success alert
addSuccess: function (actionID, message) {
this.addAlert('success', actionID, message);
},
// adds a warning alert
addWarning: function (actionID, message) {
this.addAlert('warning', actionID, message);
},
// adds an error alert
addError: function (actionID,message) {
this.addAlert('danger', actionID, message);
},
// closes an alert
closeAlert : function (actionID,index) {
alertGroups[actionID].splice(index, 1);
},
// clear all alerts for one action ID
clearActionAlerts: function (actionID) {
alertGroups[actionID] = [];
},
// clears absolutely all alerts
clearAllAlerts : function () {
alertGroups = {}
},
// generates an action ID
getGuid : function(){
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var v = new Uint8Array(1);
if (window.crypto == undefined) {
window.msCrypto.getRandomValues(v);
}
else {
window.crypto.getRandomValues(v);
}
v = v[0]/255;
var r = v*16|0, v = c == 'x' ? r : (r&0x3|0x8);
return v.toString(16);
});
}
}
});
app.controller('myController',['$scope','alertService',function($scope,alertService){
// add a reference to the alerts in the alerts service to this scope
$scope.alerts = alertService.getAlerts(),
// close an alert using the alerts service
$scope.closeAlert = alertService.closeAlert,
$scope.doSomething = function(){
var actionID = alertService.getGuid();
alertService.addInfo(actionID,"We're doing something!");
}
}]);
<!-- snippet /-->
<div id="alerts" ng-repeat="(actionID,alertGroup) in alerts">
<uib-alert ng-repeat="alert in alertGroup"
type="{{alert.type}}" close="closeAlert(actionID,$index)"
dismiss-on-timeout="{{alert.type == 'info'?99999:5000;}}">
{{alert.message}}
</uib-alert>
</div>
<!-- snippet /-->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment