Skip to content

Commit b21cc69

Browse files
corneadougcorneadoug
committed
Refactor Navbar controller to controller pattern + data factory
1 parent 5a40c4c commit b21cc69

File tree

9 files changed

+202
-131
lines changed

9 files changed

+202
-131
lines changed

‎zeppelin-web/src/app/app.controller.js‎

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
/*
2+
* Licensed under the Apache License, Version 2.0 (the "License");
3+
* you may not use this file except in compliance with the License.
4+
* You may obtain a copy of the License at
5+
*
6+
* http://www.apache.org/licenses/LICENSE-2.0
7+
*
8+
* Unless required by applicable law or agreed to in writing, software
9+
* distributed under the License is distributed on an "AS IS" BASIS,
10+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11+
* See the License for the specific language governing permissions and
12+
* limitations under the License.
13+
*/
14+
'use strict';
15+
16+
/**
17+
* @ngdoc function
18+
* @name zeppelinWebApp.controller:MainCtrl
19+
* @description
20+
* # MainCtrl
21+
* Controller of the zeppelinWebApp
22+
*
23+
* @author anthonycorbacho
24+
*/
25+
angular.module('zeppelinWebApp').controller('MainCtrl', function($scope, WebSocket, $rootScope, $window) {
26+
$rootScope.compiledScope = $scope.$new(true, $rootScope);
27+
$scope.WebSocketWaitingList = [];
28+
$scope.connected = false;
29+
$scope.looknfeel = 'default';
30+
31+
var init = function() {
32+
$scope.asIframe = (($window.location.href.indexOf('asIframe') > -1) ? true : false);
33+
};
34+
init();
35+
36+
/**
37+
* Web socket
38+
*/
39+
WebSocket.onopen(function() {
40+
console.log('Websocket created');
41+
$scope.connected = true;
42+
if ($scope.WebSocketWaitingList.length > 0) {
43+
for (var o in $scope.WebSocketWaitingList) {
44+
WebSocket.send(JSON.stringify($scope.WebSocketWaitingList[o]));
45+
}
46+
}
47+
});
48+
49+
WebSocket.onmessage(function(event) {
50+
var payload;
51+
if (event.data) {
52+
payload = angular.fromJson(event.data);
53+
}
54+
console.log('Receive << %o, %o, %o', payload.op, payload, $scope);
55+
var op = payload.op;
56+
var data = payload.data;
57+
if (op === 'NOTE') {
58+
$rootScope.$broadcast('setNoteContent', data.note);
59+
} else if (op === 'NOTES_INFO') {
60+
$rootScope.$broadcast('setNoteMenu', data.notes);
61+
} else if (op === 'PARAGRAPH') {
62+
$scope.$broadcast('updateParagraph', data);
63+
} else if (op === 'PROGRESS') {
64+
$rootScope.$broadcast('updateProgress', data);
65+
} else if (op === 'COMPLETION_LIST') {
66+
$rootScope.$broadcast('completionList', data);
67+
} else if (op === 'ANGULAR_OBJECT_UPDATE') {
68+
$rootScope.$broadcast('angularObjectUpdate', data);
69+
}
70+
});
71+
72+
WebSocket.onerror(function(event) {
73+
console.log('error message: ', event);
74+
$scope.connected = false;
75+
});
76+
77+
WebSocket.onclose(function(event) {
78+
console.log('close message: ', event);
79+
$scope.connected = false;
80+
});
81+
82+
/** Send info to the websocket server */
83+
var send = function(data) {
84+
if (WebSocket.currentState() !== 'OPEN') {
85+
$scope.WebSocketWaitingList.push(data);
86+
} else {
87+
console.log('Send >> %o, %o', data.op, data);
88+
WebSocket.send(JSON.stringify(data));
89+
}
90+
};
91+
92+
93+
/** get the childs event and sebd to the websocket server */
94+
$rootScope.$on('sendNewEvent', function(event, data) {
95+
if (!event.defaultPrevented) {
96+
send(data);
97+
event.preventDefault();
98+
}
99+
});
100+
101+
$rootScope.$on('setIframe', function(event, data) {
102+
if (!event.defaultPrevented) {
103+
$scope.asIframe = data;
104+
event.preventDefault();
105+
}
106+
});
107+
108+
$rootScope.$on('setLookAndFeel', function(event, data) {
109+
if (!event.defaultPrevented && data && data !== '') {
110+
$scope.looknfeel = data;
111+
event.preventDefault();
112+
}
113+
});
114+
115+
});

