Simon Hunt

ONOS-1477 - GUI -- Added glyphs to nav menu.

Change-Id: Ifacd5d389bdc2bb5adc61182b8329de9e2557af2
......@@ -66,9 +66,10 @@ public class UiView {
}
}
private final Category category;
private final String id;
private final String label;
private final Category category;
private final String iconId;
/**
* Creates a new user interface view descriptor. The navigation item
......@@ -79,9 +80,24 @@ public class UiView {
* @param label view label
*/
public UiView(Category category, String id, String label) {
this(category, id, label, null);
}
/**
* Creates a new user interface view descriptor. The navigation item
* will appear in the navigation menu under the specified category,
* with the specified icon adornment.
*
* @param category view category
* @param id view identifier
* @param label view label
* @param iconId icon id
*/
public UiView(Category category, String id, String label, String iconId) {
this.category = category;
this.id = id;
this.label = label;
this.iconId = iconId;
}
/**
......@@ -111,6 +127,15 @@ public class UiView {
return label;
}
/**
* Returns the icon ID.
*
* @return icon ID
*/
public String iconId() {
return iconId;
}
@Override
public int hashCode() {
return Objects.hash(id);
......@@ -134,6 +159,7 @@ public class UiView {
.add("category", category)
.add("id", id)
.add("label", label)
.add("iconId", iconId)
.toString();
}
}
......
......@@ -51,7 +51,9 @@ public class MainNavResource extends AbstractInjectionResource {
private static final String HDR_FORMAT =
"<div class=\"nav-hdr\">%s</div>\n";
private static final String NAV_FORMAT =
"<a ng-click=\"navCtrl.hideNav()\" href=\"#/%s\">%s</a>\n";
"<a ng-click=\"navCtrl.hideNav()\" href=\"#/%s\">%s %s</a>\n";
private static final String BLANK_GLYPH = "unknown";
@GET
@Produces(MediaType.TEXT_HTML)
......@@ -110,7 +112,12 @@ public class MainNavResource extends AbstractInjectionResource {
private void addCatItems(StringBuilder sb, List<UiView> catViews) {
for (UiView view : catViews) {
sb.append(String.format(NAV_FORMAT, view.id(), view.label()));
sb.append(String.format(NAV_FORMAT, view.id(), icon(view), view.label()));
}
}
private String icon(UiView view) {
String gid = view.iconId() == null ? BLANK_GLYPH : view.iconId();
return "<div icon icon-id=\"" + gid + "\"></div>";
}
}
......
......@@ -62,14 +62,16 @@ public class UiExtensionManager implements UiExtensionService, SpriteService {
// Creates core UI extension
private static UiExtension createCoreExtension() {
List<UiView> coreViews = of(new UiView(PLATFORM, "app", "Applications"),
new UiView(PLATFORM, "cluster", "Cluster Nodes"),
new UiView(NETWORK, "topo", "Topology"),
new UiView(NETWORK, "device", "Devices"),
List<UiView> coreViews = of(
new UiView(PLATFORM, "app", "Applications", "nav_apps"),
new UiView(PLATFORM, "cluster", "Cluster Nodes", "nav_cluster"),
new UiView(NETWORK, "topo", "Topology", "nav_topo"),
new UiView(NETWORK, "device", "Devices", "nav_devs"),
new UiViewHidden("flow"),
new UiView(NETWORK, "link", "Links"),
new UiView(NETWORK, "host", "Hosts"),
new UiView(NETWORK, "intent", "Intents"));
new UiView(NETWORK, "link", "Links", "nav_links"),
new UiView(NETWORK, "host", "Hosts", "nav_hosts"),
new UiView(NETWORK, "intent", "Intents", "nav_intents")
);
UiMessageHandlerFactory messageHandlerFactory =
() -> ImmutableList.of(
......
......@@ -56,7 +56,7 @@
text-decoration: none;
font-size: 14pt;
display: block;
padding: 8px 16px 6px 16px;
padding: 8px 16px 6px 12px;
}
.light #nav a {
......@@ -75,3 +75,12 @@
background-color: #777;
}
#nav a div {
display: inline-block;
vertical-align: middle;
padding-right: 4px;
}
#nav a div svg.embeddedIcon g.icon .glyph {
fill: #c66;
}
......
......@@ -47,7 +47,15 @@
hostIcon_endstation: 'endstation',
hostIcon_router: 'router',
hostIcon_bgpSpeaker: 'bgpSpeaker'
hostIcon_bgpSpeaker: 'bgpSpeaker',
nav_apps: 'bird',
nav_cluster: 'node',
nav_topo: 'unknown', // TODO: need a topology glyph
nav_devs: 'switch',
nav_links: 'ports',
nav_hosts: 'endstation',
nav_intents: 'relatedIntents'
};
function ensureIconLibDefs() {
......