Commit 4e15160904952bfbda05d78fa022d6c07a8b2dd8
1 parent
eec4f5a4
UI: Add dashboard logo sanitizer url; Added dashboard logo cache
Showing
1 changed file
with
15 additions
and
4 deletions
@@ -128,6 +128,7 @@ import { | @@ -128,6 +128,7 @@ import { | ||
128 | DashboardImageDialogComponent, | 128 | DashboardImageDialogComponent, |
129 | DashboardImageDialogData, DashboardImageDialogResult | 129 | DashboardImageDialogData, DashboardImageDialogResult |
130 | } from '@home/components/dashboard-page/dashboard-image-dialog.component'; | 130 | } from '@home/components/dashboard-page/dashboard-image-dialog.component'; |
131 | +import { DomSanitizer, SafeUrl } from '@angular/platform-browser'; | ||
131 | 132 | ||
132 | // @dynamic | 133 | // @dynamic |
133 | @Component({ | 134 | @Component({ |
@@ -211,7 +212,8 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | @@ -211,7 +212,8 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | ||
211 | 212 | ||
212 | addingLayoutCtx: DashboardPageLayoutContext; | 213 | addingLayoutCtx: DashboardPageLayoutContext; |
213 | 214 | ||
214 | - logo = 'assets/logo_title_white.svg'; | 215 | + private dashboardLogoCache: SafeUrl; |
216 | + private defaultDashboardLogo = 'assets/logo_title_white.svg'; | ||
215 | 217 | ||
216 | dashboardCtx: DashboardContext = { | 218 | dashboardCtx: DashboardContext = { |
217 | instanceId: this.utils.guid(), | 219 | instanceId: this.utils.guid(), |
@@ -312,7 +314,8 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | @@ -312,7 +314,8 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | ||
312 | private ngZone: NgZone, | 314 | private ngZone: NgZone, |
313 | private overlay: Overlay, | 315 | private overlay: Overlay, |
314 | private viewContainerRef: ViewContainerRef, | 316 | private viewContainerRef: ViewContainerRef, |
315 | - private cd: ChangeDetectorRef) { | 317 | + private cd: ChangeDetectorRef, |
318 | + private sanitizer: DomSanitizer) { | ||
316 | super(store); | 319 | super(store); |
317 | 320 | ||
318 | } | 321 | } |
@@ -413,6 +416,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | @@ -413,6 +416,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | ||
413 | private reset() { | 416 | private reset() { |
414 | this.dashboard = null; | 417 | this.dashboard = null; |
415 | this.dashboardConfiguration = null; | 418 | this.dashboardConfiguration = null; |
419 | + this.dashboardLogoCache = undefined; | ||
416 | this.prevDashboard = null; | 420 | this.prevDashboard = null; |
417 | 421 | ||
418 | this.widgetEditMode = false; | 422 | this.widgetEditMode = false; |
@@ -570,8 +574,12 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | @@ -570,8 +574,12 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | ||
570 | } | 574 | } |
571 | } | 575 | } |
572 | 576 | ||
573 | - public get dashboardLogo(): string { | ||
574 | - return this.dashboard.configuration.settings.dashboardLogoUrl || this.logo; | 577 | + public get dashboardLogo(): SafeUrl { |
578 | + if (!this.dashboardLogoCache) { | ||
579 | + const logo = this.dashboard.configuration.settings.dashboardLogoUrl || this.defaultDashboardLogo; | ||
580 | + this.dashboardLogoCache = this.sanitizer.bypassSecurityTrustUrl(logo); | ||
581 | + } | ||
582 | + return this.dashboardLogoCache; | ||
575 | } | 583 | } |
576 | 584 | ||
577 | public showRightLayoutSwitch(): boolean { | 585 | public showRightLayoutSwitch(): boolean { |
@@ -702,6 +710,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | @@ -702,6 +710,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | ||
702 | }).afterClosed().subscribe((data) => { | 710 | }).afterClosed().subscribe((data) => { |
703 | if (data) { | 711 | if (data) { |
704 | this.dashboard.configuration.settings = data.settings; | 712 | this.dashboard.configuration.settings = data.settings; |
713 | + this.dashboardLogoCache = undefined; | ||
705 | const newGridSettings = data.gridSettings; | 714 | const newGridSettings = data.gridSettings; |
706 | if (newGridSettings) { | 715 | if (newGridSettings) { |
707 | const layout = this.dashboard.configuration.states[layoutKeys.state].layouts[layoutKeys.layout]; | 716 | const layout = this.dashboard.configuration.states[layoutKeys.state].layouts[layoutKeys.layout]; |
@@ -855,11 +864,13 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | @@ -855,11 +864,13 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC | ||
855 | if (this.widgetEditMode) { | 864 | if (this.widgetEditMode) { |
856 | if (revert) { | 865 | if (revert) { |
857 | this.dashboard = this.prevDashboard; | 866 | this.dashboard = this.prevDashboard; |
867 | + this.dashboardLogoCache = undefined; | ||
858 | } | 868 | } |
859 | } else { | 869 | } else { |
860 | this.resetHighlight(); | 870 | this.resetHighlight(); |
861 | if (revert) { | 871 | if (revert) { |
862 | this.dashboard = this.prevDashboard; | 872 | this.dashboard = this.prevDashboard; |
873 | + this.dashboardLogoCache = undefined; | ||
863 | this.dashboardConfiguration = this.dashboard.configuration; | 874 | this.dashboardConfiguration = this.dashboard.configuration; |
864 | this.dashboardCtx.dashboardTimewindow = this.dashboardConfiguration.timewindow; | 875 | this.dashboardCtx.dashboardTimewindow = this.dashboardConfiguration.timewindow; |
865 | this.entityAliasesUpdated(); | 876 | this.entityAliasesUpdated(); |