--- a/frontend/js/c2net/directives.js
+++ b/frontend/js/c2net/directives.js
@@ -1,10 +1,40 @@
 'use strict';
 
 angular.module('tut.c2net')
-  .directive('applicationMenuHelloWorld', function(applicationMenuTemplateBuilder) {
+  .directive('applicationTest', function(applicationMenuTemplateBuilder) {
     return {
       retrict: 'E',
       replace: true,
-      template: applicationMenuTemplateBuilder('/#/c2net', 'mdi-thumb-up', 'C2NET')
+      template: applicationMenuTemplateBuilder('/#/notifications', 'mdi-bell', 'Notifications')
     };
-  });
+  })
+
+  .directive('tutExternalUserNotification', function() {
+    return {
+      restrict: 'E',
+      replace: true,
+      scope: {
+        notification: '='
+      },
+      templateUrl: '/c2net/views/notification.html',
+      controller: function($scope, userNotificationAPI){
+
+        $scope.openUrl = function(url,id){
+          window.open(url,'_self');
+          setAsRead(id);
+        }
+
+        var setAsRead = function(id) {
+            userNotificationAPI
+              .setRead(id, true)
+              .then(function() {
+                console.log('Successfully setting ' + id + ' as read');
+                $scope.notification.read = true;
+              }, function(err) {
+                console.log('Error setting ' + id + ' as read: ' + err);
+              })
+              .finally(function() {});
+        };
+      }
+    };
+  });