import { SharedService } from 'SharedService';
import { ProjectRoleMappings, UserDetail } from 'UserModel';
import { VimAccountDetails } from 'VimAccountModel';
-import { VNFDDetails } from 'VNFDModel';
import { VNFInstanceDetails } from 'VNFInstanceModel';
/**
/** Get all the projects @public */
public getUserAccessedProjects(): void {
- this.projectService.getUserProjects().subscribe((projects: UserDetail) => {
+ this.projectService.getUserProjects().subscribe((projects: UserDetail): void => {
const projectList: {}[] = projects.project_role_mappings;
this.projectList = projectList.filter(
- (thing: ProjectRoleMappings, i: number, arr: []) => arr
- .findIndex((t: ProjectRoleMappings) => t.project_name === thing.project_name) === i
+ (thing: ProjectRoleMappings, i: number, arr: []): boolean => arr
+ .findIndex((t: ProjectRoleMappings): boolean => t.project_name === thing.project_name) === i
);
- }, (error: Error) => {
+ }, (error: Error): void => {
// TODO: Handle failure
});
}
/** Fetching all the Project in dashboard @public */
public getAllProjects(): void {
this.isProjectsLoadingResults = true;
- this.restService.getResource(environment.PROJECTS_URL).subscribe((projectsData: ProjectDetails[]) => {
+ this.restService.getResource(environment.PROJECTS_URL).subscribe((projectsData: ProjectDetails[]): void => {
this.allProjectList = [];
- projectsData.forEach((projectData: ProjectDetails) => {
+ projectsData.forEach((projectData: ProjectDetails): void => {
const projectDataObj: ProjectData = this.generateProjectData(projectData);
this.allProjectList.push(projectDataObj);
});
this.isProjectsLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
this.isProjectsLoadingResults = false;
});
/** Function to check admin privilege @public */
public checkAdminPrivilege(): void {
if (!this.isAdmin) {
- this.projectService.getCurrentProjectDetails().subscribe((projectDetails: {}) => {
+ this.projectService.getCurrentProjectDetails().subscribe((projectDetails: {}): void => {
this.currentProjectDetails = projectDetails;
- }, (error: Error) => {
+ }, (error: Error): void => {
// TODO: Handle failure
});
}
/** Get VNFD Package details @public */
public getVnfdPackageCount(): void {
this.vnfdPackageCountSub = this.restService.getResource(environment.VNFPACKAGESCONTENT_URL)
- .subscribe((vnfdPackageData: VNFDDetails[]) => {
+ .subscribe((vnfdPackageData: []): void => {
this.vnfdPackageCount = vnfdPackageData.length;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
}
/** Get NSD Package details @public */
public getNsdPackageCount(): void {
this.nsdPackageCountSub = this.restService.getResource(environment.NSDESCRIPTORSCONTENT_URL)
- .subscribe((nsdPackageData: NSDDetails[]) => {
+ .subscribe((nsdPackageData: NSDDetails[]): void => {
this.nsdPackageCount = nsdPackageData.length;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
}
public getNsInstanceCount(): void {
this.isCanvasLoadingResults = true;
this.nsInstanceCountSub = this.restService.getResource(environment.NSDINSTANCES_URL)
- .subscribe((nsInstancesData: NSInstanceDetails[]) => {
+ .subscribe((nsInstancesData: NSInstanceDetails[]): void => {
this.nsInstancesDataArr = nsInstancesData;
this.nsInstanceCount = nsInstancesData.length;
this.nsInstanceChart();
this.isCanvasLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
this.isCanvasLoadingResults = false;
});
/** Get NS Instance chart details @public */
public nsInstanceChart(): void {
- this.nsInstancesDataArr.forEach((nsdInstanceData: NSDDetails) => {
+ this.nsInstancesDataArr.forEach((nsdInstanceData: NSDDetails): void => {
const operationalStatus: string = nsdInstanceData['operational-status'];
const configStatus: string = nsdInstanceData['config-status'];
if (operationalStatus === 'failed' || configStatus === 'failed') {
});
const now: Date = new Date();
const currentTime: number = Number((now.getTime().toString().slice(0, this.sliceLimit)));
- this.createdTimes.forEach((createdTime: string) => {
+ this.createdTimes.forEach((createdTime: string): void => {
this.noOfHours.push((Math.round((currentTime - Number(createdTime)) / this.hourConverter)));
});
this.drawNsChart();
/** Get VNFD instance details @public */
public getVnfInstanceCount(): void {
this.vnfInstanceCountSub = this.restService.getResource(environment.NSDINSTANCES_URL)
- .subscribe((vnfInstanceData: VNFInstanceDetails[]) => {
+ .subscribe((vnfInstanceData: VNFInstanceDetails[]): void => {
this.vnfInstanceCount = vnfInstanceData.length;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
}
/** Get VIM account details @public */
public getVimAccountCount(): void {
this.vimAccountCountSub = this.restService.getResource(environment.VIMACCOUNTS_URL)
- .subscribe((vimAccountData: VimAccountDetails[]) => {
+ .subscribe((vimAccountData: VimAccountDetails[]): void => {
this.vimAccountCount = vimAccountData.length;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
}
/** Get SDN Controller Count @public */
public getSDNControllerCount(): void {
this.sdnControllerCountSub = this.restService.getResource(environment.SDNCONTROLLER_URL)
- .subscribe((sdnControllerData: SDNControllerModel[]) => {
+ .subscribe((sdnControllerData: SDNControllerModel[]): void => {
this.sdnControllerCount = sdnControllerData.length;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
}
this.generateTableColumn();
this.generateTableSettings();
this.generateData();
- this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
+ this.generateDataSub = this.sharedService.dataEvent.subscribe((): void => { this.generateData(); });
}
/** Generate smart table row title and filters @public */
/** generateData initiate the ns-instance list @public */
public generateData(): void {
this.isLoadingResults = true;
- this.restService.getResource(environment.NSDINSTANCES_URL).subscribe((nsdInstancesData: NSInstanceDetails[]) => {
+ this.restService.getResource(environment.NSDINSTANCES_URL).subscribe((nsdInstancesData: NSInstanceDetails[]): void => {
this.nsInstanceData = [];
- nsdInstancesData.forEach((nsdInstanceData: NSInstanceDetails) => {
+ nsdInstancesData.forEach((nsdInstanceData: NSInstanceDetails): void => {
const nsDataObj: NSDInstanceData = {
name: nsdInstanceData.name,
identifier: nsdInstanceData.id,
OperationalStatus: nsdInstanceData['operational-status'],
ConfigStatus: nsdInstanceData['config-status'],
DetailedStatus: nsdInstanceData['detailed-status'],
- memberIndex: nsdInstanceData.nsd['constituent-vnfd'],
+ memberIndex: nsdInstanceData.nsd.df,
nsConfig: nsdInstanceData.nsd['ns-configuration']
};
this.nsInstanceData.push(nsDataObj);
} else {
this.checkDataClass = 'dataTables_empty';
}
- this.dataSource.load(this.nsInstanceData).then((data: {}) => {
+ this.dataSource.load(this.nsInstanceData).then((data: {}): void => {
this.isLoadingResults = false;
}).catch();
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
this.isLoadingResults = false;
});
/** Instantiate NS using modalservice @public */
public instantiateNS(): void {
const modalRef: NgbModalRef = this.modalService.open(InstantiateNsComponent, { backdrop: 'static' });
- modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
if (result) {
this.generateData();
}
</div>
</div>
<div class="form-group row" *ngIf="primitiveType === 'VNF_Primitive' || primitiveType === 'VDU_Primitive' || primitiveType === 'KDU_Primitive'">
- <label class="col-sm-4 col-form-label">VNF {{'MEMBERINDEX' | translate}}*</label>
+ <label class="col-sm-4 col-form-label">VNF Profile ID *</label>
<div class="col-sm-3">
- <ng-select (change)="indexChange($event, primitiveType)" [clearable]="false" placeholder="{{'SELECT' | translate}}" [items]="params.memberIndex" bindLabel="member-vnf-index" bindValue="member-vnf-index" formControlName="vnf_member_index" id="vnf_member_index"
- [ngClass]="{ 'is-invalid': submitted && f.vnf_member_index.errors }"></ng-select>
+ <ng-select (change)="indexChange($event, primitiveType)" [clearable]="false" placeholder="{{'SELECT' | translate}}" [items]="params.memberIndex[0]['vnf-profile']" bindLabel="id" bindValue="id" formControlName="member_vnf_index" id="member_vnf_index"
+ [ngClass]="{ 'is-invalid': submitted && f.member_vnf_index.errors }"></ng-select>
</div>
</div>
<div class="form-group row" *ngIf="primitiveType === 'VDU_Primitive'">
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { TranslateService } from '@ngx-translate/core';
import { NotifierService } from 'angular-notifier';
-import { APIURLHEADER, ERRORDATA, URLPARAMS } from 'CommonModel';
+import { APIURLHEADER, ERRORDATA, PRIMITIVEDATA, PRIMITIVETYPES, URLPARAMS } from 'CommonModel';
import { DataService } from 'DataService';
import { environment } from 'environment';
-import { KDUPRIMITIVELEVEL, NSData, VDUPRIMITIVELEVEL } from 'NSDModel';
+import { KDUPRIMITIVELEVEL, NSData, VDUPRIMITIVELEVEL, VNFPROFILE } from 'NSDModel';
import { NSPrimitiveParams } from 'NSInstanceModel';
import { RestService } from 'RestService';
import { SharedService } from 'SharedService';
import { isNullOrUndefined } from 'util';
+import { CONFIGPRIMITIVE, DF, VDUCONFIG, VDUPROFILE, VNFCONFIG, VNFD } from 'VNFDModel';
/**
* Creating component
public primitiveList: {}[];
/** Contains objects that is used to hold types of primitive @public */
- public primitiveTypeList: {}[] = [];
+ public primitiveTypeList: PRIMITIVETYPES[] = [];
/** Model value used to hold selected primitive type @public */
public primitiveType: string;
/** Contains list of VDU primitive lists @public */
- public vduList: {}[];
+ public vduList: VDUPROFILE[];
/** Contains list of KDU primitive lists @public */
public kduList: {}[];
];
}
+ /** convenience getter for easy access to form fields */
+ get f(): FormGroup['controls'] { return this.primitiveForm.controls; }
+
/**
* Lifecyle Hooks the trigger before component is instantiate
*/
public ngOnInit(): void {
/** Setting up initial value for NSD */
- this.dataService.currentMessage.subscribe((event: NSData) => {
+ this.dataService.currentMessage.subscribe((event: NSData): void => {
if (event.identifier !== undefined || event.identifier !== '' || event.identifier !== null) {
this.nsdId = event.identifier;
}
this.initializeForm();
}
- /** convenience getter for easy access to form fields */
- get f(): FormGroup['controls'] { return this.primitiveForm.controls; }
-
/** initialize Forms @public */
public initializeForm(): void {
this.primitiveForm = this.formBuilder.group({
primitive: [null, [Validators.required]],
- vnf_member_index: [null, [Validators.required]],
+ member_vnf_index: [null, [Validators.required]],
vdu_id: [null, [Validators.required]],
kdu_name: [null, [Validators.required]],
primitive_params: this.formBuilder.array([this.primitiveParamsBuilder()])
this.objectPrimitiveParams = {};
this.sharedService.cleanForm(this.primitiveForm);
if (this.primitiveForm.invalid) { return; } // Proceed, onces form is valid
- this.primitiveForm.value.primitive_params.forEach((params: NSPrimitiveParams) => {
+ this.primitiveForm.value.primitive_params.forEach((params: NSPrimitiveParams): void => {
if (params.primitive_params_name !== null && params.primitive_params_value !== '') {
this.objectPrimitiveParams[params.primitive_params_name] = params.primitive_params_value;
}
};
if (this.primitiveType === 'VNF_Primitive') {
// tslint:disable-next-line: no-string-literal
- primitiveParamsPayLoads['vnf_member_index'] = this.primitiveForm.value.vnf_member_index;
+ primitiveParamsPayLoads['member_vnf_index'] = this.primitiveForm.value.member_vnf_index;
}
if (this.primitiveType === 'VDU_Primitive') {
// tslint:disable-next-line: no-string-literal
- primitiveParamsPayLoads['vnf_member_index'] = this.primitiveForm.value.vnf_member_index;
+ primitiveParamsPayLoads['member_vnf_index'] = this.primitiveForm.value.member_vnf_index;
// tslint:disable-next-line: no-string-literal
primitiveParamsPayLoads['vdu_id'] = this.primitiveForm.value.vdu_id;
}
if (this.primitiveType === 'KDU_Primitive') {
// tslint:disable-next-line: no-string-literal
- primitiveParamsPayLoads['vnf_member_index'] = this.primitiveForm.value.vnf_member_index;
+ primitiveParamsPayLoads['member_vnf_index'] = this.primitiveForm.value.member_vnf_index;
// tslint:disable-next-line: no-string-literal
primitiveParamsPayLoads['kdu_name'] = this.primitiveForm.value.kdu_name;
}
url: environment.NSDINSTANCES_URL + '/' + this.nsdId + '/action'
};
this.isLoadingResults = true;
- this.restService.postResource(apiURLHeader, primitiveParamsPayLoads).subscribe((result: {}) => {
+ this.restService.postResource(apiURLHeader, primitiveParamsPayLoads).subscribe((result: {}): void => {
this.activeModal.dismiss();
this.notifierService.notify('success', this.translateService.instant('PAGE.NSPRIMITIVE.EXECUTEDSUCCESSFULLY'));
this.isLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
this.restService.handleError(error, 'post');
});
}
/** Primitive type change event @public */
- public primitiveTypeChange(data: { value: string }): void {
+ public primitiveTypeChange(data: PRIMITIVETYPES): void {
this.primitiveList = [];
this.primitiveParameter = [];
this.initializeForm();
if (data.value === 'NS_Primitive') {
this.getNSInfo(this.params.name);
- this.setUpdateValueandValidation('vnf_member_index');
+ this.setUpdateValueandValidation('member_vnf_index');
}
if (data.value === 'VNF_Primitive' || data.value === 'KDU_Primitive' || data.value === 'NS_Primitive') {
this.setUpdateValueandValidation('vdu_id');
}
}
/** Member index change event */
- public indexChange(data: {}, getType?: string): void {
+ public indexChange(data: VNFPROFILE, getType?: string): void {
this.getFormControl('vdu_id').setValue(null);
this.getFormControl('kdu_name').setValue(null);
- if (data) {
- this.getVnfdInfo(data['vnfd-id-ref'], getType);
+ if (data['vnfd-id'] !== null) {
+ this.getVnfdInfo(data['vnfd-id'], getType);
} else {
this.primitiveList = [];
this.getFormControl('primitive').setValue(null);
this.primitiveList = data[selectedType + '-configuration']['config-primitive'];
}
/** Primivtive change event */
- public primitiveChange(data: { parameter: {}[] }): void {
+ public primitiveChange(data: PRIMITIVEDATA): void {
this.primitiveParameter = [];
const formArr: FormArray = this.getFormControl('primitive_params') as FormArray;
formArr.controls = [];
}
}
/** Generate vdu section @public */
- public generateVDUData(vduData: VDUPRIMITIVELEVEL): VDUPRIMITIVELEVEL {
+ public generateVDUData(vduData: VDUPROFILE, vduConfig: VDUCONFIG[]): VDUPROFILE {
+ const getVDUConfig: VDUCONFIG = vduConfig.filter((itemData: VDUCONFIG): boolean =>
+ itemData.id === vduData['vdu-configuration-id'])[0];
return {
id: vduData.id,
- name: vduData.name,
- 'vdu-configuration': vduData['vdu-configuration']
+ name: vduData.id,
+ 'vdu-configuration': getVDUConfig
};
}
/** Generate kdu section @public */
this.getFormControl(formName).updateValueAndValidity();
}
/** Update primitive value based on parameter */
- private updatePrimitive(primitive: { parameter: {}[] }): void {
+ private updatePrimitive(primitive: PRIMITIVEDATA): void {
if (primitive.parameter) {
this.primitiveParameter = primitive.parameter;
} else {
this.primitiveParameter = [];
const formArr: AbstractControl[] = this.getControls();
- formArr.forEach((formGp: FormGroup) => {
+ formArr.forEach((formGp: FormGroup): void => {
formGp.controls.primitive_params_name.setValidators([]);
formGp.controls.primitive_params_name.updateValueAndValidity();
formGp.controls.primitive_params_value.setValidators([]);
this.primitiveList = [];
this.primitiveParameter = [];
this.getFormControl('primitive').setValue(null);
- const apiUrl: string = environment.VNFPACKAGES_URL + '?short-name=' + vnfdRef;
+ const apiUrl: string = environment.VNFPACKAGES_URL + '?product-name=' + vnfdRef;
this.isLoadingResults = true;
this.restService.getResource(apiUrl)
- .subscribe((vnfdInfo: {}) => {
- if (vnfdInfo[0]['vnf-configuration'] !== undefined && vnfdInfo[0]['vnf-configuration']) {
+ .subscribe((vnfdInfo: VNFD[]): void => {
+ const vnfInstances: VNFD = vnfdInfo[0];
+ if (!isNullOrUndefined(vnfInstances.df) && !isNullOrUndefined(vnfInstances['vnf-configuration'])) {
this.getFormControl('vdu_id').setValidators([]);
this.getFormControl('kdu_name').setValidators([]);
- this.primitiveList = vnfdInfo[0]['vnf-configuration']['config-primitive'];
+ vnfInstances.df.forEach((df: DF): void => {
+ if (df['vnf-configuration-id'] !== undefined) {
+ const vnfprimitiveList: VNFCONFIG = vnfInstances['vnf-configuration']
+ .filter((itemData: VNFCONFIG): boolean => itemData.id === df['vnf-configuration-id'])[0];
+ this.primitiveList = vnfprimitiveList['config-primitive'];
+ }
+ });
}
if (getType === 'VDU_Primitive') {
this.kduList = [];
this.vduList = [];
this.primitiveList = [];
- if (!isNullOrUndefined(vnfdInfo[0].vdu)) {
- vnfdInfo[0].vdu.forEach((vduData: VDUPRIMITIVELEVEL) => {
- if (vduData['vdu-configuration']) {
- const vduDataObj: VDUPRIMITIVELEVEL = this.generateVDUData(vduData);
- this.vduList.push(vduDataObj);
+ if (!isNullOrUndefined(vnfInstances.df) && !isNullOrUndefined(vnfInstances['vdu-configuration'])) {
+ vnfInstances.df.forEach((df: DF): void => {
+ if (df['vdu-profile'] !== undefined) {
+ df['vdu-profile'].forEach((element: VDUPROFILE): void => {
+ const vduDataObj: VDUPROFILE = this.generateVDUData(element, vnfInstances['vdu-configuration']);
+ this.vduList.push(vduDataObj);
+ });
}
});
}
this.kduList = [];
this.vduList = [];
this.primitiveList = [];
- if (!isNullOrUndefined(vnfdInfo[0].kdu)) {
- vnfdInfo[0].kdu.forEach((kduData: KDUPRIMITIVELEVEL) => {
+ if (!isNullOrUndefined(vnfInstances.kdu)) {
+ vnfInstances.kdu.forEach((kduData: KDUPRIMITIVELEVEL): void => {
if (kduData['kdu-configuration']) {
const kduDataObj: KDUPRIMITIVELEVEL = this.generateKDUData(kduData);
this.kduList.push(kduDataObj);
}
}
this.isLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
this.restService.handleError(error, 'get');
});
this.primitiveList = [];
this.primitiveParameter = [];
this.getFormControl('primitive').setValue(null);
- const apiUrl: string = environment.NSDESCRIPTORS_URL + '?short-name=' + nsdRef;
+ const apiUrl: string = environment.NSDESCRIPTORS_URL + '?name=' + nsdRef;
this.isLoadingResults = true;
this.restService.getResource(apiUrl)
- .subscribe((nsdInfo: {}) => {
+ .subscribe((nsdInfo: {}): void => {
if (!isNullOrUndefined(nsdInfo[0]['ns-configuration'])) {
this.primitiveList = !isNullOrUndefined(nsdInfo[0]['ns-configuration']['config-primitive']) ?
nsdInfo[0]['ns-configuration']['config-primitive'] : [];
this.primitiveList = [];
}
this.isLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
this.restService.handleError(error, 'get');
});
<div class="col-12 p-0">
<table class="table table-bordered text-dark custom-table">
<tbody>
- <tr>
- <td>short-name</td>
- <td>{{(virtualLink.shortName)?virtualLink.shortName:'-'}}</td>
- </tr>
<tr>
<td>Name</td>
<td>{{(virtualLink.name)?virtualLink.name:'-'}}</td>
import * as d3 from 'd3';
import { environment } from 'environment';
import * as HttpStatus from 'http-status-codes';
-import { VNFDCONNECTIONPOINTREF } from 'NSDModel';
+import { CCI, DF, VLC, VNFPROFILE } from 'NSDModel';
import { COMPOSERNODES, CONNECTIONPOINT, NSD, NSDVLD, NSINFO, NSInstanceDetails, NSINSTANCENODES, VLINFO, VNFRINFO } from 'NSInstanceModel';
import { GRAPHDETAILS, Tick, TickPath } from 'NSTopologyModel';
import { RestService } from 'src/services/RestService';
this.force.stop();
}
this.forceSimulationActive = alreadyFixedIsActive;
- this.nodes.forEach((d: COMPOSERNODES) => {
+ this.nodes.forEach((d: COMPOSERNODES): void => {
d.fx = (alreadyFixedIsActive) ? null : d.x;
d.fy = (alreadyFixedIsActive) ? null : d.y;
});
}
/** Prepare all the information for node creation @private */
private generateData(): void {
- this.restService.getResource(environment.NSINSTANCESCONTENT_URL + '/' + this.nsIdentifier).subscribe((nsData: NSInstanceDetails) => {
- this.nsData = nsData;
- this.nsInfo = {
- nsInstanceID: nsData._id,
- nsName: nsData.name,
- nsOperationalStatus: nsData['operational-status'],
- nsConfigStatus: nsData['config-status'],
- nsDetailedStatus: nsData['detailed-status'],
- nsResourceOrchestrator: nsData['resource-orchestrator']
- };
- if (this.nsData['constituent-vnfr-ref'] !== undefined) {
- this.generateVNFRCPNodes();
- }
- if (this.nsData.vld !== undefined) {
- this.generateVLDNetworkNodes();
- }
- setTimeout(() => {
- this.pushAllNodes();
- this.generateVNFDCP();
- this.generateVLDCP();
+ this.restService.getResource(environment.NSINSTANCESCONTENT_URL + '/' + this.nsIdentifier)
+ .subscribe((nsData: NSInstanceDetails): void => {
+ this.nsData = nsData;
+ this.nsInfo = {
+ nsInstanceID: nsData._id,
+ nsName: nsData.name,
+ nsOperationalStatus: nsData['operational-status'],
+ nsConfigStatus: nsData['config-status'],
+ nsDetailedStatus: nsData['detailed-status'],
+ nsResourceOrchestrator: nsData['resource-orchestrator']
+ };
+ if (this.nsData['constituent-vnfr-ref'] !== undefined) {
+ this.generateVNFRCPNodes();
+ }
+ if (this.nsData.vld !== undefined) {
+ this.generateVLDNetworkNodes();
+ }
+ setTimeout((): void => {
+ this.pushAllNodes();
+ this.generateVNFDCP();
+ this.generateVLDCP();
+ this.isLoadingResults = false;
+ this.createNode(this.nodes, this.links);
+ }, this.TIMEOUT);
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
- this.createNode(this.nodes, this.links);
- }, this.TIMEOUT);
- }, (error: ERRORDATA) => {
- this.isLoadingResults = false;
- if (error.error.status === HttpStatus.NOT_FOUND || error.error.status === HttpStatus.UNAUTHORIZED) {
- this.router.navigateByUrl('404', { skipLocationChange: true }).catch();
- } else {
- this.restService.handleError(error, 'get');
- }
- });
+ if (error.error.status === HttpStatus.NOT_FOUND || error.error.status === HttpStatus.UNAUTHORIZED) {
+ this.router.navigateByUrl('404', { skipLocationChange: true }).catch();
+ } else {
+ this.restService.handleError(error, 'get');
+ }
+ });
}
-
/** Fetching all the VNFR Information @private */
private generateVNFRCPNodes(): void {
- this.nsData['constituent-vnfr-ref'].forEach((vnfdrID: string) => {
- this.restService.getResource(environment.VNFINSTANCES_URL + '/' + vnfdrID).subscribe((vndfrDetail: NSD) => {
+ this.nsData['constituent-vnfr-ref'].forEach((vnfdrID: string): void => {
+ this.restService.getResource(environment.VNFINSTANCES_URL + '/' + vnfdrID).subscribe((vndfrDetail: NSD): void => {
this.nodes.push({
id: vndfrDetail['vnfd-ref'] + ':' + vndfrDetail['member-vnf-index-ref'],
nodeTypeRef: 'vnfd',
cp: vndfrDetail['connection-point'],
vdur: vndfrDetail.vdur,
- vld: vndfrDetail.vld,
nsID: vndfrDetail['nsr-id-ref'],
vnfdID: vndfrDetail['vnfd-id'],
vimID: vndfrDetail['vim-account-id'],
selectorId: 'nsInst-' + vndfrDetail.id
});
// Fetching all the connection point of VNF & Interface
- vndfrDetail['connection-point'].forEach((cp: CONNECTIONPOINT) => {
+ vndfrDetail['connection-point'].forEach((cp: CONNECTIONPOINT): void => {
this.nodes.push({
id: cp.name + ':' + vndfrDetail['member-vnf-index-ref'],
vndfCPRef: vndfrDetail['vnfd-ref'] + ':' + vndfrDetail['member-vnf-index-ref'],
name: cp.name
});
});
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
});
}
-
/** Fetching all the VLD/Network Information @private */
private generateVLDNetworkNodes(): void {
this.nsdData = this.nsData.nsd;
- this.nsdData.vld.forEach((ref: NSDVLD) => {
+ this.nsdData['virtual-link-desc'].forEach((ref: NSDVLD): void => {
this.nodes.push({
id: ref.id,
nodeTypeRef: 'vld',
- name: ref.name,
+ name: ref.id,
type: ref.type,
- vnfdCP: ref['vnfd-connection-point-ref'],
+ vnfdCP: this.nsdData.df,
vimNetworkName: ref['vim-network-name'],
- shortName: ref['short-name'],
selectorId: 'nsInst-' + ref.id
});
});
}
-
/** Pushing connection points of path/links nodes @private */
private pushAllNodes(): void {
- this.nodes.forEach((nodeList: NSINSTANCENODES) => {
+ this.nodes.forEach((nodeList: NSINSTANCENODES): void => {
if (nodeList.nodeTypeRef === 'vnfd') {
this.vnfdNodes.push(nodeList);
} else if (nodeList.nodeTypeRef === 'vld') {
}
});
}
-
/** Get CP position based on vndf @private */
private generateVNFDCP(): void {
- this.vnfdNodes.forEach((list: NSINSTANCENODES) => {
- const vndfPos: number = this.nodes.map((e: NSINSTANCENODES) => { return e.id; }).indexOf(list.id);
+ this.vnfdNodes.forEach((list: NSINSTANCENODES): void => {
+ const vndfPos: number = this.nodes.map((e: NSINSTANCENODES): string => { return e.id; }).indexOf(list.id);
this.cpCount = 0;
- this.nodes.forEach((res: NSINSTANCENODES) => {
+ this.nodes.forEach((res: NSINSTANCENODES): void => {
if (res.nodeTypeRef === 'cp' && res.vndfCPRef === list.id) {
this.links.push({ source: this.nodes[vndfPos], target: this.nodes[this.cpCount] });
}
});
});
}
-
/** Get CP position based on vld @private */
private generateVLDCP(): void {
let vldPos: number = 0;
- this.vldNodes.forEach((list: NSINSTANCENODES) => {
+ this.vldNodes.forEach((list: NSINSTANCENODES): void => {
if (!isNullOrUndefined(list.vnfdCP)) {
- list.vnfdCP.forEach((cpRef: VNFDCONNECTIONPOINTREF) => {
- this.cpCount = 0;
- this.nodes.forEach((res: NSINSTANCENODES) => {
- if (res.nodeTypeRef === 'cp' && res.id === cpRef['vnfd-connection-point-ref'] + ':' + cpRef['member-vnf-index-ref']) {
- this.links.push({ source: this.nodes[vldPos], target: this.nodes[this.cpCount] });
- }
- this.cpCount++;
+ list.vnfdCP.forEach((cpRef: DF): void => {
+ cpRef['vnf-profile'].forEach((vnfProfile: VNFPROFILE): void => {
+ vnfProfile['virtual-link-connectivity'].forEach((resultVLC: VLC, index: number): void => {
+ resultVLC['constituent-cpd-id'].forEach((resultCCI: CCI): void => {
+ this.cpCount = 0;
+ this.nodes.forEach((res: NSINSTANCENODES): void => {
+ if (res.nodeTypeRef === 'cp' &&
+ res.id === resultCCI['constituent-cpd-id'] + ':' + resultCCI['constituent-base-element-id']) {
+ this.links.push({ source: this.nodes[vldPos], target: this.nodes[this.cpCount] });
+ }
+ this.cpCount++;
+ });
+ });
+ });
});
});
vldPos++;
}
});
}
-
/** Node is created and render at D3 region @private */
private createNode(nodes: NSINSTANCENODES[], links: {}[]): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
d3.selectAll('svg#graphContainer > *').remove();
- d3.select(window).on('keydown', () => { this.keyDown(); });
- d3.select(window).on('keyup', () => { this.keyUp(); });
+ d3.select(window).on('keydown', (): void => { this.keyDown(); });
+ d3.select(window).on('keyup', (): void => { this.keyUp(); });
this.svg = d3.select('#graphContainer')
.attr('oncontextmenu', 'return false;')
.attr('width', graphContainerAttr.width)
.attr('height', graphContainerAttr.height);
this.force = d3.forceSimulation()
.force('charge', d3.forceManyBody().strength(graphContainerAttr.strength))
- .force('link', d3.forceLink().id((d: TickPath) => d.id).distance(graphContainerAttr.distance))
+ .force('link', d3.forceLink().id((d: TickPath): string => d.id).distance(graphContainerAttr.distance))
.force('center', d3.forceCenter(graphContainerAttr.width / graphContainerAttr.forcex,
graphContainerAttr.height / graphContainerAttr.forcey))
.force('x', d3.forceX(graphContainerAttr.width / graphContainerAttr.forcex))
.force('y', d3.forceY(graphContainerAttr.height / graphContainerAttr.forcey))
- .on('tick', () => { this.tick(); });
+ .on('tick', (): void => { this.tick(); });
// handles to link and node element groups
this.path = this.svg.append('svg:g').selectAll('path');
this.network = this.svg.append('svg:g').selectAll('network');
this.circle = this.svg.append('svg:g').selectAll('circle');
this.restart(nodes, links);
}
-
/** Update force layout (called automatically each iteration) @private */
private tick(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
// draw directed edges with proper padding from node centers
- this.path.attr('class', 'link').attr('d', (d: Tick) => {
+ this.path.attr('class', 'link').attr('d', (d: Tick): string => {
const deltaX: number = d.target.x - d.source.x;
const deltaY: number = d.target.y - d.source.y;
const dist: number = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
const targetY: number = d.target.y - (targetPadding * normY);
return `M${sourceX},${sourceY}L${targetX},${targetY}`;
});
- this.network.attr('transform', (t: TickPath) => `translate(${t.x},${t.y})`);
- this.square.attr('transform', (t: TickPath) => `translate(${t.x},${t.y})`);
- this.circle.attr('transform', (t: TickPath) => `translate(${t.x},${t.y})`);
+ this.network.attr('transform', (t: TickPath): string => `translate(${t.x},${t.y})`);
+ this.square.attr('transform', (t: TickPath): string => `translate(${t.x},${t.y})`);
+ this.circle.attr('transform', (t: TickPath): string => `translate(${t.x},${t.y})`);
}
-
/** Update graph (called when needed) @private */
private restart(nodes: NSINSTANCENODES[], links: {}[]): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
this.path = this.path.data(links);
const vnfdNodes: {}[] = []; const vldNodes: {}[] = []; const cpNodes: {}[] = []; // NB: Nodes are known by id, not by index!
- nodes.forEach((nodeList: NSINSTANCENODES) => {
+ nodes.forEach((nodeList: NSINSTANCENODES): void => {
if (nodeList.nodeTypeRef === 'vnfd') { vnfdNodes.push(nodeList); }
else if (nodeList.nodeTypeRef === 'vld') { vldNodes.push(nodeList); }
else if (nodeList.nodeTypeRef === 'cp') { cpNodes.push(nodeList); }
});
- this.square = this.square.data(vnfdNodes, (d: { id: number }) => d.id);
- this.network = this.network.data(vldNodes, (d: { id: number }) => d.id);
- this.circle = this.circle.data(cpNodes, (d: { id: number }) => d.id);
+ this.square = this.square.data(vnfdNodes, (d: COMPOSERNODES): string => d.id);
+ this.network = this.network.data(vldNodes, (d: COMPOSERNODES): string => d.id);
+ this.circle = this.circle.data(cpNodes, (d: COMPOSERNODES): string => d.id);
this.resetAndCreateNodes();
this.force.nodes(nodes).force('link').links(links); //Set the graph in motion
this.force.alphaTarget(graphContainerAttr.alphaTarget).restart();
}
-
/** Rest and create nodes @private */
private resetAndCreateNodes(): void {
this.path.exit().remove();
this.path = gPath.merge(this.path);
this.circle = this.gCircle.merge(this.circle);
}
-
/** Events handles when Shift Click to perform create cp @private */
// tslint:disable-next-line: no-any
private singleClick(nodeSelected: any, d: COMPOSERNODES): void {
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: COMPOSERNODES) => { return d.selectorId; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.selectorId; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/VNFD.svg')
- .on('click', (d: COMPOSERNODES) => { this.singleClick(this.gSquare, d); this.onNodeClickToggleSidebar(); });
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.gSquare, d); this.onNodeClickToggleSidebar(); });
this.gSquare.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: COMPOSERNODES) => d.id);
+ .text((d: COMPOSERNODES): string => d.id);
}
-
/** Settings all the network attributes of nodes @private */
private getgNetwork(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: COMPOSERNODES) => { return d.selectorId; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.selectorId; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/VL.svg')
- .on('click', (d: COMPOSERNODES) => { this.singleClick(this.gNetwork, d); this.onNodeClickToggleSidebar(); });
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.gNetwork, d); this.onNodeClickToggleSidebar(); });
this.gNetwork.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: COMPOSERNODES) => d.name);
+ .text((d: COMPOSERNODES): string => d.name);
}
-
/** Settings all the connection point attributes of nodes @private */
private getgCircle(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
+ .call(this.onDragDrop())
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/CP.svg');
this.gCircle.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: COMPOSERNODES) => d.name);
+ .text((d: COMPOSERNODES): string => d.name);
+ }
+ /** drag event @private */
+ // tslint:disable-next-line: no-any
+ private onDragDrop(): any {
+ return d3.drag().filter(this.dragFilter)
+ .on('start', this.dragstarted)
+ .on('drag', this.dragged)
+ .on('end', this.dragended);
}
-
/** Key press event @private */
private keyDown(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
this.svg.classed('ctrl', false);
}
}
+ /** Events handles when to drag using filter for the keys @private */
+ private dragFilter(): boolean {
+ return d3.event.ctrlKey && !d3.event.button;
+ }
/** Events handles when dragstarted @private */
private dragstarted(d: COMPOSERNODES): void {
d.fx = d.x;
this.isLoadingResults = true;
this.restService.getResource(environment.VNFINSTANCES_URL).subscribe((vnfInstancesData: VNFInstanceDetails[]) => {
this.vnfInstanceData = [];
- vnfInstancesData.forEach((vnfInstanceData: VNFInstanceDetails) => {
+ vnfInstancesData.forEach((vnfInstanceData: VNFInstanceDetails): void => {
const vnfDataObj: {} =
{
VNFD: vnfInstanceData['vnfd-ref'],
Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
-->
-<span class="d-none px-3 py-2 text-center text-bold bg-primary text-white">Here is a newer {{'APPVERSION' | translate}} {{PACKAGEVERSION}}
- of OSM!</span>
+<span [ngClass]="toShowNewTag ? 'd-block': 'd-none'" class="px-3 py-2 text-center text-bold bg-secondary text-white">
+ {{'NEWVERSIONTAG' | translate:{appVersion: sharedService.osmVersion} }}
+ <button type="button" class="close closeVersion" aria-label="Close" (click)="closeVersion();">
+ <i class="fas fa-times text-white"></i>
+ </button>
+</span>
<nav class="navbar navbar-expand-md sticky-top bg-white" role="navigation">
<a class="navbar-brand">
- <img routerLink="/" src="assets/images/logo.png" class="osm-logo"
- alt="OPEN SOURCE MANO" draggable="false">
+ <img routerLink="/" src="assets/images/logo.png" class="osm-logo" alt="OPEN SOURCE MANO" draggable="false">
</a>
<div class="nav navbar-nav nav-flex-icons ml-auto">
<ul class="navbar-nav cursor-pointer" ngbDropdown display="dynamic" placement="bottom-right">
<i class="fas fa-sign-out-alt"></i>
</a>
<div class="custom-divider"></div>
- <a *ngIf="sharedService.osmVersion" ngbDropdownItem class="dropdown-item project-item osm-version" href="javascript:void(0);">
+ <a *ngIf="sharedService.osmVersion" ngbDropdownItem class="dropdown-item project-item osm-version"
+ href="javascript:void(0);">
<span>{{'OSMVERSION' | translate}} {{sharedService.osmVersion}}</span>
</a>
</div>
import { ProjectService } from 'ProjectService';
import { Observable } from 'rxjs';
import { SharedService } from 'SharedService';
-import { ProjectRoleMappings, UserDetail } from 'UserModel';
import { UserSettingsComponent } from 'UserSettingsComponent';
/**
/** Contains all methods related to shared @public */
public sharedService: SharedService;
+ /** Property contains to show new version tag shared @public */
+ public toShowNewTag: Boolean = false;
+
/** Utilizes auth service for any auth operations @private */
private authService: AuthenticationService;
public ngOnInit(): void {
this.isAdmin = (localStorage.getItem('isAdmin') === 'true') ? true : false;
this.selectedProject = this.authService.ProjectName;
- this.authService.ProjectName.subscribe((projectNameFinal: string) => {
+ this.authService.ProjectName.subscribe((projectNameFinal: string): void => {
this.getSelectedProject = projectNameFinal;
});
this.username$ = this.authService.username;
this.projectService.setHeaderProjects();
this.projectList$ = this.projectService.projectList;
this.PACKAGEVERSION = environment.packageVersion;
+ const getLocalStorageVersion: string = localStorage.getItem('osmVersion');
+ if (getLocalStorageVersion === null) {
+ this.showNewVersion();
+ } else if (getLocalStorageVersion !== this.sharedService.osmVersion) {
+ this.showNewVersion();
+ }
}
/** Logout function @public */
this.authService.logout();
}
+ /** Show Version function @public */
+ public showNewVersion(): void {
+ this.toShowNewTag = true;
+ }
+
+ /** Close Version and add in local storage @public */
+ public closeVersion(): void {
+ this.toShowNewTag = false;
+ localStorage.setItem('osmVersion', this.sharedService.osmVersion);
+ }
+
/** Implementation of model for UserSettings options.@public */
public userSettings(): void {
this.modalService.open(UserSettingsComponent, { backdrop: 'static' });
public generateColumns(): void {
this.columnLists = {
name: { title: this.translateService.instant('NAME'), width: '15%', sortDirection: 'asc' },
- identifier: { title: this.translateService.instant('IDENTIFIER'), width: '30%' },
+ identifier: { title: this.translateService.instant('IDENTIFIER'), width: '15%' },
+ version: { title: this.translateService.instant('VERSION'), width: '10%' },
+ designer: { title: this.translateService.instant('DESIGNER'), width: '15%' },
description: { title: this.translateService.instant('DESCRIPTION'), width: '25%' },
- version: { title: this.translateService.instant('VERSION'), width: '15%' },
Actions: {
- name: 'Actions', width: '15%', filter: false, sort: false, type: 'custom',
+ name: 'Actions', width: '20%', filter: false, sort: false, type: 'custom',
title: this.translateService.instant('ACTIONS'),
valuePrepareFunction: (cell: NSData, row: NSData): NSData => row, renderComponent: NsPackagesActionComponent
}
name: nsdpackagedata.name,
identifier: nsdpackagedata._id,
description: nsdpackagedata.description,
- version: nsdpackagedata.version
+ version: nsdpackagedata.version,
+ designer: nsdpackagedata.designer !== undefined ? nsdpackagedata.designer : '-'
};
}
<div class="col-12 p-0">
<form autocomplete="off">
<div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'SHORTNAME' | translate }}</label>
+ <label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
<div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="{{ 'SHORTNAME' | translate }}" name="shortName"
- [(ngModel)]="vnfdPackageDetails.shortName">
+ <input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
+ [(ngModel)]="nsPackageDetails.id">
</div>
</div>
<div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'VENDOR' | translate }}</label>
+ <label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
<div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="{{ 'VENDOR' | translate }}" name="vendor"
- [(ngModel)]="vnfdPackageDetails.vendor">
+ <input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
+ [(ngModel)]="nsPackageDetails.name">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'DESCRIPTION' | translate }}</label>
<div class="col-sm-8 p-0">
- <textarea type="text" class="form-control" placeholder="{{ 'DESCRIPTION' | translate }}"
- name="description" [(ngModel)]="vnfdPackageDetails.description"></textarea>
+ <textarea rows="5" cols="50" class="form-control" placeholder="{{ 'DESCRIPTION' | translate }}"
+ name="description" [(ngModel)]="nsPackageDetails.description"></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'VERSION' | translate }}</label>
<div class="col-sm-8 p-0">
<input type="text" class="form-control" placeholder="{{ 'VERSION' | translate }}" name="version"
- [(ngModel)]="vnfdPackageDetails.version">
+ [(ngModel)]="nsPackageDetails.version">
</div>
</div>
<div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
+ <label class="col-sm-4 col-form-label">{{ 'DESIGNER' | translate }}</label>
<div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
- [(ngModel)]="vnfdPackageDetails.id">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
- <div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
- [(ngModel)]="vnfdPackageDetails.name">
+ <input type="text" class="form-control" placeholder="{{ 'DESIGNER' | translate }}" name="designer"
+ [(ngModel)]="nsPackageDetails.designer">
</div>
</div>
<button type="button" class="btn btn-primary" (click)="saveNSD()" placement="top"
<div class="col-12 p-0">
<form autocomplete="off">
<div class="form-group row">
- <label class="col-sm-4 p-0 col-form-label">{{ 'NAME' | translate }}</label>
+ <label class="col-sm-4 p-0 col-form-label">{{ 'ID' | translate }}</label>
<div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
- [(ngModel)]="vlDetails.name">
+ <input type="text" readonly class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
+ [(ngModel)]="virtualLinkDesc.id">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 p-0 col-form-label">{{'PAGE.NSPACKAGE.NSCOMPOSE.MGMTNETWORK' | translate}}</label>
<div class="col-sm-8 p-0">
- <select class="form-control custom-select" name="mgmt-network" [(ngModel)]="vlDetails['mgmt-network']">
+ <select class="form-control custom-select" name="mgmt-network" [(ngModel)]="virtualLinkDesc['mgmt-network']">
<option [value]="true">True</option>
<option [value]="false">False</option>
</select>
</div>
</div>
- <div class="form-group row">
- <label class="col-sm-4 p-0 col-form-label">{{'PAGE.NSPACKAGE.NSCOMPOSE.VIMNETWORKNAME' | translate}}</label>
- <div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="Vim network name" name="vim-network-name"
- [(ngModel)]="vlDetails['vim-network-name']">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 p-0 col-form-label">{{'TYPE' | translate}}</label>
- <div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="Type" name="type" [(ngModel)]="vlDetails.type">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 p-0 col-form-label">{{ 'ID' | translate }}</label>
- <div class="col-sm-8 p-0">
- <input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
- [(ngModel)]="vlDetails.id">
- </div>
- </div>
<button type="button" class="btn btn-primary" placement="top" ngbTooltip="Save"
- (click)="saveVL(vlDetails.id)">
+ (click)="saveVL(virtualLinkDesc.id)">
<i class="fas fa-save"></i> {{'SAVE' | translate}}
</button>
</form>
<table class="table table-bordered text-dark custom-table">
<tbody>
<tr>
- <td>{{'PAGE.NSPACKAGE.NSCOMPOSE.MEMBER-VNF-INDEX' | translate}}</td>
- <td>{{ vnfData['member-vnf-index'] }}</td>
+ <th scope="row">id</th>
+ <td>{{ vnfData.id }}</td>
</tr>
<tr>
- <td>{{'PAGE.NSPACKAGE.NSCOMPOSE.VNFD-ID-REF' | translate}}</td>
- <td>{{ vnfData['vnfd-id-ref'] }}</td>
+ <th scope="row">vnfd-id</th>
+ <td>{{ vnfData['vnfd-id'] }}</td>
</tr>
</tbody>
</table>
<table class="table table-bordered text-dark custom-table">
<tbody>
<tr>
- <td>{{'PAGE.NSPACKAGE.NSCOMPOSE.VLD-ID' | translate}}</td>
- <td>{{ vlDetails['name'] }}</td>
+ <th scope="row">id</th>
+ <td>{{ vnfData.id }}</td>
+ </tr>
+ <tr>
+ <th scope="row">vnfd-id</th>
+ <td>{{ vnfData['vnfd-id'] }}</td>
</tr>
<tr>
- <td>{{'PAGE.NSPACKAGE.NSCOMPOSE.VNFD-CP-REF' | translate}}</td>
- <td>{{ cpData['vnfd-connection-point-ref'] }}</td>
+ <th scope="row">constituent-base-element-id</th>
+ <td>{{ cpData['constituent-base-element-id'] }}</td>
</tr>
<tr>
- <td>{{'MEMBERINDEX' | translate}}</td>
- <td>{{ cpData['member-vnf-index-ref'] }}</td>
+ <th scope="row">constituent-cpd-id</th>
+ <td>{{ cpData['constituent-cpd-id'] }}</td>
</tr>
<tr>
- <td>{{'PAGE.NSPACKAGE.NSCOMPOSE.VNFD-ID-REF' | translate}}</td>
- <td>{{ cpData['vnfd-id-ref'] }}</td>
+ <th scope="row">virtual-link-profile-id</th>
+ <td>{{ virtualLinkProfileID }}</td>
</tr>
</tbody>
</table>
<ul class="list-group list-group-flush dragable scroll-box">
<li id="list['id']" class="list-group-item" draggable="true" (dragstart)="drag($event)"
[attr.data-id]="list['id']" *ngFor="let list of vnfList" placement="top"
- container="body" ngbTooltip="{{ list['short-name'] }}">
+ container="body" ngbTooltip="{{ list['product-name'] }}">
<img src="assets/images/VNFD.svg" class="ns-svg" draggable="false"/>
- <span class="span-overflow-text font-weight-bold">{{ list['short-name'] }}</span>
+ <span class="span-overflow-text font-weight-bold">{{ list['product-name'] }}</span>
<span class="drag-icon pull-right"><i class="fas fa-arrows-alt"></i></span>
</li>
</ul>
/**
* @file NS Compose Component
*/
-// tslint:disable: no-increment-decrement
import { HttpHeaders } from '@angular/common/http';
import { Component, ElementRef, Injector, ViewChild, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { environment } from 'environment';
import * as HttpStatus from 'http-status-codes';
import * as jsyaml from 'js-yaml';
-import { COMPOSERNODES, CONSTITUENTVNFD, GRAPHDETAILS, NSDDetails, Tick, TickPath, VLD, VNFDCONNECTIONPOINTREF } from 'NSDModel';
+import {
+ CCI,
+ COMPOSERNODES,
+ DF,
+ GRAPHDETAILS,
+ NSData,
+ NSDATACREATION,
+ NSDDetails,
+ Tick, TickPath, VLC, VLD, VNFPROFILE
+} from 'NSDModel';
import { RestService } from 'RestService';
import { SharedService } from 'SharedService';
import { isNullOrUndefined } from 'util';
-import { VNFData, VNFDDetails } from 'VNFDModel';
+import { VNFD, VNFData } from 'VNFDModel';
/**
* Creating component
/** dataService to pass the data from one component to another @public */
public dataService: DataService;
/** Contains VNFD Informations @public */
- public vnfdPackageDetails: VNFData = { identifier: '', shortName: '', vendor: '', description: '', version: '', id: '', name: '' };
+ public nsPackageDetails: NSData = { id: '', name: '', description: '', version: '', designer: '' };
/** Contains VL Details @public */
- public vlDetails: VLD = {
- name: '',
- 'mgmt-network': true,
- 'vim-network-name': '',
- type: '',
- id: ''
+ public virtualLinkDesc: VLD = {
+ id: '',
+ 'mgmt-network': true
};
/** Contains the information of the type of modification @public */
public putType: string;
/** Contains the node information of VNF @public */
public vnfNodes: {}[] = [];
/** contains the VNF Details @public */
- public vnfData: CONSTITUENTVNFD;
+ public vnfData: VNFPROFILE;
+ /** contains the Virtual Link connectivity Details @public */
+ public virtualLinkProfileID: string;
/** Need to show the VNF Details @public */
public isShowVNFDetails: boolean = false;
/** Contains the node information of CP @public */
public cpNodes: {}[] = [];
/** Need to show the CP Details */
- public cpData: VNFDCONNECTIONPOINTREF;
+ public cpData: CCI;
/** Need to show the VNF Details @public */
public isShowCPDetails: boolean = false;
/** random number count @public */
public randomNumberLength: number;
/** Contains the vnfd information @public */
- public vnfList: VNFDDetails[] = [];
+ public vnfList: VNFD[] = [];
/** Add the activeclass for the selected @public */
public activeClass: string = 'active';
/** Add the fixed class for the freeze @public */
/** Give the message for the loading @public */
public message: string = 'PLEASEWAIT';
/** Get VNF selected node @public */
- public getVNFSelectedData: VNFDDetails[];
+ public getVNFSelectedData: VNFD;
/** Assign the forcesimulation active @public */
public forceSimulationActive: boolean = false;
/** Assign pinned class for the button when freezed @public */
private force: any;
/** Contains all the selected node @private */
private selectedNode: COMPOSERNODES[] = [];
- /** variables used for CP @private */
- private iConnectionPointRef: number = 0;
/** Contains the connected point @private */
private connectionPoint: string;
- /** Contains all the NSD information @private */
- private nsd: string;
- /** Contains all the VNFD information @private */
- private vnfd: string;
/** Contains id of the node @private */
private identifier: string;
- /** Variables used for cp @private */
- private jConnectionPointRef: number = 0;
/** Contains copy of NSD information @private */
private nsdCopy: string;
/** Contains the VNFD copy @private */
private vnfdCopy: string;
- /** Contains name of the node @private */
- private name: string;
- /** Contains member vnf index value of the node @private */
- private memberVnfIndexValue: number = 0;
/** Contains path information of the node */
// tslint:disable-next-line:no-any
private path: any;
private setVnfdName: string;
/** Contains all methods related to shared @private */
private sharedService: SharedService;
- /** Contains selected node VLD objects @private */
- private selectedVLDResult: VLD;
+ /** Contains selected node VNF profile objects @private */
+ private selectedVNFProfile: VNFPROFILE[];
constructor(injector: Injector) {
this.injector = injector;
}
/** On clicking redirect to NS edit page @public */
public onEdit(): void {
- this.router.navigate(['/packages/ns/edit/', this.identifier]).catch(() => {
+ this.router.navigate(['/packages/ns/edit/', this.identifier]).catch((): void => {
// Catch Navigation Error
});
}
/** Events handles drop at D3 region @public */
public drop(ev: DragEvent): void {
- event.preventDefault();
- this.name = ev.dataTransfer.getData('text');
- if (this.name === 'vl') {
+ ev.preventDefault();
+ const getDropedName: string = ev.dataTransfer.getData('text');
+ if (getDropedName === 'vl') {
this.svg.selectAll('*').remove();
this.vldropComposer();
} else {
this.svg.selectAll('*').remove();
- this.vnfd = ev.dataTransfer.getData('text');
- this.vnfdropComposer();
+ const vnfdName: string = ev.dataTransfer.getData('text');
+ this.vnfdropComposer(vnfdName);
}
}
/** Drop VL Composer Data @public */
public vldropComposer(): void {
this.randomNumberLength = CONSTANTNUMBER.randomNumber;
- const generateId: string = 'ns_vl_' + this.randomString(
- this.randomNumberLength,
- '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'
- );
- if (this.nsData.vld !== undefined) {
- this.nsData.vld.push({
- 'vim-network-name': 'PUBLIC',
- name: generateId,
- 'mgmt-network': true,
- type: 'ELAN',
- id: generateId
- });
- } else {
- Object.assign(this.nsData, {
- vld: [{
- 'vim-network-name': 'PUBLIC',
- name: generateId,
- 'mgmt-network': true,
- type: 'ELAN',
- id: generateId
- }]
- });
+ const generateId: string = 'ns_vl_' + this.sharedService.randomString();
+ if (this.nsData['virtual-link-desc'] === undefined) {
+ this.nsData['virtual-link-desc'] = [];
}
+ this.nsData['virtual-link-desc'].push({
+ id: generateId,
+ 'mgmt-network': false
+ });
this.putType = 'nsdadd';
this.addData(environment.NSDESCRIPTORS_URL, this.identifier, this.nsData, this.putType);
}
/** Drop VNFD Composer Data @public */
- public vnfdropComposer(): void {
- if (this.nsData['constituent-vnfd'] !== undefined) {
- this.nsData['constituent-vnfd'].push({
- 'vnfd-id-ref': this.vnfd,
- 'member-vnf-index': ++this.memberVnfIndexValue
+ public vnfdropComposer(vnfdName: string): void {
+ const vnfID: string = 'ns_vnfd_' + this.sharedService.randomString();
+ if (this.nsData.df.length > 0) {
+ this.addVNFDID(vnfdName);
+ this.nsData.df.forEach((res: DF): void => {
+ if (res['vnf-profile'] === undefined) {
+ res['vnf-profile'] = [];
+ }
+ res['vnf-profile'].push({
+ id: vnfID,
+ 'virtual-link-connectivity': [],
+ 'vnfd-id': vnfdName
+ });
});
} else {
- Object.assign(this.nsData, {
- 'constituent-vnfd': [{
- 'vnfd-id-ref': this.vnfd,
- 'member-vnf-index': ++this.memberVnfIndexValue
+ Object.assign(this.nsData.df, {
+ id: 'default-df',
+ 'vnf-profile': [{
+ id: vnfID,
+ 'virtual-link-connectivity': [],
+ 'vnfd-id': vnfdName
}]
});
}
this.putType = 'vnfdadd';
this.addData(environment.NSDESCRIPTORS_URL, this.identifier, this.nsData, this.putType);
}
+ /** Add the VNFD-ID while drop VNFD if not exists @public */
+ public addVNFDID(vnfdName: string): void {
+ const vnfdIDArray: string[] = this.nsData['vnfd-id'];
+ if (vnfdIDArray !== undefined) {
+ if (vnfdIDArray.indexOf(vnfdName) === -1) {
+ vnfdIDArray.push(vnfdName);
+ }
+ } else {
+ Object.assign(this.nsData, {
+ 'vnfd-id': [vnfdName]
+ });
+ }
+ }
/** Events handles allow drop on D3 region @public */
public allowDrop(ev: DragEvent): void {
ev.preventDefault();
}
/** Save NSD Information @public */
public saveNSD(): void {
- if (this.vnfdPackageDetails.shortName !== undefined) {
- this.nsData['short-name'] = this.vnfdPackageDetails.shortName;
- }
- if (this.vnfdPackageDetails.vendor !== undefined) {
- this.nsData.vendor = this.vnfdPackageDetails.vendor;
+ if (this.nsPackageDetails.id !== undefined) {
+ this.nsData.id = this.nsPackageDetails.id;
}
- if (this.vnfdPackageDetails.description !== undefined) {
- this.nsData.description = this.vnfdPackageDetails.description;
+ if (this.nsPackageDetails.name !== undefined) {
+ this.nsData.name = this.nsPackageDetails.name;
}
- if (this.vnfdPackageDetails.version !== undefined) {
- this.nsData.version = this.vnfdPackageDetails.version;
+ if (this.nsPackageDetails.description !== undefined) {
+ this.nsData.description = this.nsPackageDetails.description;
}
- if (this.vnfdPackageDetails.id !== undefined) {
- this.nsData.id = this.vnfdPackageDetails.id;
+ if (this.nsPackageDetails.version !== undefined) {
+ this.nsData.version = this.nsPackageDetails.version;
}
- if (this.vnfdPackageDetails.name !== undefined) {
- this.nsData.name = this.vnfdPackageDetails.name;
+ if (this.nsPackageDetails.designer !== undefined) {
+ this.nsData.designer = this.nsPackageDetails.designer;
}
this.putType = 'nsdUpdate';
this.addData(environment.NSDESCRIPTORS_URL, this.identifier, this.nsData, this.putType);
}
/** Save Virtual Link @public */
public saveVL(vlid: string): void {
- this.nsData.vld.forEach((result: VLD) => {
+ this.nsData['virtual-link-desc'].forEach((result: VLD): void => {
if (result.id === vlid) {
- result.name = this.vlDetails.name;
- result['mgmt-network'] = !isNullOrUndefined(this.vlDetails['mgmt-network']) ? this.vlDetails['mgmt-network'] : true;
- result['vim-network-name'] = !isNullOrUndefined(this.vlDetails['vim-network-name']) ? this.vlDetails['vim-network-name'] : '';
- result.type = this.vlDetails.type;
- result.id = this.vlDetails.id;
+ result['mgmt-network'] = !isNullOrUndefined(this.virtualLinkDesc['mgmt-network']) ? this.virtualLinkDesc['mgmt-network'] : true;
}
});
this.putType = 'vlUpdate';
url: apiURL + '/' + identifier + '/nsd_content',
httpOptions: { headers: this.headers }
};
- const nsData: {} = {};
- nsData['nsd:nsd-catalog'] = {};
- nsData['nsd:nsd-catalog'].nsd = [];
- nsData['nsd:nsd-catalog'].nsd.push(data);
- const descriptorInfo: string = jsyaml.dump(nsData, {sortKeys: true});
+ const nsData: NSDATACREATION = { nsd: { nsd: [] } };
+ nsData.nsd.nsd = [];
+ nsData.nsd.nsd.push(data);
+ const descriptorInfo: string = jsyaml.dump(nsData, { sortKeys: true });
this.sharedService.targzFile({ packageType: 'nsd', id: this.identifier, descriptor: descriptorInfo })
.then((content: ArrayBuffer): void => {
- this.restService.putResource(apiURLHeader, content).subscribe((res: {}) => {
+ this.restService.putResource(apiURLHeader, content).subscribe((res: {}): void => {
this.generateData();
this.notifierService.notify('success', this.translateService.instant(successMessage));
this.isLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.generateData();
this.restService.handleError(error, 'put');
this.isLoadingResults = false;
const modalRef: NgbModalRef = this.modalService.open(ConfirmationTopologyComponent, { backdrop: 'static' });
modalRef.componentInstance.topologyType = 'Info';
modalRef.componentInstance.topologytitle = this.translateService.instant('PAGE.TOPOLOGY.INFO');
- modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
if (result) {
// empty
}
this.force.stop();
}
this.forceSimulationActive = alreadyFixedIsActive;
- this.nodes.forEach((d: COMPOSERNODES) => {
+ this.nodes.forEach((d: COMPOSERNODES): void => {
d.fx = (alreadyFixedIsActive) ? null : d.x;
d.fy = (alreadyFixedIsActive) ? null : d.y;
});
}
/** Prepare the information of the VNFD @private */
private generateVNFData(): void {
- this.restService.getResource(environment.VNFPACKAGESCONTENT_URL).subscribe((vnfdPackageData: VNFDDetails[]) => {
+ this.restService.getResource(environment.VNFPACKAGESCONTENT_URL).subscribe((vnfdPackageData: VNFD[]): void => {
this.vnfList = vnfdPackageData;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
});
}
private generateDataNSDTopology(): void {
this.nodes = [];
this.links = [];
- this.iConnectionPointRef = 0;
- this.jConnectionPointRef = 0;
- this.restService.getResource(environment.NSDESCRIPTORSCONTENT_URL + '/' + this.identifier).subscribe((nsData: NSDDetails) => {
+ this.restService.getResource(environment.NSDESCRIPTORSCONTENT_URL + '/' + this.identifier).subscribe((nsData: NSDDetails): void => {
delete nsData._admin;
delete nsData._id;
delete nsData._links;
this.nsData = nsData;
- this.vnfdPackageDetails.shortName = nsData['short-name'];
- this.vnfdPackageDetails.vendor = nsData.vendor;
- this.vnfdPackageDetails.description = nsData.description;
- this.vnfdPackageDetails.version = nsData.version;
- this.vnfdPackageDetails.id = nsData.id;
- this.vnfdPackageDetails.name = nsData.name;
- if (nsData.vld !== undefined) {
+ this.generateNSInfo(nsData);
+ if (nsData['virtual-link-desc'] !== undefined) {
/** Details of the VL */
this.nsDataVLD(nsData);
}
- if (nsData['constituent-vnfd'] !== undefined) {
- /** Details of the VNFD */
- this.nsDataConstituentVNFD(nsData);
+ if (this.nsData.df.length > 0) {
+ this.nsData.df.forEach((res: DF): void => {
+ if (res['vnf-profile'] !== undefined) {
+ /** Details of the VNFD */
+ this.nsDataConstituentVNFD(nsData);
+ }
+ });
}
- if (nsData.vld !== undefined) {
+ if (nsData.df.length > 0) {
this.nsDataVLDLinkCreation(nsData);
}
this.separateAndCreatenode();
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
if (error.error.status === HttpStatus.NOT_FOUND || error.error.status === HttpStatus.UNAUTHORIZED) {
this.router.navigateByUrl('404', { skipLocationChange: true }).catch();
} else {
this.isShowNSDDetails = false;
});
}
- /** nsData-vld undefined Call this function @private */
+ /** Generate the NS Package Information */
+ private generateNSInfo(nsData: NSDDetails): void {
+ this.nsPackageDetails.id = nsData.id;
+ this.nsPackageDetails.name = nsData.name;
+ this.nsPackageDetails.description = nsData.description;
+ this.nsPackageDetails.version = nsData.version;
+ this.nsPackageDetails.designer = nsData.designer;
+ }
+ /** nsData VL node creation function @private */
private nsDataVLD(nsData: NSDDetails): void {
- nsData.vld.forEach((res: VLD) => {
+ nsData['virtual-link-desc'].forEach((res: VLD): void => {
this.nodes.push({ id: res.id, reflexive: false, type: 'vld', name: res.id, selectorId: res.id });
- this.nsd = res.id;
- if (res['vnfd-connection-point-ref'] !== undefined) {
- res['vnfd-connection-point-ref'].forEach((result: VNFDCONNECTIONPOINTREF) => {
- this.nodes.push(
- {
- id: this.nsd + ++this.iConnectionPointRef + ':' + result['vnfd-connection-point-ref'],
- reflexive: false,
- type: 'ns',
- name: result['vnfd-connection-point-ref'],
- nodeIndex: result['member-vnf-index-ref'],
- selectorId: result['vnfd-connection-point-ref'] + '_' + result['member-vnf-index-ref'] + '-osm-' + this.nsd
- });
- });
- }
});
}
- /** nsData constituent-vnfd undefined Call this function @private */
+ /** nsData VNFD node creation function @private */
private nsDataConstituentVNFD(nsData: NSDDetails): void {
- nsData['constituent-vnfd'].forEach((res: CONSTITUENTVNFD) => {
- this.nodes.push(
- {
- id: res['vnfd-id-ref'] + ':' + res['member-vnf-index'],
- reflexive: false,
- type: 'vnfd',
- name: res['vnfd-id-ref'],
- nodeIndex: res['member-vnf-index'],
- selectorId: res['vnfd-id-ref'] + '_' + res['member-vnf-index']
- });
- this.vnfd = res['vnfd-id-ref'];
- this.memberVnfIndexValue = res['member-vnf-index'];
+ nsData.df.forEach((resDF: DF): void => {
+ resDF['vnf-profile'].forEach((resVNF: VNFPROFILE): void => {
+ this.nodes.push(
+ {
+ id: resVNF['vnfd-id'] + ':' + resVNF.id,
+ reflexive: false,
+ type: 'vnfd',
+ name: resVNF['vnfd-id'],
+ nodeIndex: resVNF.id,
+ selectorId: resVNF['vnfd-id'] + '_' + resVNF.id
+ });
+ if (resVNF['virtual-link-connectivity'] !== undefined) {
+ this.nsDataCP(resVNF, resVNF.id);
+ }
+ });
});
}
-
- /** nsData-vld undefined Call this function @private */
- private nsDataVLDLinkCreation(nsData: NSDDetails): void {
- nsData.vld.forEach((res: VLD) => {
- this.nsdCopy = res.id;
- if (res['vnfd-connection-point-ref'] !== undefined) {
- this.nsDataVNFDConnectionPointRefrence(res);
- }
+ /** nsData CP node creation function @private */
+ private nsDataCP(resVNF: VNFPROFILE, vnfID: string): void {
+ resVNF['virtual-link-connectivity'].forEach((resultVLC: VLC, index: number): void => {
+ resultVLC['constituent-cpd-id'].forEach((resultCCI: CCI): void => {
+ this.nodes.push(
+ {
+ id: vnfID + ':' + resultCCI['constituent-base-element-id'] + index + ':' + resultCCI['constituent-cpd-id'],
+ reflexive: false,
+ type: 'ns',
+ name: resultCCI['constituent-cpd-id'],
+ nodeIndex: resultCCI['constituent-base-element-id'],
+ selectorId: 'osm-' + resultCCI['constituent-cpd-id'] + '-' + vnfID + resultCCI['constituent-base-element-id'] + index
+ });
+ });
});
}
- /** nsData-vnfd-connection-point-ref undefined Call this function @private */
- private nsDataVNFDConnectionPointRefrence(res: VLD): void {
- res['vnfd-connection-point-ref'].forEach((result: VNFDCONNECTIONPOINTREF) => {
- this.connectionPoint = this.nsdCopy + ++this.jConnectionPointRef + ':' + result['vnfd-connection-point-ref'];
- this.vnfdCopy = result['vnfd-id-ref'] + ':' + result['member-vnf-index-ref'];
- const connectionPointPos: number = this.nodes.map((e: COMPOSERNODES) => { return e.id; }).indexOf(this.connectionPoint);
- const nsdPos: number = this.nodes.map((e: COMPOSERNODES) => { return e.id; }).indexOf(this.nsdCopy);
- const vnfdPos: number = this.nodes.map((e: COMPOSERNODES) => { return e.id; }).indexOf(this.vnfdCopy);
- this.links.push(
- {
- source: this.nodes[connectionPointPos],
- target: this.nodes[nsdPos]
- },
- {
- source: this.nodes[connectionPointPos],
- target: this.nodes[vnfdPos]
+ /** nsData Link node creation function @private */
+ private nsDataVLDLinkCreation(nsData: NSDDetails): void {
+ nsData.df.forEach((resDF: DF): void => {
+ if (resDF['vnf-profile'] !== undefined) {
+ resDF['vnf-profile'].forEach((resVNF: VNFPROFILE): void => {
+ this.nsdCopy = resVNF['vnfd-id'] + ':' + resVNF.id;
+ if (resVNF['virtual-link-connectivity'] !== undefined) {
+ this.nsDataVNFDConnectionPointRefrence(resVNF);
+ }
});
+ }
});
}
- /** Generate random string @private */
- private randomString(length: number, chars: string): string {
- let result: string = '';
- for (let randomStringRef: number = length; randomStringRef > 0; --randomStringRef) {
- result += chars[Math.floor(Math.random() * chars.length)];
- }
- return result;
+ /** nsDataVNFDConnectionPointRefrence undefined Call this function @private */
+ private nsDataVNFDConnectionPointRefrence(resVNF: VNFPROFILE): void {
+ resVNF['virtual-link-connectivity'].forEach((resultVLC: VLC, index: number): void => {
+ resultVLC['constituent-cpd-id'].forEach((resultCCI: CCI): void => {
+ this.vnfdCopy = resultVLC['virtual-link-profile-id'];
+ this.connectionPoint = resVNF.id + ':' + resultCCI['constituent-base-element-id'] + index + ':' + resultCCI['constituent-cpd-id'];
+ const connectionPointPos: number = this.nodes.map((e: COMPOSERNODES): string => { return e.id; }).indexOf(this.connectionPoint);
+ const nsdPos: number = this.nodes.map((e: COMPOSERNODES): string => { return e.id; }).indexOf(this.nsdCopy);
+ const vnfdPos: number = this.nodes.map((e: COMPOSERNODES): string => { return e.id; }).indexOf(this.vnfdCopy);
+ this.links.push(
+ {
+ source: this.nodes[connectionPointPos],
+ target: this.nodes[nsdPos]
+ },
+ {
+ source: this.nodes[connectionPointPos],
+ target: this.nodes[vnfdPos]
+ });
+ });
+ });
}
/** Separate and create node @private */
private separateAndCreatenode(): void {
/** Separate the nodes along with its tyep @private */
private seprateNodes(node: COMPOSERNODES[]): void {
this.vlNodes = []; this.vnfNodes = []; this.cpNodes = [];
- node.forEach((nodeList: COMPOSERNODES) => {
+ node.forEach((nodeList: COMPOSERNODES): void => {
if (nodeList.type === 'vld') {
this.vlNodes.push(nodeList);
} else if (nodeList.type === 'vnfd') {
private createnode(node: COMPOSERNODES[]): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
d3.selectAll('svg#graphContainer > *').remove();
- d3.select(window).on('keydown', () => { this.keyDown(); });
- d3.select(window).on('keyup', () => { this.keyUp(); });
+ d3.select(window).on('keydown', (): void => { this.keyDown(); });
+ d3.select(window).on('keyup', (): void => { this.keyUp(); });
this.svg = d3.select('#graphContainer')
.attr('oncontextmenu', 'return false;')
- .attr('width', graphContainerAttr.width)
- .attr('height', graphContainerAttr.height)
- .on('mousemove', () => { this.mousemove(); });
+ .attr('viewBox', `0 0 ${graphContainerAttr.width} ${graphContainerAttr.height}`)
+ .on('mousemove', (): void => { this.mousemove(); });
this.force = d3.forceSimulation()
.force('charge', d3.forceManyBody().strength(graphContainerAttr.strength))
- .force('link', d3.forceLink().id((d: TickPath) => d.id).distance(graphContainerAttr.distance))
+ .force('link', d3.forceLink().id((d: TickPath): string => d.id).distance(graphContainerAttr.distance))
.force('center', d3.forceCenter(graphContainerAttr.width / graphContainerAttr.forcex,
graphContainerAttr.height / graphContainerAttr.forcey))
.force('x', d3.forceX(graphContainerAttr.width / graphContainerAttr.forcex))
.force('y', d3.forceY(graphContainerAttr.height / graphContainerAttr.forcey))
- .on('tick', () => { this.tick(); });
+ .on('tick', (): void => { this.tick(); });
this.dragLine = this.svg.append('svg:path').attr('class', 'link dragline hidden').attr('d', 'M0,0L0,0');
this.path = this.svg.append('svg:g').selectAll('path');
this.vlNode = this.svg.append('svg:g').selectAll('vlnode');
private tick(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
// draw directed edges with proper padding from node centers
- this.path.attr('class', 'link').attr('d', (d: Tick) => {
+ this.path.attr('class', 'link').attr('d', (d: Tick): string => {
const deltaX: number = d.target.x - d.source.x;
const deltaY: number = d.target.y - d.source.y;
const dist: number = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
const targetX: number = d.target.x - (targetPadding * normX);
const targetY: number = d.target.y - (targetPadding * normY);
return `M${sourceX},${sourceY}L${targetX},${targetY}`;
- }).on('dblclick', (d: Tick) => { this.getDeleteLinkConfirmation(d); });
- this.vlNode.attr('transform', (t: TickPath) => `translate(${t.x},${t.y})`);
- this.vnfdnode.attr('transform', (t: TickPath) => `translate(${t.x},${t.y})`);
- this.cpnode.attr('transform', (t: TickPath) => `translate(${t.x},${t.y})`);
+ }).on('dblclick', (d: Tick): void => { this.getDeleteLinkConfirmation(d); });
+ this.vlNode.attr('transform', (t: TickPath): string => `translate(${t.x},${t.y})`);
+ this.vnfdnode.attr('transform', (t: TickPath): string => `translate(${t.x},${t.y})`);
+ this.cpnode.attr('transform', (t: TickPath): string => `translate(${t.x},${t.y})`);
}
/** Update graph (called when needed) at D3 region @private */
private restart(node: COMPOSERNODES[]): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
this.path = this.path.data(this.links);
- this.vlNode = this.vlNode.data(this.vlNodes, (d: COMPOSERNODES) => d.id);
- this.vnfdnode = this.vnfdnode.data(this.vnfNodes, (d: COMPOSERNODES) => d.id);
- this.cpnode = this.cpnode.data(this.cpNodes, (d: COMPOSERNODES) => d.id);
+ this.vlNode = this.vlNode.data(this.vlNodes, (d: COMPOSERNODES): string => d.id);
+ this.vnfdnode = this.vnfdnode.data(this.vnfNodes, (d: COMPOSERNODES): string => d.id);
+ this.cpnode = this.cpnode.data(this.cpNodes, (d: COMPOSERNODES): string => d.id);
this.resetAndCreateNodes();
this.force.nodes(node).force('link').links(this.links);
this.force.alphaTarget(graphContainerAttr.alphaTarget).restart();
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: COMPOSERNODES) => { return d.selectorId; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.selectorId; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/VL.svg')
- .on('mousedown', (d: COMPOSERNODES) => { this.mouseDown(d); })
- .on('mouseup', (d: COMPOSERNODES) => { this.mouseUp(d); })
- .on('click', (d: COMPOSERNODES) => { this.singleClick(this.vlNode, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: COMPOSERNODES) => { this.getDeleteConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.vlNode, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gvlNode.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: COMPOSERNODES) => d.id);
+ .text((d: COMPOSERNODES): string => d.id);
}
/** Setting all the VNFD nodes @private */
private getVNFDNodes(): void {
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: COMPOSERNODES) => { return d.selectorId; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.selectorId; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/VNFD.svg')
- .on('mousedown', (d: COMPOSERNODES) => { this.mouseDown(d); })
- .on('mouseup', (d: COMPOSERNODES) => { this.mouseUp(d); })
- .on('click', (d: COMPOSERNODES) => { this.singleClick(this.vnfdnode, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: COMPOSERNODES) => { this.getDeleteConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.vnfdnode, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gvnfdNode.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: COMPOSERNODES) => d.id);
+ .text((d: COMPOSERNODES): string => d.name);
}
/** Setting all the CP nodes @private */
private getCPNodes(): void {
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: COMPOSERNODES) => { return d.selectorId; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.selectorId; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/CP.svg')
- .on('mousedown', (d: COMPOSERNODES) => { this.mouseDown(d); })
- .on('mouseup', (d: COMPOSERNODES) => { this.mouseUp(d); })
- .on('click', (d: COMPOSERNODES) => { this.singleClick(this.cpnode, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: COMPOSERNODES) => { this.getDeleteConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.cpnode, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gcpNode.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: COMPOSERNODES) => d.id);
+ .text((d: COMPOSERNODES): string => d.name);
}
/** Events handles when mousemove it will capture the selected node data @private */
private mousemove(): void {
`M${this.mousedownNode.x},${this.mousedownNode.y}L${d3.mouse(d3.event.currentTarget)[0]},${d3.mouse(d3.event.currentTarget)[1]}`);
}
/** Get confirmation Before Deleting the Link in Topology @private */
- private getAddConfirmation(mouseData: COMPOSERNODES, getNsData: NSDDetails, addType: string, getVLDIndex: number): void {
+ private getAddConfirmation(mouseData: COMPOSERNODES, getNsData: NSDDetails, addType: string, getVLDIndex: string): void {
let findVNFName: string = '';
let findVLDID: string = '';
if (mouseData.type === 'vld') {
findVNFName = this.mouseupNode.name;
findVLDID = this.mousedownNode.id;
+ this.vlName = this.mousedownNode.name;
} else {
findVNFName = this.mousedownNode.name;
findVLDID = this.mouseupNode.id;
+ this.vlName = this.mouseupNode.name;
+ }
+ if (getNsData['vnfd-id'] !== undefined) {
+ getNsData['vnfd-id'].forEach((resVNFid: string): void => {
+ if (resVNFid === findVNFName) {
+ this.getVNFSelectedData = this.vnfList.filter((vnfList: VNFD): boolean => vnfList.id === findVNFName)[0];
+ this.setVnfdConnectionPointRef = this.getVNFSelectedData['mgmt-cp'];
+ this.setVnfdName = this.getVNFSelectedData['product-name'];
+ this.selectedVNFProfile = getNsData.df[0]['vnf-profile'];
+ }
+ });
}
- getNsData.vld.forEach((result: VLD) => {
- if (result.id === findVLDID) {
- this.vlName = result.name;
- this.getVNFSelectedData = this.vnfList.filter((vnfList: VNFDDetails) => vnfList.id === findVNFName);
- this.setVnfdConnectionPointRef = this.getVNFSelectedData[0]['mgmt-interface'].cp;
- this.setVnfdName = this.getVNFSelectedData[0].name;
- this.selectedVLDResult = result;
- }
- });
if (this.vlName !== undefined && this.setVnfdName !== undefined && this.setVnfdConnectionPointRef !== undefined) {
const modalRef: NgbModalRef = this.modalService.open(ConfirmationTopologyComponent, { backdrop: 'static' });
modalRef.componentInstance.topologyType = 'Add';
- modalRef.componentInstance.cpDetails = this.getVNFSelectedData[0]['connection-point'];
+ modalRef.componentInstance.cpDetails = this.getVNFSelectedData['ext-cpd'];
this.translateService.get('PAGE.TOPOLOGY.ADDINGCP', {
vlname: '<b>' + this.vlName + '</b>',
vnfdname: '<b>' + this.setVnfdName + '</b>',
cpname: '<b>' + this.setVnfdConnectionPointRef + '</b>'
- }).subscribe((res: string) => {
+ }).subscribe((res: string): void => {
modalRef.componentInstance.topologyname = res;
});
modalRef.componentInstance.topologytitle = this.translateService.instant('PAGE.TOPOLOGY.CONNECTIONPOINT');
- modalRef.result.then((result: MODALCLOSERESPONSEWITHCP) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEWITHCP): void => {
if (result) {
- this.nsData = getNsData;
- this.generateCPForVNF(this.selectedVLDResult, result.connection_point, getVLDIndex);
+ this.generateCPForVNF(this.selectedVNFProfile, result.connection_point, getVLDIndex);
this.addData(environment.NSDESCRIPTORS_URL, this.identifier, getNsData, addType);
} else {
this.deselectPath();
this.notifierService.notify('error', this.translateService.instant('ERROR'));
}
}
-
/** Generate connection point for vnf using vld @private */
- private generateCPForVNF(result: VLD, cp: string, getVLDIndex: number): void {
- if (result['vnfd-connection-point-ref'] !== undefined) {
- result['vnfd-connection-point-ref'].push({
- 'member-vnf-index-ref': getVLDIndex,
- 'vnfd-connection-point-ref': cp,
- 'vnfd-id-ref': this.getVNFSelectedData[0].name
+ private generateCPForVNF(result: VNFPROFILE[], cp: string, getVLDIndex: string): void {
+ if (result !== undefined) {
+ result.forEach((resultVNFPROFILE: VNFPROFILE, index: number): void => {
+ if (getVLDIndex === resultVNFPROFILE.id) {
+ resultVNFPROFILE['virtual-link-connectivity'].push({
+ 'constituent-cpd-id': [{
+ 'constituent-base-element-id': getVLDIndex,
+ 'constituent-cpd-id': cp
+ }],
+ 'virtual-link-profile-id': this.vlName
+ });
+ }
});
} else {
Object.assign(result, {
- 'vnfd-connection-point-ref': [{
- 'member-vnf-index-ref': getVLDIndex,
- 'vnfd-connection-point-ref': cp,
- 'vnfd-id-ref': this.getVNFSelectedData[0].name
+ 'virtual-link-connectivity': [{
+ 'constituent-cpd-id': [{
+ 'constituent-base-element-id': getVLDIndex,
+ 'constituent-cpd-id': cp
+ }],
+ 'virtual-link-profile-id': this.vlName
}]
});
}
}
-
/** Events handles when mousedown click it will capture the selected node data @private */
private mouseDown(d: COMPOSERNODES): void {
event.preventDefault();
this.mouseupNode = d;
if (this.mousedownNode.type === 'vld' && this.mouseupNode.type === 'vnfd') {
const getOldVLDIndex: string[] = this.mouseupNode.id.split(':');
- const setOldVLDindex: number = +getOldVLDIndex[1];
+ const setOldVLDindex: string = getOldVLDIndex[1];
this.putType = 'cpAdded';
this.getAddConfirmation(this.mousedownNode, this.nsData, this.putType, setOldVLDindex);
} else if (this.mousedownNode.type === 'vnfd' && this.mouseupNode.type === 'vld') {
const getOldVLDIndex: string[] = this.mousedownNode.id.split(':');
- const setOldVLDindex: number = +getOldVLDIndex[1];
+ const setOldVLDindex: string = getOldVLDIndex[1];
this.putType = 'cpAdded';
this.getAddConfirmation(this.mousedownNode, this.nsData, this.putType, setOldVLDindex);
} else if (this.mousedownNode.type === 'vnfd' && this.mouseupNode.type === 'ns') {
this.deselectAllNodes();
nodeSeleced.select('#' + d.selectorId).classed(this.activeClass, !alreadyIsActive);
if (d.type === 'vld' && !alreadyIsActive) {
- this.nsData.vld.forEach((result: VLD) => {
+ this.nsData['virtual-link-desc'].forEach((result: VLD): void => {
if (result.id === d.id) {
this.showRightSideInfo(false, true, false, false);
- this.vlDetails = result;
+ this.virtualLinkDesc = result;
}
});
} else if (d.type === 'vnfd' && !alreadyIsActive) {
- this.nsData['constituent-vnfd'].forEach((result: CONSTITUENTVNFD) => {
- if (result['member-vnf-index'] === d.nodeIndex && result['vnfd-id-ref'] === d.name) {
- this.showRightSideInfo(false, false, true, false);
- this.vnfData = result;
+ this.nsData.df.forEach((res: DF): void => {
+ if (res['vnf-profile'] !== undefined) {
+ res['vnf-profile'].forEach((resVNF: VNFPROFILE): void => {
+ if (resVNF.id === d.nodeIndex && resVNF['vnfd-id'] === d.name) {
+ this.showRightSideInfo(false, false, true, false);
+ this.vnfData = resVNF;
+ }
+ });
}
});
} else if (d.type === 'ns' && !alreadyIsActive) {
- this.nsData.vld.forEach((result: VLD) => {
- if (result['vnfd-connection-point-ref'] !== undefined) {
- result['vnfd-connection-point-ref'].forEach((resultCP: VNFDCONNECTIONPOINTREF) => {
- if (resultCP['member-vnf-index-ref'] === d.nodeIndex && resultCP['vnfd-connection-point-ref'] === d.name) {
- this.cpData = resultCP;
- this.vlDetails = result;
- this.showRightSideInfo(false, false, false, true);
+ this.nsData.df.forEach((resultDF: DF): void => {
+ if (resultDF['vnf-profile'] !== undefined) {
+ resultDF['vnf-profile'].forEach((resVNF: VNFPROFILE): void => {
+ if (resVNF['virtual-link-connectivity'] !== undefined) {
+ resVNF['virtual-link-connectivity'].forEach((resultVLC: VLC, index: number): void => {
+ resultVLC['constituent-cpd-id'].forEach((resultCCI: CCI): void => {
+ const connectionPointID: string = resVNF.id + ':' + resultCCI['constituent-base-element-id'] + index + ':' + resultCCI['constituent-cpd-id'];
+ if (connectionPointID === d.id) {
+ this.cpData = resultCCI;
+ this.vnfData = resVNF;
+ this.virtualLinkProfileID = resultVLC['virtual-link-profile-id'];
+ this.showRightSideInfo(false, false, false, true);
+ }
+ });
+ });
}
});
}
private getDeleteLinkConfirmation(d: Tick): void {
const modalRef: NgbModalRef = this.modalService.open(ConfirmationTopologyComponent, { backdrop: 'static' });
modalRef.componentInstance.topologyType = 'Delete';
- modalRef.componentInstance.topologyname = this.translateService.instant('PAGE.TOPOLOGY.LINK');
+ modalRef.componentInstance.topologyname = this.translateService.instant('PAGE.TOPOLOGY.LINK') + ' - ' + d.source.id;
modalRef.componentInstance.topologytitle = 'PAGE.TOPOLOGY.LINK';
- modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
if (result) {
this.doubleClickLink(d);
}
/** Events handles when Double Click to Delete the link @private */
private doubleClickLink(d: Tick): void {
let getID: string = '';
- if (d.target.type === 'vld') {
- getID = d.target.id;
- } else if (d.source.type === 'vld') {
+ let getName: string = '';
+ let getNodeIndex: string;
+ if (d.source.type === 'ns') {
getID = d.source.id;
+ getName = d.source.name;
+ getNodeIndex = d.source.nodeIndex;
}
- this.nodes.forEach((res: COMPOSERNODES) => {
- if (res.id === getID) {
- if (this.nsData.vld !== undefined) {
- this.nsData.vld.forEach((vldresult: VLD) => {
- if (vldresult.id === getID) {
- delete vldresult['vnfd-connection-point-ref'];
- }
- });
- }
+ /** Split the selected node of connectionpoint */
+ const selectedNode: string[] = getID.split(':');
+ this.nsData.df.forEach((resultDF: DF): void => {
+ if (resultDF['vnf-profile'] !== undefined) {
+ resultDF['vnf-profile'].forEach((elementVNF: VNFPROFILE): void => {
+ const selectedVNFProfileID: string = selectedNode[0];
+ /** If VNF ID is equal to selected VNFProfile ID check the VLC of CCI to match the id and name to remove the VLC index */
+ if (selectedVNFProfileID === elementVNF.id) {
+ elementVNF['virtual-link-connectivity'].forEach((elementVLC: VLC, index: number): void => {
+ const posCCI: number = elementVLC['constituent-cpd-id'].findIndex((e: CCI): boolean => {
+ const getCID: string = elementVNF.id + ':' + e['constituent-base-element-id'] + index + ':' + e['constituent-cpd-id'];
+ return getID === getCID;
+ });
+ if (posCCI !== -1) {
+ elementVNF['virtual-link-connectivity'].splice(index, 1);
+ }
+ });
+ }
+ });
}
});
this.putType = 'linkdelete';
} else if (d.type === 'ns') {
modalRef.componentInstance.topologytitle = 'PAGE.TOPOLOGY.CONNECTIONPOINT';
}
- modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
if (result) {
this.doubleClick(d);
}
/** Events handles when Double Click to Delete @private */
private doubleClick(d: COMPOSERNODES): void {
const deletedNode: COMPOSERNODES = d;
- this.nodes.forEach((res: COMPOSERNODES) => {
+ this.nodes.forEach((res: COMPOSERNODES, i: number): void => {
if (res.id === d.id) {
if (deletedNode.type === 'vld') {
- const pos: number = this.nsData.vld.map((e: VLD) => { return e.id; }).indexOf(d.id);
- this.nsData.vld.splice(pos, 1);
+ /** Remove the virtual-link-desc related to VL */
+ const pos: number = this.nsData['virtual-link-desc'].map((e: VLD): string => { return e.id; }).indexOf(d.id);
+ this.nsData['virtual-link-desc'].splice(pos, 1);
+ /** Remove the virtual-link-connectivity between VL and VNFD */
+ this.nsData.df.forEach((resultDF: DF): void => {
+ if (resultDF['vnf-profile'] !== undefined) {
+ resultDF['vnf-profile'].forEach((resVNF: VNFPROFILE): void => {
+ const getVLArray: number[] = resVNF['virtual-link-connectivity'].map((e: VLC, index: number): number => {
+ if (e['virtual-link-profile-id'] === d.id) {
+ return index;
+ }
+ });
+ if (getVLArray.length > 0) {
+ getVLArray.forEach((removeIndex: number): void => {
+ const index: string = removeIndex.toString();
+ resVNF['virtual-link-connectivity'].splice(resVNF['virtual-link-connectivity'][index], 1);
+ });
+ }
+ });
+ }
+ });
this.putType = 'nsddelete';
} else if (deletedNode.type === 'vnfd') {
- const constituentVNFD: string[] = [];
- if (this.nsData['constituent-vnfd'] !== undefined) {
- this.nsData['constituent-vnfd'].forEach((ref: CONSTITUENTVNFD) => {
- constituentVNFD.push(ref['vnfd-id-ref'] + ':' + ref['member-vnf-index']);
- });
- }
- const pos: number = constituentVNFD.map((e: string) => { return e; }).indexOf(d.id);
- this.nsData['constituent-vnfd'].splice(pos, 1);
- const getCP: string[] = d.id.split(':');
- const memberVnfIndexRef: number = +getCP[1];
- const vnfdIDRef: string = getCP[0];
- if (this.nsData.vld !== undefined) {
- this.nsData.vld.forEach((resf: VLD) => {
- if (resf['vnfd-connection-point-ref'] !== undefined) {
- resf['vnfd-connection-point-ref'].forEach((connectionPoint: VNFDCONNECTIONPOINTREF, index: number) => {
- if (+connectionPoint['member-vnf-index-ref'] === memberVnfIndexRef && connectionPoint['vnfd-id-ref'] === vnfdIDRef) {
- resf['vnfd-connection-point-ref'].splice(index, 1);
- }
+ this.nsData.df.forEach((resultDF: DF): void => {
+ if (resultDF['vnf-profile'] !== undefined) {
+ /** Remove the vnf-profile related to VNFD */
+ const posVNF: number = resultDF['vnf-profile'].findIndex((e: VNFPROFILE): boolean => {
+ return e['vnfd-id'] === d.name && e.id === d.nodeIndex;
+ });
+ resultDF['vnf-profile'].splice(posVNF, 1);
+ /** Check the VNFD exists in any vnf-profile */
+ const isVNFDExists: boolean = resultDF['vnf-profile'].some((e: VNFPROFILE): boolean => {
+ return e['vnfd-id'] === d.name;
+ });
+ /** If VNFD not exists in the vnf-profile remove from vnfd-id */
+ if (!isVNFDExists) {
+ const posVNFD: number = this.nsData['vnfd-id'].findIndex((e: string): boolean => {
+ return e === d.name;
});
+ this.nsData['vnfd-id'].splice(posVNFD, 1);
}
- });
- }
+ }
+ });
this.putType = 'vnfddelete';
} else if (deletedNode.type === 'ns') {
- const getCP: string[] = d.selectorId.split('-osm-');
- const memberVnfIndexRef: number = d.nodeIndex;
- const vnfdIDRef: string = getCP[getCP.length - 1];
- if (this.nsData.vld !== undefined) {
- this.nsData.vld.forEach((resf: VLD) => {
- if (resf['vnfd-connection-point-ref'] !== undefined && resf.id === vnfdIDRef) {
- resf['vnfd-connection-point-ref'].forEach((connectionPoint: VNFDCONNECTIONPOINTREF, index: number) => {
- if (connectionPoint['member-vnf-index-ref'] === memberVnfIndexRef) {
- resf['vnfd-connection-point-ref'].splice(index, 1);
- }
- });
- }
- });
- }
+ /** Split the selected node */
+ const selectedNode: string[] = d.id.split(':');
+ this.nsData.df.forEach((resultDF: DF): void => {
+ if (resultDF['vnf-profile'] !== undefined) {
+ resultDF['vnf-profile'].forEach((elementVNF: VNFPROFILE): void => {
+ const selectedVNFProfileID: string = selectedNode[0];
+ /** If VNF ID is equal to selected VNFProfile ID check the VLC of CCI to match the id and name to remove the VLC index */
+ if (selectedVNFProfileID === elementVNF.id) {
+ elementVNF['virtual-link-connectivity'].forEach((elementVLC: VLC, index: number): void => {
+ const posCCI: number = elementVLC['constituent-cpd-id'].findIndex((e: CCI): boolean => {
+ const getID: string = elementVNF.id + ':' + e['constituent-base-element-id'] + index + ':' + e['constituent-cpd-id'];
+ return d.id === getID;
+ });
+ if (posCCI !== -1) {
+ elementVNF['virtual-link-connectivity'].splice(index, 1);
+ }
+ });
+ }
+ });
+ }
+ });
this.putType = 'nsdelete';
}
this.addData(environment.NSDESCRIPTORS_URL, this.identifier, this.nsData, this.putType);
}
});
}
+ /** drag event @private */
+ // tslint:disable-next-line: no-any
+ private onDragDrop(): any {
+ return d3.drag().filter(this.dragFilter)
+ .on('start', this.dragstarted)
+ .on('drag', this.dragged)
+ .on('end', this.dragended);
+ }
/** Key press event @private */
private keyDown(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
if (this.lastKeyDown !== -1) { return; }
this.lastKeyDown = d3.event.keyCode;
if (d3.event.keyCode === graphContainerAttr.shiftKeyCode) {
- this.gvlNode.call(d3.drag()
- .on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended)
- );
- this.gvnfdNode.call(d3.drag()
- .on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended)
- );
- this.gcpNode.call(d3.drag()
- .on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended)
- );
this.svg.classed('ctrl', true);
}
}
this.svg.classed('ctrl', false);
}
}
+ /** Events handles when to drag using filter for the keys @private */
+ private dragFilter(): boolean {
+ return d3.event.ctrlKey && !d3.event.button;
+ }
/** Events handles when dragstarted @private */
private dragstarted(d: COMPOSERNODES): void {
d.fx = d.x;
<div class="sidebar-header">
<span class="topology_title" *ngIf="showRightSideInfo === 'vnfdInfo'">{{'PAGE.TOPOLOGY.VNFD' | translate}}</span>
<span class="topology_title" *ngIf="showRightSideInfo === 'vduInfo'">{{'PAGE.TOPOLOGY.VDU' | translate}}</span>
- <span class="topology_title" *ngIf="showRightSideInfo === 'intvlInfo'">{{'PAGE.TOPOLOGY.VIRTUALLINK' | translate}}</span>
- <span class="topology_title" *ngIf="showRightSideInfo === 'cpInfo'">{{'PAGE.TOPOLOGY.CONNECTIONPOINT' | translate}}</span>
- <span class="topology_title" *ngIf="showRightSideInfo === 'intcpInfo'">{{'PAGE.TOPOLOGY.INTCONNECTIONPOINT' | translate}}</span>
+ <span class="topology_title" *ngIf="showRightSideInfo === 'intvlInfo'">{{'PAGE.TOPOLOGY.VIRTUALLINK' |
+ translate}}</span>
+ <span class="topology_title" *ngIf="showRightSideInfo === 'cpInfo'">{{'PAGE.TOPOLOGY.CONNECTIONPOINT' |
+ translate}}</span>
+ <span class="topology_title" *ngIf="showRightSideInfo === 'intcpInfo'">{{'PAGE.TOPOLOGY.INTCONNECTIONPOINT' |
+ translate}}</span>
<button (click)="toggleSidebar()" class="close" type="button">
<i class="fas fa-times-circle text-danger" aria-hidden="true"></i>
</button>
<div class="col-12 p-0">
<form>
<div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'SHORTNAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'SHORTNAME' | translate }}" name="shortName"
- [(ngModel)]="vnfdInfo.shortName">
+ <label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
+ <div class="col-sm-8 p-0">
+ <input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
+ [(ngModel)]="vnfdInfo.id">
+ </div>
+ </div>
+ <div class="form-group row">
+ <label class="col-sm-4 col-form-label">{{ 'PRODUCTNAME' | translate }}</label>
+ <div class="col-sm-8 p-0">
+ <input type="text" class="form-control" placeholder="{{ 'PRODUCTNAME' | translate }}"
+ name="product-name" [(ngModel)]="vnfdInfo['product-name']">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'DESCRIPTION' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'DESCRIPTION' | translate }}" name="description"
- [(ngModel)]="vnfdInfo.description">
+ <div class="col-sm-8 p-0">
+ <textarea rows="5" cols="50" class="form-control" placeholder="{{ 'DESCRIPTION' | translate }}"
+ name="description" [(ngModel)]="vnfdInfo.description"></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'VERSION' | translate }}</label>
- <div class="col-sm-8">
+ <div class="col-sm-8 p-0">
<input type="text" class="form-control" placeholder="{{ 'VERSION' | translate }}" name="version"
[(ngModel)]="vnfdInfo.version">
</div>
</div>
<div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
- [(ngModel)]="vnfdInfo.id">
+ <label class="col-sm-4 col-form-label">{{ 'PROVIDER' | translate }}</label>
+ <div class="col-sm-8 p-0">
+ <input type="text" class="form-control" placeholder="{{ 'PROVIDER' | translate }}" name="provider"
+ [(ngModel)]="vnfdInfo.provider">
</div>
</div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
- [(ngModel)]="vnfdInfo.name">
- </div>
- </div>
- <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveVNFD()" placement="top" ngbTooltip="Save">
+ <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveVNFD()" placement="top"
+ ngbTooltip="Save">
<i class="fas fa-save"></i> {{'SAVE' | translate}}
</button>
</form>
<div class="row">
<div class="col-12 p-0">
<form>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'COUNT' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'COUNT' | translate }}" name="count"
- [(ngModel)]="vduInfo.count">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'DESCRIPTION' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'DESCRIPTION' | translate }}" name="description"
- [(ngModel)]="vduInfo.description">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'IMAGE' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'IMAGE' | translate }}" name="image"
- [(ngModel)]="vduInfo.image">
- </div>
- </div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
- <div class="col-sm-8">
+ <div class="col-sm-8 p-0">
<input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
[(ngModel)]="vduInfo.id">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
- <div class="col-sm-8">
+ <div class="col-sm-8 p-0">
<input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
[(ngModel)]="vduInfo.name">
</div>
</div>
- <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveVDU(vduInfo.id)" placement="top"
- ngbTooltip="Save">
+ <div class="form-group row">
+ <label class="col-sm-4 col-form-label">{{ 'DESCRIPTION' | translate }}</label>
+ <div class="col-sm-8 p-0">
+ <textarea rows="5" cols="50" class="form-control" placeholder="{{ 'DESCRIPTION' | translate }}"
+ name="description" [(ngModel)]="vduInfo.description"></textarea>
+ </div>
+ </div>
+ <div class="form-group row">
+ <label class="col-sm-4 col-form-label">{{ 'IMAGE' | translate }}</label>
+ <div class="col-sm-8 p-0">
+ <input type="text" class="form-control" placeholder="{{ 'IMAGE' | translate }}" name="sw-image-desc"
+ [(ngModel)]="vduInfo['sw-image-desc']">
+ </div>
+ </div>
+ <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveVDU(vduInfo.id)"
+ placement="top" ngbTooltip="Save">
<i class="fas fa-save"></i> {{'SAVE' | translate}}
</button>
</form>
</div>
</div>
</div>
- <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 mb-2" *ngIf="showRightSideInfo === 'intvlInfo'">
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 mb-2" *ngIf="showRightSideInfo === 'cpInfo'">
<div class="row">
<div class="col-12 p-0">
<form>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'SHORTNAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'SHORTNAME' | translate }}" name="shortName"
- [(ngModel)]="intvlInfo.shortName">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
- [(ngModel)]="intvlInfo.name">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'TYPE' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'TYPE' | translate }}" name="type"
- [(ngModel)]="intvlInfo.type">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'IPPROFILEREF' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'IP Profile Ref' | translate }}"
- name="ipProfileRef" [(ngModel)]="intvlInfo.ipProfileRef">
- </div>
- </div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
- <div class="col-sm-8">
+ <div class="col-sm-8 p-0">
<input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
- [(ngModel)]="intvlInfo.id">
+ [(ngModel)]="cpInfo.id">
</div>
</div>
- <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveIntVL(intvlInfo.id)" placement="top"
- ngbTooltip="Save">
+ <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveCP(cpInfo.id)"
+ placement="top" ngbTooltip="Save">
<i class="fas fa-save"></i> {{'SAVE' | translate}}
</button>
</form>
</div>
</div>
</div>
- <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 mb-2" *ngIf="showRightSideInfo === 'cpInfo'">
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 mb-2" *ngIf="showRightSideInfo === 'intvlInfo'">
<div class="row">
<div class="col-12 p-0">
<form>
<div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'TYPE' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'TYPE' | translate }}" name="type"
- [(ngModel)]="cpInfo.type">
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" placeholder="{{ 'NAME' | translate }}" name="name"
- [(ngModel)]="cpInfo.name">
+ <label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
+ <div class="col-sm-8 p-0">
+ <input type="text" class="form-control" placeholder="{{ 'ID' | translate }}" name="id"
+ [(ngModel)]="intvlInfo.id">
</div>
</div>
- <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveCP(cpInfo.name)" placement="top"
- ngbTooltip="Save">
+ <button type="button" class="btn btn-primary btn-sm pull-right" (click)="saveIntVL(intvlInfo.id)"
+ placement="top" ngbTooltip="Save">
<i class="fas fa-save"></i> {{'SAVE' | translate}}
</button>
</form>
<div class="row">
<div class="col-12 p-0">
<form>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'SHORTNAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" name="shortName" [(ngModel)]="intcpInfo.shortName" disabled>
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'TYPE' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" name="type" [(ngModel)]="intcpInfo.type" disabled>
- </div>
- </div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">{{ 'ID' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" name="id" [(ngModel)]="intcpInfo.id" disabled>
- </div>
- </div>
- <div class="form-group row">
- <label class="col-sm-4 col-form-label">{{ 'NAME' | translate }}</label>
- <div class="col-sm-8">
- <input type="text" class="form-control" name="name" [(ngModel)]="intcpInfo.name" disabled>
+ <div class="col-sm-8 p-0">
+ <input type="text" class="form-control" name="id" [(ngModel)]="intcpInfo.name" disabled>
</div>
</div>
</form>
</legend>
<ul class="list-group list-group-flush dragable">
<li class="list-group-item" draggable="true" (dragstart)="drag($event)" id="vdu">
- <img src="assets/images/VDU.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/VDU.svg" class="vnf-svg" draggable="false" />
<span class="span-overflow-text font-weight-bold">{{'PAGE.TOPOLOGY.VDU' | translate}}</span>
<span class="drag-icon pull-right"><i class="fas fa-arrows-alt"></i></span>
</li>
<li class="list-group-item" draggable="true" (dragstart)="drag($event)" id="cp">
- <img src="assets/images/CP-VNF.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/CP-VNF.svg" class="vnf-svg" draggable="false" />
<span class="span-overflow-text font-weight-bold">{{'PAGE.TOPOLOGY.CP' | translate}}</span>
<span class="drag-icon pull-right"><i class="fas fa-arrows-alt"></i></span>
</li>
<li class="list-group-item" draggable="true" (dragstart)="drag($event)" id="intvl">
- <img src="assets/images/INTVL.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/INTVL.svg" class="vnf-svg" draggable="false" />
<span class="span-overflow-text font-weight-bold">{{'PAGE.TOPOLOGY.INTVL' | translate}}</span>
<span class="drag-icon pull-right"><i class="fas fa-arrows-alt"></i></span>
</li>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 pl-0">
<div class="btn-group list" role="group" aria-label="Basic example">
<button type="button" class="btn btn-primary topology-btn" (click)="onFreeze()"
- [class.pinned]="classApplied" placement="top" container="body" ngbTooltip="{{(classApplied ? 'UNFREEZE' : 'FREEZE') | translate}}">
+ [class.pinned]="classApplied" placement="top" container="body"
+ ngbTooltip="{{(classApplied ? 'UNFREEZE' : 'FREEZE') | translate}}">
<i class="fas fa-thumbtack"></i>
</button>
<button type="button" class="btn btn-primary topology-btn" (click)="onEdit()" placement="top"
</div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-right pr-0 badgegroup">
<span class="badge badge-primary badge-pill bg-white text-body font-weight-bold">
- <img src="assets/images/VDU.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/VDU.svg" class="vnf-svg" draggable="false" />
<br>{{'PAGE.TOPOLOGY.VDU' | translate}}</span>
<span class="badge badge-primary badge-pill bg-white text-body font-weight-bold">
- <img src="assets/images/CP-VNF.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/CP-VNF.svg" class="vnf-svg" draggable="false" />
<br>{{'PAGE.TOPOLOGY.CP' | translate}}</span>
<span class="badge badge-primary badge-pill bg-white text-body font-weight-bold">
- <img src="assets/images/INTVL.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/INTVL.svg" class="vnf-svg" draggable="false" />
<br>{{'PAGE.TOPOLOGY.INTVL' | translate}}</span>
<span class="badge badge-primary badge-pill bg-white text-body font-weight-bold">
- <img src="assets/images/INTCP.svg" class="vnf-svg" draggable="false"/>
+ <img src="assets/images/INTCP.svg" class="vnf-svg" draggable="false" />
<br>{{'PAGE.TOPOLOGY.INTCP' | translate}}</span>
</div>
</div>
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import { TranslateService } from '@ngx-translate/core';
import { NotifierService } from 'angular-notifier';
-import { APIURLHEADER, ERRORDATA, GETAPIURLHEADER, MODALCLOSERESPONSEDATA } from 'CommonModel';
+import { APIURLHEADER, ERRORDATA, MODALCLOSERESPONSEDATA } from 'CommonModel';
import { ConfirmationTopologyComponent } from 'ConfirmationTopology';
import * as d3 from 'd3';
import { DataService } from 'DataService';
import * as jsyaml from 'js-yaml';
import { RestService } from 'RestService';
import { SharedService } from 'SharedService';
-import { isNullOrUndefined } from 'util';
-import {
- COMPOSERNODES, CONNECTIONPOINT, GRAPHDETAILS, InternalVLD, Tick, TickPath,
- VDU, VDUInternalConnectionPoint, VLDInternalConnectionPoint, VNFDInterface, VNFDNODE
-} from 'VNFDModel';
+import { COMPOSERNODES, EXTCPD, GRAPHDETAILS, INTCPD, IVLD, Tick, TickPath, VDU, VDUINTCPD, VNFD, VNFDATA, VNIR } from 'VNFDModel';
/**
* Creating component
public randomNumberLength: number;
/** Contains the vnfd information @public */
public vnfList: string[] = [];
- /** Contains node type @public */
- public nodeTypeRef: string;
/** Contains VNFD Information @public */
- public vnfdInfo: VNFDNODE = { shortName: '', description: '', version: '', id: '', name: '' };
+ public vnfdInfo: VNFD = { 'product-name': '', description: '', version: '', id: '', provider: '' };
/** Contains right panel box information @public */
public showRightSideInfo: string = '';
/** Add the fixed class for the freeze @public */
public classApplied: boolean = false;
/** Contains sidebar open status @public */
public sideBarOpened: boolean = false;
-
/** Contains SVG attributes @private */
// tslint:disable-next-line:no-any
private svg: any;
// tslint:disable-next-line:no-any
private intConnectionPoint: any;
/** Contains the node information @private */
- private nodes: VNFDNODE[] = [];
+ private nodes: COMPOSERNODES[] = [];
/** Contains the link information of nodes @private */
private links: {}[] = [];
/** Instance of the rest service @private */
// tslint:disable-next-line:no-any
private gIntConnectionPoint: any;
/** Contains all the information about VNF Details @private */
- private vnfdPackageDetails: VNFDNODE;
+ private vnfdPackageDetails: VNFD;
/** Conatins mousedown action @private */
private mousedownNode: COMPOSERNODES = null;
/** Conatins mouseup action @private */
private lastKeyDown: number = -1;
/** Contains VDU Information @private */
private vduInfo: VDU;
+ /** Contains VDU Old value Information @private */
+ private oldVDUID: string;
/** Contains Internal VL Information @private */
- private intvlInfo: InternalVLD;
+ private intvlInfo: IVLD;
+ /** Contains Internal VL Old value Information @private */
+ private oldintVLID: string;
/** Contains Connection Point Information @private */
- private cpInfo: CONNECTIONPOINT;
+ private cpInfo: EXTCPD;
+ /** Contains Connection Point Old value Information @private */
+ private oldCPID: string;
/** Contains Internal Connection Point Information @private */
- private intcpInfo: VLDInternalConnectionPoint;
+ private intcpInfo: VNIR;
/** Instance of the modal service @private */
private modalService: NgbModal;
public generateData(): void {
this.nodes = []; this.links = []; this.vnfdPackageDetails = null;
this.showRightSideInfo = 'vnfdInfo';
- const httpOptions: GETAPIURLHEADER = {
- headers: new HttpHeaders({
- 'Content-Type': 'application/zip',
- Accept: 'text/plain',
- 'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
- }),
- responseType: 'text'
- };
- this.restService.getResource(environment.VNFPACKAGES_URL + '/' + this.identifier + '/vnfd', httpOptions)
- .subscribe((vnfdPackageDetails: VNFDNODE) => {
+ this.restService.getResource(environment.VNFPACKAGESCONTENT_URL + '/' + this.identifier)
+ .subscribe((vnfdPackageDetails: VNFD): void => {
try {
- const getJson: string = jsyaml.load(vnfdPackageDetails.toString(), { json: true });
- if (getJson.hasOwnProperty('vnfd-catalog')) {
- this.vnfdPackageDetails = getJson['vnfd-catalog'].vnfd[0];
- } else if (getJson.hasOwnProperty('vnfd:vnfd-catalog')) {
- this.vnfdPackageDetails = getJson['vnfd:vnfd-catalog'].vnfd[0];
- } else if (getJson.hasOwnProperty('vnfd')) {
- // tslint:disable-next-line: no-string-literal
- this.vnfdPackageDetails = getJson['vnfd'][0];
- }
- this.generateCPPoint(this.vnfdPackageDetails);
- this.generateVDU(this.vnfdPackageDetails);
- this.generateInternalVLD(this.vnfdPackageDetails);
- this.generateInternalCP(this.vnfdPackageDetails);
- this.generateIntVLCPLinks(this.vnfdPackageDetails);
- this.generateVDUCPLinks(this.vnfdPackageDetails);
+ delete vnfdPackageDetails._admin;
+ delete vnfdPackageDetails._id;
+ delete vnfdPackageDetails._links;
+ this.vnfdPackageDetails = vnfdPackageDetails;
+ this.generateVDU(vnfdPackageDetails);
+ this.generateCPPoint(vnfdPackageDetails);
+ this.generateInternalVLD(vnfdPackageDetails);
+ this.generateInternalCP(vnfdPackageDetails);
+ this.generateIntVLCPLinks(vnfdPackageDetails);
+ this.generateVDUCPLinks(vnfdPackageDetails);
this.createNode(this.nodes);
- this.vnfdInfo.shortName = this.vnfdPackageDetails['short-name'];
- this.vnfdInfo.description = this.vnfdPackageDetails.description;
- this.vnfdInfo.version = this.vnfdPackageDetails.version;
- this.vnfdInfo.id = this.vnfdPackageDetails.id;
- this.vnfdInfo.name = this.vnfdPackageDetails.name;
+ this.generateVNFInfo(vnfdPackageDetails);
} catch (e) {
this.notifierService.notify('error', this.translateService.instant('ERROR'));
}
this.isLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
error.error = typeof error.error === 'string' ? jsyaml.load(error.error) : error.error;
if (error.error.status === HttpStatus.NOT_FOUND || error.error.status === HttpStatus.UNAUTHORIZED) {
this.router.navigateByUrl('404', { skipLocationChange: true }).catch();
this.showRightSideInfo = '';
});
}
+ /** Generate the VNF Package Information */
+ public generateVNFInfo(vnfdPackageDetails: VNFD): void {
+ this.vnfdInfo['product-name'] = vnfdPackageDetails['product-name'];
+ this.vnfdInfo.description = vnfdPackageDetails.description;
+ this.vnfdInfo.version = vnfdPackageDetails.version;
+ this.vnfdInfo.id = vnfdPackageDetails.id;
+ this.vnfdInfo.provider = vnfdPackageDetails.provider;
+ }
/** Events handles at drag on D3 region @public */
// tslint:disable-next-line:no-any
public drag(ev: any): void {
/** Events handles drop at D3 region @public */
public drop(ev: DragEvent): void {
ev.preventDefault();
- this.nodeTypeRef = ev.dataTransfer.getData('text');
- if (this.nodeTypeRef === 'vdu') {
+ const getDropedName: string = ev.dataTransfer.getData('text');
+ if (getDropedName === 'vdu') {
this.svg.selectAll('*').remove();
this.vduDropCompose();
- } else if (this.nodeTypeRef === 'cp') {
+ } else if (getDropedName === 'cp') {
this.svg.selectAll('*').remove();
this.cpDropCompose();
- } else if (this.nodeTypeRef === 'intvl') {
+ } else if (getDropedName === 'intvl') {
this.svg.selectAll('*').remove();
this.intvlDropCompose();
}
public allowDrop(ev: DragEvent): void {
ev.preventDefault();
}
- /** Generate and list CP points @public */
- public generateCPPoint(vnfdPackageDetails: VNFDNODE): void {
- if (vnfdPackageDetails['connection-point'] !== undefined) {
- vnfdPackageDetails['connection-point'].forEach((cp: CONNECTIONPOINT) => {
- this.nodes.push({ id: cp.name, nodeTypeRef: 'cp', name: cp.name, type: cp.type });
+ /** Generate and list VDU @public */
+ public generateVDU(vnfdPackageDetails: VNFD): void {
+ if (vnfdPackageDetails.vdu !== undefined) {
+ vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ this.nodes.push({
+ id: vdu.id,
+ name: vdu.name,
+ reflexive: false,
+ type: 'vdu'
+ });
});
}
}
- /** Generate and list VDU @public */
- public generateVDU(vnfdPackageDetails: VNFDNODE): void {
- if (vnfdPackageDetails.vdu !== undefined) {
- vnfdPackageDetails.vdu.forEach((vdu: VDU) => {
+ /** Generate and list CP points @public */
+ public generateCPPoint(vnfdPackageDetails: VNFD): void {
+ if (vnfdPackageDetails['ext-cpd'] !== undefined) {
+ vnfdPackageDetails['ext-cpd'].forEach((cp: EXTCPD): void => {
this.nodes.push({
- id: vdu.name, nodeTypeRef: 'vdu', 'cloud-init-file': vdu['cloud-init-file'], count: vdu.count, description: vdu.description,
- vduID: vdu.id, name: vdu.name, interface: vdu.interface, 'vm-flavor': vdu['vm-flavor']
+ id: cp['int-cpd'] !== undefined ? cp['int-cpd'].cpd : cp.id,
+ name: cp.id,
+ reflexive: false,
+ type: 'cp'
});
});
}
}
/** Generate and list Internal VLD @public */
- public generateInternalVLD(vnfdPackageDetails: VNFDNODE): void {
- if (vnfdPackageDetails['internal-vld'] !== undefined) {
- vnfdPackageDetails['internal-vld'].forEach((internalVLD: InternalVLD) => {
+ public generateInternalVLD(vnfdPackageDetails: VNFD): void {
+ if (vnfdPackageDetails['int-virtual-link-desc'] !== undefined) {
+ vnfdPackageDetails['int-virtual-link-desc'].forEach((ivld: IVLD): void => {
this.nodes.push({
- id: internalVLD.name, nodeTypeRef: 'intvl', intVLID: internalVLD.id,
- 'internal-connection-point': internalVLD['internal-connection-point'],
- 'ip-profile-ref': internalVLD['ip-profile-ref'], name: internalVLD.name, 'short-name': internalVLD['short-name'],
- type: internalVLD.type
+ id: ivld.id,
+ name: ivld.id,
+ reflexive: false,
+ type: 'intvl'
});
});
}
}
/** Generate and list Internal CP @public */
- public generateInternalCP(vnfdPackageDetails: VNFDNODE): void {
+ public generateInternalCP(vnfdPackageDetails: VNFD): void {
if (vnfdPackageDetails.vdu !== undefined) {
- vnfdPackageDetails.vdu.forEach((intCP: VDUInternalConnectionPoint) => {
- if (intCP['internal-connection-point'] !== undefined) {
- intCP['internal-connection-point'].forEach((internalCP: VDUInternalConnectionPoint) => {
- this.nodes.push({
- id: internalCP.name, nodeTypeRef: 'intcp', name: internalCP.name,
- 'short-name': internalCP['short-name'], type: internalCP.type
- });
+ vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ if (vdu['int-cpd'] !== undefined) {
+ vdu['int-cpd'].forEach((intcpd: VDUINTCPD): void => {
+ if (intcpd['int-virtual-link-desc'] !== undefined) {
+ intcpd['virtual-network-interface-requirement'].forEach((vnir: VNIR): void => {
+ this.nodes.push({
+ id: intcpd.id,
+ name: vnir.name,
+ reflexive: false,
+ type: 'intcp'
+ });
+ });
+ }
});
}
});
}
}
/** Generate VDU External and Internal CP Links @public */
- public generateVDUCPLinks(vnfdPackageDetails: VNFDNODE): void {
+ public generateVDUCPLinks(vnfdPackageDetails: VNFD): void {
if (vnfdPackageDetails.vdu !== undefined) {
- vnfdPackageDetails.vdu.forEach((vdu: VDU) => {
- const vduLink: string = vdu.name;
- if (vdu.interface !== undefined) {
- vdu.interface.forEach((interfaceDetails: VNFDInterface) => {
- if (interfaceDetails['external-connection-point-ref'] !== undefined) {
- this.links.push({ source: vduLink, target: interfaceDetails['external-connection-point-ref'] });
- }
- if (interfaceDetails['internal-connection-point-ref'] !== undefined) {
- this.links.push({ source: vduLink, target: interfaceDetails['internal-connection-point-ref'] });
+ vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ const vduLink: string = vdu.id;
+ if (vdu['int-cpd'] !== undefined) {
+ vdu['int-cpd'].forEach((intCPD: VDUINTCPD): void => {
+ if (intCPD['int-virtual-link-desc'] !== undefined) {
+ intCPD['virtual-network-interface-requirement'].forEach((vnir: VNIR): void => {
+ this.links.push({ source: vduLink, target: intCPD.id });
+ });
+ } else {
+ this.links.push({ source: vduLink, target: intCPD.id });
}
});
}
}
}
/** Generate Network/VLD/Internal VirtualLink, CP Links @public */
- public generateIntVLCPLinks(vnfdPackageDetails: VNFDNODE): void {
- if (vnfdPackageDetails['internal-vld'] !== undefined) {
- vnfdPackageDetails['internal-vld'].forEach((internalVLD: InternalVLD) => {
- const vldName: string = internalVLD.name;
- if (internalVLD['internal-connection-point'] !== undefined) {
- internalVLD['internal-connection-point'].forEach((intCP: VLDInternalConnectionPoint) => {
- this.links.push({ source: vldName, target: intCP['id-ref'] });
+ public generateIntVLCPLinks(vnfdPackageDetails: VNFD): void {
+ if (vnfdPackageDetails.vdu !== undefined) {
+ vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ if (vdu['int-cpd'] !== undefined) {
+ vdu['int-cpd'].forEach((intCPD: VDUINTCPD): void => {
+ const vldName: string = intCPD['int-virtual-link-desc'];
+ if (intCPD['int-virtual-link-desc'] !== undefined) {
+ intCPD['virtual-network-interface-requirement'].forEach((vnir: VNIR): void => {
+ this.links.push({ source: vldName, target: intCPD.id });
+ });
+ }
});
}
});
}
/** VNFD details can be saved on users inputs @public */
public saveVNFD(): void {
- this.vnfdPackageDetails['short-name'] = this.vnfdInfo.shortName;
+ this.vnfdPackageDetails['product-name'] = this.vnfdInfo['product-name'];
this.vnfdPackageDetails.description = this.vnfdInfo.description;
this.vnfdPackageDetails.version = this.vnfdInfo.version;
this.vnfdPackageDetails.id = this.vnfdInfo.id;
- this.vnfdPackageDetails.name = this.vnfdInfo.name;
+ this.vnfdPackageDetails.provider = this.vnfdInfo.provider;
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
- delete this.vnfdPackageDetails.shortName;
}
/** VDU details can be saved on users inputs @public */
- public saveVDU(vduID: string): void {
- this.vnfdPackageDetails.vdu.forEach((ref: VDU) => {
- if (ref.id === vduID) {
- ref.count = this.vduInfo.count;
- ref.description = this.vduInfo.description;
- ref.image = this.vduInfo.image;
+ public saveVDU(getVDUID: string): void {
+ const getOLDVDUID: string = this.oldVDUID;
+ this.vnfdPackageDetails.vdu.forEach((ref: VDU): void => {
+ if (ref.id === getVDUID) {
ref.id = this.vduInfo.id;
ref.name = this.vduInfo.name;
+ ref.description = this.vduInfo.description !== undefined ? this.vduInfo.description : '';
+ ref['sw-image-desc'] = this.vduInfo['sw-image-desc'];
+ }
+ });
+ this.vnfdPackageDetails['ext-cpd'].forEach((extCPD: EXTCPD): void => {
+ if (extCPD['int-cpd'] !== undefined) {
+ if (extCPD['int-cpd']['vdu-id'] === getOLDVDUID) {
+ extCPD['int-cpd']['vdu-id'] = this.vduInfo.id;
+ }
}
});
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
}
/** IntVL details can be saved on users inputs @public */
public saveIntVL(intVLID: string): void {
- this.vnfdPackageDetails['internal-vld'].forEach((ref: InternalVLD) => {
- if (ref.id === intVLID) {
- ref['short-name'] = this.intvlInfo.shortName;
- ref.name = this.intvlInfo.name;
- ref.type = this.intvlInfo.type;
- ref['ip-profile-ref'] = !isNullOrUndefined(this.intvlInfo.ipProfileRef) ? this.intvlInfo.ipProfileRef : '';
- ref.id = this.intvlInfo.id;
- delete ref.shortName;
- delete ref.ipProfileRef;
+ const getOldID: string = this.oldintVLID;
+ this.vnfdPackageDetails['int-virtual-link-desc'].forEach((ivldDetails: IVLD): void => {
+ if (ivldDetails.id === intVLID) {
+ ivldDetails.id = this.intvlInfo.id;
+ }
+ });
+ this.vnfdPackageDetails.vdu.forEach((vduDetails: VDU): void => {
+ if (vduDetails['int-cpd'] !== undefined) {
+ vduDetails['int-cpd'].forEach((intCPDDetails: VDUINTCPD): void => {
+ if (intCPDDetails['int-virtual-link-desc'] !== undefined) {
+ if (intCPDDetails['int-virtual-link-desc'] === getOldID) {
+ intCPDDetails['int-virtual-link-desc'] = this.intvlInfo.id;
+ }
+ }
+ });
}
});
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
}
/** IntVL details can be saved on users inputs @public */
- public saveCP(cpName: string): void {
- this.vnfdPackageDetails['connection-point'].forEach((ref: CONNECTIONPOINT) => {
- if (ref.name === cpName) {
- if (!isNullOrUndefined(this.cpInfo.type)) {
- ref.type = this.cpInfo.type;
- }
- ref.name = this.cpInfo.name;
+ public saveCP(cpID: string): void {
+ const getOldCP: string = this.oldCPID;
+ this.vnfdPackageDetails['ext-cpd'].forEach((ref: EXTCPD): void => {
+ if (ref.id === cpID) {
+ ref.id = this.cpInfo.id;
}
});
+ if (this.vnfdPackageDetails['mgmt-cp'] === getOldCP) {
+ this.vnfdPackageDetails['mgmt-cp'] = this.cpInfo.id;
+ }
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
}
/** Edit topology @public */
const modalRef: NgbModalRef = this.modalService.open(ConfirmationTopologyComponent, { backdrop: 'static' });
modalRef.componentInstance.topologyType = 'Info';
modalRef.componentInstance.topologytitle = this.translateService.instant('PAGE.TOPOLOGY.INFO');
- modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
if (result) {
// empty
}
this.force.stop();
}
this.forceSimulationActive = alreadyFixedIsActive;
- this.nodes.forEach((d: COMPOSERNODES) => {
+ this.nodes.forEach((d: COMPOSERNODES): void => {
d.fx = (alreadyFixedIsActive) ? null : d.x;
d.fy = (alreadyFixedIsActive) ? null : d.y;
});
};
}
/** Node is created and render at D3 region @private */
- private createNode(nodes: VNFDNODE[]): void {
+ private createNode(nodes: VNFD[]): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
d3.selectAll('svg#graphContainer > *').remove();
- d3.select(window).on('keydown', () => { this.keyDown(); });
- d3.select(window).on('keyup', () => { this.keyUp(); });
- this.svg = d3.select('#graphContainer').attr('oncontextmenu', 'return false;').attr('width', graphContainerAttr.width)
- .attr('height', graphContainerAttr.height).on('mousemove', () => { this.mousemove(); });
+ d3.select(window).on('keydown', (): void => { this.keyDown(); });
+ d3.select(window).on('keyup', (): void => { this.keyUp(); });
+ this.svg = d3.select('#graphContainer')
+ .attr('oncontextmenu', 'return false;')
+ .attr('viewBox', `0 0 ${graphContainerAttr.width} ${graphContainerAttr.height}`)
+ .on('mousemove', (): void => { this.mousemove(); });
this.force = d3.forceSimulation()
- .force('link', d3.forceLink().id((d: TickPath) => d.id).distance(graphContainerAttr.distance))
+ .force('link', d3.forceLink().id((d: TickPath): string => d.id).distance(graphContainerAttr.distance))
.force('charge', d3.forceManyBody().strength(graphContainerAttr.strength))
.force('x', d3.forceX(graphContainerAttr.width / graphContainerAttr.forcex))
.force('y', d3.forceY(graphContainerAttr.height / graphContainerAttr.forcey))
- .on('tick', () => { this.tick(); });
+ .on('tick', (): void => { this.tick(); });
this.path = this.svg.append('svg:g').selectAll('path');
this.dragLine = this.svg.append('svg:path').attr('class', 'link dragline hidden').attr('d', 'M0,0L0,0');
this.network = this.svg.append('svg:g').selectAll('network');
/** Update force layout (called automatically each iteration) @private */
private tick(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
- this.path.attr('d', (d: Tick) => {
+ this.path.attr('d', (d: Tick): string => {
const deltaX: number = d.target.x - d.source.x; const deltaY: number = d.target.y - d.source.y;
const dist: number = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
const normX: number = deltaX / dist; const normY: number = deltaY / dist;
const sourceX: number = d.source.x + (sourcePadding * normX); const sourceY: number = d.source.y + (sourcePadding * normY);
const targetX: number = d.target.x - (targetPadding * normX); const targetY: number = d.target.y - (targetPadding * normY);
return `M${sourceX},${sourceY}L${targetX},${targetY}`;
- }).on('dblclick', (d: Tick) => { this.getDeleteLinkConfirmation(d); });
- this.network.attr('transform', (d: TickPath) => `translate(${d.x},${d.y})`);
- this.virutualDeploymentUnit.attr('transform', (d: TickPath) => `translate(${d.x},${d.y})`);
- this.connectionPoint.attr('transform', (d: TickPath) => `translate(${d.x},${d.y})`);
- this.intConnectionPoint.attr('transform', (d: TickPath) => `translate(${d.x},${d.y})`);
+ }).on('dblclick', (d: Tick): void => { this.getDeleteLinkConfirmation(d); });
+ this.network.attr('transform', (d: TickPath): string => `translate(${d.x},${d.y})`);
+ this.virutualDeploymentUnit.attr('transform', (d: TickPath): string => `translate(${d.x},${d.y})`);
+ this.connectionPoint.attr('transform', (d: TickPath): string => `translate(${d.x},${d.y})`);
+ this.intConnectionPoint.attr('transform', (d: TickPath): string => `translate(${d.x},${d.y})`);
}
/** Update graph (called when needed) @private */
- private restart(nodes: VNFDNODE[]): void {
+ private restart(nodes: VNFD[]): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
this.path = this.path.data(this.links);
const cpNodes: {}[] = []; const vduNodes: {}[] = []; const vlNodes: {}[] = []; const intcpNodes: {}[] = []; //Nodes are known by id
- nodes.forEach((nodeList: VNFDNODE) => {
- if (nodeList.nodeTypeRef === 'cp') { cpNodes.push(nodeList); }
- else if (nodeList.nodeTypeRef === 'vdu') { vduNodes.push(nodeList); }
- else if (nodeList.nodeTypeRef === 'intvl') { vlNodes.push(nodeList); }
- else if (nodeList.nodeTypeRef === 'intcp') { intcpNodes.push(nodeList); }
+ nodes.forEach((nodeList: COMPOSERNODES): void => {
+ if (nodeList.type === 'cp') { cpNodes.push(nodeList); }
+ else if (nodeList.type === 'vdu') { vduNodes.push(nodeList); }
+ else if (nodeList.type === 'intvl') { vlNodes.push(nodeList); }
+ else if (nodeList.type === 'intcp') { intcpNodes.push(nodeList); }
});
- this.network = this.network.data(vlNodes, (d: { id: number }) => d.id);
- this.virutualDeploymentUnit = this.virutualDeploymentUnit.data(vduNodes, (d: { id: number }) => d.id);
- this.connectionPoint = this.connectionPoint.data(cpNodes, (d: { id: number }) => d.id);
- this.intConnectionPoint = this.intConnectionPoint.data(intcpNodes, (d: { id: number }) => d.id);
+ this.network = this.network.data(vlNodes, (d: VNFD): string => d.id);
+ this.virutualDeploymentUnit = this.virutualDeploymentUnit.data(vduNodes, (d: VNFD): string => d.id);
+ this.connectionPoint = this.connectionPoint.data(cpNodes, (d: VNFD): string => d.id);
+ this.intConnectionPoint = this.intConnectionPoint.data(intcpNodes, (d: VNFD): string => d.id);
this.resetAndCreateNodes();
this.force.nodes(nodes).force('link').links(this.links); //Set the graph in motion
this.force.alphaTarget(graphContainerAttr.alphaTarget).restart();
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: VNFDNODE) => { return d.id; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.id; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/INTVL.svg')
- .on('mousedown', (d: VNFDNODE) => { this.mouseDown(d); })
- .on('mouseup', (d: VNFDNODE) => { this.mouseUp(d); })
- .on('click', (d: VNFDNODE) => { this.singleClick(this.network, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: VNFDNODE) => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.network, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gNetwork.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: { id: number }) => d.id);
+ .text((d: COMPOSERNODES): string => d.id);
}
/** Settings all the connection point attributes of nodes @private */
private getgVirutualDeploymentUnit(): void {
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: VNFDNODE) => { return d.id; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.id; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/VDU.svg')
- .on('mousedown', (d: VNFDNODE) => { this.mouseDown(d); })
- .on('mouseup', (d: VNFDNODE) => { this.mouseUp(d); })
- .on('click', (d: VNFDNODE) => { this.singleClick(this.virutualDeploymentUnit, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: VNFDNODE) => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.virutualDeploymentUnit, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gVirutualDeploymentUnit.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: { id: string }) => d.id);
+ .text((d: COMPOSERNODES): string => d.id);
}
/** Settings all the connection point attributes of nodes @private */
private getgConnectionPoint(): void {
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: VNFDNODE) => { return d.id; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.id; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/CP-VNF.svg')
- .on('mousedown', (d: VNFDNODE) => { this.mouseDown(d); })
- .on('mouseup', (d: VNFDNODE) => { this.mouseUp(d); })
- .on('click', (d: VNFDNODE) => { this.singleClick(this.connectionPoint, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: VNFDNODE) => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.connectionPoint, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gConnectionPoint.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: { id: string }) => d.id);
+ .text((d: COMPOSERNODES): string => d.name);
}
/** Settings all the internal connection point attributes of nodes @private */
private getgIntConnectionPoint(): void {
.style('opacity', 1)
.attr('x', graphContainerAttr.imageX)
.attr('y', graphContainerAttr.imageY)
- .attr('id', (d: VNFDNODE) => { return d.id; })
+ .call(this.onDragDrop())
+ .attr('id', (d: COMPOSERNODES): string => { return d.id; })
.attr('class', 'node').attr('width', graphContainerAttr.nodeWidth).attr('height', graphContainerAttr.nodeHeight)
.attr('xlink:href', 'assets/images/INTCP.svg')
- .on('mousedown', (d: VNFDNODE) => { this.mouseDown(d); })
- .on('mouseup', (d: VNFDNODE) => { this.mouseUp(d); })
- .on('click', (d: VNFDNODE) => { this.singleClick(this.intConnectionPoint, d); this.onNodeClickToggleSidebar(); })
- .on('dblclick', (d: VNFDNODE) => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
+ .on('mousedown', (d: COMPOSERNODES): void => { this.mouseDown(d); })
+ .on('mouseup', (d: COMPOSERNODES): void => { this.mouseUp(d); })
+ .on('click', (d: COMPOSERNODES): void => { this.singleClick(this.intConnectionPoint, d); this.onNodeClickToggleSidebar(); })
+ .on('dblclick', (d: COMPOSERNODES): void => { this.getDeleteNodeConfirmation(d); this.onNodedblClickToggleSidebar(); });
this.gIntConnectionPoint.append('svg:text')
.attr('class', 'node_text')
.attr('y', graphContainerAttr.textY)
- .text((d: { id: string }) => d.id);
+ .text((d: COMPOSERNODES): string => d.name);
}
/** Drop VDU Composer Data @private */
private vduDropCompose(): void {
const randomID: string = this.sharedService.randomString();
- const vduNode: VNFDNODE[] = [{
- nodeTypeRef: 'vdu', id: 'vdu_' + randomID, count: 1, description: '', name: 'vdu_' + randomID, image: 'ubuntu',
- interface: [], 'internal-connection-point': [], 'monitoring-param': [], 'vm-flavor': {}
- }];
- const nodeCopy: VNFDNODE[] = this.nodes;
- Array.prototype.push.apply(vduNode, nodeCopy);
- this.nodes = vduNode;
- if (this.vnfdPackageDetails.vdu === undefined) { this.vnfdPackageDetails.vdu = []; }
+ if (this.vnfdPackageDetails.vdu === undefined) {
+ this.vnfdPackageDetails.vdu = [];
+ }
this.vnfdPackageDetails.vdu.push({
- id: 'vdu_' + randomID, count: 1, description: '', name: 'vdu_' + randomID, image: 'ubuntu',
- interface: [], 'internal-connection-point': [], 'monitoring-param': [], 'vm-flavor': {}
+ id: 'vdu_' + randomID,
+ name: 'vdu_' + randomID,
+ description: '',
+ 'sw-image-desc': 'ubuntu',
+ 'int-cpd': [],
+ 'monitoring-parameter': [],
+ 'virtual-compute-desc': '',
+ 'virtual-storage-desc': []
});
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
}
/** Drop CP Composer Data @private */
private cpDropCompose(): void {
const randomID: string = this.sharedService.randomString();
- const cpNode: VNFDNODE[] = [{ nodeTypeRef: 'cp', id: 'cp_' + randomID, name: 'cp_' + randomID }];
- const nodeCopy: VNFDNODE[] = this.nodes;
- Array.prototype.push.apply(cpNode, nodeCopy);
- this.nodes = cpNode;
- if (this.vnfdPackageDetails['connection-point'] === undefined) {
- this.vnfdPackageDetails['connection-point'] = [];
+ if (this.vnfdPackageDetails['ext-cpd'] === undefined) {
+ this.vnfdPackageDetails['ext-cpd'] = [];
+ this.vnfdPackageDetails['mgmt-cp'] = 'cp_' + randomID;
}
- this.vnfdPackageDetails['connection-point'].push({
- id: 'cp_' + randomID, name: 'cp_' + randomID, type: 'VPORT'
+ this.vnfdPackageDetails['ext-cpd'].push({
+ id: 'cp_' + randomID,
+ 'int-cpd': {}
});
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
}
/** Drop IntVL Composer Data @private */
private intvlDropCompose(): void {
const randomID: string = this.sharedService.randomString();
- const intvlNode: VNFDNODE[] = [{
- nodeTypeRef: 'intvl', id: 'vnf_vl_' + randomID, name: 'vnf_vl_' + randomID, 'short-name': 'vnf_vl_' + randomID, 'ip-profile-ref': '',
- type: 'ELAN'
- }];
- const nodeCopy: VNFDNODE[] = this.nodes;
- Array.prototype.push.apply(intvlNode, nodeCopy);
- this.nodes = intvlNode;
- if (this.vnfdPackageDetails['internal-vld'] === undefined) { this.vnfdPackageDetails['internal-vld'] = []; }
- this.vnfdPackageDetails['internal-vld'].push({
- id: 'vnf_vl_' + randomID, name: 'vnf_vl_' + randomID, 'short-name': 'vnf_vl_' + randomID,
- 'ip-profile-ref': '', type: 'ELAN', 'internal-connection-point': []
+ if (this.vnfdPackageDetails['int-virtual-link-desc'] === undefined) {
+ this.vnfdPackageDetails['int-virtual-link-desc'] = [];
+ }
+ this.vnfdPackageDetails['int-virtual-link-desc'].push({
+ id: 'vnf_vl_' + randomID
});
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
}
/** Add the Add Nodes Data @private */
- private addNodes(apiURL: string, identifier: string, data: VNFDNODE): void {
+ private addNodes(apiURL: string, identifier: string, data: VNFD): void {
this.isLoadingResults = true;
const apiURLHeader: APIURLHEADER = {
url: apiURL + '/' + identifier + '/package_content',
httpOptions: { headers: this.headers }
};
- const vnfData: {} = {};
- vnfData['vnfd:vnfd-catalog'] = {};
- vnfData['vnfd:vnfd-catalog'].vnfd = [];
- vnfData['vnfd:vnfd-catalog'].vnfd.push(data);
+ const vnfData: VNFDATA = {};
+ vnfData.vnfd = data;
const descriptorInfo: string = jsyaml.dump(vnfData, { sortKeys: true });
this.sharedService.targzFile({ packageType: 'vnfd', id: this.identifier, descriptor: descriptorInfo })
.then((content: ArrayBuffer): void => {
- this.restService.putResource(apiURLHeader, content).subscribe((res: {}) => {
+ this.restService.putResource(apiURLHeader, content).subscribe((res: {}): void => {
this.generateData();
this.notifierService.notify('success', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.UPDATEDSUCCESSFULLY'));
this.isLoadingResults = false;
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.generateData();
this.restService.handleError(error, 'put');
this.isLoadingResults = false;
});
}
/** Events handles when mousedown click it will capture the selected node data @private */
- private mouseDown(d: VNFDNODE): void {
+ private mouseDown(d: COMPOSERNODES): void {
event.preventDefault();
if (d3.event.ctrlKey) { return; }
if (d3.event.shiftKey) {
}
}
/** Event handles when mouseup event occures @private */
- private mouseUp(d: VNFDNODE): void {
+ private mouseUp(d: COMPOSERNODES): void {
if (!this.mousedownNode) { return; }
this.dragLine.classed('hidden', true);
this.mouseupNode = d;
- if (this.mousedownNode.nodeTypeRef === 'vdu') {
+ if (this.mousedownNode.type === 'vdu') {
this.vduMouseDownNode();
- } else if (this.mousedownNode.nodeTypeRef === 'cp') {
+ } else if (this.mousedownNode.type === 'cp') {
this.cpMouseDownNode();
- } else if (this.mousedownNode.nodeTypeRef === 'intvl') {
+ } else if (this.mousedownNode.type === 'intvl') {
this.intVLMouseDownNode();
- } else if (this.mousedownNode.nodeTypeRef === 'intcp') {
+ } else if (this.mousedownNode.type === 'intcp') {
this.intCPMouseDownNode();
} else {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.INVALIDSELECTION'));
}
/** Establish a connection point between vdu and other nodes @private */
private vduMouseDownNode(): void {
- if (this.mousedownNode.nodeTypeRef === 'vdu' && this.mouseupNode.nodeTypeRef === 'cp') {
+ if (this.mousedownNode.type === 'vdu' && this.mouseupNode.type === 'cp') {
this.vduCPConnection(this.mousedownNode.id, this.mouseupNode.id);
- } else if (this.mousedownNode.nodeTypeRef === 'vdu' && this.mouseupNode.nodeTypeRef === 'intcp') {
+ } else if (this.mousedownNode.type === 'vdu' && this.mouseupNode.type === 'intcp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKVDUANDINTCP'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'vdu' && this.mouseupNode.nodeTypeRef === 'vdu') {
+ } else if (this.mousedownNode.type === 'vdu' && this.mouseupNode.type === 'vdu') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKVDUANDVDU'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'vdu' && this.mouseupNode.nodeTypeRef === 'intvl') {
+ } else if (this.mousedownNode.type === 'vdu' && this.mouseupNode.type === 'intvl') {
this.vduIntvlConnection(this.mousedownNode.id, this.mouseupNode.id);
}
}
-
/** Establish a connection point between cp and other nodes @private */
private cpMouseDownNode(): void {
- if (this.mousedownNode.nodeTypeRef === 'cp' && this.mouseupNode.nodeTypeRef === 'vdu') {
+ if (this.mousedownNode.type === 'cp' && this.mouseupNode.type === 'vdu') {
this.vduCPConnection(this.mouseupNode.id, this.mousedownNode.id);
- } else if (this.mousedownNode.nodeTypeRef === 'cp' && this.mouseupNode.nodeTypeRef === 'intvl') {
+ } else if (this.mousedownNode.type === 'cp' && this.mouseupNode.type === 'intvl') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKCPANDVNFVL'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'cp' && this.mouseupNode.nodeTypeRef === 'intcp') {
+ } else if (this.mousedownNode.type === 'cp' && this.mouseupNode.type === 'intcp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKCPANDINTCP'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'cp' && this.mouseupNode.nodeTypeRef === 'cp') {
+ } else if (this.mousedownNode.type === 'cp' && this.mouseupNode.type === 'cp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKCPANDCP'));
this.deselectPath();
}
}
-
/** Establish a connection piont between intvl and other nodes @private */
private intVLMouseDownNode(): void {
- if (this.mousedownNode.nodeTypeRef === 'intvl' && this.mouseupNode.nodeTypeRef === 'cp') {
+ if (this.mousedownNode.type === 'intvl' && this.mouseupNode.type === 'cp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKVNFVLANDCP'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'intvl' && this.mouseupNode.nodeTypeRef === 'vdu') {
+ } else if (this.mousedownNode.type === 'intvl' && this.mouseupNode.type === 'vdu') {
this.vduIntvlConnection(this.mouseupNode.id, this.mousedownNode.id);
- } else if (this.mousedownNode.nodeTypeRef === 'intvl' && this.mouseupNode.nodeTypeRef === 'intvl') {
+ } else if (this.mousedownNode.type === 'intvl' && this.mouseupNode.type === 'intvl') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKVNFVLANDVNFVL'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'intvl' && this.mouseupNode.nodeTypeRef === 'intcp') {
+ } else if (this.mousedownNode.type === 'intvl' && this.mouseupNode.type === 'intcp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKVNFVLANDONTCP'));
this.deselectPath();
}
}
-
/** Establish a connection point between intcp and other nodes @private */
private intCPMouseDownNode(): void {
- if (this.mousedownNode.nodeTypeRef === 'intcp' && this.mouseupNode.nodeTypeRef === 'vdu') {
+ if (this.mousedownNode.type === 'intcp' && this.mouseupNode.type === 'vdu') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKINTCPANDVDU'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'intcp' && this.mouseupNode.nodeTypeRef === 'cp') {
+ } else if (this.mousedownNode.type === 'intcp' && this.mouseupNode.type === 'cp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKINTCPANDCP'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'intcp' && this.mouseupNode.nodeTypeRef === 'intvl') {
+ } else if (this.mousedownNode.type === 'intcp' && this.mouseupNode.type === 'intvl') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKINTCPANDVNFVL'));
this.deselectPath();
- } else if (this.mousedownNode.nodeTypeRef === 'intcp' && this.mouseupNode.nodeTypeRef === 'intcp') {
+ } else if (this.mousedownNode.type === 'intcp' && this.mouseupNode.type === 'intcp') {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.CANNOTLINKINTCPANDINTCP'));
this.deselectPath();
}
}
-
/** Establish a connection between VDU & CP vice versa @private */
private vduCPConnection(nodeA: string, nodeB: string): void {
- this.vnfdPackageDetails.vdu.forEach((vduDetails: VDU) => {
- if (vduDetails.id === nodeA) {
- if (vduDetails.interface === undefined) { vduDetails.interface = []; }
- vduDetails.interface.push({
- 'external-connection-point-ref': nodeB, 'mgmt-interface': true,
- name: 'eth_' + this.sharedService.randomString(),
- 'virtual-interface': { type: 'VIRTIO' },
- type: 'EXTERNAL'
- });
- if (vduDetails['internal-connection-point'] === undefined) {
- vduDetails['internal-connection-point'] = [];
- }
- if (vduDetails['monitoring-param'] === undefined) {
- vduDetails['monitoring-param'] = [];
- }
- if (vduDetails['vm-flavor'] === undefined) {
- vduDetails['vm-flavor'] = {};
+ const vduExternalID: string = nodeA + '-eth_' + this.sharedService.randomString();
+ if (this.vnfdPackageDetails.vdu !== undefined) {
+ this.vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ const vduID: string = vdu.id;
+ if (vdu.id === nodeA) {
+ if (this.vnfdPackageDetails['ext-cpd'] !== undefined) {
+ this.vnfdPackageDetails['ext-cpd'].forEach((extcpd: EXTCPD, index: number): void => {
+ if (extcpd.id === nodeB) {
+ if (vdu['int-cpd'] === undefined) {
+ vdu['int-cpd'] = [];
+ }
+ if (extcpd['int-cpd'] === undefined) {
+ vdu['int-cpd'].push({
+ id: vduExternalID,
+ 'virtual-network-interface-requirement': [
+ {
+ name: vduExternalID,
+ position: 1,
+ 'virtual-interface': { type: 'PARAVIRT' }
+ }
+ ]
+ });
+ this.vnfdPackageDetails['ext-cpd'][index] = {
+ id: extcpd.id,
+ 'int-cpd': {
+ cpd: vduExternalID,
+ 'vdu-id': vduID
+ }
+ };
+ }
+ }
+ });
+ }
}
- }
- });
+ });
+ }
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
this.deselectPath();
}
-
/** Establish a connection between vdu & intvl and vice versa @private */
private vduIntvlConnection(nodeA: string, nodeB: string): void {
- const setIntCP: string = 'intcp_' + this.sharedService.randomString();
- this.vnfdPackageDetails['internal-vld'].forEach((vldInternal: InternalVLD) => {
- if (vldInternal.id === nodeB) {
- if (vldInternal['internal-connection-point'] === undefined) { vldInternal['internal-connection-point'] = []; }
- vldInternal['internal-connection-point'].push({ 'id-ref': setIntCP });
- }
- });
- this.vnfdPackageDetails.vdu.forEach((vduDetails: VDU) => {
- if (vduDetails.id === nodeA) {
- if (vduDetails.interface === undefined) {
- vduDetails.interface = [];
- }
- vduDetails.interface.push({
- 'internal-connection-point-ref': setIntCP, name: 'int_' + setIntCP, type: 'INTERNAL', 'virtual-interface': { type: 'VIRTIO' }
- });
- if (vduDetails['internal-connection-point'] === undefined) {
- vduDetails['internal-connection-point'] = [];
+ const vduInternalID: string = nodeA + '-eth_' + this.sharedService.randomString();
+ if (this.vnfdPackageDetails.vdu !== undefined) {
+ this.vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ if (vdu.id === nodeA) {
+ if (vdu['int-cpd'] === undefined) {
+ vdu['int-cpd'] = [];
+ }
+ vdu['int-cpd'].push({
+ id: vduInternalID,
+ 'int-virtual-link-desc': nodeB,
+ 'virtual-network-interface-requirement': [
+ {
+ name: vduInternalID,
+ position: 1,
+ 'virtual-interface': { type: 'PARAVIRT' }
+ }
+ ]
+ });
}
- vduDetails['internal-connection-point'].push({
- id: setIntCP, name: setIntCP, 'short-name': setIntCP, type: 'VPORT'
- });
- }
- });
+ });
+ }
this.addNodes(environment.VNFPACKAGES_URL, this.identifier, this.vnfdPackageDetails);
this.deselectPath();
}
-
/** Events handles when mousemove it will capture the selected node data @private */
private mousemove(): void {
if (!this.mousedownNode) { return; }
this.mousedownNode = null;
this.mouseupNode = null;
}
+ /** drag event @private */
+ // tslint:disable-next-line: no-any
+ private onDragDrop(): any {
+ return d3.drag().filter(this.dragFilter)
+ .on('start', this.dragstarted)
+ .on('drag', this.dragged)
+ .on('end', this.dragended);
+ }
/** Key press event @private */
private keyDown(): void {
const graphContainerAttr: GRAPHDETAILS = this.getGraphContainerAttr();
if (this.lastKeyDown !== -1) { return; }
this.lastKeyDown = d3.event.keyCode;
if (d3.event.keyCode === graphContainerAttr.shiftKeyCode) {
- this.gNetwork.call(d3.drag().on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended));
- this.gVirutualDeploymentUnit.call(d3.drag().on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended));
- this.gConnectionPoint.call(d3.drag().on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended));
- this.gIntConnectionPoint.call(d3.drag().on('start', this.dragstarted).on('drag', this.dragged).on('end', this.dragended));
this.svg.classed('ctrl', true);
}
}
}
/** Events handles when Shift Click to perform create cp @private */
// tslint:disable-next-line: no-any
- private singleClick(nodeSelected: any, d: VNFDNODE): void {
+ private singleClick(nodeSelected: any, d: COMPOSERNODES): void {
this.selectedNode(nodeSelected, d);
}
/** Get confirmation Before Deleting the Node in Topology @private */
- private getDeleteNodeConfirmation(d: VNFDNODE): void {
+ private getDeleteNodeConfirmation(d: COMPOSERNODES): void {
const modalRef: NgbModalRef = this.modalService.open(ConfirmationTopologyComponent, { backdrop: 'static' });
modalRef.componentInstance.topologyType = 'Delete';
modalRef.componentInstance.topologyname = d.name;
- if (d.nodeTypeRef === 'vdu') {
+ if (d.type === 'vdu') {
modalRef.componentInstance.topologytitle = 'PAGE.TOPOLOGY.VDU';
- } else if (d.nodeTypeRef === 'intvl') {
+ } else if (d.type === 'intvl') {
modalRef.componentInstance.topologytitle = 'PAGE.TOPOLOGY.INTVL';
- } else if (d.nodeTypeRef === 'cp') {
+ } else if (d.type === 'cp') {
modalRef.componentInstance.topologytitle = 'PAGE.TOPOLOGY.CONNECTIONPOINT';
- } else if (d.nodeTypeRef === 'intcp') {
+ } else if (d.type === 'intcp') {
modalRef.componentInstance.topologytitle = 'PAGE.TOPOLOGY.INTCP';
}
- modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
+ modalRef.result.then((result: MODALCLOSERESPONSEDATA): void => {
if (result) {
this.deleteNode(d);
}
}).catch();
}
/** Delete nodes @private */
- private deleteNode(d: VNFDNODE): void {
- const deletedNode: VNFDNODE = d;
- this.nodes.forEach((node: VNFDNODE) => {
+ private deleteNode(d: COMPOSERNODES): void {
+ // tslint:disable-next-line: max-func-body-length
+ this.nodes.forEach((node: VNFD): void => {
if (node.id === d.id) {
- if (deletedNode.nodeTypeRef === 'cp') {
- if (this.vnfdPackageDetails.vdu !== undefined) {
- this.vnfdPackageDetails.vdu.forEach((vduDetails: VDU) => {
- if (vduDetails.interface !== undefined) {
- const interfacePos: number = vduDetails.interface.map((e: VNFDInterface) => { return e['external-connection-point-ref']; })
- .indexOf(d.id);
- if (interfacePos >= 0) {
- vduDetails.interface.splice(interfacePos, 1);
+ if (d.type === 'cp') {
+ if (this.vnfdPackageDetails['ext-cpd'] !== undefined) {
+ let getRelatedVDUCPD: string; let getRelatedVDUID: string;
+ const posExtCPD: number = this.vnfdPackageDetails['ext-cpd'].findIndex((e: EXTCPD): boolean => {
+ if (e.id === d.name) {
+ if (e['int-cpd'] !== undefined) {
+ getRelatedVDUCPD = e['int-cpd'].cpd; getRelatedVDUID = e['int-cpd']['vdu-id'];
}
+ return true;
+ } else {
+ return false;
}
});
- }
- const cpPos: number = this.vnfdPackageDetails['connection-point'].map((e: CONNECTIONPOINT) => { return e.name; })
- .indexOf(d.id);
- if (cpPos >= 0) {
- this.vnfdPackageDetails['connection-point'].splice(cpPos, 1);
- }
- } else if (deletedNode.nodeTypeRef === 'intcp') {
- this.vnfdPackageDetails.vdu.forEach((vduDetails: VDU) => {
- // Delete Interface
- const interfacePos: number = vduDetails.interface.map((e: VNFDInterface) => { return e['internal-connection-point-ref']; })
- .indexOf(d.id);
- if (interfacePos >= 0) {
- vduDetails.interface.splice(interfacePos, 1);
+ if (posExtCPD !== -1) {
+ this.vnfdPackageDetails['ext-cpd'].splice(posExtCPD, 1);
}
- // Delete Internal CP
- const interCPPos: number = vduDetails['internal-connection-point']
- .map((e: VDUInternalConnectionPoint) => { return e.id; })
- .indexOf(d.id);
- if (interCPPos >= 0) {
- vduDetails['internal-connection-point'].splice(interCPPos, 1);
+ if (getRelatedVDUCPD !== undefined && getRelatedVDUID !== undefined) {
+ this.vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ if (vdu.id === getRelatedVDUID) {
+ const posINTCPD: number = vdu['int-cpd'].findIndex((intCPD: VDUINTCPD): boolean => {
+ return intCPD.id === getRelatedVDUCPD;
+ });
+ if (posINTCPD !== -1) {
+ vdu['int-cpd'].splice(posINTCPD, 1);
+ }
+ }
+ });
}
- });
- if (this.vnfdPackageDetails['internal-vld'] !== undefined && this.vnfdPackageDetails['internal-vld'].length > 0) {
- this.vnfdPackageDetails['internal-vld'].forEach((internalVLD: InternalVLD) => {
- const interfacePos: number = internalVLD['internal-connection-point']
- .map((e: VLDInternalConnectionPoint) => { return e['id-ref']; }).indexOf(d.id);
- if (interfacePos >= 0) {
- internalVLD['internal-connection-point'].splice(interfacePos, 1);
- }
- });
}
- } else if (deletedNode.nodeTypeRef === 'intvl') {
- const intvlPos: number = this.vnfdPackageDetails['internal-vld']
- .map((e: InternalVLD) => { return e.name; }).indexOf(d.id);
- if (intvlPos >= 0) {
- this.vnfdPackageDetails['internal-vld'].splice(intvlPos, 1);
+ } else if (d.type === 'intcp') {
+ this.vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ const posINTCPD: number = vdu['int-cpd'].findIndex((intCPD: VDUINTCPD): boolean => {
+ return intCPD.id === d.id;
+ });
+ if (posINTCPD !== -1) {
+ vdu['int-cpd'].splice(posINTCPD, 1);
+ }
+ });
+ } else if (d.type === 'intvl') {
+ const posINTVLD: number = this.vnfdPackageDetails['int-virtual-link-desc'].findIndex((intVLD: IVLD): boolean => {
+ return intVLD.id === d.id;
+ });
+ if (posINTVLD !== -1) {
+ this.vnfdPackageDetails['int-virtual-link-desc'].splice(posINTVLD, 1);
}
- } else if (deletedNode.nodeTypeRef === 'vdu') {
- const internalCPList: string[] = [];
- if (deletedNode.interface !== undefined && deletedNode.interface.length > 0) {
- deletedNode.interface.forEach((interfaceNode: InternalVLD) => {
- if (interfaceNode['internal-connection-point-ref'] !== undefined) {
- internalCPList.push(interfaceNode['internal-connection-point-ref']);
+ if (this.vnfdPackageDetails.vdu !== undefined) {
+ this.vnfdPackageDetails.vdu.forEach((vduDetails: VDU): void => {
+ if (vduDetails['int-cpd'] !== undefined) {
+ const newVDUintCPDArray: VDUINTCPD[] = vduDetails['int-cpd'].filter((item: VDUINTCPD): boolean => {
+ return item['int-virtual-link-desc'] !== undefined ? item['int-virtual-link-desc'] !== d.id ? true : false : true;
+ });
+ vduDetails['int-cpd'] = newVDUintCPDArray;
}
});
}
- internalCPList.forEach((list: string) => {
- if (this.vnfdPackageDetails['internal-vld'] !== undefined && this.vnfdPackageDetails['internal-vld'].length > 0) {
- this.vnfdPackageDetails['internal-vld'].forEach((internalVLD: InternalVLD) => {
- const interfacePos: number = internalVLD['internal-connection-point']
- .map((e: VLDInternalConnectionPoint) => { return e['id-ref']; }).indexOf(list);
- if (interfacePos >= 0) {
- internalVLD['internal-connection-point'].splice(interfacePos, 1);
- }
- });
+ } else if (d.type === 'vdu') {
+ const getRelatedExtCPD: string[] = [];
+ const posVDU: number = this.vnfdPackageDetails.vdu.findIndex((vduDetails: VDU): boolean => {
+ if (vduDetails.id === d.id) {
+ if (vduDetails['int-cpd'] !== undefined) {
+ vduDetails['int-cpd'].forEach((intCPDDetails: VDUINTCPD): void => {
+ if (intCPDDetails['int-virtual-link-desc'] === undefined) {
+ getRelatedExtCPD.push(intCPDDetails.id);
+ }
+ });
+ }
+ return true;
+ } else {
+ return false;
}
});
- const vduPos: number = this.vnfdPackageDetails.vdu.map((e: VDU) => { return e.id; }).indexOf(d.id);
- if (vduPos >= 0) {
- this.vnfdPackageDetails.vdu.splice(vduPos, 1);
+ if (posVDU !== -1) {
+ this.vnfdPackageDetails.vdu.splice(posVDU, 1);
}
+ getRelatedExtCPD.forEach((CPDID: string, index: number): void => {
+ this.vnfdPackageDetails['ext-cpd'].forEach((extCPD: EXTCPD): void => {
+ if (extCPD['int-cpd'] !== undefined) {
+ if (extCPD['int-cpd'].cpd === CPDID) {
+ delete extCPD['int-cpd'];
+ }
+ }
+ });
+ });
} else {
this.notifierService.notify('warning', this.translateService.instant('PAGE.VNFPACKAGE.VNFCOMPOSE.INVALIDSELECTION'));
}
}
/** Selected nodes @private */
// tslint:disable-next-line: no-any
- private selectedNode(nodeSeleced: any, d: VNFDNODE): void {
+ private selectedNode(nodeSeleced: any, d: COMPOSERNODES): void {
const alreadyIsActive: boolean = nodeSeleced.select('#' + d.id).classed(this.activeNode);
this.deselectAllNodes();
nodeSeleced.select('#' + d.id).classed(this.activeNode, !alreadyIsActive);
- if (d.nodeTypeRef === 'vdu' && !alreadyIsActive) {
- this.vnfdPackageDetails.vdu.forEach((res: VDU) => {
- if (res.name === d.id) {
+ if (d.type === 'vdu' && !alreadyIsActive) {
+ this.vnfdPackageDetails.vdu.forEach((res: VDU): void => {
+ if (res.id === d.id) {
this.showRightSideInfo = 'vduInfo';
this.vduInfo = res;
+ this.oldVDUID = res.id;
}
});
- } else if (d.nodeTypeRef === 'intvl' && !alreadyIsActive) {
- this.vnfdPackageDetails['internal-vld'].forEach((res: InternalVLD) => {
- if (res.name === d.id) {
- this.showRightSideInfo = 'intvlInfo';
- this.intvlInfo = res;
- this.intvlInfo.shortName = res['short-name'];
- this.intvlInfo.ipProfileRef = res['ip-profile-ref'];
+ } else if (d.type === 'cp' && !alreadyIsActive) {
+ this.vnfdPackageDetails['ext-cpd'].forEach((cp: EXTCPD): void => {
+ const getCPDID: string = cp['int-cpd'] !== undefined ? cp['int-cpd'].cpd : cp.id;
+ if (getCPDID === d.id) {
+ this.showRightSideInfo = 'cpInfo';
+ this.cpInfo = cp;
+ this.oldCPID = cp.id;
}
});
- } else if (d.nodeTypeRef === 'cp' && !alreadyIsActive) {
- this.vnfdPackageDetails['connection-point'].forEach((res: CONNECTIONPOINT) => {
- if (res.name === d.id) {
- this.showRightSideInfo = 'cpInfo';
- this.cpInfo = res;
+ } else if (d.type === 'intvl' && !alreadyIsActive) {
+ this.vnfdPackageDetails['int-virtual-link-desc'].forEach((ivld: IVLD): void => {
+ if (ivld.id === d.id) {
+ this.showRightSideInfo = 'intvlInfo';
+ this.intvlInfo = ivld;
+ this.oldintVLID = ivld.id;
}
});
- }
- else if (d.nodeTypeRef === 'intcp' && !alreadyIsActive) {
- this.intcpInfo = d;
- this.showRightSideInfo = 'intcpInfo';
- this.intcpInfo.shortName = d['short-name'];
+ } else if (d.type === 'intcp' && !alreadyIsActive) {
+ this.vnfdPackageDetails.vdu.forEach((vdu: VDU): void => {
+ vdu['int-cpd'].forEach((intcpd: VDUINTCPD): void => {
+ if (intcpd.id === d.id) {
+ if (intcpd['int-virtual-link-desc'] !== undefined) {
+ intcpd['virtual-network-interface-requirement'].forEach((vnir: VNIR): void => {
+ this.intcpInfo = vnir;
+ this.showRightSideInfo = 'intcpInfo';
+ });
+ }
+ }
+ });
+ });
} else {
this.showRightSideInfo = 'vnfdInfo';
}
this.connectionPoint.select('image').classed(this.activeNode, false);
this.intConnectionPoint.select('image').classed(this.activeNode, false);
}
+ /** Events handles when to drag using filter for the keys @private */
+ private dragFilter(): boolean {
+ return d3.event.ctrlKey && !d3.event.button;
+ }
/** Events handles when dragstarted @private */
private dragstarted(d: COMPOSERNODES): void {
d.fx = d.x;
import { RestService } from 'RestService';
import { Subscription } from 'rxjs';
import { SharedService } from 'SharedService';
-import { VNFData, VNFDDetails } from 'VNFDModel';
+import { VNFD, VNFData } from 'VNFDModel';
import { VNFPackagesActionComponent } from 'VNFPackagesAction';
/**
Accept: 'application/json',
'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
});
- this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
+ this.generateDataSub = this.sharedService.dataEvent.subscribe((): void => { this.generateData(); });
}
/** smart table Header Colums @public */
public generateColumns(): void {
this.columnLists = {
productName: { title: this.translateService.instant('PRODUCTNAME'), width: '15%', sortDirection: 'asc' },
- identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
+ identifier: { title: this.translateService.instant('IDENTIFIER'), width: '15%' },
+ version: { title: this.translateService.instant('VERSION'), width: '10%' },
+ provider: { title: this.translateService.instant('PROVIDER'), width: '10%' },
type: {
title: this.translateService.instant('TYPE'),
filter: {
]
}
},
- width: '15%'
+ width: '10%'
},
description: { title: this.translateService.instant('DESCRIPTION'), width: '25%' },
- version: { title: this.translateService.instant('VERSION'), width: '10%' },
Actions: {
name: 'Action', width: '15%', filter: false, sort: false, type: 'custom',
title: this.translateService.instant('ACTIONS'),
/** Post the droped files and reload the page @public */
public saveFileData(urlHeader: APIURLHEADER, fileData: {}): void {
this.fileInput.nativeElement.value = null;
- this.restService.postResource(urlHeader, fileData).subscribe((result: {}) => {
+ this.restService.postResource(urlHeader, fileData).subscribe((result: {}): void => {
this.notifierService.notify('success', this.translateService.instant('PAGE.VNFPACKAGE.CREATEDSUCCESSFULLY'));
this.generateData();
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'post');
this.isLoadingResults = false;
});
}
/** Generate nsData object from loop and return for the datasource @public */
- public generatevnfdData(vnfdpackagedata: VNFDDetails): VNFData {
+ public generatevnfdData(vnfdpackagedata: VNFD): VNFData {
return {
productName: vnfdpackagedata['product-name'],
identifier: vnfdpackagedata._id,
type: vnfdpackagedata._admin.type,
description: vnfdpackagedata.description,
- version: vnfdpackagedata.version
+ version: vnfdpackagedata.version,
+ provider: vnfdpackagedata.provider !== undefined ? vnfdpackagedata.provider : '-'
};
}
/** Handle compose new ns package method @public */
/** Fetching the data from server to Load in the smarttable @protected */
protected generateData(): void {
this.isLoadingResults = true;
- this.restService.getResource(environment.VNFPACKAGESCONTENT_URL).subscribe((vnfdPackageData: VNFDDetails[]) => {
+ this.restService.getResource(environment.VNFPACKAGESCONTENT_URL).subscribe((vnfdPackageData: VNFD[]): void => {
this.vnfData = [];
- vnfdPackageData.forEach((vnfdpackagedata: VNFDDetails) => {
+ vnfdPackageData.forEach((vnfdpackagedata: VNFD): void => {
const vnfDataObj: VNFData = this.generatevnfdData(vnfdpackagedata);
this.vnfData.push(vnfDataObj);
});
} else {
this.checkDataClass = 'dataTables_empty';
}
- this.dataSource.load(this.vnfData).then((data: boolean) => {
+ this.dataSource.load(this.vnfData).then((data: boolean): void => {
this.isLoadingResults = false;
- }).catch(() => {
+ }).catch((): void => {
this.isLoadingResults = false;
});
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.restService.handleError(error, 'get');
this.isLoadingResults = false;
});
import { APIURLHEADER, ERRORDATA, GETAPIURLHEADER, MODALCLOSERESPONSEDATA, URLPARAMS } from 'CommonModel';
import { environment } from 'environment';
import * as jsyaml from 'js-yaml';
-import { NSDDetails } from 'NSDModel';
+import { NSDATACREATION, NSDDetails } from 'NSDModel';
import { RestService } from 'RestService';
import { SharedService } from 'SharedService';
+import { VNFDATA } from 'VNFDModel';
/**
* Creating component
apiUrl = environment.VNFPACKAGES_URL + '/' + this.params.id + '/vnfd';
this.isLoadingResults = true;
this.restService.getResource(apiUrl, httpOptions)
- .subscribe((nsData: NSDDetails[]) => {
+ .subscribe((nsData: NSDDetails[]): void => {
this.modifyContent(nsData);
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
error.error = typeof error.error === 'string' ? jsyaml.load(error.error) : error.error;
this.restService.handleError(error, 'get');
* Get and modify package information based on type
*/
private modifyContent(packageInfo: NSDDetails[]): void {
- const packageContent: string = jsyaml.load(packageInfo.toString());
if (this.params.page === 'nsd') {
- this.packageName = 'clone_' + packageContent['nsd:nsd-catalog'].nsd[0].name;
+ const nsPackageContent: NSDATACREATION = jsyaml.load(packageInfo.toString());
+ this.packageName = 'clone_' + nsPackageContent.nsd.nsd[0].name;
this.endPoint = environment.NSDESCRIPTORSCONTENT_URL;
- packageContent['nsd:nsd-catalog'].nsd.forEach((nsd: NSDDetails) => {
+ nsPackageContent.nsd.nsd.forEach((nsd: NSDDetails): void => {
nsd.id = 'clone_' + nsd.id;
nsd.name = 'clone_' + nsd.name;
- nsd['short-name'] = 'clone_' + nsd['short-name'];
});
+ this.clonePackage(nsPackageContent);
} else {
- this.packageName = 'clone_' + packageContent['vnfd:vnfd-catalog'].vnfd[0].name;
+ const vnfPackageContent: VNFDATA = jsyaml.load(packageInfo.toString());
+ this.packageName = 'clone_' + vnfPackageContent.vnfd['product-name'];
this.endPoint = environment.VNFPACKAGESCONTENT_URL;
- packageContent['vnfd:vnfd-catalog'].vnfd.forEach((vnfd: NSDDetails) => {
- vnfd.id = 'clone_' + vnfd.id;
- vnfd.name = 'clone_' + vnfd.name;
- vnfd['short-name'] = 'clone_' + vnfd['short-name'];
- });
+ vnfPackageContent.vnfd.id = 'clone_' + vnfPackageContent.vnfd.id;
+ vnfPackageContent.vnfd['product-name'] = 'clone_' + vnfPackageContent.vnfd['product-name'];
+ this.clonePackage(vnfPackageContent);
}
- this.clonePackage(packageContent);
}
/**
* Create clone package and upload as TAR.GZ file
*/
- private clonePackage(packageContent: string): void {
+ private clonePackage(packageContent: NSDATACREATION | VNFDATA): void {
const descriptorInfo: string = jsyaml.dump(packageContent);
const apiHeader: HttpHeaders = new HttpHeaders({
'Content-Type': 'application/gzip',
url: this.endPoint,
httpOptions: { headers: apiHeader }
};
- this.restService.postResource(apiURLHeader, content).subscribe((result: { id: string }) => {
+ // tslint:disable-next-line: completed-docs
+ this.restService.postResource(apiURLHeader, content).subscribe((result: { id: string }): void => {
this.activeModal.close(modalData);
this.isLoadingResults = false;
this.notifierService.notify('success', this.translateService.instant('CLONESUCCESSFULLY'));
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
this.restService.handleError(error, 'post');
});
this.sharedService = this.injector.get(SharedService);
}
+ /** convenience getter for easy access to form fields */
+ get f(): FormGroup['controls'] { return this.packagesForm.controls; }
+
/**
* Lifecyle Hooks the trigger before component is instantiate
*/
});
}
- /** convenience getter for easy access to form fields */
- get f(): FormGroup['controls'] { return this.packagesForm.controls; }
-
/** Create packages @public */
public createPackages(): void {
this.submitted = true;
url: this.endPoint,
httpOptions: { headers: this.headers }
};
- this.restService.postResource(apiURLHeader, packageContent).subscribe((result: { id: string }) => {
+ // tslint:disable-next-line: completed-docs
+ this.restService.postResource(apiURLHeader, packageContent).subscribe((result: { id: string }): void => {
this.isLoadingResults = false;
this.activeModal.close();
this.composeNSPackages(result.id);
- }, (error: ERRORDATA) => {
+ }, (error: ERRORDATA): void => {
this.isLoadingResults = false;
this.restService.handleError(error, 'post');
});
this.notifierService.notify('success', this.packagesForm.value.name + ' ' +
this.translateService.instant('PAGE.VNFPACKAGE.CREATEDSUCCESSFULLY'));
}
- this.router.navigate([packageUrl, id]).catch(() => {
+ this.router.navigate([packageUrl, id]).catch((): void => {
// Catch Navigation Error
});
}
/** Deafult template for NS and VNF Packages @private */
private packageYaml(descriptorType: string): string {
let packageYaml: {} = {};
+ const composerName: string = 'NGUI Composer';
+ const composerDefaultVersion: string = '1.0';
if (descriptorType === 'ns-package') {
packageYaml = {
- 'nsd:nsd-catalog': {
+ nsd: {
nsd: [
{
- 'short-name': this.packagesForm.value.name,
- vendor: 'OSM Composer',
- description: this.packagesForm.value.name + ' descriptor',
- vld: [],
- 'constituent-vnfd': [],
- version: '1.0',
id: this.packagesForm.value.name,
- name: this.packagesForm.value.name
+ name: this.packagesForm.value.name,
+ version: composerDefaultVersion,
+ description: this.packagesForm.value.name + ' descriptor',
+ designer: composerName,
+ df: [
+ {
+ id: 'default-df',
+ 'vnf-profile': []
+ }
+ ]
}
]
}
};
} else {
packageYaml = {
- 'vnfd:vnfd-catalog': {
- vnfd: [
+ vnfd: {
+ id: this.packagesForm.value.name,
+ 'product-name': this.packagesForm.value.name,
+ version: composerDefaultVersion,
+ description: this.packagesForm.value.name + ' descriptor',
+ provider: composerName,
+ df: [
{
- 'short-name': this.packagesForm.value.name,
- vdu: [],
- description: '',
- 'mgmt-interface': {
- cp: ''
- },
- id: this.packagesForm.value.name,
- version: '1.0',
- 'internal-vld': [],
- 'connection-point': [],
- name: this.packagesForm.value.name
+ id: 'default-df',
+ 'instantiation-level': [],
+ 'vdu-profile': []
}
- ]
+ ],
+ 'ext-cpd': [],
+ vdu: [],
+ 'sw-image-desc': [],
+ 'virtual-storage-desc': []
}
};
}
<div class="modal-body">
<div *ngIf="topologyType === 'Add'">
<p [innerHTML]="topologyname"></p>
- <ng-select placeholder="{{'SELECT' | translate}}" formControlName="cpName" [items]="cpDetails" bindLabel="name"
- bindValue="name" [(ngModel)]="connectionPointInput"
+ <ng-select placeholder="{{'SELECT' | translate}}" formControlName="cpName" [items]="cpDetails" bindLabel="id"
+ bindValue="id" [(ngModel)]="connectionPointInput"
[ngClass]="{ 'is-invalid': submitted && f.cpName.errors }"></ng-select>
</div>
</div>
</button>
</div>
<div class="modal-body">
- <span *ngIf="topologyType === 'Delete'">{{'DELETECONFIRMPOPUPMESSAGE' | translate}} {{ topologyname }} ?</span>
+ <span *ngIf="topologyType === 'Delete'">{{'DELETECONFIRMPOPUPMESSAGE' | translate}} <b>{{ topologyname }}</b> ?</span>
<ul *ngIf="topologyType === 'Info'">
<li>
<p><b>{{'PAGE.TOPOLOGY.HELPINFO.CREATEEDGE' | translate}}</b>:
this.title = '';
if (data.name !== undefined) {
this.title = data.name;
- } else if (data.shortName !== undefined) {
- this.title = data.shortName;
} else if (data.projectName !== undefined) {
this.title = data.projectName;
this.id = this.title;
this.title = data.userName;
} else if (data.username !== undefined) {
this.title = data.username;
+ } else if (data.productName !== undefined) {
+ this.title = data.productName;
}
}
/** Generate Delete url from data @public */
'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
});
this.nsdID = this.value.identifier;
- this.nsdName = this.value.shortName;
+ this.nsdName = this.value.name;
}
/** Instantiate NS using modalservice @public */
'Cache-Control': 'no-cache, no-store, must-revalidate, max-age=0'
});
this.vnfID = this.value.identifier;
- this.vnfName = this.value.shortName;
+ this.vnfName = this.value.productName;
}
/** Delete VNF packages @public */
"PACKAGES": "Pakete",
"MODIFIED": "Geändert",
"NODATAMSG": "Keine Daten in der Tabelle verfügbar",
- "SHORTNAME": "Kurzer Name",
"PRODUCTNAME":"Produktname",
"IDENTIFIER": "Kennung",
"DESCRIPTION": "Beschreibung",
- "VENDOR": "Verkäuferin",
+ "DESIGNER": "Designer",
+ "PROVIDER": "Anbieter",
"VERSION": "Ausführung",
"ACTIONS": "Aktionen",
"NAME": "Name",
"NODATE": "Keine Datumsinformationen gefunden",
"TYPEINFO": "Um einen neuen TYPW hinzuzufügen, geben Sie oben die Eingabe ein",
"UPLOADCONFIGLABEL": "Bitte laden Sie eine Datei im .yaml- oder .yml-Format hoch",
+ "NEWVERSIONTAG": "Hier ist die neue Version {{appVersion}} von OSM!",
"PAGE": {
"DASHBOARD": {
"DASHBOARD": "Instrumententafel",
"DELETEVNFD": "VNF erfolgreich gelöscht",
"DELETENS": "Der Verbindungspunkt wurde erfolgreich gelöscht",
"DELETELINK": "Der Link wurde erfolgreich gelöscht",
- "MGMTNETWORK": "Mgmt Network",
- "VIMNETWORKNAME": "Vim Network Name",
- "MEMBER-VNF-INDEX": "member-vnf-index",
- "VNFD-ID-REF": "vnfd-id-ref",
- "VLD-ID": "vld-id",
- "VNFD-CP-REF": "vnfd-Verbindungspunkt-ref"
+ "MGMTNETWORK": "Mgmt Network"
},
"EDITPACKAGES": {
"UPDATEDSUCCESSFULLY": "Erfolgreich geupdated"
"PACKAGES": "Packages",
"MODIFIED": "Modified",
"NODATAMSG": "No data available in table",
- "SHORTNAME": "Short Name",
"PRODUCTNAME":"Product Name",
"IDENTIFIER": "Identifier",
"DESCRIPTION": "Description",
- "VENDOR": "Vendor",
+ "DESIGNER": "Designer",
+ "PROVIDER": "Provider",
"VERSION": "Version",
"ACTIONS": "Actions",
"NAME": "Name",
"NODATE": "No date information found",
"TYPEINFO": "To add a new TYPE, Please enter input above",
"UPLOADCONFIGLABEL": "Please upload file with .yaml or .yml format",
+ "NEWVERSIONTAG": "Here is the new version {{appVersion}} of OSM!",
"PAGE": {
"DASHBOARD": {
"DASHBOARD": "Dashboard",
"DELETEVNFD": "Successfully Deleted the VNF",
"DELETENS": "Successfully Deleted the Connection point",
"DELETELINK": "Successfully Deleted the Link",
- "MGMTNETWORK": "Mgmt Network",
- "VIMNETWORKNAME": "Vim Network Name",
- "MEMBER-VNF-INDEX": "member-vnf-index",
- "VNFD-ID-REF": "vnfd-id-ref",
- "VLD-ID": "vld-id",
- "VNFD-CP-REF": "vnfd-connection-point-ref"
+ "MGMTNETWORK": "Mgmt Network"
},
"EDITPACKAGES": {
"UPDATEDSUCCESSFULLY": "Descriptor Updated Successfully"
"PACKAGES": "Paquetes",
"MODIFIED": "Modificado",
"NODATAMSG": "No hay datos disponibles en la tabla",
- "SHORTNAME": "Nombre corto",
"PRODUCTNAME":"Nombre del producto",
"IDENTIFIER": "Identificador",
"DESCRIPTION": "Descripción",
- "VENDOR": "Vendedor",
+ "DESIGNER": "Diseñador",
+ "PROVIDER": "Proveedor",
"VERSION": "Versión",
"ACTIONS": "Comportamiento",
"NAME": "Nombre",
"NODATE": "No se encontró información de fecha",
"TYPEINFO": "Para agregar un nuevo TIPO, ingrese la entrada de arriba",
"UPLOADCONFIGLABEL": "Cargue el archivo con formato .yaml o .yml",
+ "NEWVERSIONTAG": "¡Aquí está la nueva versión {{appVersion}} de OSM!",
"PAGE": {
"DASHBOARD": {
"DASHBOARD": "Tablero",
"DELETEVNFD": "VNFD eliminado correctamente",
"DELETENS": "Se eliminó correctamente el punto de conexión",
"DELETELINK": "Se eliminó el enlace correctamente",
- "MGMTNETWORK": "Mgmt Network",
- "VIMNETWORKNAME": "Vim Network Name",
- "MEMBER-VNF-INDEX": "member-vnf-index",
- "VNFD-ID-REF": "vnfd-id-ref",
- "VLD-ID": "vld-id",
- "VNFD-CP-REF": "vnfd-punto de conexión-ref"
+ "MGMTNETWORK": "Mgmt Network"
},
"EDITPACKAGES": {
"UPDATEDSUCCESSFULLY": "Descriptor actualizado correctamente"
"MODIFIED": "Modificada",
"PACKAGES": "Pacotes",
"NODATAMSG": "Sem dados disponíveis na tabela",
- "SHORTNAME": "Nome curto",
"PRODUCTNAME":"Nome do Produto",
"IDENTIFIER": "Identificador",
"DESCRIPTION": "Descrição",
- "VENDOR": "Fornecedor",
+ "DESIGNER": "Designer",
+ "PROVIDER": "Fornecedor",
"VERSION": "Versão",
"ACTIONS": "Ações",
"NAME": "Nome",
"NODATE": "Nenhuma informação de data encontrada",
"TYPEINFO": "Para adicionar um novo TIPO, insira a entrada acima",
"UPLOADCONFIGLABEL": "Faça o upload do arquivo no formato .yaml ou .yml",
+ "NEWVERSIONTAG": "Aqui está a nova versão {{appVersion}} do OSM!",
"PAGE": {
"DASHBOARD": {
"DASHBOARD": "painel de controle",
"DELETEVNFD": "O VNF foi excluído com sucesso",
"DELETENS": "Excluído com êxito o ponto de conexão",
"DELETELINK": "O link foi excluído com sucesso",
- "MGMTNETWORK": "Mgmt Network",
- "VIMNETWORKNAME": "Vim Network Name",
- "MEMBER-VNF-INDEX": "member-vnf-index",
- "VNFD-ID-REF": "vnfd-id-ref",
- "VLD-ID": "vld-id",
- "VNFD-CP-REF": "vnfd-ponto de conexão-ref"
+ "MGMTNETWORK": "Mgmt Network"
},
"EDITPACKAGES": {
"UPDATEDSUCCESSFULLY": "Atualizado com sucesso"
.close {
opacity: 1 !important;
}
+ .closeVersion {
+ text-shadow: none;
+ }
.roles-section {
.card {
.bg-secondary {
/**
* @file Model for Commonly used information.
*/
+// tslint:disable: completed-docs
/**
* handle count @enum
*/
export interface DELETEPARAMS {
identifier: string;
name?: string;
- shortName: string;
projectName?: string;
userName?: string;
username?: string;
page?: string;
id?: string;
+ productName?: string;
}
/** Interface for the Delete Details */
value: string;
title: string;
}
+/** Interface for PRIMITIVETYPES */
+export interface PRIMITIVETYPES {
+ title: string;
+ value: string;
+}
+/** Interface for the PRIMITIVEDATA */
+export interface PRIMITIVEDATA {
+ parameter: {}[];
+}
/** Interface for VIM type Openstack's Config */
export const TYPEOPENSTACK: {} = {
sdn_controller: '',
/**
* @file Model for NSD related information.
*/
-
+// tslint:disable: completed-docs
import { VNFDAdminDetails } from './VNFDModel';
/** Interface for NSData */
export interface NSData {
- shortName?: string;
- identifier: string;
- description: string;
- vendor?: string;
+ id?: string;
+ identifier?: string;
+ description?: string;
version: string;
- page?: string;
name?: string;
- projectName?: string;
- userName?: string;
- username?: string;
+ designer?: string;
}
/** Interface for the nscompose descriptors content */
id: string;
logo: string;
name: string;
- 'short-name': string;
- vendor: string;
version: string;
vld: VLD[];
_admin: VNFDAdminDetails;
_id: string;
_links?: string;
'constituent-vnfr-ref': string[];
+ 'virtual-link-desc': VLD[];
+ df: DF[];
+ 'vnfd-id': string[];
+ designer?: string;
}
/** Interface for the connection-point */
/** Interface for the vld */
export interface VLD {
id: string;
- 'mgmt-network': boolean;
- name: string;
- 'short-name'?: string;
- 'type': string;
- 'vnfd-connection-point-ref'?: VNFDCONNECTIONPOINTREF[];
- 'vim-network-name': string;
+ 'mgmt-network'?: boolean;
}
-/** Interface for VNFDCONNECTIONPOINTREF */
-export interface VNFDCONNECTIONPOINTREF {
- 'member-vnf-index-ref': number;
- 'vnfd-connection-point-ref': string;
- 'vnfd-id-ref': string;
-}
/** Interface Nodes Creation */
export interface COMPOSERNODES {
id: string;
reflexive: Boolean;
'type': string;
name?: string;
- nodeIndex?: number;
+ nodeIndex?: string;
selectorId?: string;
x?: number;
y?: number;
y: number;
id: string;
'type'?: string;
-}
-
-/** Interface for the NSD */
-interface NSD {
- 'constituent-vnfd': CONSTITUENTVNFD[];
- description: string;
- id: string;
- name: string;
- 'short-name': string;
- vendor: string;
- version: string;
- vld: VLD[];
- _admin: VNFDAdminDetails;
- _id: string;
+ name?: string;
+ nodeIndex?: string;
}
/** Interface for the GRAPHDETAILS */
export interface GRAPHDETAILS {
'juju-bundle': string;
'kdu-configuration': {};
}
+
+/** Interface for the DF */
+export interface DF {
+ id: string;
+ 'vnf-profile': VNFPROFILE[];
+}
+
+/** Interface for the DF */
+export interface VNFPROFILE {
+ id: string;
+ 'virtual-link-connectivity': VLC[];
+ 'vnfd-id': string;
+}
+
+/** Interface for the VLC */
+export interface VLC {
+ 'constituent-cpd-id': CCI[];
+ 'virtual-link-profile-id': string;
+}
+
+/** Interface for the CCI */
+export interface CCI {
+ 'constituent-base-element-id': string;
+ 'constituent-cpd-id': string;
+}
+/** Interface for NSDATACREATION */
+export interface NSDATACREATION {
+ nsd: NSDETAILDATA;
+}
+/** Interface for NSDETAILDATA */
+export interface NSDETAILDATA {
+ nsd: NSDDetails[];
+}
/**
* @file Model for NS Instance related information.
*/
-
-import { CONSTITUENTVNFD, VLD, VNFDCONNECTIONPOINTREF } from 'NSDModel';
+// tslint:disable: completed-docs
+import { CONSTITUENTVNFD, DF, VLD } from 'NSDModel';
import { VNFDAdminDetails } from 'VNFDModel';
/** Interface for NSInstanceDetails */
nsd: NSD;
name: string;
'name-ref': string;
- 'short-name': string;
id: string;
'nsd-name-ref': string;
description: string;
/** Interface for NSD */
export interface NSD {
description: string;
- vld: NSDVLD[];
_admin: VNFDAdminDetails;
name: string;
version: string;
_id: string;
- 'short-name': string;
id: string;
'constituent-vnfd': CONSTITUENTVNFD[];
vendor: string;
vdur: string[];
'connection-point': CONNECTIONPOINT[];
+ 'virtual-link-desc': NSDVLD[];
+ df: DF[];
}
/** Interface for _AdminDetails */
'vim-network-name': string;
id: string;
'type': string;
- 'vnfd-connection-point-ref': VNFDCONNECTIONPOINTREF[];
- 'short-name': string;
+ df: DF[];
}
/** Interface for InstantiateParam */
ConfigStatus: string;
DetailedStatus: string;
state?: string;
- memberIndex?: object;
+ memberIndex?: DF[];
nsConfig?: object;
}
nodeTypeRef?: string;
name?: string;
'type'?: string;
- vnfdCP?: VNFDCONNECTIONPOINTREF[];
+ vnfdCP?: DF[];
vimNetworkName?: string;
shortName?: string;
cp?: CONNECTIONPOINT[];
vnfdRef?: string;
vndfCPRef?: string;
selectorId?: string;
+ reflexive?: Boolean;
+ nodeIndex?: number;
}
/** Interface for the connection-point */
/**
* @file Model for VNFD related information.
*/
-
+// tslint:disable: completed-docs
/** Interface for Project */
export interface ProjectModel {
project_id: string;
created: string;
}
-/** Interface for VNFD NODE Details */
-export interface VNFDNODE {
- nodeTypeRef?: string;
- 'connection-point'?: CONNECTIONPOINT[];
+/** Interface for VNFD Details */
+export interface VNFD {
description?: string;
+ df?: DF[];
+ 'ext-cpd'?: EXTCPD[];
id: string;
- 'internal-vld'?: InternalVLD[];
- version?: string;
- name?: string;
- 'mgmt-interface'?: MGMT;
- _id?: string;
+ 'int-virtual-link-desc'?: IVLD[];
+ 'mgmt-cp'?: string;
+ onboardingState?: string;
+ operationalState?: string;
+ 'product-name'?: string;
+ provider?: string;
+ 'sw-image-desc'?: SWIMAGEDESCRIPTION[];
+ usageState?: string;
vdu?: VDU[];
+ version?: string;
+ 'virtual-compute-desc'?: string;
+ 'virtual-storage-desc'?: string[];
_admin?: VNFDAdminDetails;
- 'short-name'?: string;
- shortName?: string;
- vendor?: string;
- 'type'?: string;
- 'cloud-init-file'?: string;
- count?: number;
- vduID?: string;
- 'interface'?: VNFDInterface[];
- 'vm-flavor'?: VMFlavor;
- intVLID?: string;
- 'internal-connection-point'?: VLDInternalConnectionPoint[];
- 'monitoring-param'?: MonitoringParam[];
- 'ip-profile-ref'?: string;
- 'id-ref'?: string;
- 'ip-address'?: string;
- reflexive?: boolean;
- image?: string;
+ _id?: string;
+ _links?: string;
+ 'vnf-configuration'?: VNFCONFIG[];
+ kdu?: [];
}
-
-/** Interface for VNFDDetails */
-export interface VNFDDetails {
- 'connection-point': CONNECTIONPOINT[];
- description: string;
+/** Interface for DF */
+export interface VNFCONFIG {
id: string;
- 'internal-vld': InternalVLD[];
- version: string;
+ 'config-primitive'?: CONFIGPRIMITIVE[];
+ 'initial-config-primitive'?: INITIALCONFIGPRIMITIVE[];
+}
+/** Interface for DF */
+export interface DF {
+ id: string;
+ 'instantiation-level'?: INSTANTIATIONLEVEL[];
+ 'vdu-profile'?: VDUPROFILE[];
+ 'vnf-configuration-id'?: string;
+}
+/** Interface for INSTANTIATIONLEVEL */
+export interface INSTANTIATIONLEVEL {
+ id: string;
+ 'vdu-level': VDULEVEL[];
+}
+/** Interface for VDULEVEL */
+export interface VDULEVEL {
+ 'number-of-instances': number;
+ 'vdu-id': string;
+}
+/** Interface for VDULEVEL */
+export interface VDUPROFILE {
+ id: string;
+ name?: string;
+ 'min-number-of-instances'?: number;
+ 'max-number-of-instances'?: number;
+ 'vdu-configuration-id'?: string;
+ 'vdu-configuration'?: VDUCONFIG;
+}
+/** Interface for VDUCONFIG */
+export interface VDUCONFIG {
+ id: string;
+ 'config-primitive': CONFIGPRIMITIVE[];
+ 'initial-config-primitive': INITIALCONFIGPRIMITIVE[];
+}
+/** Interface for CONFIGPRIMITIVE */
+export interface CONFIGPRIMITIVE {
name: string;
- 'mgmt-interface': MGMT;
- _id: string;
- vdu: VDU[];
- _admin: VNFDAdminDetails;
- 'short-name': string;
- vendor: string;
- 'product-name'?: string;
}
-
-/** Interface for MGMT */
-interface MGMT {
- cp: string;
+/** Interface for INITIALCONFIGPRIMITIVE */
+export interface INITIALCONFIGPRIMITIVE {
+ seq: string;
+ name: string;
+}
+/** Interface for the ext-cpd */
+export interface EXTCPD {
+ id?: string;
+ 'int-cpd'?: INTCPD;
+}
+/** Interface for the int-cpd */
+export interface INTCPD {
+ cpd?: string;
+ 'vdu-id'?: string;
+}
+/** Interface for IVLD */
+export interface IVLD {
+ id?: string;
+ description?: string;
+}
+/** Interface for SWIMAGEDESCRIPTION */
+export interface SWIMAGEDESCRIPTION {
+ id: string;
+ name: string;
+ version: string;
}
-
/** Interface for VDU */
export interface VDU {
- nodeTypeRef?: string;
'cloud-init-file'?: string;
- count?: number;
description?: string;
id?: string;
- image?: string;
- 'interface'?: VNFDInterface[];
- 'internal-connection-point'?: VDUInternalConnectionPoint[];
+ 'int-cpd'?: VDUINTCPD[];
+ 'monitoring-parameter'?: MonitoringParam[];
name?: string;
- 'vm-flavor'?: VMFlavor;
- vduInterface?: string;
- 'monitoring-param'?: MonitoringParam[];
+ 'sw-image-desc'?: string;
+ 'virtual-compute-desc'?: string;
+ 'virtual-storage-desc'?: string[];
}
-
-/** Interface for VMFlavor */
-interface VMFlavor {
- 'storage-gb'?: string;
- 'memory-mb'?: string;
- 'vcpu-count'?: string;
+/** Interface for the vdu int-cpd */
+export interface VDUINTCPD {
+ id: string;
+ 'int-virtual-link-desc'?: string;
+ 'virtual-network-interface-requirement': VNIR[];
}
-
-/** Interface for VNFDInterface */
-export interface VNFDInterface {
- 'external-connection-point-ref'?: string;
- 'internal-connection-point-ref'?: string;
- 'mgmt-interface'?: boolean;
- name?: string;
- 'type'?: string;
- position?: boolean;
- 'virtual-interface'?: VirtualInterface;
+/** Interface for the vdu int-cpd => VNIR */
+export interface VNIR {
+ name: string;
+ position: number;
+ 'virtual-interface': VIRTUALINTERFACE;
}
-
-/** Interface for VDU Internal Connection Point */
-export interface VDUInternalConnectionPoint {
+/** Interface for the VIRTUALINTERFACE */
+export interface VIRTUALINTERFACE {
+ 'type': string;
+}
+/** Interface for monitoring params */
+export interface MonitoringParam {
id: string;
name?: string;
- 'short-name'?: string;
- 'type'?: string;
+ 'performance-metric'?: string;
+ 'collection-period'?: number;
}
-
-/** Interface for VirutalInterface */
-interface VirtualInterface {
- 'type': string;
+/** Interface for VNFDATA */
+export interface VNFDATA {
+ vnfd?: VNFD;
}
-/** Interface for the connection-point */
-export interface CONNECTIONPOINT {
- nodeTypeRef?: string;
- 'connection-point-id'?: string;
- name?: string;
+/** Interface for VDU InternalCPD */
+export interface InternalCPD {
id: string;
- 'type'?: string;
+ 'int-virtual-link-desc'?: string;
+ 'virtual-network-interface-requirement'?: VIRTUALNETWORKINTERFACEREQUIREMENT;
}
-/** Interface for Internal VLD */
-export interface InternalVLD {
- nodeTypeRef?: string;
- id?: string;
- 'internal-connection-point'?: VLDInternalConnectionPoint[];
- 'ip-profile-ref'?: string;
- name?: string;
- 'short-name'?: string;
- 'type'?: string;
- 'shortName'?: string;
- 'ipProfileRef'?: string;
-}
-
-/** Interface for VLD Internal Connection Point */
-export interface VLDInternalConnectionPoint {
- nodeTypeRef?: string;
- 'ip-address'?: string;
- 'id-ref'?: string;
- 'shortName'?: string;
+/** Interface for VIRTUALNETWORKINTERFACEREQUIREMENT */
+export interface VIRTUALNETWORKINTERFACEREQUIREMENT {
+ name: string;
+ position?: number;
+ 'virtual-interface'?: VirtualInterface;
}
-/** Interface for monitoring params */
-export interface MonitoringParam {
- id: string;
- 'nfvi-metric'?: string;
- 'interface-name-ref'?: string;
+/** Interface for VirutalInterface */
+interface VirtualInterface {
+ 'type': string;
}
/** Interface for _AdminDetails */
-// tslint:disable-next-line:class-name
export interface VNFDAdminDetails {
created: number;
modified: string;
/** Interface for VNFData */
export interface VNFData {
- name?: string;
+ identifier?: string;
id?: string;
- shortName?: string;
- identifier: string;
+ name?: string;
description: string;
- vendor?: string;
version: string;
'type'?: string;
productName?: string;
+ provider?: string;
}
/** Interface for the Tick */
/** Interface Nodes Creation */
export interface COMPOSERNODES {
id: string;
- reflexive?: boolean;
- 'type'?: string;
+ reflexive: Boolean;
+ 'type': string;
name?: string;
- nodeTypeRef?: string;
+ nodeIndex?: number;
+ selectorId?: string;
x?: number;
y?: number;
fx?: number;
this.loggedIn.next(false);
const langCode: string = localStorage.getItem('languageCode');
const redirecturl: string = isNullOrUndefined(localStorage.getItem('returnUrl')) ? '/' : localStorage.getItem('returnUrl');
+ const osmVersion: string = isNullOrUndefined(localStorage.getItem('osmVersion')) ? '' : localStorage.getItem('osmVersion');
localStorage.clear();
localStorage.setItem('languageCode', langCode);
localStorage.setItem('returnUrl', redirecturl);
localStorage.setItem('token_state', null);
+ localStorage.setItem('osmVersion', osmVersion);
this.idle.stop();
this.router.navigate(['login']).catch();
}
}
/** Download Files function @public */
- public downloadFiles(shortName: string, binaryData: Blob[], filetype: string): void {
+ public downloadFiles(name: string, binaryData: Blob[], filetype: string): void {
const downloadLink: HTMLAnchorElement = document.createElement('a');
downloadLink.href = window.URL.createObjectURL(new Blob(binaryData, { type: filetype }));
- if (shortName !== undefined) {
+ if (name !== undefined) {
if (window.navigator.msSaveOrOpenBlob) {
- window.navigator.msSaveBlob(new Blob(binaryData, { type: filetype }), 'OSM_Export_' + shortName + '.tar.gz');
+ window.navigator.msSaveBlob(new Blob(binaryData, { type: filetype }), 'OSM_Export_' + name + '.tar.gz');
} else {
- downloadLink.setAttribute('download', 'OSM_Export_' + shortName + '.tar.gz');
+ downloadLink.setAttribute('download', 'OSM_Export_' + name + '.tar.gz');
document.body.appendChild(downloadLink);
downloadLink.click();
}
projects / osm / NG-UI.git / commitdiff