Option to upload image for appliance added

This commit is contained in:
piotrpekala7 2020-06-18 16:50:31 +02:00
parent 300e710341
commit b8e2bb00ac
3 changed files with 56 additions and 2 deletions

View File

@ -142,7 +142,14 @@
{{image.filename}}
</div>
<div>
<button class="button" mat-raised-button (click)="importImage(image)">Import</button>
<input
type="file"
class="non-visible"
#file2
(change)="importImage($event)"
ng2FileSelect
[uploader]="uploaderImage"/>
<button class="button" mat-raised-button (click)="file2.click()">Import</button>
<button class="button" mat-raised-button color="primary" (click)="downloadImage(image)">Download</button>
</div>
</div>

View File

@ -50,6 +50,8 @@
.create-button {
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
}
.radio-button {

View File

@ -4,7 +4,7 @@ import { Server } from '../../../models/server';
import { Node } from '../../../cartography/models/node';
import { Project } from '../../../models/project';
import { ApplianceService } from '../../../services/appliances.service';
import { Appliance } from '../../../models/appliance';
import { Appliance, Image } from '../../../models/appliance';
import { animate, state, style, transition, trigger } from '@angular/animations';
import { FileUploader, FileItem, ParsedResponseHeaders } from 'ng2-file-upload';
import { ToasterService } from '../../../services/toaster.service';
@ -29,6 +29,7 @@ export class NewTemplateDialogComponent implements OnInit {
@Input() project: Project;
uploader: FileUploader;
uploaderImage: FileUploader;
public action: string = 'install';
public actionTitle: string = 'Install appliance from server';
@ -94,6 +95,19 @@ export class NewTemplateDialogComponent implements OnInit {
this.uploader.onSuccessItem = (item: FileItem, response: string, status: number, headers: ParsedResponseHeaders) => {
this.toasterService.success('Appliance imported succesfully');
};
this.uploaderImage = new FileUploader({});
this.uploaderImage.onAfterAddingFile = file => {
file.withCredentials = false;
};
this.uploaderImage.onErrorItem = (item: FileItem, response: string, status: number, headers: ParsedResponseHeaders) => {
this.toasterService.error('An error has occured');
};
this.uploaderImage.onSuccessItem = (item: FileItem, response: string, status: number, headers: ParsedResponseHeaders) => {
this.toasterService.success('Image imported succesfully');
};
}
addAppliance(event): void {
@ -192,6 +206,37 @@ export class NewTemplateDialogComponent implements OnInit {
dialogRef.componentInstance.appliance = object;
}
importImage(event) {
let name = event.target.files[0].name.split('-')[0];
let fileName = event.target.files[0].name;
let file = event.target.files[0];
let fileReader: FileReader = new FileReader();
let emulator;
fileReader.onloadend = () => {
let appliance = JSON.parse(fileReader.result as string);
if (appliance.docker) emulator = 'docker';
if (appliance.dynamips) emulator = 'dynamips';
if (appliance.iou) emulator = 'iou';
if (appliance.qemu) emulator = 'qemu';
const url = this.applianceService.getUploadPath(this.server, emulator, fileName);
this.uploader.queue.forEach(elem => (elem.url = url));
const itemToUpload = this.uploader.queue[0];
(itemToUpload as any).options.disableMultipart = true;
this.uploader.uploadItem(itemToUpload);
};
fileReader.readAsText(file);
}
downloadImage(image: Image) {
window.open(image.download_url);
}
create() {
}