‎zeppelin-web/src/app/app.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,8 @@ angular
110110

111111
$routeProvider
112112
.when('/', {
113-
templateUrl: 'app/home/home.html'
113+
templateUrl: 'app/home/home.html',
114+
controller: 'HomeCtrl'
114115
})
115116
.when('/notebook/:noteId', {
116117
templateUrl: 'app/notebook/notebook.html',

‎zeppelin-web/src/app/home/home.controller.js‎

Lines changed: 6 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -13,108 +13,10 @@
1313
*/
1414
'use strict';
1515

16-
/**
17-
* @ngdoc function
18-
* @name zeppelinWebApp.controller:MainCtrl
19-
* @description
20-
* # MainCtrl
21-
* Controller of the zeppelinWebApp
22-
*
23-
* @author anthonycorbacho
24-
*/
25-
angular.module('zeppelinWebApp')
26-
.controller('MainCtrl', function($scope, WebSocket, $rootScope, $window) {
27-
$rootScope.compiledScope = $scope.$new(true, $rootScope);
28-
$scope.WebSocketWaitingList = [];
29-
$scope.connected = false;
30-
$scope.looknfeel = 'default';
31-
32-
var init = function() {
33-
$scope.asIframe = (($window.location.href.indexOf('asIframe') > -1) ? true : false);
34-
};
35-
init();
36-
37-
/**
38-
* Web socket
39-
*/
40-
WebSocket.onopen(function() {
41-
console.log('Websocket created');
42-
$scope.connected = true;
43-
if ($scope.WebSocketWaitingList.length > 0) {
44-
for (var o in $scope.WebSocketWaitingList) {
45-
WebSocket.send(JSON.stringify($scope.WebSocketWaitingList[o]));
46-
}
47-
}
48-
setInterval(function(){
49-
$rootScope.$emit('sendNewEvent', {op: 'PING'})
50-
}
51-
,60000);
52-
});
53-
54-
WebSocket.onmessage(function(event) {
55-
var payload;
56-
if (event.data) {
57-
payload = angular.fromJson(event.data);
58-
}
59-
console.log('Receive << %o, %o, %o', payload.op, payload, $scope);
60-
var op = payload.op;
61-
var data = payload.data;
62-
if (op === 'NOTE') {
63-
$scope.$broadcast('setNoteContent', data.note);
64-
} else if (op === 'NOTES_INFO') {
65-
$scope.$broadcast('setNoteMenu', data.notes);
66-
} else if (op === 'PARAGRAPH') {
67-
$scope.$broadcast('updateParagraph', data);
68-
} else if (op === 'PROGRESS') {
69-
$scope.$broadcast('updateProgress', data);
70-
} else if (op === 'COMPLETION_LIST') {
71-
$scope.$broadcast('completionList', data);
72-
} else if (op === 'ANGULAR_OBJECT_UPDATE') {
73-
$scope.$broadcast('angularObjectUpdate', data);
74-
}
75-
});
76-
77-
WebSocket.onerror(function(event) {
78-
console.log('error message: ', event);
79-
$scope.connected = false;
80-
});
81-
82-
WebSocket.onclose(function(event) {
83-
console.log('close message: ', event);
84-
$scope.connected = false;
85-
});
86-
87-
/** Send info to the websocket server */
88-
var send = function(data) {
89-
if (WebSocket.currentState() !== 'OPEN') {
90-
$scope.WebSocketWaitingList.push(data);
91-
} else {
92-
console.log('Send >> %o, %o', data.op, data);
93-
WebSocket.send(JSON.stringify(data));
94-
}
95-
};
96-
97-
98-
/** get the childs event and sebd to the websocket server */
99-
$rootScope.$on('sendNewEvent', function(event, data) {
100-
if (!event.defaultPrevented) {
101-
send(data);
102-
event.preventDefault();
103-
}
104-
});
105-
106-
$rootScope.$on('setIframe', function(event, data) {
107-
if (!event.defaultPrevented) {
108-
$scope.asIframe = data;
109-
event.preventDefault();
110-
}
111-
});
112-
113-
$rootScope.$on('setLookAndFeel', function(event, data) {
114-
if (!event.defaultPrevented && data && data !== '') {
115-
$scope.looknfeel = data;
116-
event.preventDefault();
117-
}
118-
});
119-
16+
angular.module('zeppelinWebApp').controller('HomeCtrl', function($scope, notebookListDataFactory, websocketMsgSrv) {
17+
18+
var vm = this;
19+
vm.notes = notebookListDataFactory;
20+
vm.websocketMsgSrv = websocketMsgSrv;
21+
12022
});

‎zeppelin-web/src/app/home/home.html‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
you may not use this file except in compliance with the License.
44
You may obtain a copy of the License at
55
6-
http://www.apache.org/licenses/LICENSE-2.0
6+
http://www.apache.org/licenses/LICENSE-2.0
77
88
Unless required by applicable law or agreed to in writing, software
99
distributed under the License is distributed on an "AS IS" BASIS,
@@ -12,7 +12,7 @@
1212
limitations under the License.
1313
-->
1414

15-
<div class="box width-full home">
15+
<div class="box width-full home" ng-controller="HomeCtrl as home">
1616
<div class="zeppelin">
1717
<div class="zeppelin2"></div>
1818
</div>
@@ -26,10 +26,11 @@ <h1 class="box-heading" id="welcome">
2626
<div class="col-md-4">
2727
<h4>Notebook</h4>
2828

29-
<div ng-controller="NavCtrl">
30-
<h5><a href="javascript:void(0);" ng-click="createNewNote()" style="text-decoration: none;"><i style="font-size: 15px;" class="icon-notebook"></i> Create new note</a></h5>
29+
<div>
30+
<h5><a href="javascript:void(0);" ng-click="home.websocketMsgSrv.createNotebook()" style="text-decoration: none;">
31+
<i style="font-size: 15px;" class="icon-notebook"></i> Create new note</a></h5>
3132
<ul style="list-style-type: none;">
32-
<li ng-repeat="note in notes track by $index"><i style="font-size: 10px;" class="icon-doc"></i>
33+
<li ng-repeat="note in home.notes.list track by $index"><i style="font-size: 10px;" class="icon-doc"></i>
3334
<a style="text-decoration: none;" href="#/notebook/{{note.id}}">{{note.name || 'Note ' + note.id}}</a>
3435
</li>
3536
</ul>

‎zeppelin-web/src/components/navbar/navbar.controller.js‎

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -25,32 +25,33 @@
2525
* @author anthonycorbacho
2626
*/
2727

28-
angular.module('zeppelinWebApp').controller('NavCtrl', function($scope, $rootScope, $routeParams) {
28+
angular.module('zeppelinWebApp').controller('NavCtrl', function($scope, $rootScope, $routeParams, notebookListDataFactory, websocketMsgSrv) {
2929
/** Current list of notes (ids) */
30-
$scope.notes = [];
30+
31+
var vm = this;
32+
vm.notes = notebookListDataFactory;
33+
vm.websocketMsgSrv = websocketMsgSrv;
34+
3135
$('#notebook-list').perfectScrollbar({suppressScrollX: true});
32-
33-
/** Set the new menu */
36+
3437
$scope.$on('setNoteMenu', function(event, notes) {
35-
$scope.notes = notes;
38+
notebookListDataFactory.setNotes(notes);
3639
});
3740

38-
var loadNotes = function() {
39-
$rootScope.$emit('sendNewEvent', {op: 'LIST_NOTES'});
40-
};
41-
loadNotes();
42-
43-
/** Create a new note */
44-
$scope.createNewNote = function() {
45-
$rootScope.$emit('sendNewEvent', {op: 'NEW_NOTE'});
46-
};
41+
function loadNotes() {
42+
$rootScope.$broadcast('sendNewEvent', {op: 'LIST_NOTES'});
43+
}
4744

48-
/** Check if the note url is equal to the current note */
49-
$scope.isActive = function(noteId) {
45+
function isActive(noteId) {
5046
if ($routeParams.noteId === noteId) {
5147
return true;
5248
}
5349
return false;
54-
};
55-
50+
}
51+
52+
vm.loadNotes = loadNotes;
53+
vm.isActive = isActive;
54+
55+
vm.loadNotes();
56+
5657
});

‎zeppelin-web/src/components/navbar/navbar.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,15 @@
1111
</a>
1212
</div>
1313

14-
<div class="collapse navbar-collapse" ng-controller="NavCtrl">
14+
<div class="collapse navbar-collapse" ng-controller="NavCtrl as navbar">
1515
<ul class="nav navbar-nav">
1616
<li class="dropdown">
1717
<a href="#" class="dropdown-toggle">Notebook <span class="caret"></span></a>
1818
<ul class="dropdown-menu" role="menu">
19-
<li><a href="javascript:void(0);" ng-click="createNewNote()"><i class="fa fa-plus"></i> Create new note</a></li>
19+
<li><a href="javascript:void(0);" ng-click="navbar.websocketMsgSrv.createNotebook()"><i class="fa fa-plus"></i> Create new note</a></li>
2020
<li class="divider"></li>
2121
<div id="notebook-list" class="scrollbar-container">
22-
<li ng-repeat="note in notes track by $index" ng-class="{'active' : isActive(note.id)}">
22+
<li ng-repeat="note in navbar.notes.list track by $index" ng-class="{'active' : isActive(note.id)}">
2323
<a href="#/notebook/{{note.id}}">{{note.name || 'Note ' + note.id}} </a>
2424
</li>
2525
</div>

‎zeppelin-web/src/components/notebookListDataFactory/notebookList.datafactory.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/*
2+
* Licensed under the Apache License, Version 2.0 (the "License");
3+
* you may not use this file except in compliance with the License.
4+
* You may obtain a copy of the License at
5+
*
6+
* http://www.apache.org/licenses/LICENSE-2.0
7+
*
8+
* Unless required by applicable law or agreed to in writing, software
9+
* distributed under the License is distributed on an "AS IS" BASIS,
10+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11+
* See the License for the specific language governing permissions and
12+
* limitations under the License.
13+
*/
14+
'use strict';
15+
16+
angular.module('zeppelinWebApp').factory('notebookListDataFactory', function() {
17+
var notes = {};
18+
19+
notes.list = [];
20+
21+
notes.setNotes = function(notesList) {
22+
notes.list = angular.copy(notesList);
23+
};
24+
25+
return notes;
26+
});

‎zeppelin-web/src/components/websocketEvents/websocketMsg.service.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/*
2+
* Licensed under the Apache License, Version 2.0 (the "License");
3+
* you may not use this file except in compliance with the License.
4+
* You may obtain a copy of the License at
5+
*
6+
* http://www.apache.org/licenses/LICENSE-2.0
7+
*
8+
* Unless required by applicable law or agreed to in writing, software
9+
* distributed under the License is distributed on an "AS IS" BASIS,
10+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11+
* See the License for the specific language governing permissions and
12+
* limitations under the License.
13+
*/
14+
'use strict';
15+
16+
angular.module('zeppelinWebApp').service('websocketMsgSrv', function($rootScope) {
17+
18+
this.createNotebook = function() {
19+
$rootScope.$broadcast('sendNewEvent', {op: 'NEW_NOTE'});
20+
};
21+
22+
});

0 commit comments

Comments
 (0)