diff --git a/src/components/dialog/dialog.component.ts b/src/components/dialog/dialog.component.ts index 7001bbf092dd04bf1b36cdf3ffd31d5304d146bb..1e5b2ce32b91e6ed901b5eeffc35a2bd3a28a947 100644 --- a/src/components/dialog/dialog.component.ts +++ b/src/components/dialog/dialog.component.ts @@ -15,6 +15,8 @@ import { filter, share } from "rxjs/operators"; export class DialogComponent implements OnInit, OnDestroy { private subscrptions: Subscription[] = [] + + @Input() iconClass: string = `fas fa-save` @Input() title: string = 'Message' @Input() placeholder: string = "Type your response here" @@ -29,11 +31,12 @@ export class DialogComponent implements OnInit, OnDestroy { @Inject(MAT_DIALOG_DATA) public data:any, private dialogRef: MatDialogRef<DialogComponent> ){ - const { title, placeholder, defaultValue, message } = this.data + const { title, placeholder, defaultValue, message, iconClass = null } = this.data if (title) this.title = title if (placeholder) this.placeholder = placeholder if (defaultValue) this.value = defaultValue if (message) this.message = message + if (typeof iconClass !== 'undefined') this.iconClass = iconClass } ngOnInit(){ diff --git a/src/components/dialog/dialog.template.html b/src/components/dialog/dialog.template.html index 311b6f30f1582e1cb04b789782a27c87519c0e78..067ecb0ff65f13a449c18419aa2d45000e8dcb75 100644 --- a/src/components/dialog/dialog.template.html +++ b/src/components/dialog/dialog.template.html @@ -32,7 +32,7 @@ class="ml-1" mat-raised-button color="primary"> - <i class="fas fa-save mr-1"></i> + <i *ngIf="iconClass" [ngClass]="iconClass" class="mr-1"></i> Confirm </button> </div> \ No newline at end of file diff --git a/src/plugin_examples/plugin_api.md b/src/plugin_examples/plugin_api.md index f997fd37881d952c16729e6656c9f5c80105eec0..9ae6069b39e7aa6040fe3f65d83eeeb4a49b1048 100644 --- a/src/plugin_examples/plugin_api.md +++ b/src/plugin_examples/plugin_api.md @@ -155,6 +155,7 @@ window.interactiveViewer "message":"Message to be seen by the user.", // default: "" "placeholder": "Start typing here", // default: "Type your response here" "defaultValue": "42" // default: "" + "iconClass":"fas fa-save" // default fas fa-save, set to falsy value to disable } ``` - *getUserConfirmation(config)* returns a Promise, resolves when user confirms, rejects when user cancels. expects config object object with the following structure: diff --git a/src/services/dialogService.service.ts b/src/services/dialogService.service.ts index 110edf6663f748866b952af474d56291e2229149..02fd6b387748c4790465aa64163e82040726ae07 100644 --- a/src/services/dialogService.service.ts +++ b/src/services/dialogService.service.ts @@ -31,13 +31,20 @@ export class DialogService{ } public getUserInput(config: Partial<DialogConfig> = {}):Promise<string>{ - const { defaultValue = '', placeholder = 'Type your response here', title = 'Message', message = '' } = config + const { + defaultValue = '', + placeholder = 'Type your response here', + title = 'Message', + message = '', + iconClass + } = config this.dialogRef = this.dialog.open(DialogComponent, { data: { title, placeholder, defaultValue, - message + message, + iconClass } }) return new Promise((resolve, reject) => { @@ -59,4 +66,5 @@ export interface DialogConfig{ placeholder: string defaultValue: string message: string + iconClass: string } \ No newline at end of file diff --git a/src/ui/viewerStateController/viewerState.component.ts b/src/ui/viewerStateController/viewerState.component.ts index c344d3315092e64dfd8f2b88b947ba02978f5f0e..a0c33fd2b5dc45988271bc142063b0e3456e287f 100644 --- a/src/ui/viewerStateController/viewerState.component.ts +++ b/src/ui/viewerStateController/viewerState.component.ts @@ -132,7 +132,8 @@ export class ViewerStateController implements OnInit{ this.dialogService.getUserInput({ defaultValue: savedRegionsSelection.name, placeholder: `Enter new name`, - title: 'Edit name' + title: 'Edit name', + iconClass: null }).then(name => { if (!name) throw new Error('user cancelled') this.store$.dispatch({ @@ -186,7 +187,8 @@ export class ViewerStateController implements OnInit{ this.dialogService.getUserInput({ defaultValue: `Saved Region`, placeholder: `Name the selection`, - title: 'Save region selection' + title: 'Save region selection', + iconClass: 'far fa-bookmark' }) .then(name => { if (!name) throw new Error('User cancelled') diff --git a/src/ui/viewerStateController/viewerState.template.html b/src/ui/viewerStateController/viewerState.template.html index 0f814b3e5b35c9bf877a89fef8cfb40bb7a6c529..5223f311c44afcf73e677e582ad57b3954aa78ad 100644 --- a/src/ui/viewerStateController/viewerState.template.html +++ b/src/ui/viewerStateController/viewerState.template.html @@ -135,7 +135,7 @@ <!-- selected regions --> <mat-card-content> - <mat-chip-list> + <mat-chip-list *ngIf="(regionsSelected$ | async)?.length > 0 "> <cdk-virtual-scroll-viewport class="w-100 h-10em overflow-x-hidden" [itemSize]="32">