ONOS-2033 - GUI -- Buckets in groups view are one per line, Link direction on li…

…nks view has HTML arrow.

Change-Id: I6adfb49a05fba0160ce60a22ee4b63bac817fca0

@@ -103,7 +103,7 @@ public class GroupViewMessageHandler extends UiMessageHandler {
         }
 
         private final class BucketFormatter implements CellFormatter {
-            private static final String COMMA = ", ";
+            private static final String BREAK = "<br>";
 
             @Override
             public String format(Object value) {
@@ -121,18 +121,11 @@ public class GroupViewMessageHandler extends UiMessageHandler {
                             .append(b.packets())
                             .append(" Actions: ")
                             .append(b.treatment().allInstructions())
-                            .append(COMMA);
+                            .append(BREAK);
                 }
-                removeTrailingComma(sb);
 
                 return sb.toString();
             }
-
-            private StringBuilder removeTrailingComma(StringBuilder sb) {
-                int pos = sb.lastIndexOf(COMMA);
-                sb.delete(pos, sb.length());
-                return sb;
-            }
         }
     }
 }

@@ -125,7 +125,7 @@ public class LinkViewMessageHandler extends UiMessageHandler {
         }
 
         private String linkDir(BiLink link) {
-            return link.two != null ? "A <--> B" : "A --> B";
+            return link.two != null ? "A &harr; B" : "A &rarr; B";
         }
     }
 }

@@ -62,7 +62,8 @@
                 </tr>
                 <tr class="ignore-width"
                     ng-repeat-end ng-repeat-done>
-                    <td class="buckets" colspan="6">{{group.buckets}}</td>
+                    <td class="buckets" colspan="6"
+                        ng-bind-html="group.buckets"></td>
                 </tr>
             </table>
         </div>

@@ -48,6 +48,14 @@
                 query: params
             });
 
+            $scope.$watch('tableData', function () {
+                if (!fs.isEmptyObject($scope.tableData)) {
+                    $scope.tableData.forEach(function (group) {
+                        group.buckets = $sce.trustAsHtml(group.buckets);
+                    });
+                }
+            });
+
             $log.log('OvGroupCtrl has been created');
         }]);
 }());

@@ -57,7 +57,7 @@
                     <td>{{link.one}}</td>
                     <td>{{link.two}}</td>
                     <td>{{link.type}}</td>
-                    <td>{{link.direction}}</td>
+                    <td ng-bind-html="link.direction"></td>
                     <td>{{link.durable}}</td>
                 </tr>
             </table>

@@ -23,14 +23,22 @@
 
     angular.module('ovLink', [])
     .controller('OvLinkCtrl',
-        ['$log', '$scope', 'TableBuilderService',
+        ['$log', '$scope', '$sce', 'FnService', 'TableBuilderService',
 
-        function ($log, $scope, tbs) {
+        function ($log, $scope, $sce, fs, tbs) {
             tbs.buildTable({
                 scope: $scope,
                 tag: 'link'
             });
 
+            $scope.$watch('tableData', function () {
+                if (!fs.isEmptyObject($scope.tableData)) {
+                    $scope.tableData.forEach(function (link) {
+                        link.direction = $sce.trustAsHtml(link.direction);
+                    });
+                }
+            });
+
             $log.log('OvLinkCtrl has been created');
         }]);
 }());