diff --git a/src/services/stateStore.service.ts b/src/services/stateStore.service.ts index 909b93ef38ae9e4dd49224cb0a5a0d2380dab7cb..1f61df6072c6213d127567b6280a3104afa3151e 100644 --- a/src/services/stateStore.service.ts +++ b/src/services/stateStore.service.ts @@ -90,13 +90,16 @@ export const ADD_NG_LAYER = 'ADD_NG_LAYER' export const REMOVE_NG_LAYER = 'REMOVE_NG_LAYER' export const SHOW_NG_LAYER = 'SHOW_NG_LAYER' export const HIDE_NG_LAYER = 'HIDE_NG_LAYER' +export const FORCE_SHOW_SEGMENT = `FORCE_SHOW_SEGMENT` export interface NgViewerStateInterface{ layers : NgLayerInterface[] + forceShowSegment : boolean | null } export interface NgViewerAction extends Action{ layer : NgLayerInterface + forceShowSegment : boolean } const mapLayer = (existingLayer:NgLayerInterface, incomingLayer:NgLayerInterface):NgLayerInterface => { @@ -116,7 +119,7 @@ const mapLayer = (existingLayer:NgLayerInterface, incomingLayer:NgLayerInterface } as NgLayerInterface) } -export function ngViewerState(prevState:NgViewerStateInterface = {layers:[]}, action:NgViewerAction):NgViewerStateInterface{ +export function ngViewerState(prevState:NgViewerStateInterface = {layers:[], forceShowSegment:null}, action:NgViewerAction):NgViewerStateInterface{ switch(action.type){ case ADD_NG_LAYER: return Object.assign({}, prevState, { @@ -142,6 +145,10 @@ export function ngViewerState(prevState:NgViewerStateInterface = {layers:[]}, ac } as NgLayerInterface) : l) }) + case FORCE_SHOW_SEGMENT: + return Object.assign({}, prevState, { + forceShowSegment : action.forceShowSegment + }) as NgViewerStateInterface default: return prevState } @@ -340,6 +347,7 @@ export interface File{ mimetype : string url? : string data? : any + kgID? : string targetParcellation : string properties : any } diff --git a/src/ui/layerbrowser/layerbrowser.component.ts b/src/ui/layerbrowser/layerbrowser.component.ts index cc09552a6db59bd93560889c63a6ef80c86fae50..174275636e8f9012221e26342070da6b246fc3ee 100644 --- a/src/ui/layerbrowser/layerbrowser.component.ts +++ b/src/ui/layerbrowser/layerbrowser.component.ts @@ -44,10 +44,9 @@ export class LayerBrowser implements OnDestroy{ window['viewer'].registerDisposer(this.disposeHandler) })) - this.subscriptions.push(this.forceShowSegment$.subscribe(state => { - console.log('assigning new val') - this.forceShowSegmentCurrentState = state - })) + this.subscriptions.push( + this.forceShowSegment$.subscribe(state => this.forceShowSegmentCurrentState = state) + ) } ngOnDestroy(){ @@ -92,7 +91,7 @@ export class LayerBrowser implements OnDestroy{ } toggleForceShowSegment(ngLayer:any){ - if(!ngLayer && ngLayer.type !== 'segmentation'){ + if(!ngLayer || ngLayer.type !== 'segmentation'){ /* toggle only on segmentation layer */ return } @@ -119,4 +118,20 @@ export class LayerBrowser implements OnDestroy{ } }) } + + segmentationTooltip(){ + return `toggle segments visibility: +${this.forceShowSegmentCurrentState === true ? 'always show' : this.forceShowSegmentCurrentState === false ? 'always hide' : 'auto'}` + } + + + get segmentationAdditionalClass(){ + return this.forceShowSegmentCurrentState === null + ? 'blue' + : this.forceShowSegmentCurrentState === true + ? 'normal' + : this.forceShowSegmentCurrentState === false + ? 'muted' + : 'red' + } } diff --git a/src/ui/layerbrowser/layerbrowser.style.css b/src/ui/layerbrowser/layerbrowser.style.css index 8116c6ae618eb97dbade6b6ce35de1ee6ca927cc..47a34fbd1abaa67608b4162e860aeb9d4a697e1d 100644 --- a/src/ui/layerbrowser/layerbrowser.style.css +++ b/src/ui/layerbrowser/layerbrowser.style.css @@ -35,4 +35,15 @@ div[body] display: flex; flex-direction: row; align-items: center; -} \ No newline at end of file +} + +.glyphicon.blue +{ + color: #337ab7; +} + +.glyphicon.red +{ + color: red; +} + diff --git a/src/ui/layerbrowser/layerbrowser.template.html b/src/ui/layerbrowser/layerbrowser.template.html index a636084eed162af7ca23c18ade223a99c4f414d1..8518e1ffa69d9a362150b030d354d4b425ff7bb5 100644 --- a/src/ui/layerbrowser/layerbrowser.template.html +++ b/src/ui/layerbrowser/layerbrowser.template.html @@ -18,10 +18,11 @@ <i container = "body" placement = "bottom" - [tooltip] = "ngLayer.type === 'segmentation' ? 'hide show segments' : 'only segmentation layer can hide/show segments'" - (click) = "toggleForceShowSegment(ngLayer)" + [tooltip] = "ngLayer.type === 'segmentation' ? segmentationTooltip() : 'only segmentation layer can hide/show segments'" + (click) = "forceSegment.hide();toggleForceShowSegment(ngLayer)" class = "glyphicon" - [ngClass] = "ngLayer.type === 'segmentation' ? 'glyphicon-th-large' : 'glyphicon-lock muted' "> + #forceSegment = "bs-tooltip" + [ngClass] = "ngLayer.type === 'segmentation' ? ('glyphicon-th-large ' + segmentationAdditionalClass) : 'glyphicon-lock muted' "> </i> </div> diff --git a/src/ui/nehubaContainer/nehubaContainer.component.ts b/src/ui/nehubaContainer/nehubaContainer.component.ts index 086053ae0000db47df6ec0a11d3363f26660b8da..36501ee38d840f222835d6b8e6f86618146369f1 100644 --- a/src/ui/nehubaContainer/nehubaContainer.component.ts +++ b/src/ui/nehubaContainer/nehubaContainer.component.ts @@ -30,7 +30,8 @@ export class NehubaContainer implements OnInit, OnDestroy{ private newViewer$ : Observable<any> private selectedParcellation$ : Observable<any> private selectedRegions$ : Observable<any[]> - private dedicatedView$ : Observable<string[]|null> + private hideSegmentations$ : Observable<boolean> + private fetchedSpatialDatasets$ : Observable<any[]> private userLandmarks$ : Observable<UserLandmark[]> public onHoverSegmentName$ : Observable<string> @@ -44,7 +45,7 @@ export class NehubaContainer implements OnInit, OnDestroy{ private selectedRegionIndexSet : Set<number> = new Set() public fetchedSpatialData : DataEntry[] = [] - private ngLayersRegister : NgViewerStateInterface = {layers : []} + private ngLayersRegister : NgViewerStateInterface = {layers : [], forceShowSegment: null} private ngLayers$ : Observable<NgViewerStateInterface> private selectedParcellationNgId : string private selectedParcellation : any | null @@ -69,6 +70,7 @@ export class NehubaContainer implements OnInit, OnDestroy{ private elementRef : ElementRef ){ this.nehubaViewerFactory = this.csf.resolveComponentFactory(NehubaViewerUnit) + this.newViewer$ = this.store.pipe( select('viewerState'), filter(state=>isDefined(state) && isDefined(state.templateSelected)), @@ -90,12 +92,6 @@ export class NehubaContainer implements OnInit, OnDestroy{ map(state=>state.regionsSelected) ) - this.dedicatedView$ = this.store.pipe( - select('viewerState'), - filter(state=>typeof state !== 'undefined' && state !== null && typeof state.dedicatedView !== 'undefined'), - map(state=>state.dedicatedView) - ) - this.fetchedSpatialDatasets$ = this.store.pipe( select('dataStore'), safeFilter('fetchedSpatialData'), @@ -207,6 +203,12 @@ export class NehubaContainer implements OnInit, OnDestroy{ this.ngLayers$ = this.store.pipe( select('ngViewerState') ) + + this.hideSegmentations$ = this.ngLayers$.pipe( + map(state => isDefined(state) + ? state.layers.findIndex(l => l.mixability === 'nonmixable') >= 0 + : false) + ) } ngOnInit(){ @@ -284,15 +286,23 @@ export class NehubaContainer implements OnInit, OnDestroy{ ) this.subscriptions.push( + + /* TODO add observable of forcedShowSegment */ combineLatest( this.selectedRegions$, - this.dedicatedView$ - ).pipe( - filter(([_,dedicatedView])=>!isDefined(dedicatedView)), - map(([regions,_])=>regions) + this.hideSegmentations$, + this.ngLayers$.pipe( + map(state => state.forceShowSegment) + ) ) - .subscribe(regions=>{ + .subscribe(([regions,hideSegmentFlag,forceShowSegment])=>{ if(!this.nehubaViewer) return + + if( forceShowSegment === false || (forceShowSegment === null && hideSegmentFlag) ){ + this.nehubaViewer.hideAllSeg() + return + } + this.selectedRegionIndexSet = new Set(regions.map(r=>Number(r.labelIndex))) this.selectedRegionIndexSet.size > 0 ? this.nehubaViewer.showSegs([...this.selectedRegionIndexSet]) : @@ -301,15 +311,11 @@ export class NehubaContainer implements OnInit, OnDestroy{ ) ) - this.subscriptions.push( - this.dedicatedView$.subscribe((this.handleDedicatedView).bind(this)) - ) this.subscriptions.push( this.ngLayers$.subscribe(ngLayersInterface => { - if(!this.nehubaViewer) - return - + if(!this.nehubaViewer) return + const newLayers = ngLayersInterface.layers.filter(l => this.ngLayersRegister.layers.findIndex(ol => ol.name === l.name) < 0) const removeLayers = this.ngLayersRegister.layers.filter(l => ngLayersInterface.layers.findIndex(nl => nl.name === l.name) < 0) @@ -328,16 +334,6 @@ export class NehubaContainer implements OnInit, OnDestroy{ this.ngLayersRegister.layers = this.ngLayersRegister.layers.filter(rl => rl.name !== l.name) }) } - - /* this is how visibility should work, but this also hides the mesh and perspective view */ - // ngLayersInterface.layers.forEach(l => typeof l.visible === 'undefined' - // ? this.nehubaViewer.setLayerVisibility({ name : l.name}, true) - // : this.nehubaViewer.setLayerVisibility({ name : l.name}, l.visible)) - - - ngLayersInterface.layers.findIndex(l => l.mixability === 'nonmixable') >= 0 - ? this.nehubaViewer.hideAllSeg() - : this.nehubaViewer.showSegs([...this.selectedRegionIndexSet]) }) ) @@ -345,29 +341,18 @@ export class NehubaContainer implements OnInit, OnDestroy{ combineLatest( this.navigationChanges$, this.selectedRegions$, - this.dedicatedView$ - ).subscribe(([navigation,regions,dedicatedView])=>{ + ).subscribe(([navigation,regions])=>{ this.nehubaViewer.initNav = Object.assign({},navigation,{ positionReal : true }) this.nehubaViewer.initRegions = regions.map(re=>re.labelIndex) - this.nehubaViewer.initDedicatedView = dedicatedView - - /* TODO abit hacky. test what happens when: select dedicated view, then change template... check ngLayerRegister */ - if(dedicatedView){ - this.ngLayersRegister.layers = this.ngLayersRegister.layers.concat(dedicatedView.map((layer, index) => ({ - name : `dedicatedview-${index}`, - source : layer, - visible : true, - mixability : 'nonmixable', - transform : null - }))) - } + + /* TODO what to do with init nfiti? */ }) this.subscriptions.push( - this.navigationChanges$.subscribe(this.handleDispatchedNavigationChange.bind(this),console.warn) + this.navigationChanges$.subscribe(this.handleDispatchedNavigationChange.bind(this)) ) } @@ -424,7 +409,7 @@ export class NehubaContainer implements OnInit, OnDestroy{ return } - /* for now */ + /* TODO remove handle dedicated view. perhaps keep for backwards compatibility (?) */ return if(dedicatedView.length === 0){