diff --git a/package-lock.json b/package-lock.json index 2538f37e30d94362494a75c6fd26d6dbe14171c1..e7591b1bff4fef8a05a9f0e022f0712a6ab7f908 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,7 @@ "@asymmetrik/ngx-leaflet": "^18.0.1", "@compodoc/compodoc": "^1.1.25", "@ghsc/disagg-d3": "^0.9.0", - "@ghsc/nshmp-lib-ng": "^18.4.0", + "@ghsc/nshmp-lib-ng": "^18.5.1", "@ghsc/nshmp-template": "^18.0.3", "@ghsc/nshmp-utils-ts": "^3.6.3", "angular-plotly.js": "^5.2.2", @@ -4281,9 +4281,9 @@ } }, "node_modules/@ghsc/nshmp-lib-ng": { - "version": "18.4.0", - "resolved": "https://code.usgs.gov/api/v4/projects/12416/packages/npm/@ghsc/nshmp-lib-ng/-/@ghsc/nshmp-lib-ng-18.4.0.tgz", - "integrity": "sha1-eyMUGjSiCTN9ZLN5X2qk57gNLBE=", + "version": "18.5.1", + "resolved": "https://code.usgs.gov/api/v4/projects/12416/packages/npm/@ghsc/nshmp-lib-ng/-/@ghsc/nshmp-lib-ng-18.5.1.tgz", + "integrity": "sha1-/MBJxJWn8foExhQSMbvgdRMl/ew=", "dependencies": { "tslib": "^2.3.0" }, diff --git a/package.json b/package.json index 7d80d79d9a56339f7f242fc3961cb9dde86ab374..01433ce56f9b9cfcff60e701e68676bc40a605b3 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "@asymmetrik/ngx-leaflet": "^18.0.1", "@compodoc/compodoc": "^1.1.25", "@ghsc/disagg-d3": "^0.9.0", - "@ghsc/nshmp-lib-ng": "^18.4.0", + "@ghsc/nshmp-lib-ng": "^18.5.1", "@ghsc/nshmp-template": "^18.0.3", "@ghsc/nshmp-utils-ts": "^3.6.3", "angular-plotly.js": "^5.2.2", diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.html index 8c44aad304463a77739371d5fd88cbbcbf019411..ab41fefbf9839e60c87630d09ebe6ee3ad7eb664 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.html @@ -4,14 +4,9 @@ [formGroup]="formState" (submit)="onSubmit()" > - <mat-form-field class="grid-col-12 multi-select-parameter-menu padding-top-1"> - <mat-label>Multi-Selectable Parameter</mat-label> - <mat-select [formControl]="formState.controls.multiSelectableParam"> - <mat-option value="gmm">Ground Motion Models</mat-option> - <mat-option value="Mw">M<sub>W</sub></mat-option> - <mat-option value="vs30">V<sub>S30</sub></mat-option> - </mat-select> - </mat-form-field> + <nshmp-lib-ng-gmm-multi-param-menu + [multiParamControl]="controls.multiSelectableParam" + /> <!-- GMM menu --> @if (parameters()) { diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.ts index d1f97931310cb3e908cc28f2dc424478df4ff260..56e68521448282eb5485b2f635078d7ac82cba43 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/control-panel/control-panel.component.ts @@ -8,8 +8,10 @@ import {MatSelect} from '@angular/material/select'; import { GmmFormControlIds, gmmUtils, + MultiSelectableParam, MW_COMMON_VALUES, NshmpLibNgGmmMenuComponent, + NshmpLibNgGmmMultiParamMenuComponent, NshmpLibNgGmmMultiSelectComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, VS30_COMMON_VALUES, @@ -39,6 +41,7 @@ import {AppService} from '../../services/app.service'; NshmpLibNgGmmMultiSelectComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, NshmpLibNgControlPanelButtonsComponent, + NshmpLibNgGmmMultiParamMenuComponent, ReactiveFormsModule, ], selector: 'app-control-panel', @@ -189,11 +192,11 @@ export class ControlPanelComponent implements OnInit, OnDestroy { const {multiSelectableParam} = this.formState.getRawValue(); const parameters = this.service.state().usageResponse.response.parameters; - if (multiSelectableParam === GmmFormControlIds.MW) { + if (multiSelectableParam === MultiSelectableParam.MW) { this.formState.controls.gmmSource.setValue([]); this.formState.controls.Mw.setValue(parameters.Mw.value as number); this.formState.controls.MwMulti.setValue([]); - } else if (multiSelectableParam === GmmFormControlIds.VS30) { + } else if (multiSelectableParam === MultiSelectableParam.VS30) { this.formState.controls.gmmSource.setValue([]); this.formState.controls.vs30.setValue(parameters.vs30.value as number); this.formState.controls.vs30Multi.setValue([]); diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.html b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.html index 7478650f282308cce72a66a5436821122a657d90..91953bb6cadc72e84631bc6d9c071fd442dfd7ec 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.html +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.html @@ -19,7 +19,7 @@ {{ imtIdToDisplay(form?.value?.imt) }} </mat-list-item> - @if (form.value.multiSelectableParam === GmmFormControlIds.MW) { + @if (form.value.multiSelectableParam === Params.MW) { <mat-list-item> <span class="parameter">Magnitude</span>: </mat-list-item> @@ -53,7 +53,7 @@ <div class="grid-col-12 tablet-lg:grid-col-3"> <mat-list class="parameter-list"> - @if (form.value.multiSelectableParam === GmmFormControlIds.VS30) { + @if (form.value.multiSelectableParam === Params.VS30) { <mat-list-item> <span class="parameter">Vs30</span>: </mat-list-item> @for (vs30 of form?.value?.vs30Multi; track vs30) { diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.ts b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.ts index 0ec319d28e478ac14bdefbe13aaa2907c947518a..ac81499e35ee1598ff4ec9782aa0bef9fd3f7873 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.ts +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/components/parameter-summary/parameter-summary.component.ts @@ -1,7 +1,7 @@ import {AsyncPipe} from '@angular/common'; import {Component} from '@angular/core'; import {MatList, MatListItem} from '@angular/material/list'; -import {GmmFormControlIds, gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import {AppService} from '../../services/app.service'; @@ -16,8 +16,8 @@ import {AppService} from '../../services/app.service'; templateUrl: './parameter-summary.component.html', }) export class ParameterSummaryComponent { - /** Control panel ids */ - GmmFormControlIds = GmmFormControlIds; + /** Paramaters */ + Params = MultiSelectableParam; /** Function to convert IMT id to display */ imtIdToDisplay = gmmUtils.imtIdToDisplay; diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/services/app.service.ts b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/services/app.service.ts index 6759dcf161051b6fab8b00e9c62daaad91280005..836581e75bbde51ce98104b6a5501cd51ce0cbb5 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/services/app.service.ts +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/services/app.service.ts @@ -1,6 +1,6 @@ import {Injectable, signal} from '@angular/core'; import {AbstractControl, FormBuilder, Validators} from '@angular/forms'; -import {GmmFormControlIds, gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import { FormGroupControls, NshmpService, @@ -134,7 +134,7 @@ export class AppService gmmGroupType: GmmGroupType.ACTIVE_CRUST, gmmSource: [], imt: gmmUtils.imtPlaceHolder().value, - multiSelectableParam: GmmFormControlIds.GMM, + multiSelectableParam: MultiSelectableParam.GMM, Mw: null, MwMulti: [], rMax: 100, diff --git a/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.html index 70060005dc446a00d0e08c599299fa3d18c04f7c..9ea5daa839d8d84cfa323b0b870c6783dbd3e83d 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.html @@ -4,14 +4,9 @@ [formGroup]="form" (submit)="onSubmit()" > - <mat-form-field class="grid-col-12 multi-select-parameter-menu padding-top-1"> - <mat-label>Multi-Selectable Parameter</mat-label> - <mat-select [formControl]="controls.multiSelectableParam"> - <mat-option value="gmm">Ground Motion Models</mat-option> - <mat-option value="Mw">M<sub>W</sub></mat-option> - <mat-option value="vs30">V<sub>S30</sub></mat-option> - </mat-select> - </mat-form-field> + <nshmp-lib-ng-gmm-multi-param-menu + [multiParamControl]="controls.multiSelectableParam" + /> <!-- GMM menu --> @if (parameters()) { diff --git a/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.ts index a1ae1c6905696b32fe6ce945d595bedc2586b4d9..9151858307f1cabf61d151494b0e152086d0980b 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/gmm/distance/components/control-panel/control-panel.component.ts @@ -8,8 +8,10 @@ import {MatSelect} from '@angular/material/select'; import { GmmFormControlIds, gmmUtils, + MultiSelectableParam, MW_COMMON_VALUES, NshmpLibNgGmmMenuComponent, + NshmpLibNgGmmMultiParamMenuComponent, NshmpLibNgGmmMultiSelectComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, VS30_COMMON_VALUES, @@ -39,6 +41,7 @@ import {AppService} from '../../services/app.service'; NshmpLibNgGmmMultiSelectComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, NshmpLibNgControlPanelButtonsComponent, + NshmpLibNgGmmMultiParamMenuComponent, ReactiveFormsModule, ], selector: 'app-control-panel', @@ -177,11 +180,11 @@ export class ControlPanelComponent implements OnInit, OnDestroy { const {multiSelectableParam} = this.form.getRawValue(); const parameters = this.service.state().usageResponse.response.parameters; - if (multiSelectableParam === GmmFormControlIds.MW) { + if (multiSelectableParam === MultiSelectableParam.MW) { this.controls.gmmSource.setValue([]); this.controls.Mw.setValue(parameters.Mw.value as number); this.controls.MwMulti.setValue([]); - } else if (multiSelectableParam === GmmFormControlIds.VS30) { + } else if (multiSelectableParam === MultiSelectableParam.VS30) { this.controls.gmmSource.setValue([]); this.controls.vs30.setValue(parameters.vs30.value as number); this.controls.vs30Multi.setValue([]); diff --git a/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.html b/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.html index d61b7f90198b22b9741be2c60ecffdcf8deca35c..be93c30f8ada1f7273a868b8304a6e8f03154d5e 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.html +++ b/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.html @@ -20,7 +20,7 @@ {{ imtIdToDisplay(form?.value?.imt) }} </mat-list-item> - @if (form.value.multiSelectableParam === GmmFormControlIds.MW) { + @if (form.value.multiSelectableParam === Params.MW) { <mat-list-item> <span class="parameter">Magnitude</span>: </mat-list-item> @@ -53,7 +53,7 @@ <div class="grid-col-12 tablet-lg:grid-col-3"> <mat-list class="parameter-list"> - @if (form.value.multiSelectableParam === GmmFormControlIds.VS30) { + @if (form.value.multiSelectableParam === Params.VS30) { <mat-list-item> <span class="parameter">Vs30</span>: </mat-list-item> @for (vs30 of form?.value?.vs30Multi; track vs30) { <mat-list-item class="indent-list"> diff --git a/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.ts b/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.ts index df6fc16b8401e6d72bdd0f4c70188174eddf6a23..ba182792761ba421ba0b316bc4095d3c1373ece3 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.ts +++ b/projects/nshmp-apps/src/app/gmm/distance/components/parameter-summary/parameter-summary.component.ts @@ -1,7 +1,7 @@ import {AsyncPipe} from '@angular/common'; import {Component, computed} from '@angular/core'; import {MatList, MatListItem} from '@angular/material/list'; -import {GmmFormControlIds, gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import {AppService} from '../../services/app.service'; @@ -16,8 +16,8 @@ import {AppService} from '../../services/app.service'; templateUrl: './parameter-summary.component.html', }) export class ParameterSummaryComponent { - /** Control panel ids */ - GmmFormControlIds = GmmFormControlIds; + /** Parameters */ + Params = MultiSelectableParam; /** Function to convert IMT id to display */ imtIdToDisplay = gmmUtils.imtIdToDisplay; diff --git a/projects/nshmp-apps/src/app/gmm/distance/services/app.service.ts b/projects/nshmp-apps/src/app/gmm/distance/services/app.service.ts index 1b93e109e98f42f1a3336cf5a35e46f72b018385..e4de80cbf8bc0467c818b78040645b2ff8fd0af2 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/services/app.service.ts +++ b/projects/nshmp-apps/src/app/gmm/distance/services/app.service.ts @@ -1,6 +1,6 @@ import {computed, Injectable, Signal, signal} from '@angular/core'; import {AbstractControl, FormBuilder, Validators} from '@angular/forms'; -import {gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import { FormGroupControls, NshmpService, @@ -22,7 +22,7 @@ import {AppServiceModel} from 'projects/nshmp-apps/src/shared/models/app-service import {SharedService} from 'projects/nshmp-apps/src/shared/services/shared.service'; import {catchError} from 'rxjs'; -import {FormControlIds, FormControls} from '../models/form-controls.model'; +import {FormControls} from '../models/form-controls.model'; import {AppState} from '../models/state.model'; /** @@ -152,7 +152,7 @@ export class AppService gmmGroupType: GmmGroupType.ACTIVE_CRUST, gmmSource: [], imt: 'default', - multiSelectableParam: FormControlIds.GMM, + multiSelectableParam: MultiSelectableParam.GMM, Mw: null, MwMulti: [], rMax: 300, diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.html index 9a48777ada6163f98e497901f43a55ca834d6521..55762fedf8c3937b03b2734b18ad3896470246b2 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.html @@ -5,13 +5,10 @@ (submit)="onSubmit()" novalidate > - <mat-form-field class="grid-col-12 multi-select-parameter-menu padding-top-1"> - <mat-label>Multi-Selectable Parameter</mat-label> - <mat-select [formControl]="controls.multiSelectableParam"> - <mat-option value="gmm">Ground Motion Models</mat-option> - <mat-option value="vs30">V30</mat-option> - </mat-select> - </mat-form-field> + <nshmp-lib-ng-gmm-multi-param-menu + [multiParamControl]="controls.multiSelectableParam" + [showMw]="false" + /> <!-- GMM menu --> @if (parameters()) { diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.ts index fcf830fe40eac1c1211262ea4e6a7ea712fd5e1e..f4acc9baa5baac863b82d10151e1f8256bea0660 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/gmm/magnitude/components/control-panel/control-panel.component.ts @@ -5,9 +5,10 @@ import {MatOption} from '@angular/material/core'; import {MatFormField, MatLabel} from '@angular/material/form-field'; import {MatSelect} from '@angular/material/select'; import { - GmmFormControlIds, gmmUtils, + MultiSelectableParam, NshmpLibNgGmmMenuComponent, + NshmpLibNgGmmMultiParamMenuComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, } from '@ghsc/nshmp-lib-ng/gmm'; import { @@ -30,6 +31,7 @@ import {SourceParametersComponent} from '../source-parameters/source-parameters. NshmpLibNgGmmMenuComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, NshmpLibNgControlPanelButtonsComponent, + NshmpLibNgGmmMultiParamMenuComponent, MatFormField, MatLabel, MatSelect, @@ -145,10 +147,10 @@ export class ControlPanelComponent implements OnInit, OnDestroy { const {multiSelectableParam} = this.form.getRawValue(); const parameters = this.service.state().usageResponse.response.parameters; - if (multiSelectableParam === GmmFormControlIds.MW) { + if (multiSelectableParam === MultiSelectableParam.MW) { this.controls.Mw.setValue(parameters.Mw.value as number); this.controls.MwMulti.setValue([]); - } else if (multiSelectableParam === GmmFormControlIds.VS30) { + } else if (multiSelectableParam === MultiSelectableParam.VS30) { this.controls.vs30.setValue(parameters.vs30.value as number); this.controls.vs30Multi.setValue([]); } diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.html b/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.html index 06e1589fbac83e95c2d39ec59c7075d4e20550ed..d4055d1a06f6efdcdb5563462fc7c1a813dc4c11 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.html +++ b/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.html @@ -51,7 +51,7 @@ <span class="parameter"> Distance</span>: {{ form?.value?.distance }} km </mat-list-item> - @if (form.value.multiSelectableParam === GmmFormControlIds.VS30) { + @if (form.value.multiSelectableParam === Params.VS30) { <mat-list-item> <span class="parameter">Vs30</span>: </mat-list-item> @for (vs30 of form?.value?.vs30Multi; track vs30) { <mat-list-item class="indent-list"> diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.ts b/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.ts index 97c4c234ebfb3ababbe1bd0d1a061c26dc51fb8a..7db551ad91dbdb7be78e706cb76136fc852057b7 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.ts +++ b/projects/nshmp-apps/src/app/gmm/magnitude/components/parameter-summary/parameter-summary.component.ts @@ -1,7 +1,7 @@ import {AsyncPipe} from '@angular/common'; import {Component, computed} from '@angular/core'; import {MatList, MatListItem} from '@angular/material/list'; -import {GmmFormControlIds, gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import {AppService} from '../../services/app.service'; @@ -16,8 +16,8 @@ import {AppService} from '../../services/app.service'; templateUrl: './parameter-summary.component.html', }) export class ParameterSummaryComponent { - /** Control panel ids */ - GmmFormControlIds = GmmFormControlIds; + /** Parameters */ + Params = MultiSelectableParam; /** Function to convert IMT id to display */ imtIdToDisplay = gmmUtils.imtIdToDisplay; diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/services/app.service.ts b/projects/nshmp-apps/src/app/gmm/magnitude/services/app.service.ts index 0c92e62155a86ae1581bfad273af6e26187397c7..13e278af57f36c5eb65b1b954de61fc52afa22f9 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/services/app.service.ts +++ b/projects/nshmp-apps/src/app/gmm/magnitude/services/app.service.ts @@ -1,6 +1,6 @@ import {computed, Injectable, Signal, signal} from '@angular/core'; import {AbstractControl, FormBuilder, Validators} from '@angular/forms'; -import {gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import { FormGroupControls, NshmpService, @@ -26,10 +26,7 @@ import {AppServiceModel} from 'projects/nshmp-apps/src/shared/models/app-service import {SharedService} from 'projects/nshmp-apps/src/shared/services/shared.service'; import {catchError} from 'rxjs'; -import { - FormControlIds, - GmmMagnitudeFormControls, -} from '../models/gmm-magnitude-form-controls.model'; +import {GmmMagnitudeFormControls} from '../models/gmm-magnitude-form-controls.model'; import {AppState} from '../models/state.model'; /** @@ -174,7 +171,7 @@ export class AppService imt: 'default', mMax: null, mMin: null, - multiSelectableParam: FormControlIds.GMM, + multiSelectableParam: MultiSelectableParam.GMM, Mw: null, showEpistemicUncertainty: false, step: null, diff --git a/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.html index 16ac7dc53b2c6334f95ca84c1f13eae49d100357..e48df9933e61cd0992d3ff9553037950b7a2c34d 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.html @@ -5,14 +5,9 @@ (submit)="onSubmit()" novalidate > - <mat-form-field class="grid-col-12 multi-select-parameter-menu padding-top-1"> - <mat-label>Multi-Selectable Parameter</mat-label> - <mat-select [formControl]="controls.multiSelectableParam"> - <mat-option value="gmm">Ground Motion Model</mat-option> - <mat-option value="Mw">Magnitude</mat-option> - <mat-option value="vs30">Site Class</mat-option> - </mat-select> - </mat-form-field> + <nshmp-lib-ng-gmm-multi-param-menu + [multiParamControl]="controls.multiSelectableParam" + /> <!-- GMM menu --> @if (parameters()) { diff --git a/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.ts index a439466747eea16ab7da77cced0f3512cf595f7c..d1805a4fb3201c162a5f30f651018df1ba7e463c 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/gmm/spectra/components/control-panel/control-panel.component.ts @@ -5,8 +5,9 @@ import {MatOption} from '@angular/material/core'; import {MatFormField, MatLabel} from '@angular/material/form-field'; import {MatSelect} from '@angular/material/select'; import { - GmmFormControlIds, + MultiSelectableParam, NshmpLibNgGmmMenuComponent, + NshmpLibNgGmmMultiParamMenuComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, } from '@ghsc/nshmp-lib-ng/gmm'; import { @@ -28,6 +29,7 @@ import {SourceParametersComponent} from '../source-parameters/source-parameters. imports: [ NshmpLibNgGmmMenuComponent, NshmpLibNgGmmPlotOptionsControlPanelComponent, + NshmpLibNgGmmMultiParamMenuComponent, NshmpLibNgControlPanelButtonsComponent, MatFormField, MatLabel, @@ -115,10 +117,10 @@ export class ControlPanelComponent implements OnInit, OnDestroy { const {multiSelectableParam} = this.form.getRawValue(); const parameters = this.service.state().usageResponse.response.parameters; - if (multiSelectableParam === GmmFormControlIds.MW) { + if (multiSelectableParam === MultiSelectableParam.MW) { this.controls.Mw.setValue(parameters.Mw.value as number); this.controls.MwMulti.setValue([]); - } else if (multiSelectableParam === GmmFormControlIds.VS30) { + } else if (multiSelectableParam === MultiSelectableParam.VS30) { this.controls.vs30.setValue(parameters.vs30.value as number); this.controls.vs30Multi.setValue([]); } diff --git a/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.html b/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.html index e35d058f4bb911531c9ee00daeee41f6c9a34067..011bcd97f9e54d0290e5c12e561e89fbff894a7c 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.html +++ b/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.html @@ -15,7 +15,7 @@ <div class="grid-col-12 tablet-lg:grid-col-3"> <mat-list class="parameter-list"> - @if (form.value.multiSelectableParam === GmmFormControlIds.MW) { + @if (form.value.multiSelectableParam === Params.MW) { <mat-list-item> <span class="parameter">Magnitude</span>: </mat-list-item> @@ -92,7 +92,7 @@ {{ form?.value?.hangingWall ? 'Hanging Wall' : 'Footwall' }} </mat-list-item> - @if (form.value.multiSelectableParam === GmmFormControlIds.VS30) { + @if (form.value.multiSelectableParam === Params.VS30) { <mat-list-item> <span class="parameter">Vs30</span>: </mat-list-item> @for (vs30 of form?.value?.vs30Multi; track vs30) { <mat-list-item class="indent-list"> diff --git a/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.ts b/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.ts index 97c4c234ebfb3ababbe1bd0d1a061c26dc51fb8a..7db551ad91dbdb7be78e706cb76136fc852057b7 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.ts +++ b/projects/nshmp-apps/src/app/gmm/spectra/components/parameter-summary/parameter-summary.component.ts @@ -1,7 +1,7 @@ import {AsyncPipe} from '@angular/common'; import {Component, computed} from '@angular/core'; import {MatList, MatListItem} from '@angular/material/list'; -import {GmmFormControlIds, gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import {AppService} from '../../services/app.service'; @@ -16,8 +16,8 @@ import {AppService} from '../../services/app.service'; templateUrl: './parameter-summary.component.html', }) export class ParameterSummaryComponent { - /** Control panel ids */ - GmmFormControlIds = GmmFormControlIds; + /** Parameters */ + Params = MultiSelectableParam; /** Function to convert IMT id to display */ imtIdToDisplay = gmmUtils.imtIdToDisplay; diff --git a/projects/nshmp-apps/src/app/gmm/spectra/services/app.service.ts b/projects/nshmp-apps/src/app/gmm/spectra/services/app.service.ts index 89b4671f90c9ffae8617732d838efaa3903961ec..380aafde410f87ac71db4618469bd6f37a619177 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/services/app.service.ts +++ b/projects/nshmp-apps/src/app/gmm/spectra/services/app.service.ts @@ -5,7 +5,7 @@ import { FormControl, Validators, } from '@angular/forms'; -import {GmmFormControlIds, gmmUtils} from '@ghsc/nshmp-lib-ng/gmm'; +import {gmmUtils, MultiSelectableParam} from '@ghsc/nshmp-lib-ng/gmm'; import { FormGroupControls, NshmpService, @@ -260,7 +260,7 @@ export class AppService gmmGroupType: GmmGroupType.ACTIVE_CRUST, gmmSource: [], hangingWall: true, - multiSelectableParam: GmmFormControlIds.GMM, + multiSelectableParam: MultiSelectableParam.GMM, Mw: null, MwMulti: [], rake: 0,