ONOS-1281, ONOS-1747 - GUI -- Flows table created; version updated.
Change-Id: I06477793d6a1943ed90825f5103c8f6f4e962b70
diff --git a/web/gui/src/main/webapp/app/fw/svg/glyph.js b/web/gui/src/main/webapp/app/fw/svg/glyph.js
index 0612427..3cbef4b 100644
--- a/web/gui/src/main/webapp/app/fw/svg/glyph.js
+++ b/web/gui/src/main/webapp/app/fw/svg/glyph.js
@@ -114,6 +114,24 @@
"-2,4.1-2.9,7-2.9c2.9,0,5.1,0.9,6.9,2.9c5,5.4,5.6,17.1,5.4,22.6" +
"h-25C42.3,43.1,43.1,31.5,48.1,26.1z",
+ flowTable: 'M15.9,19.1h-8v-13h8V19.1z M90.5,6.1H75.6v13h14.9V6.1z' +
+ ' M71.9,6.1H56.9v13h14.9V6.1z M53.2,6.1H38.3v13h14.9V6.1z M34.5,' +
+ '6.1H19.6v13h14.9V6.1z M102.2,6.1h-8v13h8V6.1z M102.2,23.6H7.9v' +
+ '78.5h94.4V23.6z M86,63.2c0,3.3-2.7,6-6,6c-2.8,0-5.1-1.9-5.8-' +
+ '4.5H63.3v5.1c0,0.9-0.7,1.5-1.5,1.5h-5.2v10.6c2.6,0.7,4.5,3,4.5,' +
+ '5.8c0,3.3-2.7,6-6,6c-3.3,0-6-2.7-6-6c0-2.8,1.9-5.1,4.4-5.8V71.3' +
+ 'H48c-0.9,0-1.5-0.7-1.5-1.5v-5.1H36c-0.7,2.6-3,4.4-5.8,4.4c-3.3,' +
+ '0-6-2.7-6-6s2.7-6,6-6c2.8,0,5.2,1.9,5.8,4.5h10.5V56c0-0.9,0.7-' +
+ '1.5,1.5-1.5h5.5V43.8c-2.6-0.7-4.5-3-4.5-5.8c0-3.3,2.7-6,6-6s6,' +
+ '2.7,6,6c0,2.8-1.9,5.1-4.5,5.8v10.6h5.2c0.9,0,1.5,0.7,1.5,1.5v' +
+ '5.6h10.8c0.7-2.6,3-4.5,5.8-4.5C83.3,57.1,86,59.8,86,63.2z M55.1,' +
+ '42.3c2.3,0,4.3-1.9,4.3-4.3c0-2.3-1.9-4.3-4.3-4.3s-4.3,1.9-4.3,' +
+ '4.3C50.8,40.4,52.7,42.3,55.1,42.3z M34.4,63.1c0-2.3-1.9-4.3-4.3' +
+ '-4.3s-4.3,1.9-4.3,4.3s1.9,4.3,4.3,4.3S34.4,65.5,34.4,63.1z ' +
+ 'M55.1,83.5c-2.3,0-4.3,1.9-4.3,4.3s1.9,4.3,4.3,4.3s4.3-1.9,4.3-' +
+ '4.3S57.5,83.5,55.1,83.5zM84.2,63.2c0-2.3-1.9-4.3-4.3-4.3s-4.3,' +
+ '1.9-4.3,4.3s1.9,4.3,4.3,4.3S84.2,65.5,84.2,63.2z',
+
// --- Topology toolbar specific glyphs ----------------------
summary: "M95.8,9.2H14.2c-2.8,0-5,2.2-5,5v81.5c0,2.8,2.2,5,5," +
diff --git a/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js b/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
index 93249ed..1343b8f 100644
--- a/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
+++ b/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js
@@ -25,13 +25,16 @@
// example params to buildTable:
// {
- // self: this, <- controller object
- // scope: $scope, <- controller scope
- // tag: 'device', <- table identifier
- // selCb: selCb <- row selection callback (optional)
+ // self: this, <- controller object
+ // scope: $scope, <- controller scope
+ // tag: 'device', <- table identifier
+ // selCb: selCb <- row selection callback (optional)
+ // query: params <- query parameters in URL (optional)
// }
// Note: selCb() is passed the row data model of the selected row,
// or null when no row is selected.
+ // Note: query is always an object (empty or containing properties)
+ // it comes from $location.search()
function buildTable(o) {
var handlers = {},
@@ -48,7 +51,8 @@
}
function sortCb(params) {
- wss.sendEvent(req, params);
+ var p = angular.extend({}, params, o.query);
+ wss.sendEvent(req, p);
}
o.scope.sortCallback = sortCb;
diff --git a/web/gui/src/main/webapp/app/view/device/device.js b/web/gui/src/main/webapp/app/view/device/device.js
index 236f374..c600e89 100644
--- a/web/gui/src/main/webapp/app/view/device/device.js
+++ b/web/gui/src/main/webapp/app/view/device/device.js
@@ -119,11 +119,11 @@
bns.button(btnsDiv,
'dev-dets-p-flows',
- 'flowsTable',
+ 'flowTable',
function () {
ns.navTo(flowPath, { devId: details.id });
},
- 'Show flows for this device');
+ 'Show flows table for this device');
}
function addPortRow(tbody, port) {
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.css b/web/gui/src/main/webapp/app/view/flow/flow.css
index 7166e57..7a91837 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.css
+++ b/web/gui/src/main/webapp/app/view/flow/flow.css
@@ -18,5 +18,28 @@
ONOS GUI -- Flow View -- CSS file
*/
-#ov-flow td {
+.light #ov-flow tr:nth-child(6n + 2),
+.light #ov-flow tr:nth-child(6n + 3),
+.light #ov-flow tr:nth-child(6n + 4) {
+ background-color: #eee;
+}
+.light #ov-flow tr:nth-child(6n + 5),
+.light #ov-flow tr:nth-child(6n + 6),
+.light #ov-flow tr:nth-child(6n + 1) {
+ background-color: #ddd;
+}
+.dark #ov-flow tr:nth-child(6n + 2),
+.dark #ov-flow tr:nth-child(6n + 3),
+.dark #ov-flow tr:nth-child(6n + 4) {
+ background-color: #444;
+}
+.dark #ov-flow tr:nth-child(6n + 5),
+.dark #ov-flow tr:nth-child(6n + 6),
+.dark #ov-flow tr:nth-child(6n + 1) {
+ background-color: #333;
+}
+
+#ov-flow td.selector,
+#ov-flow td.treatment {
+ padding-left: 36px;
}
\ No newline at end of file
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.html b/web/gui/src/main/webapp/app/view/flow/flow.html
index 9c1de12..40b6946 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.html
+++ b/web/gui/src/main/webapp/app/view/flow/flow.html
@@ -1,4 +1,52 @@
-<!-- Host partial HTML -->
+<!-- Flow partial HTML -->
<div id="ov-flow">
- <h1> Flows are here </h1>
+ <div class="tabular-header">
+ <h2>
+ Flows for Device {{ctrl.devId || "none"}}
+ ({{ctrl.tableData.length}} total)
+ </h2>
+ </div>
+
+ <table class="summary-list"
+ onos-fixed-header
+ onos-sortable-header
+ sort-callback="sortCallback(requestParams)">
+ <thead>
+ <tr>
+ <th colId="id" sortable>Flow ID </th>
+ <th colId="appId" sortable>App ID </th>
+ <th colId="groupId" sortable>Group ID </th>
+ <th colId="tableId" sortable>Table ID </th>
+ <th colId="priority" sortable>Priority </th>
+ <th colId="timeout" sortable>Timeout </th>
+ <th colId="permanent" sortable>Permanent </th>
+ <th colId="state" sortable>State </th>
+ </tr>
+ </thead>
+
+ <tbody>
+ <tr ng-hide="ctrl.tableData.length">
+ <td class="nodata" colspan="8">
+ No Flows found
+ </td>
+ </tr>
+
+ <tr ng-repeat-start="flow in ctrl.tableData">
+ <td>{{flow.id}}</td>
+ <td>{{flow.appId}}</td>
+ <td>{{flow.groupId}}</td>
+ <td>{{flow.tableId}}</td>
+ <td>{{flow.priority}}</td>
+ <td>{{flow.timeout}}</td>
+ <td>{{flow.permanent}}</td>
+ <td>{{flow.state}}</td>
+ </tr>
+ <tr>
+ <td class="selector" colspan="8">{{flow.selector}}</td>
+ </tr>
+ <tr ng-repeat-end ng-repeat-done>
+ <td class="treatment" colspan="8">{{flow.treatment}}</td>
+ </tr>
+ </tbody>
+ </table>
</div>
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.js b/web/gui/src/main/webapp/app/view/flow/flow.js
index 0436a3e..239ebda 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.js
+++ b/web/gui/src/main/webapp/app/view/flow/flow.js
@@ -21,16 +21,33 @@
(function () {
'use strict';
+ // injected references
+ var $log, $scope, $location, fs, tbs;
+
angular.module('ovFlow', [])
.controller('OvFlowCtrl',
- ['$log', '$scope', 'TableBuilderService',
+ ['$log', '$scope', '$location', 'FnService', 'TableBuilderService',
- function ($log, $scope, tbs) {
- //tbs.buildTable({
- // self: this,
- // scope: $scope,
- // tag: 'flow'
- //});
+ function (_$log_, _$scope_, _$location_, _fs_, _tbs_) {
+ var self = this,
+ params;
+ $log = _$log_;
+ $scope = _$scope_;
+ $location = _$location_;
+ fs = _fs_;
+ tbs = _tbs_;
+
+ params = $location.search();
+ if (params.hasOwnProperty('devId')) {
+ self.devId = params['devId'];
+ }
+
+ tbs.buildTable({
+ self: self,
+ scope: $scope,
+ tag: 'flow',
+ query: params
+ });
$log.log('OvFlowCtrl has been created');
}]);
diff --git a/web/gui/src/main/webapp/app/view/topo/topoSelect.js b/web/gui/src/main/webapp/app/view/topo/topoSelect.js
index cf08d2f..521c917 100644
--- a/web/gui/src/main/webapp/app/view/topo/topoSelect.js
+++ b/web/gui/src/main/webapp/app/view/topo/topoSelect.js
@@ -248,9 +248,9 @@
if ((data.props).hasOwnProperty('URI')) {
tps.addAction({
id: 'flows-table-btn',
- gid: 'flowsTable',
+ gid: 'flowTable',
cb: function () {
- ns.navTo(flowPath, { devId: data.id });
+ ns.navTo(flowPath, { devId: data.props['URI'] });
},
tt: 'Show flows for this device'
});
diff --git a/web/gui/src/main/webapp/onos.js b/web/gui/src/main/webapp/onos.js
index 5d534e3..0844adb 100644
--- a/web/gui/src/main/webapp/onos.js
+++ b/web/gui/src/main/webapp/onos.js
@@ -78,7 +78,7 @@
self.$route = $route;
self.$routeParams = $routeParams;
self.$location = $location;
- self.version = '1.1.0';
+ self.version = '1.3.0';
// initialize services...
ts.init();
diff --git a/web/gui/src/main/webapp/tests/app/onos-spec.js b/web/gui/src/main/webapp/tests/app/onos-spec.js
index 4fd43ff..fedd839 100644
--- a/web/gui/src/main/webapp/tests/app/onos-spec.js
+++ b/web/gui/src/main/webapp/tests/app/onos-spec.js
@@ -29,7 +29,7 @@
ctrl = $controller('OnosCtrl');
}));
- it('should report version 1.1.0', function () {
- expect(ctrl.version).toEqual('1.1.0');
+ it('should report version 1.3.0', function () {
+ expect(ctrl.version).toEqual('1.3.0');
});
});
\ No newline at end of file