From aaddeda6fe020f99b751e3e716690ae3d18fc452 Mon Sep 17 00:00:00 2001
From: Xiao Gui <xgui3783@gmail.com>
Date: Wed, 9 Jun 2021 10:30:11 +0200
Subject: [PATCH] chore: wait on data not yet available
---
common/constants.js | 2 +
.../splashScreen/splashScreen.component.ts | 58 +++++++------------
.../splashScreen/splashScreen.template.html | 4 +-
3 files changed, 24 insertions(+), 40 deletions(-)
diff --git a/common/constants.js b/common/constants.js
index e68066f35..64605a56c 100644
--- a/common/constants.js
+++ b/common/constants.js
@@ -79,6 +79,8 @@
RECEPTOR_FP_CAPTION: `The receptor densities are visualized as fingerprints (fp), which provide the mean density and standard deviation for each of the analyzed receptor types, averaged across samples.`,
RECEPTOR_PR_CAPTION: `For a single tissue sample, an exemplary density distribution for a single receptor from the pial surface to the border between layer VI and the white matter.`,
RECEPTOR_AR_CAPTION: `An exemplary density distribution of a single receptor for one laminar cross-section in a single tissue sample.`,
+
+ DATA_NOT_READY: `Still fetching data. Please try again in a few moments.`
}
exports.QUICKTOUR_DESC ={
diff --git a/src/atlasComponents/splashScreen/splashScreen/splashScreen.component.ts b/src/atlasComponents/splashScreen/splashScreen/splashScreen.component.ts
index a0ace579b..af098de5c 100644
--- a/src/atlasComponents/splashScreen/splashScreen/splashScreen.component.ts
+++ b/src/atlasComponents/splashScreen/splashScreen/splashScreen.component.ts
@@ -1,10 +1,11 @@
-import { AfterViewInit, Component, ElementRef, Pipe, PipeTransform, ViewChild } from "@angular/core";
+import { Component, ElementRef, Pipe, PipeTransform, ViewChild } from "@angular/core";
+import { MatSnackBar } from "@angular/material/snack-bar";
import { select, Store } from "@ngrx/store";
-import { fromEvent, Observable, Subject, Subscription } from "rxjs";
-import { bufferTime, filter, map, switchMap, take, withLatestFrom, shareReplay } from 'rxjs/operators'
-import { IavRootStoreInterface } from "src/services/stateStore.service";
+import { Observable, Subject, Subscription } from "rxjs";
+import { filter } from 'rxjs/operators'
import { viewerStateHelperStoreName, viewerStateSelectAtlas } from "src/services/state/viewerState.store.helper";
import { PureContantService } from "src/util";
+import { CONST } from 'common/constants'
@Component({
selector : 'ui-splashscreen',
@@ -14,31 +15,26 @@ import { PureContantService } from "src/util";
],
})
-export class SplashScreen implements AfterViewInit {
+export class SplashScreen {
- public finishedLoading$: Observable<boolean>
- public loadedTemplate$: Observable<any[]>
+ public finishedLoading: boolean = false
public loadedAtlases$: Observable<any[]>
@ViewChild('parentContainer', {read: ElementRef})
- private parentContainer: ElementRef
public activatedTemplate$: Subject<any> = new Subject()
private subscriptions: Subscription[] = []
constructor(
- private store: Store<IavRootStoreInterface>,
+ private store: Store<any>,
+ private snack: MatSnackBar,
private pureConstantService: PureContantService
) {
- this.loadedTemplate$ = this.store.pipe(
- select('viewerState'),
- select('fetchedTemplates'),
- shareReplay(1),
+ this.subscriptions.push(
+ this.pureConstantService.allFetchingReady$.subscribe(flag => this.finishedLoading = flag)
)
- this.finishedLoading$ = this.pureConstantService.allFetchingReady$
-
this.loadedAtlases$ = this.store.pipe(
select(state => state[viewerStateHelperStoreName]),
select(state => state.fetchedAtlases),
@@ -46,29 +42,15 @@ export class SplashScreen implements AfterViewInit {
)
}
- public ngAfterViewInit() {
-
- /**
- * instead of blindly listening to click event, this event stream waits to see if user mouseup within 200ms
- * if yes, it is interpreted as a click
- * if no, user may want to select a text
- */
- /**
- * TODO change to onclick listener
- */
- this.subscriptions.push(
- fromEvent(this.parentContainer.nativeElement, 'mousedown').pipe(
- filter((ev: MouseEvent) => ev.button === 0),
- switchMap(() => fromEvent(this.parentContainer.nativeElement, 'mouseup').pipe(
- bufferTime(200),
- take(1),
- )),
- filter(arr => arr.length > 0),
- withLatestFrom(this.activatedTemplate$),
- map(([_, atlas]) => atlas),
- ).subscribe(atlas => this.store.dispatch(
- viewerStateSelectAtlas({ atlas })
- )),
+ public selectAtlas(atlas: any){
+ if (!this.finishedLoading) {
+ this.snack.open(CONST.DATA_NOT_READY, null, {
+ duration: 3000
+ })
+ return
+ }
+ this.store.dispatch(
+ viewerStateSelectAtlas({ atlas })
)
}
}
diff --git a/src/atlasComponents/splashScreen/splashScreen/splashScreen.template.html b/src/atlasComponents/splashScreen/splashScreen/splashScreen.template.html
index 1f8105d27..bb855b2ef 100644
--- a/src/atlasComponents/splashScreen/splashScreen/splashScreen.template.html
+++ b/src/atlasComponents/splashScreen/splashScreen/splashScreen.template.html
@@ -5,7 +5,7 @@
#parentContainer
class="p-5 w-100 d-flex flex-column flex-wrap justify-content-center align-items-stretch pe-all">
<mat-card
- (mousedown)="activatedTemplate$.next(atlas)"
+ (click)="selectAtlas(atlas)"
matRipple
*ngFor="let atlas of loadedAtlases$ | async | filterNull"
class="m-3 col-md-12 col-lg-12 pe-all">
@@ -21,7 +21,7 @@
</mat-card-footer>
</mat-card>
- <ng-template [ngIf]="!(finishedLoading$ | async)">
+ <ng-template [ngIf]="!finishedLoading">
<div class="d-flex align-items-center p-4">
<h1 class="mat-h1">
<spinner-cmp></spinner-cmp>
--
GitLab