Index: branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Hubs/CalendarHubber.js
===================================================================
--- branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Hubs/CalendarHubber.js	(revision 13782)
+++ branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Hubs/CalendarHubber.js	(revision 13795)
@@ -14,4 +14,5 @@
                vm.alertMessage = "No alerts";
                vm.currentcal = [];
+               $scope.permission = false;
                vm.selectedEventId = -1;
                vm.groups = [];
@@ -27,8 +28,10 @@
                        hubber.server.requestInfo();
                    });
-                   hubber.client.processData = function (data) {
+                   hubber.client.processData = function (data, users, groups) {
                        vm.data = JSON.parse(data);
+                       vm.permUsers = JSON.parse(users);
+                       vm.permGroups = JSON.parse(groups);
                        $scope.buildTree();
-
+                      
                        $scope.$apply();
                    };
@@ -48,4 +51,12 @@
                        $scope.$apply();
                    }
+                   hubber.client.processPermissions = function (id, perm) {
+                       var json = JSON.parse(perm);
+                      
+                       $scope.treeview.currentNode.permissions = json;
+                       refreshPermissions();
+                       $scope.permissionLoader = false;
+                       $scope.$apply();
+                   }
                    hubber.client.processDowntime = function (id, down) {
                        var json = JSON.parse(down);
@@ -91,13 +102,15 @@
                        $(".selected.ng-binding").addClass('loaded');
                        $scope.selectedEventId = -1;
+                       
                        if ($scope.treeview.currentNode != null && $scope.treeview.currentNode.Id != undefined) {
                            if ($scope.treeview.currentNode.calendar.length === 0) {
+                               hubber.server.requestPermissions(vm.treeview.currentNode.Id);
                                hubber.server.requestDownTime(vm.treeview.currentNode.Id);
-
+                               vm.permissionLoader = true;
                            }
                            else {
                                $timeout(function () {
+                                   refreshPermissions();
                                    $scope.currentcal = $scope.treeview.currentNode.calendar;
-
                                }, 0);
 
@@ -106,4 +119,20 @@
 
                    });
+               }
+               function refreshPermissions() {
+                   for (var i = 0; i < $scope.permUsers.length; i++){
+                       $scope.permUsers[i].state = false;
+                       for (var j = 0; j < $scope.treeview.currentNode.permissions.length; j++) {
+                           if($scope.permUsers[i].Id === $scope.treeview.currentNode.permissions[j].GrantedUserId)
+                               $scope.permUsers[i].state = true;
+                       }
+                   }
+                   for (var i = 0; i < $scope.permGroups.length; i++) {
+                       $scope.permGroups[i].state = false;
+                       for (var j = 0; j < $scope.treeview.currentNode.permissions.length; j++) {
+                           if ($scope.permGroups[i].Id === $scope.treeview.currentNode.permissions[j].GrantedUserId)
+                               $scope.permGroups[i].state = true;
+                       }
+                   }
                }
                $scope.clearTreeSelect = function () {
@@ -179,10 +208,22 @@
                    return current;
                }
-
                $scope.toggleDisposable = function () {
                    $scope.calendarDispose = true;
                    hubber.server.toggleDisposable(vm.treeview.currentNode.Id);
                }
