GUI2 Bug fixes to Topo view
Change-Id: Ib40279fec94ffecb1d6c771aa376ad1cded03c02
diff --git a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.html b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.html
index 8a5e1b5..35c3fd4 100644
--- a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.html
+++ b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.html
@@ -67,7 +67,7 @@
overlaid on the above. This is the blue box, and its width and height does
not change
-->
- <svg:rect x="-16" y="-16" width="32" height="32" style="fill: url(#diagonal_blue)">
+ <svg:rect x="-16" y="-16" width="32" height="32" [ngStyle]="{'fill': panelColour(0)}">
</svg:rect>
<svg:path *ngIf="device.location && device.location.locType != 'none'"
d="M-15 12 v3 h5" style="stroke: white; stroke-width: 1; fill: none"></svg:path>
diff --git a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.spec.ts b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.spec.ts
index b490605..b2f0592 100644
--- a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.spec.ts
+++ b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.spec.ts
@@ -16,7 +16,7 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { DeviceNodeSvgComponent } from './devicenodesvg.component';
-import {IconService, LogService} from 'gui2-fw-lib';
+import {FnService, IconService, LogService} from 'gui2-fw-lib';
import {ActivatedRoute, Params} from '@angular/router';
import {of} from 'rxjs';
import {ChangeDetectorRef} from '@angular/core';
@@ -35,9 +35,11 @@
}
describe('DeviceNodeSvgComponent', () => {
+ let fs: FnService;
let logServiceSpy: jasmine.SpyObj<LogService>;
let component: DeviceNodeSvgComponent;
let fixture: ComponentFixture<DeviceNodeSvgComponent>;
+ let windowMock: Window;
let ar: MockActivatedRoute;
let testDevice: Device;
@@ -48,6 +50,19 @@
testDevice = new Device('test:1');
testDevice.online = true;
+ windowMock = <any>{
+ location: <any>{
+ hostname: 'foo',
+ host: 'foo',
+ port: '80',
+ protocol: 'http',
+ search: { debug: 'true' },
+ href: 'ws://foo:123/onos/ui/websock/path',
+ absUrl: 'ws://foo:123/onos/ui/websock/path'
+ }
+ };
+ fs = new FnService(ar, logSpy, windowMock);
+
TestBed.configureTestingModule({
imports: [ BrowserAnimationsModule ],
declarations: [ DeviceNodeSvgComponent ],
@@ -55,7 +70,8 @@
{ provide: LogService, useValue: logSpy },
{ provide: ActivatedRoute, useValue: ar },
{ provide: ChangeDetectorRef, useClass: ChangeDetectorRef },
- { provide: IconService, useClass: MockIconService }
+ { provide: IconService, useClass: MockIconService },
+ { provide: 'Window', useValue: windowMock },
]
})
.compileComponents();
diff --git a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.ts b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.ts
index 90bd2d3..d40f413 100644
--- a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.ts
+++ b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/devicenodesvg/devicenodesvg.component.ts
@@ -23,7 +23,7 @@
SimpleChanges,
} from '@angular/core';
import {Device, LabelToggle, UiElement} from '../../models';
-import {IconService, LocMeta, LogService, MetaUi, ZoomUtils} from 'gui2-fw-lib';
+import {IconService, LocMeta, LogService, MetaUi, SvgUtilService, ZoomUtils} from 'gui2-fw-lib';
import {NodeVisual, SelectedEvent} from '../nodevisual';
import {animate, state, style, transition, trigger} from '@angular/animations';
import {LocationType} from '../../../backgroundsvg/backgroundsvg.component';
@@ -73,6 +73,7 @@
constructor(
protected log: LogService,
private is: IconService,
+ protected sus: SvgUtilService,
private ref: ChangeDetectorRef
) {
super();
@@ -131,4 +132,12 @@
return 'm_' + this.device.type;
}
}
+
+ /**
+ * Get a colour for the banner of the nth panel
+ * @param idx The index of the panel (0-6)
+ */
+ panelColour(idx: number): string {
+ return this.sus.cat7().getColor(idx, false, '');
+ }
}
diff --git a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/linksvg/linksvg.component.ts b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/linksvg/linksvg.component.ts
index 9853889..85ef536 100644
--- a/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/linksvg/linksvg.component.ts
+++ b/web/gui2-topo-lib/projects/gui2-topo-lib/src/lib/layer/forcesvg/visuals/linksvg/linksvg.component.ts
@@ -71,11 +71,14 @@
this.highlighted = hl.css;
this.label = hl.label;
this.isHighlighted = true;
- setTimeout(() => {
- this.isHighlighted = false;
- this.highlighted = '';
- this.ref.markForCheck();
- }, 4990);
+ this.log.debug('Link hightlighted', hl);
+ if (hl.fadems > 0) {
+ setTimeout(() => {
+ this.isHighlighted = false;
+ this.highlighted = '';
+ this.ref.markForCheck();
+ }, hl.fadems);
+ }
}