GUI2 Added in support for custom glyphs
Change-Id: If082b6e5727c278022ed3a72035878098e031611
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/nav/nav.service.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/nav/nav.service.ts
index 98de228..f5d5156 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/nav/nav.service.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/nav/nav.service.ts
@@ -73,6 +73,13 @@
} else if (uiView.cat === 'NETWORK') {
if ( uiView.id !== 'topo') {
this.uiNetworkViews.push(uiView);
+ } else {
+ this.uiNetworkViews.push(<UiView>{
+ id: 'topo2',
+ icon: 'nav_topo',
+ cat: 'NETWORK',
+ label: uiView.label
+ });
}
} else if (uiView.cat === 'HIDDEN') {
this.uiHiddenViews.push(uiView);
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/remote/websocket.service.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/remote/websocket.service.ts
index 2a254b4..93020f0 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/remote/websocket.service.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/remote/websocket.service.ts
@@ -41,10 +41,16 @@
m_uiAttached: boolean;
}
+interface Glyph {
+ id: string;
+ viewbox: string;
+ path: string;
+}
+
interface Bootstrap {
user: string;
clusterNodes: ClusterNode[];
- glyphs: any[]; // TODO: narrow this down to a known type
+ glyphs: Glyph[];
}
interface ErrorData {
@@ -76,7 +82,7 @@
private url; // web socket URL
private clusterNodes: ClusterNode[] = []; // ONOS instances data for failover
private clusterIndex = -1; // the instance to which we are connected
- private glyphs = [];
+ private glyphs: Glyph[] = [];
private connectRetries: number = 0; // limit our attempts at reconnecting
// A map of registered Callbacks for websocket open()
@@ -103,7 +109,7 @@
});
this.glyphs = data.glyphs;
const glyphsMap = new Map<string, string>([]);
- this.glyphs.forEach((d, i) => {
+ this.glyphs.forEach((d) => {
glyphsMap.set('_' + d.id, d.viewbox);
glyphsMap.set(d.id, d.path);
this.gs.registerGlyphs(glyphsMap);
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/glyphdata.service.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/glyphdata.service.ts
index 3703243..a3cbb43 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/glyphdata.service.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/glyphdata.service.ts
@@ -17,10 +17,13 @@
import { LogService } from '../log.service';
-// --- ONOS logo glyph ------------------------------------
-
+/**
+ * ONOS logo glyph
+ *
+ * TODO: Some major refactoring needs to go on here to make this more understandable
+ */
export const logos = new Map<string, string>([
- [ '_bird', '352 224 113 112'],
+ [ '_bird', '352 224 113 112'], // viewbox of bird - next is the bird path
[ 'bird', 'M427.7,300.4 c-6.9,0.6-13.1,5-19.2,7.1c-18.1,6.2-33.9,' +
'9.1-56.5,4.7c24.6,17.2,36.6,13,63.7,0.1c-0.5,0.6-0.7,1.3-1.3,' +
'1.9c1.4-0.4,2.4-1.7,3.4-2.2c-0.4,0.7-0.9,1.5-1.4,1.9c2.2-0.6,' +
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon.service.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon.service.ts
index 766cc56..f2497f7 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon.service.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon.service.ts
@@ -246,7 +246,11 @@
* @param iconCls The icon class as a string
*/
loadIconDef(iconCls: string): void {
- this.gs.loadDefs(this.ensureIconLibDefs(), [glyphMapping.get(iconCls)], true);
+ let glyphName: string = glyphMapping.get(iconCls);
+ if (!glyphName) {
+ glyphName = iconCls;
+ }
+ this.gs.loadDefs(this.ensureIconLibDefs(), [glyphName], true);
this.log.debug('icon definition', iconCls, 'added to defs');
}
diff --git a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon/icon.component.ts b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon/icon.component.ts
index ad8d382..db28914 100644
--- a/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon/icon.component.ts
+++ b/web/gui2-fw-lib/projects/gui2-fw-lib/src/lib/svg/icon/icon.component.ts
@@ -73,6 +73,11 @@
* @returns The iconTag corresponding to the iconId of this instance
*/
iconTag(): string {
- return '#' + glyphMapping.get(this.iconId);
+ const iconIdStr: string = glyphMapping.get(this.iconId);
+ if (iconIdStr) {
+ return '#' + iconIdStr;
+ } else {
+ return '#' + this.iconId;
+ }
}
}