Free cookie consent management tool by TermsFeed Policy Generator

source: branches/WebJobManager/HeuristicLab.Clients.Hive.WebJobManager/Scripts/Hubs/CalendarHubber.js @ 13758

Last change on this file since 13758 was 13758, checked in by jlodewyc, 8 years ago

#2582 Calendar basic interactions working. Timezone working correct. Next: saving to server

File size: 13.0 KB
Line 
1
2angular.module('wjm', ['ui.bootstrap', 'ui.calendar', 'angularTreeview', 'ngDialog']).
3
4           controller('resourceCtrl', function ($scope, uiCalendarConfig, $compile, ngDialog , $timeout) {
5               var vm = $scope;
6
7               var date = new Date();
8
9               var d = date.getDate();
10               var m = date.getMonth();
11               var y = date.getFullYear();
12               var hubber = $.connection.calendarHub;
13               vm.alertMessage = "No alerts";
14               vm.currentcal = [];
15               vm.selectedEventId = -1;
16
17               vm.init = function () {
18
19                   //  $.connection.hub.logging = true;
20
21
22                   var v = document.getElementById("userId").innerHTML;
23                   $.connection.hub.qs = { 'userid': v };
24                   $.connection.hub.start().done(function () {
25                       hubber.server.requestInfo();
26                   });
27                   hubber.client.processData = function (data) {
28                       vm.data = JSON.parse(data);
29                       $scope.buildTree();
30
31                       $scope.$apply();
32                   };
33                   hubber.client.processDowntime = function (id, down) {
34                       var json = JSON.parse(down);
35                       var arrdown = [];
36                       var str = "";
37                       var col = "";
38                       for (var i = 0; i < json.length; i++) {
39                           if (json[i].DowntimeType === 0) {
40                               str = "Unavailable";
41                               col = "#006080";
42                           }
43                           else {
44                               str = "Shutdown";
45                               col = "#993300";
46                           }
47                           arrdown.push({
48                               id: json[i].Id,
49                               title: str,
50                               start: new Date(json[i].StartDate),
51                               end: new Date(json[i].EndDate),
52                               allDay: json[i].AllDayEvent,
53                               color: col
54                           });
55                       }
56                       var dat = { 'id': id, 'down': [arrdown] };
57                       $scope.treeview.currentNode.calendar = dat;
58
59                       $scope.currentcal = $scope.treeview.currentNode.calendar;
60                       $scope.$apply();
61                   }
62
63                   $scope.$watch("treeview.currentNode", function (newValue, oldValue) {
64                       $scope.currentcal = [];
65                       $(".selected.ng-binding").addClass('loaded');
66                       $scope.selectedEventId = -1;
67                       if ($scope.treeview.currentNode != null) {
68                           if ($scope.treeview.currentNode.calendar.length === 0) {
69                               hubber.server.requestDownTime(vm.treeview.currentNode.Id);
70
71                           }
72                           else {
73                               $timeout(function () {
74                                   $scope.currentcal = $scope.treeview.currentNode.calendar;
75
76                               }, 0);
77
78                           }
79                       }
80
81                   });
82               }
83               $scope.saveCurrentCalendar = function () {
84                   console.log("Save Current cal");
85               }
86               $scope.saveAllCalendars = function () {
87                   console.log("Save all");
88               }
89               $scope.clearCurrentCalendar = function () {
90                   
91                   $scope.selectedEventId = -1;
92                   $scope.treeview.currentNode.calendar = null;
93                   $scope.currentcal = [];
94                   hubber.server.requestDownTime(vm.treeview.currentNode.Id);
95                   $(".selected.ng-binding").removeClass('changed');
96               }
97               $scope.clearAllCalendars = function () {
98                   ngDialog.openConfirm({
99                       template:
100                        '<p>Are you sure you want to delete all calendar changes?</p>' +
101                        '<div>' +
102                          '<button type="button" class="btn btn-default" ng-click="closeThisDialog(0)">No </button> ' +
103                          '<button type="button" class="btn btn-primary" ng-click="confirm(1)">Yes' +
104                        '</button></div>',
105                       plain: true
106                   }).then(function (success) {
107                       $(".ng-binding.changed").removeClass('changed');
108                       $(".ng-binding.loaded").removeClass('loaded');
109                       $scope.selectedEventId = -1;
110                       $scope.treeview.currentNode.calendar = null;
111                       $scope.currentcal = [];
112                       for (var i = 0; i < $scope.tree.length; i++)
113                           removeCalendarsRecurse($scope.tree[i]);
114                       hubber.server.requestDownTime(vm.treeview.currentNode.Id);
115                       $(".selected.ng-binding").addClass('loaded');
116                   });
117                 
118               }
119               function removeCalendarsRecurse(node) {
120
121                   node.calendar = [];
122                   node.todelete = [];
123
124                   for (var i = 0; i < node.children.length; i++) {
125                       removeCalendarsRecurse(node.children[i]);
126                   }
127               }
128
129               $scope.buildTree = function () {
130                   vm.tree = [];
131                   vm.temptree = [];
132                   vm.top = false;
133                   for (; vm.data.length > 0;) {
134
135                       if (vm.data[0].ParentResourceId == null) {
136                           var curr = $scope.seekChildren(vm.data.splice(0, 1)[0]);
137                           vm.tree.push(curr);
138                       }
139                       else {
140                           var curr = $scope.seekChildren(vm.data.splice(0, 1)[0]);
141                           vm.temptree.push(curr);
142                       }
143                   }
144
145               };
146
147               $scope.seekChildren = function (current) {
148                   current.calendar = [];
149                   current.children = [];
150                   current.todelete = [];
151                   current.collapsed = true;
152                   for (var t = 0; t < vm.temptree.length;) {
153                       if (current.Id == vm.temptree[t].ParentResourceId) {
154                           current.children.push(vm.temptree.splice(t, 1)[0]);
155                       }
156                       else {
157                           t++;
158                       }
159                   }
160                   var childc = current.children.length;//Remembers count of children received from temp tree;
161                   for (var t = 0; t < vm.data.length;) {
162                       if (current.Id == vm.data[t].ParentResourceId) {
163                           current.children.push(vm.data.splice(t, 1)[0]);
164                       }
165                       else {
166                           t++;
167                       }
168                   }
169                   for (var t = childc; t < current.children.length; t++) {
170                       current.children[t] = $scope.seekChildren(current.children[t]);
171                   }
172                   return current;
173               }
174               function checkId(id) {
175                   for (var i = 0; i < vm.treeview.currentNode.calendar.down[0].length ; i++) {
176                       if (vm.treeview.currentNode.calendar.down[0][i]._id === id)
177                           return i;
178                   }
179                   return -1;
180               }
181               $scope.setChanged = function () {
182                   if (vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].title === "Unavailable")
183                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].color = '#0099cc';
184                   else
185                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].color = '#ff5500';
186                   vm.treeview.currentNode.changes = true;
187                   $(".selected.ng-binding").addClass('changed');
188               }
189               //*Add event by click
190               $scope.calendarClick = function (date, jsEvent, view) {
191                   var newid = 0;
192                   if (vm.treeview.currentNode.calendar.down[0].length != 0)
193                       newid = vm.treeview.currentNode.calendar.down[0][(vm.treeview.currentNode.calendar.down[0].length - 1)]._id + 1;
194                   vm.treeview.currentNode.calendar.down[0].push({
195                       id: '00000000-0000-0000-0000-000000000000',
196                       title: 'Unavailable',
197                       start: date.toDate(),
198                       end: null,
199                       allDay: date._ambigTime,
200                       _id: (newid)
201                   });
202
203                   vm.selectedEventId = vm.treeview.currentNode.calendar.down[0].length - 1;
204                   vm.setChanged();
205
206               }
207               /* alert on eventClick */
208               $scope.alertOnEventClick = function (date, jsEvent, view) {
209                   vm.selectedEventId = checkId(date._id);
210               };
211               /* alert on Drop */
212               $scope.alertOnDrop = function (event, delta, revertFunc, jsEvent, ui, view) {
213                   vm.selectedEventId = checkId(event._id);
214                   vm.setChanged();
215                   if (vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].allDay && event.start._ambigTime == false) {
216                       event.allDay = false;
217                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].allDay = false;
218                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].end = null;
219                   }
220                   else if (!vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].allDay && event.start._ambigTime == true) {
221                       event.allDay = true;
222                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].allDay = true;
223                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].end = null;
224                   }
225                   vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].start = new Date(event.start);
226                   if (vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].end != null)
227                       vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].end = new Date(event.end);
228               };
229               /* alert on Resize */
230               $scope.alertOnResize = function (event, delta, revertFunc, jsEvent, ui, view) {
231                   vm.selectedEventId = checkId(event._id);
232                   vm.setChanged();
233                   vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].start = new Date(event.start);
234                   vm.treeview.currentNode.calendar.down[0][vm.selectedEventId].end = new Date(event.end);
235               };
236
237               /* add custom event*/
238               $scope.addEvent = function () {
239
240               };
241
242               /* remove event */
243               $scope.remove = function (index) {
244                   vm.selectedEventId = -1;
245                   if (vm.treeview.currentNode.calendar.down[0][index].id != "00000000-0000-0000-0000-000000000000") {
246                       vm.treeview.currentNode.todelete.push(vm.treeview.currentNode.calendar.down[0][index - 1].id);
247                   }
248                   vm.treeview.currentNode.calendar.down[0].splice(index, 1);
249
250
251               };
252               /* Render Tooltip */
253               $scope.eventRender = function (event, element, view) {
254                   element.attr({
255                       'tooltip': event.title,
256                       'tooltip-append-to-body': true
257                   });
258                   //$compile(element)($scope);
259               };
260               /* config object */
261               $scope.uiConfig = {
262                   calendar: {
263                       height: 500,
264                       editable: true,
265                       defaultView: 'agendaWeek',
266                       firstDay: 1,
267                       header: {
268                           left: 'title',
269                           center: '',
270                           right: 'today prev,next'
271                       },
272                       timezone: 'UTC',
273                       timeFormat: 'HH:mm',
274                       eventClick: $scope.alertOnEventClick,
275                       eventDrop: $scope.alertOnDrop,
276                       eventResize: $scope.alertOnResize,
277                       eventRender: $scope.eventRender,
278                       dayClick: $scope.calendarClick
279
280
281                   }
282               };
283
284           });
285
286
Note: See TracBrowser for help on using the repository browser.