4 angular.module('foundation.notification', ['foundation.core'])
5 .controller('ZfNotificationController', ZfNotificationController)
6 .directive('zfNotificationSet', zfNotificationSet)
7 .directive('zfNotification', zfNotification)
8 .directive('zfNotificationStatic', zfNotificationStatic)
9 .directive('zfNotify', zfNotify)
10 .factory('NotificationFactory', NotificationFactory)
11 .service('FoundationNotification', FoundationNotification)
14 FoundationNotification.$inject = ['FoundationApi', 'NotificationFactory'];
16 function FoundationNotification(foundationApi, NotificationFactory) {
19 service.activate = activate;
20 service.deactivate = deactivate;
24 //target should be element ID
25 function activate(target) {
26 foundationApi.publish(target, 'show');
29 //target should be element ID
30 function deactivate(target) {
31 foundationApi.publish(target, 'hide');
34 function toggle(target) {
35 foundationApi.publish(target, 'toggle');
38 function createNotificationSet(config) {
39 return new NotificationFactory(config);
44 ZfNotificationController.$inject = ['$scope', 'FoundationApi'];
46 function ZfNotificationController($scope, foundationApi) {
47 var controller = this;
48 controller.notifications = $scope.notifications = $scope.notifications || [];
50 controller.addNotification = function(info) {
51 var id = foundationApi.generateUuid();
53 $scope.notifications.push(info);
56 controller.removeNotification = function(id) {
57 $scope.notifications.forEach(function(notification) {
58 if(notification.id === id) {
59 var ind = $scope.notifications.indexOf(notification);
60 $scope.notifications.splice(ind, 1);
65 controller.clearAll = function() {
66 while($scope.notifications.length > 0) {
67 $scope.notifications.pop();
72 zfNotificationSet.$inject = ['FoundationApi'];
74 function zfNotificationSet(foundationApi) {
77 templateUrl: 'components/notification/notification-set.html',
78 controller: 'ZfNotificationController',
88 function link(scope, element, attrs, controller) {
89 scope.position = scope.position ? scope.position.split(' ').join('-') : 'top-right';
91 foundationApi.subscribe(attrs.id, function(msg) {
92 if(msg === 'clearall') {
93 controller.clearAll();
96 controller.addNotification(msg);
97 if (!scope.$root.$$phase) {
105 zfNotification.$inject = ['FoundationApi'];
107 function zfNotification(foundationApi) {
110 templateUrl: 'components/notification/notification.html',
113 require: '^zfNotificationSet',
114 controller: function() { },
135 function preLink(scope, iElement, iAttrs) {
136 iAttrs.$set('zf-closable', 'notification');
139 function postLink(scope, element, attrs, controller) {
140 scope.active = false;
141 var animationIn = attrs.animationIn || 'fadeIn';
142 var animationOut = attrs.animationOut || 'fadeOut';
145 //due to dynamic insertion of DOM, we need to wait for it to show up and get working!
146 setTimeout(function() {
148 foundationApi.animate(element, scope.active, animationIn, animationOut);
151 scope.hide = function() {
152 scope.active = false;
153 foundationApi.animate(element, scope.active, animationIn, animationOut);
154 setTimeout(function() {
155 controller.removeNotification(scope.notifId);
159 // close if autoclose
160 if (scope.autoclose) {
161 setTimeout(function() {
165 }, parseInt(scope.autoclose));
170 hammerElem = new Hammer(element[0]);
171 // set the options for swipe (to make them a bit more forgiving in detection)
172 hammerElem.get('swipe').set({
173 direction: Hammer.DIRECTION_ALL,
174 threshold: 5, // this is how far the swipe has to travel
175 velocity: 0.5 // and this is how fast the swipe must travel
179 hammerElem.on('swipe', function() {
188 zfNotificationStatic.$inject = ['FoundationApi'];
190 function zfNotificationStatic(foundationApi) {
193 templateUrl: 'components/notification/notification-static.html',
209 var type = 'notification';
216 function preLink(scope, iElement, iAttrs, controller) {
217 iAttrs.$set('zf-closable', type);
220 function postLink(scope, element, attrs, controller) {
221 scope.position = attrs.position ? attrs.position.split(' ').join('-') : 'top-right';
223 var animationIn = attrs.animationIn || 'fadeIn';
224 var animationOut = attrs.animationOut || 'fadeOut';
227 foundationApi.subscribe(attrs.id, function(msg) {
228 if(msg == 'show' || msg == 'open') {
230 // close if autoclose
231 if (scope.autoclose) {
232 setTimeout(function() {
236 }, parseInt(scope.autoclose));
238 } else if (msg == 'close' || msg == 'hide') {
240 } else if (msg == 'toggle') {
242 // close if autoclose
243 if (scope.autoclose) {
244 setTimeout(function() {
248 }, parseInt(scope.autoclose));
252 foundationApi.animate(element, scope.active, animationIn, animationOut);
258 scope.hide = function() {
259 scope.active = false;
260 foundationApi.animate(element, scope.active, animationIn, animationOut);
264 scope.show = function() {
266 foundationApi.animate(element, scope.active, animationIn, animationOut);
270 scope.toggle = function() {
271 scope.active = !scope.active;
272 foundationApi.animate(element, scope.active, animationIn, animationOut);
280 zfNotify.$inject = ['FoundationApi'];
282 function zfNotify(foundationApi) {
297 function link(scope, element, attrs, controller) {
298 element.on('click', function(e) {
299 foundationApi.publish(attrs.zfNotify, {
301 content: scope.content,
304 autoclose: scope.autoclose
311 NotificationFactory.$inject = ['$http', '$templateCache', '$rootScope', '$compile', '$timeout', 'FoundationApi'];
313 function NotificationFactory($http, $templateCache, $rootScope, $compile, $timeout, foundationApi) {
314 return notificationFactory;
316 function notificationFactory(config) {
317 var self = this, //for prototype functions
318 container = angular.element(config.container || document.body),
319 id = config.id || foundationApi.generateUuid(),
334 self.addNotification = addNotification;
335 self.clearAll = clearAll;
336 self.destroy = destroy;
339 addNotification: addNotification,
344 function checkStatus() {
346 throw "Error: Notification Set was destroyed. Delete the object and create a new NotificationFactory instance."
350 function addNotification(notification) {
352 $timeout(function() {
353 foundationApi.publish(id, notification);
357 function clearAll() {
359 $timeout(function() {
360 foundationApi.publish(id, 'clearall');
364 function init(state) {
365 if(!attached && html.length > 0) {
366 var modalEl = container.append(element);
368 scope.active = state;
369 $compile(element)(scope);
375 function assembleDirective() {
376 // check for duplicate element to prevent factory from cloning notification sets
377 if (document.getElementById(id)) {
380 html = '<zf-notification-set id="' + id + '"></zf-notification-set>';
382 element = angular.element(html);
384 scope = $rootScope.$new();
386 for(var i = 0; i < props.length; i++) {
387 if(config[props[i]]) {
388 element.attr(props[i], config[props[i]]);
392 // access view scope variables
393 if (config.contentScope) {
394 contentScope = config.contentScope;
395 for (var prop in contentScope) {
396 if (contentScope.hasOwnProperty(prop)) {
397 scope[prop] = contentScope[prop];
406 setTimeout(function() {
411 foundationApi.unsubscribe(id);