-
+               $scope.pushPermissions = function () {
+                   var perms = [];
+                   $scope.permissionLoader = true;
+                   var node = $scope.treeview.currentNode;
+                   for (var i = 0; i < $scope.permGroups.length; i++) {
+                       if ($scope.permGroups[i].state === true)
+                           perms.push($scope.permGroups[i].Id);
+                   }
+                   for (var i = 0; i < $scope.permUsers.length; i++) {
+                       if ($scope.permUsers[i].state === true)
+                           perms.push($scope.permUsers[i].Id);
+                   }
+                   hubber.server.changePermissions(perms, node.Id);
+               }
                function collectInfoToSave(node, refresh, last) {
                    var arr = node.calendar.down[0];
@@ -273,4 +314,5 @@
                    $scope.currentcal = [];
                    hubber.server.requestDownTime(vm.treeview.currentNode.Id);
+                   $(".selected.ng-scope").removeClass('changed');
                    $(".selected.ng-binding").removeClass('changed');
 
@@ -293,5 +335,7 @@
                function clearAllCalendarsFunc() {
                    $(".ng-binding.changed").removeClass('changed');
+                   $(".ng-scope.changed").removeClass('changed');
                    $(".ng-binding.loaded").removeClass('loaded');
+                   $(".ng-scope.loaded").removeClass('loaded');
                    $scope.selectedEventId = -1;
                    $scope.treeview.currentNode.calendar = null;
@@ -301,4 +345,5 @@
                    hubber.server.requestDownTime(vm.treeview.currentNode.Id);
                    $(".selected.ng-binding").addClass('loaded');
+                   $(".selected.ng-scope").addClass('loaded');
                }
                function clearCalendarsRecurse(node) {
@@ -361,5 +406,5 @@
                    }
                    vm.treeview.currentNode.changes = true;
-                   $(".selected.ng-binding").addClass('changed');
+                   $(".selected").addClass('changed');
                }
                //*Add event by click
Index: branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Styling/StyleSheet.css
===================================================================
--- branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Styling/StyleSheet.css	(revision 13782)
+++ branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Styling/StyleSheet.css	(revision 13795)
@@ -138,80 +138,23 @@
 }
 
