ExternalVendorCode/gns3-web-ui
1
0
Fork 0
mirror of https://github.com/GNS3/gns3-web-ui.git synced 2025-01-20 11:38:59 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Fix for template component

Browse Source
This commit is contained in:
piotrpekala7 2021-05-14 12:26:33 +02:00
parent 350ed9a4aa
commit c8f1a4d428
3 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/app/components/template/template.component.html
View File

@ -43,25 +43,25 @@
<span *ngIf="i % 4 === 0" class="templateRow"> <span *ngIf="i % 4 === 0" class="templateRow">
<span class="templateIcon"> <span class="templateIcon">
<div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i])"> <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i])">
<img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i]) | authImage: server | async" /> <img class="image" alt="Image" [src]="getImageSourceForTemplate(filteredTemplates[i])" />
</div> </div>
<div class="templateText">{{ filteredTemplates[i].name }}</div> <div class="templateText">{{ filteredTemplates[i].name }}</div>
</span> </span>
<span *ngIf="filteredTemplates[i + 1]" class="templateIcon"> <span *ngIf="filteredTemplates[i + 1]" class="templateIcon">
<div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 1])"> <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 1])">
<img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 1]) | authImage: server | async" /> <img class="image" alt="Image" [src]="getImageSourceForTemplate(filteredTemplates[i + 1])" />
</div> </div>
<div class="templateText">{{ filteredTemplates[i + 1].name }}</div> <div class="templateText">{{ filteredTemplates[i + 1].name }}</div>
</span> </span>
<span *ngIf="filteredTemplates[i + 2]" class="templateIcon"> <span *ngIf="filteredTemplates[i + 2]" class="templateIcon">
<div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 2])"> <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 2])">
<img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 2]) | authImage: server | async" /> <img class="image" alt="Image" [src]="getImageSourceForTemplate(filteredTemplates[i + 2])" />
</div> </div>
<div class="templateText">{{ filteredTemplates[i + 2].name }}</div> <div class="templateText">{{ filteredTemplates[i + 2].name }}</div>
</span> </span>
<span *ngIf="filteredTemplates[i + 3]" class="templateIcon"> <span *ngIf="filteredTemplates[i + 3]" class="templateIcon">
<div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 3])"> <div mwlDraggable (dragStart)="dragStart($event)" (dragEnd)="dragEnd($event, filteredTemplates[i + 3])">
<img class="image" [src]="getImageSourceForTemplate(filteredTemplates[i + 3]) | authImage: server | async" /> <img class="image" alt="Image" [src]="getImageSourceForTemplate(filteredTemplates[i + 3])" />
</div> </div>
<div class="templateText">{{ filteredTemplates[i + 3].name }}</div> <div class="templateText">{{ filteredTemplates[i + 3].name }}</div>
</span> </span>

8
src/app/components/template/template.component.ts
View File

@ -8,6 +8,7 @@ import { MapScaleService } from '../../services/mapScale.service';
import { SymbolService } from '../../services/symbol.service'; import { SymbolService } from '../../services/symbol.service';
import { TemplateService } from '../../services/template.service'; import { TemplateService } from '../../services/template.service';
import { NodeAddedEvent, TemplateListDialogComponent } from './template-list-dialog/template-list-dialog.component'; import { NodeAddedEvent, TemplateListDialogComponent } from './template-list-dialog/template-list-dialog.component';
import { DomSanitizer } from '@angular/platform-browser';
@Component({ @Component({
selector: 'app-template', selector: 'app-template',
@ -49,7 +50,8 @@ export class TemplateComponent implements OnInit, OnDestroy {
private dialog: MatDialog, private dialog: MatDialog,
private templateService: TemplateService, private templateService: TemplateService,
private scaleService: MapScaleService, private scaleService: MapScaleService,
private symbolService: SymbolService private symbolService: SymbolService,
private domSanitizer: DomSanitizer
) {} ) {}
ngOnInit() { ngOnInit() {
@ -127,7 +129,9 @@ export class TemplateComponent implements OnInit, OnDestroy {
} }
getImageSourceForTemplate(template: Template) { getImageSourceForTemplate(template: Template) {
return this.symbolService.getSymbolFromTemplate(this.server, template); let symbol = this.symbolService.getSymbolFromTemplate(template);
if (symbol) return this.domSanitizer.bypassSecurityTrustUrl(`data:image/svg+xml;base64,${btoa(symbol.raw)}`);
return this.domSanitizer.bypassSecurityTrustUrl('data:image/svg+xml;base64,');
} }
ngOnDestroy() { ngOnDestroy() {

4
src/app/services/symbol.service.ts
View File

@ -59,8 +59,8 @@ export class SymbolService {
return this.httpServer.getText(server, `/symbols/${encoded_uri}/raw`); return this.httpServer.getText(server, `/symbols/${encoded_uri}/raw`);
} }
getSymbolFromTemplate(server: Server, template: Template) { getSymbolFromTemplate(template: Template) {
return `${server.protocol}//${server.host}:${server.port}/v3/symbols/${template.symbol}/raw`; return this.symbols.find((symbol: Symbol) => symbol.filename === template.symbol.split('/')[2]);
} }
} }