diff --git a/src/app/app.module.ts b/src/app/app.module.ts index c907b644..59d9e9f4 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -278,6 +278,7 @@ import { ImageManagerComponent } from './components/image-manager/image-manager. import { AddImageDialogComponent } from './components/image-manager/add-image-dialog/add-image-dialog.component'; import { DeleteAllImageFilesDialogComponent } from './components/image-manager/deleteallfiles-dialog/deleteallfiles-dialog.component'; import { UploadingProcessbarComponent } from './common/uploading-processbar/uploading-processbar.component'; +import { NodesMenuConfirmationDialogComponent } from './components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component'; @NgModule({ declarations: [ @@ -472,6 +473,7 @@ import { UploadingProcessbarComponent } from './common/uploading-processbar/uplo AddImageDialogComponent, DeleteAllImageFilesDialogComponent, UploadingProcessbarComponent, + NodesMenuConfirmationDialogComponent, ], imports: [ BrowserModule, diff --git a/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.html b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.html new file mode 100644 index 00000000..5683855a --- /dev/null +++ b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.html @@ -0,0 +1,18 @@ +
+
+
Confirm {{ confirmActionData.actionType | titlecase }} All
+
+
+ +
+
+ + +

Are you sure you want to {{confirmActionData.actionType}} all devices?

+
+ + + + diff --git a/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.scss b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.scss new file mode 100644 index 00000000..b55af6fc --- /dev/null +++ b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.scss @@ -0,0 +1,16 @@ +.close-btn{ + height: 30px; + width: 30px; + margin-left: 10px; + margin-bottom:10px +} +.close-icon{ + font-size: 15px; +} +.text-padding{ + padding: 15px 0 0 0; + +} +.mat-dialog-actions { + min-height: 31px; +} \ No newline at end of file diff --git a/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.spec.ts b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.spec.ts new file mode 100644 index 00000000..26a42efd --- /dev/null +++ b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { NodesMenuConfirmationDialogComponent } from './nodes-menu-confirmation-dialog.component'; + +describe('NodesMenuConfirmationDialogComponent', () => { + let component: NodesMenuConfirmationDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ NodesMenuConfirmationDialogComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(NodesMenuConfirmationDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.ts b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.ts new file mode 100644 index 00000000..3c912534 --- /dev/null +++ b/src/app/components/project-map/nodes-menu/nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component.ts @@ -0,0 +1,27 @@ +import { Component, Inject, OnInit } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; + +@Component({ + selector: 'app-nodes-menu-confirmation-dialog', + templateUrl: './nodes-menu-confirmation-dialog.component.html', + styleUrls: ['./nodes-menu-confirmation-dialog.component.scss'], +}) +export class NodesMenuConfirmationDialogComponent implements OnInit { + confirmActionData = { + actionType: 'start', + isAction:false + }; + constructor( + @Inject(MAT_DIALOG_DATA) public data: any, + public dialogRef: MatDialogRef + ) {} + + ngOnInit(): void { + this.confirmActionData.actionType = this.data; + } + + confirmAction() { + this.confirmActionData.isAction = true + this.dialogRef.close(this.confirmActionData); + } +} diff --git a/src/app/components/project-map/nodes-menu/nodes-menu.component.html b/src/app/components/project-map/nodes-menu/nodes-menu.component.html index b495ad3c..7177ab12 100644 --- a/src/app/components/project-map/nodes-menu/nodes-menu.component.html +++ b/src/app/components/project-map/nodes-menu/nodes-menu.component.html @@ -12,7 +12,7 @@ matTooltip="Start/Resume all nodes" matTooltipClass="custom-tooltip" mat-icon-button - (click)="startNodes()" + (click)="confirmControlsActions('start')" class="menu-button" > play_arrow @@ -21,7 +21,7 @@ matTooltip="Suspend all nodes" matTooltipClass="custom-tooltip" mat-icon-button - (click)="suspendNodes()" + (click)="confirmControlsActions('suspend')" class="menu-button" > pause @@ -30,7 +30,7 @@ matTooltip="Stop all nodes" matTooltipClass="custom-tooltip" mat-icon-button - (click)="stopNodes()" + (click)="confirmControlsActions('stop')" class="menu-button" > stop @@ -39,7 +39,7 @@ matTooltip="Reload all nodes" matTooltipClass="custom-tooltip" mat-icon-button - (click)="reloadNodes()" + (click)="confirmControlsActions('reload')" class="menu-button" > replay diff --git a/src/app/components/project-map/nodes-menu/nodes-menu.component.ts b/src/app/components/project-map/nodes-menu/nodes-menu.component.ts index 839ccbbe..89fccc15 100644 --- a/src/app/components/project-map/nodes-menu/nodes-menu.component.ts +++ b/src/app/components/project-map/nodes-menu/nodes-menu.component.ts @@ -1,14 +1,16 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; -import { MapSettingsService } from '../../../services/mapsettings.service'; +import { MatDialog } from '@angular/material/dialog'; import { ElectronService } from 'ngx-electron'; import { NodesDataSource } from '../../../cartography/datasources/nodes-datasource'; import { Project } from '../../../models/project'; import { Server } from '../../../models/server'; +import { MapSettingsService } from '../../../services/mapsettings.service'; import { NodeService } from '../../../services/node.service'; +import { NodeConsoleService } from '../../../services/nodeConsole.service'; import { ServerService } from '../../../services/server.service'; import { SettingsService } from '../../../services/settings.service'; import { ToasterService } from '../../../services/toaster.service'; -import { NodeConsoleService } from '../../../services/nodeConsole.service'; +import { NodesMenuConfirmationDialogComponent } from './nodes-menu-confirmation-dialog/nodes-menu-confirmation-dialog.component'; @Component({ selector: 'app-nodes-menu', @@ -28,7 +30,8 @@ export class NodesMenuComponent { private serverService: ServerService, private settingsService: SettingsService, private mapSettingsService: MapSettingsService, - private electronService: ElectronService + private electronService: ElectronService, + private dialog: MatDialog ) {} async startConsoleForAllNodes() { @@ -83,4 +86,26 @@ export class NodesMenuComponent { this.toasterService.success('All nodes successfully reloaded'); }); } + public confirmControlsActions(type) { + const dialogRef = this.dialog.open(NodesMenuConfirmationDialogComponent, { + width: '500px', + maxHeight: '200px', + autoFocus: false, + disableClose: true, + data: type, + }); + + dialogRef.afterClosed().subscribe((confirmAction_result) => { + if (confirmAction_result.isAction && confirmAction_result.actionType == 'start') { + this.startNodes(); + } else if (confirmAction_result.isAction && confirmAction_result.actionType == 'stop') { + this.stopNodes(); + } else if (confirmAction_result.isAction && confirmAction_result.actionType == 'reload') { + this.reloadNodes(); + } else if (confirmAction_result.isAction && confirmAction_result.actionType == 'suspend') { + this.suspendNodes(); + } else { + } + }); + } }