-div[data-angular-treeview] {
-    /* prevent user selection */
-    -moz-user-select: -moz-none;
-    -khtml-user-select: none;
-    -webkit-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    /* default */
-    font-family: Tahoma;
-    font-size: 13px;
-    color: #555;
-    text-decoration: none;
+
+[animate-on-change] {
+    transition: all 1s;
+    -webkit-transition: all 1s;
 }
 
-div[data-tree-model] ul {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-    border: none;
-    overflow: hidden;
-}
-
-div[data-tree-model] li {
-    position: relative;
-    padding: 0 0 0 20px;
-    line-height: 20px;
-}
-
-    div[data-tree-model] li .expanded {
-        padding: 1px 10px;
-        background-image: url('../../wwwroot/img/computer_network-256.png');
-        background-repeat: no-repeat;
+    [animate-on-change].changed {
+        background-color: lightblue;
+        transition: none;
+        -webkit-transition: none;
     }
 
-    div[data-tree-model] li .collapsed {
-        padding: 1px 10px;
-        background-image: url('../../wwwroot/img/computer_network-256.png');
-        background-repeat: no-repeat;
+    [animate-on-change].changedshut {
+        background-color: lightsalmon;
+        transition: none;
+        -webkit-transition: none;
     }
 
-    div[data-tree-model] li .normal {
-        padding: 1px 10px;
-        background-image: url('../../wwwroot/img/plainicon.com-51131-512px-515.png');
-        background-repeat: no-repeat;
+    .panel-heading .nav-justified.nav-pills li.active>a{
+        background-color:#74a9d8 !important;
     }
-
-    div[data-tree-model] li i, div[data-tree-model] li span {
-        cursor: pointer;
-    }
-
-    div[data-tree-model] li .selected {
-        background-color: #aaddff;
-        font-weight: bold;
-        padding: 1px 5px;
-    }
-    div[data-tree-model] li .changed {
-        background-color: #ffff00;
-        font-weight: bold;
-        padding: 1px 5px;
-    }
-    div[data-tree-model] li .loaded{
-        text-decoration:underline;
-        font-style:oblique;
-    }
-    [animate-on-change] {
-  transition: all 1s;
-  -webkit-transition: all 1s;
-}
-[animate-on-change].changed {
-  background-color: lightblue;
-  transition: none;
-  -webkit-transition: none;
-}
-[animate-on-change].changedshut {
-  background-color: lightsalmon;
-  transition: none;
-  -webkit-transition: none;
-}
Index: branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Styling/angular.treeview.css
===================================================================
--- branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Styling/angular.treeview.css	(revision 13782)
+++ branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Styling/angular.treeview.css	(revision 13795)
@@ -1,56 +1,86 @@
 div[data-angular-treeview] {
-  /* prevent user selection */
-  -moz-user-select: -moz-none;
-  -khtml-user-select: none;
-  -webkit-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-
-  /* default */
-  font-family: Tahoma;
-  font-size:13px;
-  color: #555;
-  text-decoration: none;
+    /* prevent user selection */
+    
+    -moz-user-select: -moz-none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
+    /* default */
+    font-size: 14px;
+    font-weight:600;
+    color: white;
+    text-decoration: none;
+    text-shadow:1px 1px black;
 }
 
 div[data-tree-model] ul {
-  margin: 0;
-  padding: 0;
-  list-style: none; 
-  border: none;
-  overflow: hidden;
+   
+    padding:5px;
+    list-style: none;
+    border: none;
+    overflow: hidden;
+    border-color: lightslategray;
+}   
+
+div[data-tree-model] li {
+    position: relative;
+    padding: 0 0 0 20px;
+    line-height: 20px;
+    margin-top:3px;
+    border: none;
+    border-color: lightblue;
+    border-radius:10px;
+    box-shadow:  2px 3px 5px rgba(0,0,0,0.6), inset 1px 10px 300px 51px rgba(33,151,184,1);
 }
 
-div[data-tree-model] li {
-  position: relative;
-  padding: 0 0 0 20px;
-  line-height: 20px;
-}
+    div[data-tree-model] li .expanded {
+        padding: 1px 10px;
+        background-image: url('../img/folder.png');
+        
+        background-repeat: no-repeat;
+    }
 
-div[data-tree-model] li .expanded {
-  padding: 1px 10px;
-  background-image: url("../img/folder.png");
-  background-repeat: no-repeat;
-}
+    div[data-tree-model] li .collapsed {
+        padding: 1px 10px;
+        background-image: url('../img/folder-closed.png');
+        background-repeat: no-repeat;
+    }
 
-div[data-tree-model] li .collapsed {
-  padding: 1px 10px;
-  background-image: url("../img/folder-closed.png");
-  background-repeat: no-repeat;
-}
+    div[data-tree-model] li .normal {
+        padding: 1px 10px;
+        color:black;
+        background-image: url('../img/file.png');
+        background-repeat: no-repeat;
+    }
 
-div[data-tree-model] li .normal {
-  padding: 1px 10px;
-  background-image: url("../img/file.png");
-  background-repeat: no-repeat;
-}
+    div[data-tree-model] li i, div[data-tree-model] li {
+        cursor: pointer;
+    }
 
-div[data-tree-model] li i, div[data-tree-model] li span {
-  cursor: pointer;
-}
+    div[data-tree-model] li.selected {
+        box-shadow:  2px 3px 5px rgba(0,0,0,0.6), inset 1px 10px 300px 51px rgba(143,201,58,1)!important;
+    }
+    div[data-tree-model] span.selected {
+        color:white!important;
+        text-shadow:1px 1px black!important;
+        font-weight: bold;
+        padding: 1px 5px;
+    }
 
-div[data-tree-model] li .selected {
-  background-color: #aaddff;
-  font-weight: bold;
-  padding: 1px 5px;
-}
+    div[data-tree-model] li.changed {
+        box-shadow:  2px 3px 5px rgba(0,0,0,0.6), inset 1px 10px 300px 51px rgba(250,250,210,1);
+    }
+     div[data-tree-model] span.changed {
+        color:black;
+        text-shadow:1px 1px white;
+        font-weight: bold;
+        padding: 1px 5px;
+    }
+
+    div[data-tree-model] span.loaded {
+        text-decoration: underline;
+        font-style: oblique;
+        
+    }
