Merge pull request #1941 from asfadmin/andy/displacement

Andy/displacement
asfadmin · Jul 25, 2024 · 36105c9 · 36105c9
2 parents 2bdbe7e + e9ed9c8
commit 36105c9
Show file tree

Hide file tree

Showing 29 changed files with 192 additions and 194 deletions.
diff --git a/src/app/components/filters-dropdown/filters-dropdown.component.html b/src/app/components/filters-dropdown/filters-dropdown.component.html
@@ -34,8 +34,8 @@
           {{ 'EVENT_SEARCH' | translate }}
         </ng-container>
 
-        @if(selectedSearchType === searchTypes.TIMESERIES) {
-          {{ 'TIMESERIES_SEARCH' | translate }}
+        @if(selectedSearchType === searchTypes.DISPLACEMENT) {
+          {{ 'DISPLACEMENT_SEARCH' | translate }}
         }
       </div>
     </div>
@@ -66,7 +66,7 @@
       <ng-container *ngIf="selectedSearchType === searchTypes.SARVIEWS_EVENTS">
         <app-sarviews-filters></app-sarviews-filters>
       </ng-container>
-      @if(selectedSearchType === searchTypes.TIMESERIES) {
+      @if(selectedSearchType === searchTypes.DISPLACEMENT) {
         <app-timeseries-filters></app-timeseries-filters>
       }
     </div>

diff --git a/src/app/components/header/header.component.html b/src/app/components/header/header.component.html
@@ -13,7 +13,7 @@
       <app-dataset-header *ngIf="searchType === searchTypes.DATASET">
       </app-dataset-header>
 
-      <app-timeseries-header *ngIf="searchType === searchTypes.TIMESERIES">
+      <app-timeseries-header *ngIf="searchType === searchTypes.DISPLACEMENT">
       </app-timeseries-header>
 
       <app-list-header *ngIf="searchType === searchTypes.LIST">

diff --git a/src/app/components/map/map-controls/map-controls.component.html b/src/app/components/map/map-controls/map-controls.component.html
@@ -49,7 +49,7 @@
               </div>
             </div>
 
-            <div *ngIf="searchType === searchTypes.DATASET || searchType === searchTypes.SBAS || searchType === searchTypes.TIMESERIES" class="fx-empty group-margin">
+            <div *ngIf="searchType === searchTypes.DATASET || searchType === searchTypes.SBAS || searchType === searchTypes.DISPLACEMENT" class="fx-empty group-margin">
               <div class="fx-row-center button-group-label">
                 <label>{{ 'AREA_OF_INTEREST' |  translate }}</label>
               </div>

diff --git a/src/app/components/results-menu/results-menu.component.html b/src/app/components/results-menu/results-menu.component.html
@@ -39,13 +39,13 @@
               searchType !== SearchTypes.BASELINE &&
               searchType !== SearchTypes.SBAS &&
               searchType !== SearchTypes.SARVIEWS_EVENTS &&
-              searchType !== SearchTypes.TIMESERIES
+              searchType !== SearchTypes.DISPLACEMENT
               "
               [class.small-size]="breakpoint === breakpoints.SMALL"
               [resize$]="resize$">
             </app-desktop-results-menu>
 
-            <app-timeseries-results-menu class="w100 h100 results-menu--layout" *ngIf="searchType === SearchTypes.TIMESERIES" [resize$]="resize$">
+            <app-timeseries-results-menu class="w100 h100 results-menu--layout" *ngIf="searchType === SearchTypes.DISPLACEMENT">
 
             </app-timeseries-results-menu>
             <app-sarviews-results-menu class="w100 h100 results-menu--layout"

diff --git a/src/app/components/results-menu/scenes-list/scenes-list.component.html b/src/app/components/results-menu/scenes-list/scenes-list.component.html
@@ -17,7 +17,7 @@
           searchType === SearchTypes.BASELINE ||
           searchType === SearchTypes.LIST ||
           searchType === SearchTypes.CUSTOM_PRODUCTS ||
-          searchType === SearchTypes.TIMESERIES
+          searchType === SearchTypes.DISPLACEMENT
           "
           >
         <div *cdkVirtualFor="let scene of scenes | slice:0:numberProductsInList">

diff --git a/...pp/components/results-menu/timeseries-results-menu/timeseries-results-menu.component.html b/...pp/components/results-menu/timeseries-results-menu/timeseries-results-menu.component.html
@@ -75,7 +75,7 @@
 			<div class="toggle-group-wrapper--layout">
 				<mat-button-toggle class="control-mat-button-toggle ts-criteria-button-toggle"
 					(click)="onToggleFiltersMenu()">
-					{{ 'TIMESERIES FILTERS' | translate }}<mat-icon class="more-horiz">more_horiz</mat-icon>
+					{{ 'DISPLACEMENT FILTERS' | translate }}<mat-icon class="more-horiz">more_horiz</mat-icon>
 				</mat-button-toggle>
 			</div>
 		</div>

diff --git a/...pp/components/results-menu/timeseries-results-menu/timeseries-results-menu.component.scss b/...pp/components/results-menu/timeseries-results-menu/timeseries-results-menu.component.scss
@@ -11,8 +11,7 @@
 .ts-chart-card {
 	box-shadow: none;
 	height: 100%;
-	width: 100%;
-	flex: 1 1 100%;
+	flex: 1 1 auto;
 	box-sizing: border-box;
 }
 
@@ -61,8 +60,9 @@
 }
 
 .ts-layer-list {
-  flex-basis: 650px;
-  flex-grow: 0;
+   flex: 1 1 500px;
+  //flex-basis: 650px;
+  //flex-grow: 0;
 }
 
 .ts-layer-list-header {
@@ -268,4 +268,4 @@ label {
 }
 .ts-column-2 {
 	margin: 25px;
-}
+}
diff --git a/src/app/components/shared/aoi-options/draw-selector/draw-selector.component.html b/src/app/components/shared/aoi-options/draw-selector/draw-selector.component.html
@@ -28,7 +28,7 @@
       <mat-icon class="draw-icon">place</mat-icon>
       {{ 'PLACE_A_POINT' | translate }}
     </button>
-    @if(searchType !== searchTypes.TIMESERIES) {
+    @if(searchType !== searchTypes.DISPLACEMENT) {
 
       <button mat-menu-item
       (click)="onLineStringSelected()"

diff --git a/src/app/components/shared/docs-modal/docs-modal.component.html b/src/app/components/shared/docs-modal/docs-modal.component.html
@@ -5,6 +5,6 @@
 </ng-container>
 <ng-template #elseBlock>
   <a (click)="showDoc()" class="link-pointer" matTooltip="{{this.tooltip ?? 'OPEN_LINK_TO_DOCUMENTATION' | translate}}">
-    <mat-icon>{{ icon }}</mat-icon>
+    <mat-icon class="icon-size">{{ icon }}</mat-icon>
   </a>
 </ng-template>
diff --git a/src/app/components/shared/docs-modal/docs-modal.component.scss b/src/app/components/shared/docs-modal/docs-modal.component.scss
@@ -4,6 +4,11 @@
   cursor: pointer;
 }
 
+.icon-size {
+  height: 16px !important;
+  line-height: 16px !important;
+}
+
 .text-link {
   @include themify($themes) {
     color: themed('blue-link');

diff --git a/src/app/components/shared/docs-modal/docs-modal.component.ts b/src/app/components/shared/docs-modal/docs-modal.component.ts
@@ -38,7 +38,7 @@ export interface DialogData {
 export class DocsModalComponent implements OnInit, OnDestroy {
   @Input() url: string;
   @Input() text: string;
-  @Input() icon: string = 'info';
+  @Input() icon: string = 'read_more';
   @Input() tooltip: string;
   public docURL: string;
   public safeDocURL: any;

diff --git a/...ts/shared/selectors/burst-selector/full-burst-selector/full-burst-selector.component.html b/...ts/shared/selectors/burst-selector/full-burst-selector/full-burst-selector.component.html
@@ -1,5 +1,5 @@
 <ng-container *ngIf="searchType$ | async as type">
-  <ng-container *ngIf="type === searchTypes.TIMESERIES; else other_stuff">
+  <ng-container *ngIf="type === searchTypes.DISPLACEMENT; else other_stuff">
     <mat-form-field style="display: block">
 
       <mat-label>{{'BURST_ID_FULL' | translate}}</mat-label>
@@ -12,4 +12,4 @@
       <textarea matInput style="height: 75px;" [value]="fullBurstIDs.join(',')" (input)="onChange($event)"></textarea>
     </mat-form-field>
   </ng-template>
-</ng-container>
+</ng-container>
diff --git a/src/app/components/shared/selectors/search-type-selector/search-type-selector.component.html b/src/app/components/shared/selectors/search-type-selector/search-type-selector.component.html
@@ -20,86 +20,73 @@
     <mat-menu #searchTypeMenu="matMenu" [(ngModel)]="searchType" name="searchType" id="searchMenu" ngDefaultControl>
 
       <div>
-        <menu mat-menu-item class="menu-item mat-menu-item" [matMenuTriggerFor]="searchMenu" mat-menu-item>
-          <div class="menu-item-inner">
-            <div class="fx-75 menu-item-content">
-              <div class="item-title">
-                Search Types
-              </div>
-              <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
-                A collection of different search types available for perusal.
+        @for(type of searchTypeSelectors.search; track type.nameKey; let last = $last) {
+          <menu class="menu-item mat-menu-item" mat-menu-item (click)="onSetSearchType(type.searchType)">
+            <div class="menu-item-inner">
+              <div class="fx-80 menu-item-content">
+                <div class="item-title">
+                  {{ type.nameKey | translate}}
+                </div>
+                <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
+                  <span *ngFor="let key of type.descriptionKeys">
+                    {{ key | translate }}
+                  </span>
+                  <app-docs-modal url="{{ type.helpUrl}}" class="read-more-icon"></app-docs-modal>
+                </div>
               </div>
-            </div>
-            <div class="fx-25 menu-item-aside">
-              <span class="material-icons-outlined menu-item-icon">
-                search</span>
-
-            </div>
-          </div>
-        </menu>
-        <hr class="dataset-hr">
-
-        <menu mat-menu-item class="menu-item mat-menu-item" [matMenuTriggerFor]="toolMenu" mat-menu-item>
-          <div class="menu-item-inner">
-            <div class="fx-75 menu-item-content">
-              <div class="item-title">
-                Tools
-              </div>
-              <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
-                A collection of different tools available for refining searches.
+              <div class="fx-20 menu-item-aside">
+                <span *ngIf="type.iconType === iconTypes.MATERIAL" class="material-icons-outlined menu-item-icon">
+                  {{ type.icon}}
+                </span>
+                <img *ngIf="type.iconType === iconTypes.IMAGE" src="{{ type.icon }}" class="menu-item-icon">
               </div>
             </div>
-            <div class="fx-25 menu-item-aside">
-              <span class="material-icons-outlined menu-item-icon">
-                gear</span>
-
-            </div>
-          </div>
-        </menu>
+          </menu>
+          @if(!last) {
+            <hr class="dataset-hr">
+          }
+        }
         <hr class="dataset-hr">
-
         <menu class="menu-item mat-menu-item" mat-menu-item (click)="onSetSearchType(searchTypes.CUSTOM_PRODUCTS)"
-          [ngClass]="{'disable-search-type-on-demand' : !isLoggedIn}">
+              [ngClass]="{'disable-search-type-on-demand' : !isLoggedIn}">
           <div class="menu-item-inner">
-            <div class="fx-75 menu-item-content">
+            <div class="fx-80 menu-item-content">
               <div class="item-title">
                 {{'ON_DEMAND_PRODUCTS' | translate}}
                 <span class="login-prompt" [ngClass]="{'login-hidden' : isLoggedIn}">
-                  {{'SIGN_IN_TO_ACCESS' | translate}}
-                </span>
+                      {{'SIGN_IN_TO_ACCESS' | translate}}
+                    </span>
               </div>
               <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
                 {{'ON_DEMAND_SEARCH_ALLOWS_YOU_TO_VIEW_YOUR_SUBMITTED_ON_DEMAND_JOBS' | translate}}
-              </div>
-              <mat-card-actions (click)="onOpenDocs($event)">
-                <app-docs-modal class="info-text" text="{{ 'MORE_INFO' | translate }}"
-                  url="https://docs.asf.alaska.edu/vertex/manual/#on-demand-products-search-options">
+                <app-docs-modal class="read-more-icon"
+                                url="https://docs.asf.alaska.edu/vertex/manual/#on-demand-products-search-options">
                 </app-docs-modal>
-              </mat-card-actions>
+              </div>
             </div>
-            <div class="fx-25 menu-item-aside">
+            <div class="fx-20 menu-item-aside">
               <img src="assets/asf-logos/HyP3-graphic-only.png" class="menu-item-icon">
             </div>
           </div>
         </menu>
 
         <hr class="dataset-hr">
-
-        <menu mat-menu-item class="menu-item mat-menu-item" [matMenuTriggerFor]="derivedDatasetMenu" mat-menu-item>
-          <div class="menu-item-inner">
-            <div class="fx-75 menu-item-content">
-              <div class="item-title">
-                {{'DERIVED_DATASETS' | translate }}
+          <menu mat-menu-item class="menu-item mat-menu-item" [matMenuTriggerFor]="derivedDatasetMenu" mat-menu-item>
+            <div class="menu-item-inner">
+              <div class="fx-80 menu-item-content">
+                <div class="item-title">
+                  {{'DERIVED_DATASETS' | translate }}
+                </div>
+                <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
+                  {{'DERIVED_DATASETS_CONTAIN_A_COLLECTION_OF_DATASETS_AVAILABLE_TO_VIEW_AND_DOWNLOAD'| translate }}
+                </div>
               </div>
-              <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
-                {{'DERIVED_DATASETS_CONTAIN_A_COLLECTION_OF_DATASETS_AVAILABLE_TO_VIEW_AND_DOWNLOAD'| translate }}
+              <div class="fx-20 menu-item-aside">
+                <span class="material-icons-outlined menu-item-icon">{{ 'DATASET_LINKED' | translate }}</span>
               </div>
             </div>
-            <div class="fx-25 menu-item-aside">
-              <span class="material-icons-outlined menu-item-icon">{{ 'DATASET_LINKED' | translate }}</span>
-            </div>
-          </div>
-        </menu>
+          </menu>
+
       </div>
     </mat-menu>
 
@@ -108,7 +95,7 @@
         (click)="onOpenDerivedDataset(dataset.info_url, dataset.name); $event.stopPropagation();">
         <div class="menu-item">
           <div class="menu-item-inner">
-            <div class="fx-75 menu-item-content">
+            <div class="fx-80 menu-item-content">
               <div class="item-title" (click)="onOpenDerivedDataset(dataset.info_url, dataset.name)">
                 {{ dataset.name | translate }}
               </div>
@@ -122,7 +109,7 @@
                   mat-button>{{ 'DOWNLOAD' | translate }}</button>
               </mat-card-actions>
             </div>
-            <div class="fx-75 menu-item-aside">
+            <div class="fx-80 menu-item-aside">
               <img [src]="dataset.picture" (click)="onOpenDerivedDataset(dataset.info_url, dataset.name)"
                 class="menu-item-icon">
             </div>
@@ -131,70 +118,5 @@
         <hr *ngIf="!isLast" class="dataset-hr">
       </menu>
     </mat-menu>
-
-    <mat-menu #searchMenu="matMenu">
-      @for(type of searchTypeSelectors.search; track type.nameKey; let last = $last) {
-      <menu class="menu-item mat-menu-item" mat-menu-item (click)="onSetSearchType(type.searchType)">
-        <div class="menu-item-inner">
-          <div class="fx-75 menu-item-content">
-            <div class="item-title">
-              {{ type.nameKey | translate}}
-            </div>
-            <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
-              <span *ngFor="let key of type.descriptionKeys">
-                {{ key | translate }}
-              </span>
-            </div>
-            <mat-card-actions>
-              <app-docs-modal class="info-text" text="{{'MORE_INFO' | translate}}" url="{{ type.helpUrl}}">
-              </app-docs-modal>
-            </mat-card-actions>
-          </div>
-          <div class="fx-25 menu-item-aside">
-            <span *ngIf="type.iconType === iconTypes.MATERIAL" class="material-icons-outlined menu-item-icon">
-              {{ type.icon}}</span>
-
-            <img *ngIf="type.iconType === iconTypes.IMAGE" src="{{ type.icon }}" class="menu-item-icon">
-          </div>
-        </div>
-        @if(!last) {
-        <hr class="dataset-hr">
-        }
-      </menu>
-      }
-
-    </mat-menu>
-    <mat-menu #toolMenu="matMenu">
-      @for(type of searchTypeSelectors.tools; track type.nameKey; let last = $last) {
-      <menu class="menu-item mat-menu-item" mat-menu-item (click)="onSetSearchType(type.searchType)">
-        <div class="menu-item-inner">
-          <div class="fx-75 menu-item-content">
-            <div class="item-title">
-              {{ type.nameKey | translate}}
-            </div>
-            <div class="item-content" [ngClass]="{'limitTextHeight': isReadMore}">
-              <span *ngFor="let key of type.descriptionKeys">
-                {{ key | translate }}
-              </span>
-            </div>
-            <mat-card-actions>
-              <app-docs-modal class="info-text" text="{{'MORE_INFO' | translate}}" url="{{ type.helpUrl}}">
-              </app-docs-modal>
-            </mat-card-actions>
-          </div>
-          <div class="fx-25 menu-item-aside">
-            <span *ngIf="type.iconType === iconTypes.MATERIAL" class="material-icons-outlined menu-item-icon">
-              {{ type.icon}}</span>
-
-            <img *ngIf="type.iconType === iconTypes.IMAGE" src="{{ type.icon }}" class="menu-item-icon">
-          </div>
-        </div>
-        @if(!last) {
-        <hr class="dataset-hr">
-        }
-      </menu>
-      }
-
-    </mat-menu>
   </div>
-</div>
+</div>