diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml index d2c10861851c9070702e2e7af08957d8cc33a088..609fbccf5e3687acd59834654daa2609685fb331 100644 --- a/.gitlab-ci.yml +++ b/.gitlab-ci.yml @@ -4,7 +4,7 @@ variables: IMAGE_NAME: ${CODE_REGISTRY_IMAGE}/${CI_PROJECT_NAME}:${ENVIRONMENT}-${CI_COMMIT_SHORT_SHA} UPSTREAM_PATH: ghsc/nshmp/nshmp-apps -image: ${CI_REGISTRY}/devops/images/usgs/node:20 +image: ${CI_REGISTRY}/devops/images/usgs/node:lts # Do not run for merge requests workflow: diff --git a/package-lock.json b/package-lock.json index be43e15d3ad12334bf1019afc9915660c6e005cd..52e209421dbeb07332a00c2e5ebce9e56751c953 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,8 +21,8 @@ "@bluehalo/ngx-leaflet": "^19.0.0", "@compodoc/compodoc": "^1.1.26", "@ghsc/disagg-d3": "^0.13.0", - "@ghsc/nshmp-lib-ng": "^19.0.0", - "@ghsc/nshmp-template": "^19.1.1", + "@ghsc/nshmp-lib-ng": "^19.2.2", + "@ghsc/nshmp-template": "^19.2.4", "@ghsc/nshmp-utils-ts": "^3.12.1", "angular-plotly.js": "^6.0.0", "d3": "^7.9.0", @@ -4852,9 +4852,9 @@ } }, "node_modules/@ghsc/nshmp-lib-ng": { - "version": "19.0.0", - "resolved": "https://code.usgs.gov/api/v4/projects/12416/packages/npm/@ghsc/nshmp-lib-ng/-/@ghsc/nshmp-lib-ng-19.0.0.tgz", - "integrity": "sha1-bkwGldODNQFdbEMnMhOxFf8mp50=", + "version": "19.2.2", + "resolved": "https://code.usgs.gov/api/v4/projects/12416/packages/npm/@ghsc/nshmp-lib-ng/-/@ghsc/nshmp-lib-ng-19.2.2.tgz", + "integrity": "sha1-qRBBKQrd6vYmo+IGz73WI9QIjM8=", "dependencies": { "tslib": "^2.3.0" }, @@ -4864,9 +4864,9 @@ } }, "node_modules/@ghsc/nshmp-template": { - "version": "19.1.1", - "resolved": "https://code.usgs.gov/api/v4/projects/1416/packages/npm/@ghsc/nshmp-template/-/@ghsc/nshmp-template-19.1.1.tgz", - "integrity": "sha1-p55HT0oEhcSv9ogKZJ33/2CoJc4=", + "version": "19.2.4", + "resolved": "https://code.usgs.gov/api/v4/projects/1416/packages/npm/@ghsc/nshmp-template/-/@ghsc/nshmp-template-19.2.4.tgz", + "integrity": "sha1-YniUKBo7ycH/P7YuVE57oo2EWWQ=", "dependencies": { "tslib": "^2.3.1" }, diff --git a/package.json b/package.json index 23890c4e6a976ff3c90cf18778c74c130550954f..c03496b4b176c902c8e6a00676d934c1c998e716 100644 --- a/package.json +++ b/package.json @@ -45,8 +45,8 @@ "@bluehalo/ngx-leaflet": "^19.0.0", "@compodoc/compodoc": "^1.1.26", "@ghsc/disagg-d3": "^0.13.0", - "@ghsc/nshmp-lib-ng": "^19.0.0", - "@ghsc/nshmp-template": "^19.1.1", + "@ghsc/nshmp-lib-ng": "^19.2.2", + "@ghsc/nshmp-template": "^19.2.4", "@ghsc/nshmp-utils-ts": "^3.12.1", "angular-plotly.js": "^6.0.0", "d3": "^7.9.0", diff --git a/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts b/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts index 90965311560ac7ee361e1f994d61561fad014eab..f3f644ecbf872a6b324b372914781867d357d735 100644 --- a/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts +++ b/projects/nshmp-apps/cypress/integration/dev/math/exceedance-explorer/exceedance-explorer.spec.ts @@ -20,7 +20,7 @@ describe('Exceedance Explorer Application', () => { utils.changePlotSettings('.exceedance-plot', '.exceedance-settings'); it('Has default plot', () => { - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('plotly-plot') .should('be.visible'); }); diff --git a/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts b/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts index ade920cfaf8e2776f7ff0c788f974c6ab1ed7638..ec8be6590f3fb6029400c1508384b9e411c544f2 100644 --- a/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts +++ b/projects/nshmp-apps/cypress/integration/hazard/disagg/disagg.spec.ts @@ -34,7 +34,7 @@ describe('Disagg Application', () => { plotClass: 'hazard-lib-disagg-plot', }); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.export-button') .scrollIntoView() .click(); @@ -47,7 +47,7 @@ describe('Disagg Application', () => { plotClass: 'hazard-lib-disagg-plot', }); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.summary') .find('.summary-report') .scrollIntoView() @@ -68,25 +68,25 @@ describe('Disagg Application', () => { cy.get('.cdk-overlay-container').as('overlay'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.component-select') .find('mat-select') .should('be.visible') .click(); cy.get('@overlay').find('mat-option').should('not.exist'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.export-button') .should('be.visible') .should('not.be.enabled'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.summary') .find('app-disagg-summary') .scrollIntoView() .should('not.be.visible'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.summary') .find('app-disagg-contributors') .scrollIntoView() @@ -96,7 +96,7 @@ describe('Disagg Application', () => { plotClass: 'hazard-lib-disagg-plot', }); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.component-select') .scrollIntoView() .find('mat-select') @@ -105,20 +105,20 @@ describe('Disagg Application', () => { cy.get('@overlay').find('mat-option').should('have.length.above', 1); utils.selectMatOption('Total'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.export-button') .scrollIntoView() .should('be.visible') .should('be.enabled') .click(); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.summary') .find('app-disagg-summary') .scrollIntoView() .should('be.visible'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('.summary') .find('app-disagg-contributors') .scrollIntoView() diff --git a/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts b/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts index 86f9982fd2e93d9728f41b4b48c4851bb1ede50c..18cd9977aec361cc6bda4df3bd2e142afbd73621 100644 --- a/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts +++ b/projects/nshmp-apps/cypress/utils/nshmp-template.utils.ts @@ -121,7 +121,7 @@ export function hasNshmpTemplate(navList: NavigationList[]) { export function hasPlotContent() { it('Has plot content', () => { - cy.get('nshmp-template-plot-content').should('exist'); + cy.get('nshmp-template-main-content').should('exist'); }); } @@ -129,7 +129,7 @@ export function submitFormCheckPlot(options: CheckPlot) { options.intercept = options.intercept === undefined ? true : options.intercept; - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(options.plotClass) .then(originalPlot => { if (options.intercept) { @@ -145,7 +145,7 @@ export function submitFormCheckPlot(options: CheckPlot) { cy.wait('@service-call'); } - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(options.plotClass) .should(updatedPlot => { expect(originalPlot).to.not.equal(updatedPlot); @@ -157,10 +157,10 @@ export function submitFormCheckPlots(options: CheckPlots) { options.intercept = options.intercept === undefined ? true : options.intercept; - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(options.firstPlotClass) .then(originalFirstPlot => { - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(options.secondPlotClass) .then(originalSecondPlot => { if (options.intercept) { @@ -178,12 +178,12 @@ export function submitFormCheckPlots(options: CheckPlots) { }); } - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(options.firstPlotClass) .should(updatedFirstPlot => { expect(originalFirstPlot).to.not.equal(updatedFirstPlot); }); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(options.secondPlotClass) .should(updatedSecondPlot => { expect(originalSecondPlot).to.not.equal(updatedSecondPlot); @@ -214,9 +214,9 @@ export function togglePlotPanel() { .should('be.enabled') .as('plot-button'); - cy.get('nshmp-template-plot-content').should('exist'); + cy.get('nshmp-template-main-content').should('exist'); cy.get('@plot-button').click(); - cy.get('nshmp-template-plot-content').should('not.exist'); + cy.get('nshmp-template-main-content').should('not.exist'); }); } diff --git a/projects/nshmp-apps/cypress/utils/plot-lib.utils.ts b/projects/nshmp-apps/cypress/utils/plot-lib.utils.ts index 3aa50136d37a73519f4a59c4fbda248238d6fe53..7bd671a795b2091857f28dd44e1abf91c567d70c 100644 --- a/projects/nshmp-apps/cypress/utils/plot-lib.utils.ts +++ b/projects/nshmp-apps/cypress/utils/plot-lib.utils.ts @@ -14,7 +14,7 @@ export function changePlotSettings(plotClass: string, settingsClass: string) { .find(settingsClass) .scrollIntoView() .as('plot-settings'); - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find(plotClass) .scrollIntoView() .as('plot'); diff --git a/projects/nshmp-apps/cypress/utils/utils.ts b/projects/nshmp-apps/cypress/utils/utils.ts index d71198b4e883b5e79ee17a649adee20b8e15c8bd..c5fbc4f1e992de0de6a0846ab13c7eed487fac9a 100644 --- a/projects/nshmp-apps/cypress/utils/utils.ts +++ b/projects/nshmp-apps/cypress/utils/utils.ts @@ -1,7 +1,7 @@ import 'cypress'; export function hasApplicationTab(tabClass: string) { - cy.get('nshmp-template-plot-content') + cy.get('nshmp-template-main-content') .find('mat-tab-group') .find(tabClass) .should('be.visible') diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html index cdf8fb7e3520b4e27986db1fdd7d0edf776c1372..464fe56b0043d779f6b76cc773592bb909e855df 100644 --- a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html +++ b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts index 6131c2f823ada3d4f79f9b9e3eab5447bb4c4f5d..b306d8a4ac2dd49f12c736f0c95ebbba3de80559 100644 --- a/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts +++ b/projects/nshmp-apps/src/app/designmaps/rtgm/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -21,7 +21,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, NshmpTemplateSettingsComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-hazard/control-panel-hazard.component.scss b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-hazard/control-panel-hazard.component.scss index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..2de7e2145e51a7fd2ddc142b020cd04ff0d5934c 100644 --- a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-hazard/control-panel-hazard.component.scss +++ b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-hazard/control-panel-hazard.component.scss @@ -0,0 +1,5 @@ +body.small-screen :host ::ng-deep { + .form-buttons { + width: 100%; + } +} diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.html b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.html index 4ac652ac54d9c398c7c0378b3df7033a3b5f3a62..cacbe97550986aef82698caf8fbba2efb6adb99b 100644 --- a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.html +++ b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.html @@ -1,7 +1,7 @@ <form [formGroup]="formGroup" class="height-full overflow-auto padding-top-1" - (submit)="service.callService()" + (submit)="onSubmit()" > <!-- Building code --> <app-building-code-control [control]="formGroup.controls.buildingCode" /> diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.scss b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.scss index 479ce114e334096c48ce47bfb3705bd69ef28ea9..32da3bdb5f978637f18e222705e1fb1856a8f4bf 100644 --- a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.scss +++ b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.scss @@ -1,3 +1,9 @@ .hint { font-size: 10.9px; } + +body.small-screen :host ::ng-deep { + .form-buttons { + width: 100%; + } +} diff --git a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.ts b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.ts index 019168b78508826676d1bdc6ea160795db01148f..58e0d805a8f5cd6941a1d6eeb45c7e76c48b09ac 100644 --- a/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.ts +++ b/projects/nshmp-apps/src/app/designmaps/rtgm/components/control-panel-input/control-panel-input.component.ts @@ -3,7 +3,10 @@ import {ReactiveFormsModule} from '@angular/forms'; import {MatButtonModule} from '@angular/material/button'; import {MatError, MatHint, MatInputModule} from '@angular/material/input'; import {MatFormField, MatSelectModule} from '@angular/material/select'; -import {NshmpLibNgControlPanelButtonsComponent} from '@ghsc/nshmp-lib-ng/nshmp'; +import { + NshmpLibNgControlPanelButtonsComponent, + NshmpService, +} from '@ghsc/nshmp-lib-ng/nshmp'; import {Subscription} from 'rxjs'; import {AppService} from '../../services/app.service'; @@ -32,7 +35,10 @@ export class ControlPanelInputComponent implements OnInit, OnDestroy { subs: Subscription[] = []; - constructor(public service: AppService) {} + constructor( + public service: AppService, + private nshmpService: NshmpService, + ) {} ngOnInit(): void { const controls = this.formGroup.controls; @@ -55,4 +61,12 @@ export class ControlPanelInputComponent implements OnInit, OnDestroy { ngOnDestroy(): void { this.subs.forEach(sub => sub.unsubscribe()); } + + /** + * On form submit. + */ + onSubmit(): void { + this.service.callService(); + this.nshmpService.selectPlotControl(); + } } diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html index ef6d2a8806a58e8945043ed44ceb9b67c8db67b7..996e7c48b91f5ffa312d91013ff4dd70132b8a8a 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.html @@ -6,9 +6,9 @@ </nshmp-template-control-panel> <!-- Plots --> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <!-- Settings --> <nshmp-template-settings> diff --git a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts index e892e89171ac879260502c8c9a6cd3cafe8541b8..199bd29b0890fdb04ffe692abb2de4a759a88618 100644 --- a/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts +++ b/projects/nshmp-apps/src/app/dev/gmm/hanging-wall-effects/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {devApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -21,7 +21,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html index 375b90fa6d390e2841ee1455e38a1a4a9a7a7906..e86be1762c08239a2f7139d58a004fc4623ac6f7 100644 --- a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html +++ b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.html @@ -6,9 +6,9 @@ </nshmp-template-control-panel> <!-- Plots --> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <!-- Settings --> <nshmp-template-settings> diff --git a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts index f239fca482c0df32f72f8d4ee681ab4cee84c87b..22774c738d84bc2cae526435564bb7976ca46082 100644 --- a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts +++ b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/app.component.ts @@ -5,7 +5,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {devApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -22,7 +22,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgHazardProvisionalModelComponent, NshmpLibNgAboutPageComponent, diff --git a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.html b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.html index 14318223902f6a93aefcd651555d5c8f3c5af5ce..895ed83f7046eaeed678ee70d7dd190cfe758fc4 100644 --- a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.html +++ b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.html @@ -6,8 +6,8 @@ <div class="grid-col-12 plots-panel widescreen:grid-col-6" [ngClass]="{ - 'panels-opened': panelsOpened$ | async, - 'desktop-lg:grid-col-6': panelsClosed$ | async, + 'panels-opened': panelsOpened(), + 'desktop-lg:grid-col-6': panelsClosed(), }" > <mat-accordion> diff --git a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.ts b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.ts index 21c9fae9edc5b29a6b251a7bfdc62ad28d544ffd..bec0fcca3f63ef4c8d1f3222c52addfe652ab996 100644 --- a/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.ts +++ b/projects/nshmp-apps/src/app/dev/hazard/dynamic-compare/components/plots/plots.component.ts @@ -1,4 +1,4 @@ -import {AsyncPipe, NgClass} from '@angular/common'; +import {NgClass} from '@angular/common'; import {Component, computed, Signal} from '@angular/core'; import {MatDivider} from '@angular/material/divider'; import { @@ -13,9 +13,8 @@ import { NshmpLibNgPlotComponent, NshmpLibNgPlotsContainerComponent, } from '@ghsc/nshmp-lib-ng/plot'; -import {AppControlsService} from '@ghsc/nshmp-template'; +import {HeaderService} from '@ghsc/nshmp-template'; import {PlotlyPlot} from '@ghsc/nshmp-utils-ts/libs/plotly'; -import {map} from 'rxjs'; import {Plots} from '../../models/state.model'; import {AppService} from '../../services/app.service'; @@ -50,7 +49,6 @@ interface PlotInfo { MatExpansionPanelTitle, MatDivider, ParameterSummaryComponent, - AsyncPipe, ], selector: 'app-plots', styleUrl: './plots.component.scss', @@ -88,21 +86,17 @@ export class PlotsComponent { ); /** Wheather both the control and settings panels are closed */ - panelsClosed$ = this.controlsService.controlsChanged.pipe( - map( - () => - !this.controlsService.controlPanelIsSelected && - !this.controlsService.settingsIsSelected, - ), + panelsClosed = computed( + () => + !this.headerService.controlPanelSelected() && + !this.headerService.settingsSelected(), ); /** Wheather both the control and settings panels are opened */ - panelsOpened$ = this.controlsService.controlsChanged.pipe( - map( - () => - this.controlsService.controlPanelIsSelected && - this.controlsService.settingsIsSelected, - ), + panelsOpened = computed( + () => + this.headerService.controlPanelSelected() && + this.headerService.settingsSelected(), ); /** The plots */ @@ -132,6 +126,6 @@ export class PlotsComponent { constructor( private service: AppService, - private controlsService: AppControlsService, + private headerService: HeaderService, ) {} } diff --git a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html index 5e121fa46dc54ead22e5a80295f01cda9ae6bb44..3e40d662b9aab1ac6d28633c8813a37ca0b52ad3 100644 --- a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html +++ b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-plot /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts index 6fd5c89d286d1129fc2041c71bf6d92bcc257456..578861498c75149a6e647c51ac2135b41c83ea0f 100644 --- a/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts +++ b/projects/nshmp-apps/src/app/dev/math/exceedance-explorer/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {devApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -25,7 +25,7 @@ import {PlotSettingsPanelComponent} from './components/plot-settings-panel/plot- NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/gmm/distance/app.component.html b/projects/nshmp-apps/src/app/gmm/distance/app.component.html index cdf8fb7e3520b4e27986db1fdd7d0edf776c1372..464fe56b0043d779f6b76cc773592bb909e855df 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/app.component.html +++ b/projects/nshmp-apps/src/app/gmm/distance/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/gmm/distance/app.component.ts b/projects/nshmp-apps/src/app/gmm/distance/app.component.ts index 9c546cadf268b33ef1bf085b5580f48b67909ece..92ff39db7b83e61306b4a9aba84c0a3e48cce1d3 100644 --- a/projects/nshmp-apps/src/app/gmm/distance/app.component.ts +++ b/projects/nshmp-apps/src/app/gmm/distance/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -28,7 +28,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html index cdf8fb7e3520b4e27986db1fdd7d0edf776c1372..464fe56b0043d779f6b76cc773592bb909e855df 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html +++ b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts index 8e288d5cb14f0d75daf69dd92da153bded6c3ef4..1d80636ca79111cd32e01f4b04350a7ed4deed28 100644 --- a/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts +++ b/projects/nshmp-apps/src/app/gmm/magnitude/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -28,7 +28,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/gmm/spectra/app.component.html b/projects/nshmp-apps/src/app/gmm/spectra/app.component.html index cdf8fb7e3520b4e27986db1fdd7d0edf776c1372..464fe56b0043d779f6b76cc773592bb909e855df 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/app.component.html +++ b/projects/nshmp-apps/src/app/gmm/spectra/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts b/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts index d1b3103672e4af429f72ea2741f18c11721be915..ed3a8c451eb59a684cedfa2fb96870b14cc110fa 100644 --- a/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts +++ b/projects/nshmp-apps/src/app/gmm/spectra/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -28,7 +28,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/hazard/disagg/app.component.html b/projects/nshmp-apps/src/app/hazard/disagg/app.component.html index c38decbf22fd470d2ddc1a1a920fc97f436930d6..12181bf4bed00941ff00faddd624759c4ea3f0a7 100644 --- a/projects/nshmp-apps/src/app/hazard/disagg/app.component.html +++ b/projects/nshmp-apps/src/app/hazard/disagg/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> </nshmp-template-content-container> <!-- Provisional model warning --> diff --git a/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts b/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts index 048c8b8bec96ae48bc3076dfd3dadebe82f8e6ae..8b970cb29fafb196c6b0a2c935432769cd5b2dd9 100644 --- a/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts +++ b/projects/nshmp-apps/src/app/hazard/disagg/app.component.ts @@ -5,7 +5,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; import {navigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'; @@ -23,7 +23,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, NshmpLibNgHazardProvisionalModelComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/hazard/disagg/components/disagg-contributors/disagg-contributors.component.html b/projects/nshmp-apps/src/app/hazard/disagg/components/disagg-contributors/disagg-contributors.component.html index f055f198db405f1393b5cae802a1e4099b922a89..7367b3299a9e1a28ad6d4fa65ffbc8529638eb5a 100644 --- a/projects/nshmp-apps/src/app/hazard/disagg/components/disagg-contributors/disagg-contributors.component.html +++ b/projects/nshmp-apps/src/app/hazard/disagg/components/disagg-contributors/disagg-contributors.component.html @@ -26,11 +26,9 @@ <tr> <th nowrap> Source Set - <mat-icon - class="down-arrow" - aria-label="Down arrow icon" - fontIcon="subdirectory_arrow_right" - /> + <mat-icon class="down-arrow" aria-label="Down arrow icon"> + subdirectory_arrow_right + </mat-icon> Source </th> <th nowrap>Type</th> diff --git a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html index 03bdde34cccaca1ef8567a9c19e937c0a8fbd4bd..b7c70d9bdd1656521be13d513dcf150766718885 100644 --- a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html +++ b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts index 084042bc4dbc41d1c4debb1fb5ad52e2926ec3af..b1ea4cd94a8be405acdf6edccd9f69898fc3d22c 100644 --- a/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts +++ b/projects/nshmp-apps/src/app/hazard/dynamic/app.component.ts @@ -5,7 +5,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -25,7 +25,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, NshmpLibNgHazardProvisionalModelComponent, NshmpTemplateSettingsComponent, diff --git a/projects/nshmp-apps/src/app/hazard/static/app.component.html b/projects/nshmp-apps/src/app/hazard/static/app.component.html index cdf8fb7e3520b4e27986db1fdd7d0edf776c1372..464fe56b0043d779f6b76cc773592bb909e855df 100644 --- a/projects/nshmp-apps/src/app/hazard/static/app.component.html +++ b/projects/nshmp-apps/src/app/hazard/static/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/hazard/static/app.component.ts b/projects/nshmp-apps/src/app/hazard/static/app.component.ts index 04a4ef74d335ee23fe5cce8ceeecb12f785f9a6e..903650eabe7f2cd25ffd0b2ae6be5371d55dc163 100644 --- a/projects/nshmp-apps/src/app/hazard/static/app.component.ts +++ b/projects/nshmp-apps/src/app/hazard/static/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -24,7 +24,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, NshmpTemplateSettingsComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html index 9e5ed1e206622d1f8b2e8613bb614163b4a295c9..30ea230dcc154436eed88a17184780ff5b9eea39 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> </nshmp-template-content-container> <!-- About page --> diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts index 0cbfa4c25a29d435f12de5995d4522976da62776..3c9c639c23497902b6209fc75665385c970fef01 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, } from '@ghsc/nshmp-template'; import {internalApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; import {internalNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'; @@ -27,7 +27,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, ContentComponent, diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/content/content.component.html b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/content/content.component.html index e3d7925dde9d8b898b5380ac607eeb5bdf76c0ba..d5e18ca03eaa4cd718f81c7ec8b15ffe97a396e4 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/content/content.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/content/content.component.html @@ -27,19 +27,15 @@ <span class="logs-toolbar-item"> <mat-button-toggle-group> <mat-button-toggle matTooltip="Scroll to Top" (click)="scrollTop()"> - <mat-icon - aria-label="Scroll to top" - fontIcon="vertical_align_top" - /> + <mat-icon aria-label="Scroll to top"> vertical_align_top </mat-icon> </mat-button-toggle> <mat-button-toggle matTooltip="Scroll to Bottom" (click)="scrollBottom()" > - <mat-icon - aria-label="Scroll to bottom" - fontIcon="vertical_align_bottom" - /> + <mat-icon aria-label="Scroll to bottom"> + vertical_align_bottom + </mat-icon> </mat-button-toggle> </mat-button-toggle-group> </span> diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.html index 71038f6422fb91cf00d1385c9bbbf0f66d1228cd..d5ded724e9343c090f7fbbe90199f892fba1fa95 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.html @@ -7,7 +7,9 @@ <!-- Buttons --> <div class="form-buttons form-buttons--left grid-row" - [ngClass]="nshmpService.controlPanelButtonClass$ | async" + [ngClass]="{ + 'full-width': (nshmpTemplateService.isSmallScreen$ | async) === true, + }" > <div class="grid-col-6 padding-x-1"> <button diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.ts index af369d2ad3b2e69f4be3bdc12ac0c8474f918d6a..d828dff8cbe9230b80f64ccfb8b09e6d4f9e533e 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/control-panel/control-panel.component.ts @@ -5,6 +5,7 @@ import {MatButton} from '@angular/material/button'; import {MatFormField, MatLabel} from '@angular/material/form-field'; import {MatInput} from '@angular/material/input'; import {NshmpService} from '@ghsc/nshmp-lib-ng/nshmp'; +import {NshmpTemplateService} from '@ghsc/nshmp-template'; import {AppService} from '../../services/app.service'; @@ -36,6 +37,7 @@ export class ControlPanelComponent { constructor( public service: AppService, public nshmpService: NshmpService, + public nshmpTemplateService: NshmpTemplateService, ) {} /** diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.html b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.html index d39af39529127541c76ee835bf0b5e3c90c5ab4c..d5fca73b56ae72a0887b31be8a6c3c58ddb89abb 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.html @@ -15,7 +15,7 @@ class="download-button" (click)="download()" > - <mat-icon aria-label="Download from cloud" fontIcon="cloud_download" /> + <mat-icon aria-label="Download from cloud"> cloud_download </mat-icon> </button> <button @@ -24,6 +24,6 @@ matTooltip="Click to dismiss" (click)="dismiss()" > - <mat-icon aria-label="Close" fontIcon="close" /> + <mat-icon aria-label="Close"> close </mat-icon> </button> </span> diff --git a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.ts b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.ts index 1fb833f5f8c9bdb6d796f8de2302128bb84723f7..e031177e551ccb1755d6c55dc635201f163a20bc 100644 --- a/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.ts +++ b/projects/nshmp-apps/src/app/internal/aws/check-haz-jobs/components/snack-bar/snack-bar.component.ts @@ -9,6 +9,7 @@ import { MatSnackBarLabel, } from '@angular/material/snack-bar'; import {MatTooltip} from '@angular/material/tooltip'; +import {NSHMP_TEMPLATE_PROVIDERS} from '@ghsc/nshmp-template'; /** * Angular material snackbar to show link to download results. @@ -24,6 +25,7 @@ import {MatTooltip} from '@angular/material/tooltip'; MatSnackBarAction, MatIcon, ], + providers: [NSHMP_TEMPLATE_PROVIDERS], selector: 'app-snack-bar', styleUrl: './snack-bar.component.scss', templateUrl: './snack-bar.component.html', diff --git a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html index 9e5ed1e206622d1f8b2e8613bb614163b4a295c9..30ea230dcc154436eed88a17184780ff5b9eea39 100644 --- a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> </nshmp-template-content-container> <!-- About page --> diff --git a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts index 464e028556fe38c849fb1104e478cfbd4760218e..c40822124fd026bf96868bc665a7acd24ce7fa87 100644 --- a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts +++ b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, } from '@ghsc/nshmp-template'; import {internalApps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; import {internalNavigation} from 'projects/nshmp-apps/src/shared/utils/navigation.utils'; @@ -25,7 +25,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, ControlPanelComponent, ContentComponent, diff --git a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.html index 314f2f13c9eea11c0484ce2128699af1f4c73f37..905b0609ce6f04a5198be5f06da5391e91bb2144 100644 --- a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.html @@ -21,7 +21,9 @@ <!-- Buttons --> <div class="form-buttons form-buttons--left grid-row" - [ngClass]="nshmpService.controlPanelButtonClass$ | async" + [ngClass]="{ + 'full-width': (nshmpTemplateService.isSmallScreen$ | async) === true, + }" > <div class="grid-col-12 padding-x-1"> <button diff --git a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.ts index fc4f642643739a55f8cf106360c3f4931a312b74..00b5e267f4358c7d327918bcdba38598937c4ae0 100644 --- a/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/internal/aws/haz-job-history/components/control-panel/control-panel.component.ts @@ -8,6 +8,7 @@ import {MatInput} from '@angular/material/input'; import {MatSelect} from '@angular/material/select'; import {JobStatus} from '@ghsc/nshmp-lib-ng/aws'; import {NshmpService, nshmpUtils} from '@ghsc/nshmp-lib-ng/nshmp'; +import {NshmpTemplateService} from '@ghsc/nshmp-template'; import {Subscription} from 'rxjs'; import {AppService} from '../../services/app.service'; @@ -43,6 +44,7 @@ export class ControlPanelComponent implements OnInit, OnDestroy { constructor( public nshmpService: NshmpService, + public nshmpTemplateService: NshmpTemplateService, private service: AppService, ) {} diff --git a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/form/form.component.html b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/form/form.component.html index a702754e061f06a5d383234f411333007271de71..83b08889787220f98934dd7e4f5c5740f4504391 100644 --- a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/form/form.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/form/form.component.html @@ -63,7 +63,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Memory icon" fontIcon="memory" /> + <mat-icon aria-label="Memory icon">memory</mat-icon> </span> <a matSuffix @@ -73,7 +73,7 @@ target="__blank" color="primary" > - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </a> <mat-hint> The AWS EC2 instance type </mat-hint> <mat-error>Must not contain spaces</mat-error> @@ -110,7 +110,7 @@ [formControl]="form.controls.nshmpConfig.controls.email" /> <span matPrefix> - <mat-icon aria-label="Email icon" fontIcon="email" /> + <mat-icon aria-label="Email icon">email</mat-icon> </span> <mat-error>Must be a valid USGS email</mat-error> <mat-hint>Email to recieve notifications from AWS</mat-hint> @@ -138,7 +138,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Code icon" fontIcon="code" /> + <mat-icon aria-label="Code icon">code</mat-icon> </span> <a matSuffix @@ -148,7 +148,7 @@ target="__blank" color="primary" > - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </a> <mat-error> Must be a valid URL ending in <code>.git</code> @@ -170,7 +170,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Code icon" fontIcon="code" /> + <mat-icon aria-label="Code icon">code</mat-icon> </span> <mat-hint> The branch, tag, or commit of the nshmp-haz repository @@ -195,7 +195,7 @@ } </mat-select> <span matPrefix> - <mat-icon aria-label="Code icon" fontIcon="code" /> + <mat-icon aria-label="Code icon">code</mat-icon> </span> <a matSuffix @@ -205,7 +205,7 @@ target="__blank" color="primary" > - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </a> <mat-hint>Java class name of class to run</mat-hint> </mat-form-field> @@ -238,7 +238,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Code icon" fontIcon="code" /> + <mat-icon aria-label="Code icon">code</mat-icon> </span> <a matSuffix @@ -248,7 +248,7 @@ target="__blank" color="primary" > - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </a> <mat-error> Must be a valid URL ending in <code>.git</code> @@ -276,7 +276,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Code icon" fontIcon="code" /> + <mat-icon aria-label="Code icon">code</mat-icon> </span> <mat-error> Must be a valid URL ending in <code>.git</code> @@ -311,7 +311,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Plot icon" fontIcon="show_chart" /> + <mat-icon aria-label="Plot icon">show_chart</mat-icon> </span> <a matSuffix @@ -321,7 +321,7 @@ target="__blank" color="primary" > - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </a> <mat-hint>The Git URL to the NSHM repository</mat-hint> <mat-error> @@ -343,9 +343,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Code icon" fontIcon="code" - >code</mat-icon - > + <mat-icon aria-label="Code icon">code</mat-icon> </span> <mat-error>Must not contain spaces</mat-error> <mat-hint> @@ -366,7 +364,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Folder icon" fontIcon="folder" /> + <mat-icon aria-label="Folder icon">folder</mat-icon> </span> <mat-error>Must not contain spaces</mat-error> <mat-hint>Path inside tarball to model</mat-hint> @@ -412,7 +410,7 @@ " /> <span matPrefix> - <mat-icon aria-label="Note icon" fontIcon="note_add" /> + <mat-icon aria-label="Note icon">note_add</mat-icon> </span> <a matSuffix @@ -422,7 +420,7 @@ target="__blank" color="primary" > - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </a> <mat-error> Must be a valid URL </mat-error> <mat-hint diff --git a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/history/history.component.html b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/history/history.component.html index 100d4e3dbd24d262896af3980b10fe667d71856a..c3018fa9ad6098e5f978e2cab24a336db9bf1d5a 100644 --- a/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/history/history.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/submit-haz-jobs/components/history/history.component.html @@ -70,7 +70,7 @@ matTooltip="Download the configuration file" (click)="downloadConfiguration(serviceResponse)" > - <mat-icon fontIcon="download" aria-label="Download icon" /> + <mat-icon aria-label="Download icon">download</mat-icon> </button> <button @@ -81,7 +81,7 @@ service.clearHistory(serviceResponse.response.jobId) " > - <mat-icon fontIcon="delete" aria-label="Delete icon" /> + <mat-icon aria-label="Delete icon">delete</mat-icon> </button> </div> </mat-card-actions> diff --git a/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/components/content/content.component.html b/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/components/content/content.component.html index c227eda608e5ae7244be3ed05f16ff6432bdad36..a741a95660f2b880eec84a44d294860d246fca82 100644 --- a/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/components/content/content.component.html +++ b/projects/nshmp-apps/src/app/internal/aws/terminate-haz-jobs/components/content/content.component.html @@ -11,7 +11,7 @@ <mat-label>Job ID <span class="form-required">*</span></mat-label> <input matInput type="text" [formControl]="form.controls.id" /> <div matSuffix matTooltip="The id of the running job to terminate"> - <mat-icon aria-label="Info icon" fontIcon="info" /> + <mat-icon aria-label="Info icon">info</mat-icon> </div> <mat-hint>The id of the running job to terminate</mat-hint> </mat-form-field> diff --git a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html index 7b42a2066f03e462b5cd7988f2479fa9f14f278b..3f2a7bef6075f20daf89a70e6fd188a2bffde42f 100644 --- a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html +++ b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts index 32e2387a5ea476e2eea66f7f1319d555714f857d..c1327eec073f7986e907c92e2c080bc948d183b1 100644 --- a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts +++ b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/app.component.ts @@ -4,7 +4,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -21,7 +21,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateControlPanelComponent, NshmpTemplateContentContainerComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpLibNgAboutPageComponent, NshmpTemplateSettingsComponent, ControlPanelComponent, diff --git a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.html index e095673423654534dd022843ac19e7aacc506b9b..1defdd8025f3e43687b10a8c8ea75787b22e9eb3 100644 --- a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.html @@ -2,7 +2,7 @@ <form class="height-full overflow-auto padding-top-1" [formGroup]="formGroup" - (submit)="service.callService()" + (submit)="onSubmit()" > @let depths = parameters()?.depths; @let location = parameters()?.location; @@ -81,7 +81,7 @@ class="margin-0 margin-top-neg-105" (click)="removeLocation(index)" > - <mat-icon fontIcon="remove" /> + <mat-icon>remove</mat-icon> </button> </span> } @@ -122,7 +122,7 @@ type="button" color="secondary" > - <mat-icon fontIcon="add" /> + <mat-icon>add</mat-icon> Add additional location </button> diff --git a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.ts index 89484208db0e46b32645ae7df3f59e16941b3af2..9a76a3dc0934efc316af84456326fe5c4bf498b6 100644 --- a/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/ncm/geophysical-profiles/components/control-panel/control-panel.component.ts @@ -13,6 +13,7 @@ import { import { FormGroupControls, NshmpLibNgControlPanelButtonsComponent, + NshmpService, } from '@ghsc/nshmp-lib-ng/nshmp'; import {NcmUsageParameter} from '@ghsc/nshmp-utils-ts/libs/ncm/geophysical'; import {Location} from '@ghsc/nshmp-utils-ts/libs/nshmp-lib/geo'; @@ -61,7 +62,10 @@ export class ControlPanelComponent implements OnInit, OnDestroy { private subs: Subscription[] = []; - constructor(public service: AppService) {} + constructor( + public service: AppService, + private nshmpService: NshmpService, + ) {} ngOnInit(): void { const controls = this.formGroup.controls; @@ -86,6 +90,11 @@ export class ControlPanelComponent implements OnInit, OnDestroy { this.subs.forEach(sub => sub.unsubscribe()); } + onSubmit(): void { + this.service.callService(); + this.nshmpService.selectPlotControl(); + } + removeLocation(index: number): void { this.formGroup.controls.locations.removeAt(index); } diff --git a/projects/nshmp-apps/src/app/services/components/content/content.component.html b/projects/nshmp-apps/src/app/services/components/content/content.component.html index fd7dbe5e0fc7633395097f930af04960f7c4a37e..c381cbe8b972209a9deec6c653963776849794de 100644 --- a/projects/nshmp-apps/src/app/services/components/content/content.component.html +++ b/projects/nshmp-apps/src/app/services/components/content/content.component.html @@ -30,17 +30,15 @@ > @if (sidenavCollapsed === false) { <div class="icon-text"> - <mat-icon - aria-label="Left arrow icon" - fontIcon="keyboard_double_arrow_left" - /> + <mat-icon aria-label="Left arrow icon"> + keyboard_double_arrow_left + </mat-icon> <span>Collapse sidebar</span> </div> } @else { - <mat-icon - aria-label="Right arrow icon" - fontIcon="keyboard_double_arrow_right" - /> + <mat-icon aria-label="Right arrow icon"> + keyboard_double_arrow_right + </mat-icon> } </button> </div> @@ -60,7 +58,7 @@ mat-icon-button (click)="onLinkIconClick(serviceGroup.id)" > - <mat-icon aria-label="Link Icon" fontIcon="link" /> + <mat-icon aria-label="Link Icon">link</mat-icon> </button> {{ serviceGroup.title }} </div> diff --git a/projects/nshmp-apps/src/app/source/mfd/app.component.html b/projects/nshmp-apps/src/app/source/mfd/app.component.html index 03bdde34cccaca1ef8567a9c19e937c0a8fbd4bd..b7c70d9bdd1656521be13d513dcf150766718885 100644 --- a/projects/nshmp-apps/src/app/source/mfd/app.component.html +++ b/projects/nshmp-apps/src/app/source/mfd/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/source/mfd/app.component.ts b/projects/nshmp-apps/src/app/source/mfd/app.component.ts index 4caa9b025485a76bfe1b4221f657a2d52607e6a3..509376c6dcab573ffda677a60244ea08e774bf86 100644 --- a/projects/nshmp-apps/src/app/source/mfd/app.component.ts +++ b/projects/nshmp-apps/src/app/source/mfd/app.component.ts @@ -5,7 +5,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateService, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; @@ -29,7 +29,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgHazardProvisionalModelComponent, NshmpLibNgAboutPageComponent, diff --git a/projects/nshmp-apps/src/app/source/model-maps/app.component.html b/projects/nshmp-apps/src/app/source/model-maps/app.component.html index 8c5371544bee801ad470186c97b75f15786f6d84..85fc7ab01a23544fb1e0a84c56625d222f96a4c1 100644 --- a/projects/nshmp-apps/src/app/source/model-maps/app.component.html +++ b/projects/nshmp-apps/src/app/source/model-maps/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-map-content> + <nshmp-template-main-content> <app-map /> - </nshmp-template-map-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/source/model-maps/app.component.ts b/projects/nshmp-apps/src/app/source/model-maps/app.component.ts index b893795adb26d2d27befe02f08f4f95e48a07ec1..8e75d6ec50b6c63c2eec7d67a96b9827351464c4 100644 --- a/projects/nshmp-apps/src/app/source/model-maps/app.component.ts +++ b/projects/nshmp-apps/src/app/source/model-maps/app.component.ts @@ -1,12 +1,12 @@ -import {Component, OnDestroy, OnInit, ViewEncapsulation} from '@angular/core'; +import {Component, effect, OnInit, ViewEncapsulation} from '@angular/core'; import {NshmpLibNgAboutPageComponent} from '@ghsc/nshmp-lib-ng/about'; import {NshmpLibNgHazardProvisionalModelComponent} from '@ghsc/nshmp-lib-ng/hazard'; import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { - AppControlsService, + HeaderService, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplateMapContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -33,7 +33,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplateMapContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgHazardProvisionalModelComponent, NshmpLibNgAboutPageComponent, @@ -47,7 +47,7 @@ import {AppService} from './services/app.service'; styleUrl: './app.component.scss', templateUrl: './app.component.html', }) -export class AppComponent implements OnInit, OnDestroy { +export class AppComponent implements OnInit { /** Subscirption on controls change */ controlsSubscription: Subscription; /** Navigation list for meny */ @@ -57,18 +57,16 @@ export class AppComponent implements OnInit, OnDestroy { constructor( public service: AppService, - private controlsService: AppControlsService, - ) {} + private headerService: HeaderService, + ) { + effect(() => { + this.headerService.controlPanelSelected(); + this.headerService.settingsSelected(); + this.service.mapRedraw(); + }); + } ngOnInit() { this.service.init(); - - this.controlsSubscription = this.controlsService.controlsChanged.subscribe( - () => this.service.mapRedraw(), - ); - } - - ngOnDestroy(): void { - this.controlsSubscription?.unsubscribe(); } } diff --git a/projects/nshmp-apps/src/app/source/model-maps/components/control-panel/control-panel.component.html b/projects/nshmp-apps/src/app/source/model-maps/components/control-panel/control-panel.component.html index 67e0d34170ff59f7a32d96b9681823acbadba4f1..47f433ac422dfceb0b0b27914bb734251939733a 100644 --- a/projects/nshmp-apps/src/app/source/model-maps/components/control-panel/control-panel.component.html +++ b/projects/nshmp-apps/src/app/source/model-maps/components/control-panel/control-panel.component.html @@ -1,6 +1,6 @@ <form [formGroup]="formGroup" class="height-full overflow-auto"> <div class="settings-section"> - <mat-label class="settings-section--label">Model Layers</mat-label> + <mat-label class="label">Model Layers</mat-label> <div class="settings-subsection padding-top-1"> <div class="settings-subsection--section"> <nshmp-lib-ng-hazard-model-form diff --git a/projects/nshmp-apps/src/app/source/model-maps/components/plot-settings-panel/plot-settings-panel.component.html b/projects/nshmp-apps/src/app/source/model-maps/components/plot-settings-panel/plot-settings-panel.component.html index a9c8dbb791871c0b9419c6ee03e643f7f0832fc3..9b096a51c76a8d1ad192ea4315183040d066099e 100644 --- a/projects/nshmp-apps/src/app/source/model-maps/components/plot-settings-panel/plot-settings-panel.component.html +++ b/projects/nshmp-apps/src/app/source/model-maps/components/plot-settings-panel/plot-settings-panel.component.html @@ -1,6 +1,6 @@ <div class="height-full overflow-auto"> <div class="settings-section"> - <mat-label class="settings-section--label">Map Settings</mat-label> + <mat-label class="label">Map Settings</mat-label> <div class="padding-x-2"> <div class="padding-top-2"> diff --git a/projects/nshmp-apps/src/app/source/rates/app.component.html b/projects/nshmp-apps/src/app/source/rates/app.component.html index 03bdde34cccaca1ef8567a9c19e937c0a8fbd4bd..b7c70d9bdd1656521be13d513dcf150766718885 100644 --- a/projects/nshmp-apps/src/app/source/rates/app.component.html +++ b/projects/nshmp-apps/src/app/source/rates/app.component.html @@ -4,9 +4,9 @@ <app-control-panel /> </nshmp-template-control-panel> - <nshmp-template-plot-content> + <nshmp-template-main-content> <app-content /> - </nshmp-template-plot-content> + </nshmp-template-main-content> <nshmp-template-settings> <app-plot-settings-panel /> diff --git a/projects/nshmp-apps/src/app/source/rates/app.component.ts b/projects/nshmp-apps/src/app/source/rates/app.component.ts index 637796ffe2f5df1a76f3e38ecf020cdd460c60c9..7cfe965356c7942233d5dd1558950456b7064047 100644 --- a/projects/nshmp-apps/src/app/source/rates/app.component.ts +++ b/projects/nshmp-apps/src/app/source/rates/app.component.ts @@ -5,7 +5,7 @@ import {NshmpLibNgTemplateComponent} from '@ghsc/nshmp-lib-ng/nshmp'; import { NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, } from '@ghsc/nshmp-template'; import {apps} from 'projects/nshmp-apps/src/shared/utils/applications.utils'; @@ -22,7 +22,7 @@ import {AppService} from './services/app.service'; NshmpLibNgTemplateComponent, NshmpTemplateContentContainerComponent, NshmpTemplateControlPanelComponent, - NshmpTemplatePlotContentComponent, + NshmpTemplateMainContentComponent, NshmpTemplateSettingsComponent, NshmpLibNgHazardProvisionalModelComponent, NshmpLibNgAboutPageComponent, diff --git a/projects/nshmp-apps/src/app/source/rates/components/control-panel/control-panel.component.ts b/projects/nshmp-apps/src/app/source/rates/components/control-panel/control-panel.component.ts index 2cdb723259b68f54fefd8347bdf92513501aa446..93c1b8534dad45a990608a6a1072d7206a6569f1 100644 --- a/projects/nshmp-apps/src/app/source/rates/components/control-panel/control-panel.component.ts +++ b/projects/nshmp-apps/src/app/source/rates/components/control-panel/control-panel.component.ts @@ -10,7 +10,10 @@ import { NshmpLibNgMapSelectSiteComponent, SelectSiteDialogData, } from '@ghsc/nshmp-lib-ng/map'; -import {NshmpLibNgControlPanelButtonsComponent} from '@ghsc/nshmp-lib-ng/nshmp'; +import { + NshmpLibNgControlPanelButtonsComponent, + NshmpService, +} from '@ghsc/nshmp-lib-ng/nshmp'; import {Location} from '@ghsc/nshmp-utils-ts/libs/nshmp-lib/geo'; import {environment} from 'projects/nshmp-apps/src/environments/environment'; import {Subscription} from 'rxjs'; @@ -55,7 +58,10 @@ export class ControlPanelComponent implements OnInit, OnDestroy { private subs: Subscription[] = []; - constructor(public service: AppService) {} + constructor( + public service: AppService, + private nshmpService: NshmpService, + ) {} ngOnInit(): void { const controls = this.formGroup.controls; @@ -83,6 +89,23 @@ export class ControlPanelComponent implements OnInit, OnDestroy { this.subs.forEach(sub => sub.unsubscribe()); } + onSubmit(): void { + this.service.callService(); + this.nshmpService.selectPlotControl(); + } + + /** + * Set the location form fields. + * + * @param location The location + */ + setLocation(location: Location): void { + this.formGroup.patchValue({ + latitude: location.latitude, + longitude: location.longitude, + }); + } + private onModelChange(): void { const {latitude, longitude} = this.formGroup.getRawValue(); const latitudeBounds = this.service.usage().response.latitude; @@ -106,20 +129,4 @@ export class ControlPanelComponent implements OnInit, OnDestroy { this.formGroup.controls.longitude.markAsPristine(); this.service.resetState(); } - - onSubmit(): void { - this.service.callService(); - } - - /** - * Set the location form fields. - * - * @param location The location - */ - setLocation(location: Location): void { - this.formGroup.patchValue({ - latitude: location.latitude, - longitude: location.longitude, - }); - } } diff --git a/projects/nshmp-apps/src/styles/_forms.scss b/projects/nshmp-apps/src/styles/_forms.scss index c1f793ac602f6601646993b7ebfd756993d2a9f8..bb6488c3833c302851c7b7dbe58e120ee401022e 100644 --- a/projects/nshmp-apps/src/styles/_forms.scss +++ b/projects/nshmp-apps/src/styles/_forms.scss @@ -6,36 +6,5 @@ @use '@ghsc/nshmp-template/styles/variables'; nshmp-template-control-panel form { - padding-bottom: 3em; -} - -/* Form buttons */ -.form-buttons { - bottom: 0; - padding: 1em 0 0 0; - position: absolute; - width: variables.$side-panel-width; - z-index: 10; - background-color: mat.m2-get-color-from-palette(variables.$nshmp-accent); - box-shadow: 0 0 1px rgba(0, 0, 0, 0.8); -} - -.form-buttons.full-width { - width: 100%; -} - -.form-buttons.half-width { - width: 50%; -} - -.form-buttons--left { - left: 0; -} - -.form-buttons--right { - right: 0; -} - -body.dark-mode .form-buttons { - background-color: mat.m2-get-color-from-palette(variables.$nshmp-accent, 800); + padding: 1em 0.5em 1em; } diff --git a/projects/nshmp-apps/src/styles/_settings-panel.scss b/projects/nshmp-apps/src/styles/_settings-panel.scss index 5255f646abf4a76792f3e90ea61b8d47fb95a526..af4f946e3ecb67da59767e80f04d0632973a8d96 100644 --- a/projects/nshmp-apps/src/styles/_settings-panel.scss +++ b/projects/nshmp-apps/src/styles/_settings-panel.scss @@ -2,11 +2,11 @@ * Styling for plot settings side panel */ -.app-content .app-content--side-panel, +.app-content .side-panel, .settings { /* Plot settings */ .settings-section { - .settings-section--label { + .label { font-weight: 900; font-size: 18px; } diff --git a/tsconfig.json b/tsconfig.json index 6b0b78324666be687bc710cc839241ae39a4f7d8..4789584f6ee675120f8b127233d38a41c94182e0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -27,7 +27,7 @@ "strictStandalone": true, "extendedDiagnostics": { "checks": { - "unusedStandaloneImports": "error" + "unusedStandaloneImports": "warning" } } },