ONOS-1281, ONOS-1747 - GUI -- Flows table created; version updated.

Change-Id: I06477793d6a1943ed90825f5103c8f6f4e962b70

@@ -92,7 +92,8 @@
                             org.onlab.packet.*,
                             org.onlab.rest.*,
                             org.onosproject.*,
-                            org.joda.time.*
+                            org.joda.time.*,
+                            org.apache.commons.*
                         </Import-Package>
                         <Web-ContextPath>${web.context}</Web-ContextPath>
                     </instructions>

+/*
+ * Copyright 2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package org.onosproject.ui.impl;
+
+import com.fasterxml.jackson.databind.node.ArrayNode;
+import com.fasterxml.jackson.databind.node.ObjectNode;
+import com.google.common.collect.ImmutableSet;
+import org.apache.commons.lang.WordUtils;
+import org.onosproject.net.DeviceId;
+import org.onosproject.net.flow.FlowEntry;
+import org.onosproject.net.flow.FlowRuleService;
+import org.onosproject.net.flow.TrafficSelector;
+import org.onosproject.net.flow.TrafficTreatment;
+import org.onosproject.net.flow.criteria.Criterion;
+import org.onosproject.net.flow.instructions.Instruction;
+
+import java.util.ArrayList;
+import java.util.Arrays;
+import java.util.List;
+import java.util.Set;
+
+
+/**
+ * Message handler for flow view related messages.
+ */
+public class FlowViewMessageHandler extends AbstractTabularViewMessageHandler {
+
+    private static final String NO_DEV = "none";
+
+    /**
+     * Creates a new message handler for the flow messages.
+     */
+    protected FlowViewMessageHandler() {
+        super(ImmutableSet.of("flowDataRequest"));
+    }
+
+    @Override
+    public void process(ObjectNode message) {
+        ObjectNode payload = payload(message);
+        String uri = string(payload, "devId", NO_DEV);
+        String sortCol = string(payload, "sortCol", "id");
+        String sortDir = string(payload, "sortDir", "asc");
+
+        ObjectNode rootNode;
+        if (uri.equals(NO_DEV)) {
+            rootNode = mapper.createObjectNode();
+            rootNode.set("flows", mapper.createArrayNode());
+        } else {
+            DeviceId deviceId = DeviceId.deviceId(uri);
+
+            FlowRuleService service = get(FlowRuleService.class);
+            TableRow[] rows = generateTableRows(service, deviceId);
+            RowComparator rc =
+                    new RowComparator(sortCol, RowComparator.direction(sortDir));
+            Arrays.sort(rows, rc);
+            ArrayNode flows = generateArrayNode(rows);
+
+            rootNode = mapper.createObjectNode();
+            rootNode.set("flows", flows);
+        }
+
+        connection().sendMessage("flowDataResponse", 0, rootNode);
+    }
+
+    private TableRow[] generateTableRows(FlowRuleService service,
+                                         DeviceId deviceId) {
+        List<TableRow> list = new ArrayList<>();
+        for (FlowEntry flow : service.getFlowEntries(deviceId)) {
+            list.add(new FlowTableRow(flow));
+        }
+        return list.toArray(new TableRow[list.size()]);
+    }
+
+    /**
+     * TableRow implementation for {@link org.onosproject.net.flow.FlowRule flows}.
+     */
+    private static class FlowTableRow extends AbstractTableRow {
+
+        private static final String ID = "id";
+        private static final String APP_ID = "appId";
+        private static final String GROUP_ID = "groupId";
+        private static final String TABLE_ID = "tableId";
+        private static final String PRIORITY = "priority";
+        private static final String SELECTOR = "selector";
+        private static final String TREATMENT = "treatment";
+        private static final String TIMEOUT = "timeout";
+        private static final String PERMANENT = "permanent";
+        private static final String STATE = "state";
+
+        private static final String COMMA = ", ";
+
+        private static final String[] COL_IDS = {
+            ID, APP_ID, GROUP_ID, TABLE_ID, PRIORITY, SELECTOR,
+                TREATMENT, TIMEOUT, PERMANENT, STATE
+        };
+
+        public FlowTableRow(FlowEntry f) {
+            add(ID, Long.toString(f.id().value()));
+            add(APP_ID, Short.toString(f.appId()));
+            add(GROUP_ID, Integer.toString(f.groupId().id()));
+            add(TABLE_ID, Integer.toString(f.tableId()));
+            add(PRIORITY, Integer.toString(f.priority()));
+            add(SELECTOR, getSelectorString(f));
+            add(TREATMENT, getTreatmentString(f));
+            add(TIMEOUT, Integer.toString(f.timeout()));
+            add(PERMANENT, Boolean.toString(f.isPermanent()));
+            add(STATE, WordUtils.capitalizeFully(f.state().toString()));
+        }
+
+        private String getSelectorString(FlowEntry f) {
+            String result;
+            TrafficSelector selector = f.selector();
+            Set<Criterion> criteria = selector.criteria();
+
+            if (criteria.isEmpty()) {
+                result = "(No traffic selectors for this flow)";
+            } else {
+                StringBuilder sb = new StringBuilder("Criteria = ");
+                for (Criterion c : criteria) {
+                    sb.append(WordUtils.capitalizeFully(c.type().toString()))
+                            .append(COMMA);
+                }
+                result = removeTrailingComma(sb).toString();
+            }
+            return result;
+        }
+
+        private String getTreatmentString(FlowEntry f) {
+            TrafficTreatment treatment = f.treatment();
+            List<Instruction> deferred = treatment.deferred();
+            List<Instruction> immediate = treatment.immediate();
+            boolean haveDef = !deferred.isEmpty();
+            boolean haveImm = !immediate.isEmpty();
+            boolean both = haveDef && haveImm;
+            boolean neither = !haveDef && !haveImm;
+            String result;
+
+            if (neither) {
+                result = "(No traffic treatment instructions for this flow)";
+            } else {
+                StringBuilder sb = new StringBuilder();
+                addDeferred(sb, deferred);
+                if (both) {
+                    sb.append(COMMA);
+                }
+                addImmediate(sb, immediate);
+                result = sb.toString();
+            }
+            return result;
+        }
+
+        private void addDeferred(StringBuilder sb, List<Instruction> deferred) {
+            if (!deferred.isEmpty()) {
+                sb.append("Deferred instructions = ");
+                for (Instruction i : deferred) {
+                    sb.append(WordUtils.capitalizeFully(i.type().toString()))
+                            .append(COMMA);
+                }
+                removeTrailingComma(sb);
+            }
+        }
+
+        private void addImmediate(StringBuilder sb, List<Instruction> immediate) {
+            if (!immediate.isEmpty()) {
+                sb.append("Immediate instructions = ");
+                for (Instruction i : immediate) {
+                    sb.append(WordUtils.capitalizeFully(i.type().toString()))
+                            .append(COMMA);
+                }
+                removeTrailingComma(sb);
+            }
+        }
+
+        private StringBuilder removeTrailingComma(StringBuilder sb) {
+            int pos = sb.lastIndexOf(COMMA);
+            sb.delete(pos, sb.length());
+            return sb;
+        }
+
+
+        @Override
+        protected String[] columnIds() {
+            return COL_IDS;
+        }
+    }
+
+}

@@ -79,6 +79,7 @@ public class UiExtensionManager implements UiExtensionService, SpriteService {
                         new DeviceViewMessageHandler(),
                         new LinkViewMessageHandler(),
                         new HostViewMessageHandler(),
+                        new FlowViewMessageHandler(),
                         new IntentViewMessageHandler(),
                         new ApplicationViewMessageHandler(),
                         new ClusterViewMessageHandler()

@@ -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," +

@@ -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;
 

@@ -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) {

@@ -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

-<!-- 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>

@@ -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_, _$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'];
+            }
 
-        function ($log, $scope, tbs) {
-            //tbs.buildTable({
-            //    self: this,
-            //    scope: $scope,
-            //    tag: 'flow'
-            //});
+            tbs.buildTable({
+                self: self,
+                scope: $scope,
+                tag: 'flow',
+                query: params
+            });
             
             $log.log('OvFlowCtrl has been created');
         }]);

@@ -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'
             });

@@ -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();

@@ -29,7 +29,7 @@ describe('Controller: OnosCtrl', function () {
         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