From 3da62124b0234d5a75f64f01c09e129cf2fb841a Mon Sep 17 00:00:00 2001 From: Thomas Vachuska Date: Wed, 4 Oct 2017 13:49:12 -0700 Subject: [PATCH] Fixing some content and visual glitches in the device flows view. - idle timeout - hard timeout - app name fix - CSS styles & details pane structure Change-Id: I90a04cfe679a1c8371d06aed3d972c9f0bc93f6f --- .../ui/impl/FlowViewMessageHandler.java | 17 +++++++++---- .../src/main/webapp/app/view/flow/flow.css | 12 +++++++++- web/gui/src/main/webapp/app/view/flow/flow.js | 24 ++++++++----------- 3 files changed, 33 insertions(+), 20 deletions(-) diff --git a/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java b/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java index 71c7d5ae48..8f2a0a5efb 100644 --- a/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java +++ b/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java @@ -23,6 +23,7 @@ import com.google.common.collect.ImmutableSet; import org.onosproject.app.ApplicationService; import org.onosproject.core.Application; import org.onosproject.core.ApplicationId; +import org.onosproject.core.CoreService; import org.onosproject.core.DefaultApplicationId; import org.onosproject.net.DeviceId; import org.onosproject.net.flow.FlowEntry; @@ -76,7 +77,8 @@ public class FlowViewMessageHandler extends UiMessageHandler { private static final String SELECTOR = "selector"; private static final String TREATMENT_C = "treatment_c"; // for table column private static final String TREATMENT = "treatment"; - private static final String TIMEOUT = "timeout"; + private static final String IDLE_TIMEOUT = "idleTimeout"; + private static final String HARD_TIMEOUT = "hardTimeout"; private static final String PERMANENT = "permanent"; private static final String STATE = "state"; private static final String PACKETS = "packets"; @@ -134,7 +136,7 @@ public class FlowViewMessageHandler extends UiMessageHandler { APP_NAME, GROUP_ID, - TIMEOUT, + IDLE_TIMEOUT, PERMANENT, SELECTOR_C, @@ -170,7 +172,11 @@ public class FlowViewMessageHandler extends UiMessageHandler { private String makeAppName(short id, Map lookup) { ApplicationId appId = lookup.get(id); if (appId == null) { - return UNKNOWN + SPACE + ANGLE_O + id + ANGLE_C; + appId = get(CoreService.class).getAppId(id); + if (appId == null) { + return UNKNOWN + SPACE + ANGLE_O + id + ANGLE_C; + } + lookup.put(id, appId); } String appName = appId.name(); return appName.startsWith(ONOS_PREFIX) @@ -238,7 +244,7 @@ public class FlowViewMessageHandler extends UiMessageHandler { .cell(APP_NAME, makeAppName(flow.appId(), lookup)) .cell(GROUP_ID, flow.groupId().id()) - .cell(TIMEOUT, flow.timeout()) + .cell(IDLE_TIMEOUT, flow.timeout()) .cell(PERMANENT, flow.isPermanent()) .cell(SELECTOR_C, flow) @@ -415,7 +421,8 @@ public class FlowViewMessageHandler extends UiMessageHandler { data.put(APP_NAME, makeAppName(flow.appId(), appShortMap())); data.put(GROUP_ID, decorateGroupId(flow)); - data.put(TIMEOUT, flow.hardTimeout()); + data.put(IDLE_TIMEOUT, flow.timeout()); + data.put(HARD_TIMEOUT, flow.hardTimeout()); data.put(PERMANENT, flow.isPermanent()); data.set(SELECTOR, jsonCriteria(flow)); 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 06e9b1a948..cbe0cdb936 100644 --- a/web/gui/src/main/webapp/app/view/flow/flow.css +++ b/web/gui/src/main/webapp/app/view/flow/flow.css @@ -64,10 +64,20 @@ #flow-details-panel h2 { display: inline-block; margin: 8px 0; + font-size: 16pt; + font-weight: lighter; +} + +#flow-details-panel h3 { + display: inline-block; + margin: 8px 0; + font-size: 11pt; + font-variant: small-caps; + text-transform: uppercase; } #flow-details-panel .top-content table { - font-size: 12pt; + font-size: 10pt; } #flow-details-panel td.label { 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 71794bd14b..4392d425cf 100644 --- a/web/gui/src/main/webapp/app/view/flow/flow.js +++ b/web/gui/src/main/webapp/app/view/flow/flow.js @@ -30,8 +30,6 @@ pHeight, top, topTable, - trtDiv, - selDiv, topSelTable, topTrtTable, iconDiv, @@ -39,7 +37,7 @@ // constants var topPdg = 28, - wtPdg = 532, + wtPdg = 400, pName = 'flow-details-panel', detailsReq = 'flowDetailsRequest', @@ -59,7 +57,8 @@ 'appId', 'groupId', - 'timeout', + 'idleTimeout', + 'hardTimeout', 'permanent', ], friendlyProps = [ @@ -76,7 +75,8 @@ 'App ID', 'Group ID', - 'Timeout', + 'Idle Timeout', + 'Hard Timeout', 'Permanent', ]; @@ -112,16 +112,12 @@ .append('table'); top.append('hr'); - selDiv = container.append('div').classed('top', true); - selDiv.append('h2').text('Selector'); - topSelTable = selDiv.append('div').classed('top-content', true) - .append('table'); - selDiv.append('hr'); + top.append('h3').text('Selector'); + topSelTable = top.append('div').classed('top-content', true).append('table'); + top.append('hr'); - trtDiv = container.append('div').classed('top', true); - trtDiv.append('h2').text('Treatment'); - topTrtTable = trtDiv.append('div').classed('top-content', true) - .append('table'); + top.append('h3').text('Treatment'); + topTrtTable = top.append('div').classed('top-content', true).append('table'); } function addProp(tbody, label, value) {