diff --git a/src/atlasViewer/atlasViewer.component.ts b/src/atlasViewer/atlasViewer.component.ts
index 0aaf3777becca55bf88c9399a8d863da6a46dfc9..db6b45721de1820e2f53043348e1cd2c197899c8 100644
--- a/src/atlasViewer/atlasViewer.component.ts
+++ b/src/atlasViewer/atlasViewer.component.ts
@@ -5,7 +5,6 @@ import { Observable, Subscription, combineLatest } from "rxjs";
 import { map, filter, distinctUntilChanged } from "rxjs/operators";
 import { AtlasViewerDataService } from "./atlasViewer.dataService.service";
 import { WidgetServices } from "./widgetUnit/widgetService.service";
-import { DataBrowserUI } from "../ui/databrowser/databrowser.component";
 import { LayoutMainSide } from "../layouts/mainside/mainside.component";
 import { Chart } from 'chart.js'
 import { AtlasViewerConstantsServices, SUPPORT_LIBRARY_MAP } from "./atlasViewer.constantService.service";
@@ -13,7 +12,6 @@ import { BsModalService } from "ngx-bootstrap/modal";
 import { ModalUnit } from "./modalUnit/modalUnit.component";
 import { AtlasViewerURLService } from "./atlasViewer.urlService.service";
 import { ToastComponent } from "../components/toast/toast.component";
-import { WidgetUnit } from "./widgetUnit/widgetUnit.component";
 import { AtlasViewerAPIServices } from "./atlasViewer.apiService.service";
 import { PluginServices } from "./atlasViewer.pluginService.service";
 
@@ -218,8 +216,10 @@ export class AtlasViewer implements OnDestroy, OnInit, AfterViewInit {
           return
         }
         this.dedicatedViewComponentRef = this.toastContainer.createComponent(this.toastComponentFactory)
-        this.dedicatedViewComponentRef.instance.messageContainer.createEmbeddedView(this.dedicatedViewerToast)
-        this.dedicatedViewComponentRef.instance.dismissable = false
+        // this.dedicatedViewComponentRef.instance.messageContainer.createEmbeddedView(this.dedicatedViewerToast)
+        this.dedicatedViewComponentRef.instance.message = `hello`
+        this.dedicatedViewComponentRef.instance.dismissable = true
+        this.dedicatedViewComponentRef.instance.timeout = 1000
       })
     )
 
@@ -404,11 +404,11 @@ export class AtlasViewer implements OnDestroy, OnInit, AfterViewInit {
     }
   }
 
-  clearDedicatedView() {
-    this.store.dispatch({
-      type: UNLOAD_DEDICATED_LAYER
-    })
-  }
+  // clearDedicatedView() {
+  //   this.store.dispatch({
+  //     type: UNLOAD_DEDICATED_LAYER
+  //   })
+  // }
 
   toggleSidePanel(panelName:string){
     this.store.dispatch({
diff --git a/src/atlasViewer/atlasViewer.template.html b/src/atlasViewer/atlasViewer.template.html
index c1b156795591ee45466b54cd47b87dae0d6d9a9b..41b53f945899d4dc413c5e7b251518536878136a 100644
--- a/src/atlasViewer/atlasViewer.template.html
+++ b/src/atlasViewer/atlasViewer.template.html
@@ -139,10 +139,10 @@
 </markdown-dom>
 
 <ng-template #dedicatedViewerToast>
-  <div *ngIf = "dedicatedView$ | async">
+  <!-- <div *ngIf = "dedicatedView$ | async">
     <span dedicatedviewertext>displaying : {{ dedicatedView$ | async | getFilenameFromPathname }}. </span>
     <span (click) = "clearDedicatedView()" class = "btn btn-link">clear</span>
-  </div>
+  </div> -->
   <div *ngIf = "!(dedicatedView$ | async)">
     no special data is being displayed right now
   </div>
diff --git a/src/services/stateStore.service.ts b/src/services/stateStore.service.ts
index 0f49f1f49c50cfb9e49eeb790ba02bda3005232c..909b93ef38ae9e4dd49224cb0a5a0d2380dab7cb 100644
--- a/src/services/stateStore.service.ts
+++ b/src/services/stateStore.service.ts
@@ -41,6 +41,7 @@ export interface ViewerStateInterface{
   userLandmarks : UserLandmark[]
 
   navigation : any | null
+  dedicatedView : string[]
 }
 
 export interface AtlasAction extends Action{
@@ -49,7 +50,7 @@ export interface AtlasAction extends Action{
   selectTemplate? : any
   selectParcellation? : any
   selectRegions? : any[]
-  dedicatedView? : string 
+  dedicatedView? : string
 
   landmarks : UserLandmark[]
 
@@ -175,12 +176,17 @@ export function uiState(state:UIStateInterface = {mouseOverSegment:null, focused
 export function viewerState(state:ViewerStateInterface,action:AtlasAction){
   switch(action.type){
     case LOAD_DEDICATED_LAYER:
+      const dedicatedView = state.dedicatedView
+        ? state.dedicatedView.concat(action.dedicatedView)
+        : [action.dedicatedView]
       return Object.assign({},state,{
-        dedicatedView : action.dedicatedView
+        dedicatedView 
       })
     case UNLOAD_DEDICATED_LAYER:
       return Object.assign({},state,{
-        dedicatedView : null
+        dedicatedView : state.dedicatedView
+          ? state.dedicatedView.filter(dv => dv !== action.dedicatedView)
+          : []
       })
     case NEWVIEWER:
       return Object.assign({},state,{
diff --git a/src/ui/databrowser/databrowser.component.ts b/src/ui/databrowser/databrowser.component.ts
index 84f56fbd243daa4fbfab5673472a0b9a1ffc8da4..3e94701d857b6043fd85e74f0a2e2694d20ca958 100644
--- a/src/ui/databrowser/databrowser.component.ts
+++ b/src/ui/databrowser/databrowser.component.ts
@@ -270,11 +270,6 @@ export class DataBrowserUI implements OnDestroy,OnInit{
     return `${file.name ? file.name : file.path}`
   }
 
-  handleDedicatedViewString = (dedicatedViewString:string|null)=>this.store.dispatch({
-    type : dedicatedViewString ? LOAD_DEDICATED_LAYER : UNLOAD_DEDICATED_LAYER,
-    dedicatedView : dedicatedViewString
-  })
-
   dataWindowRegistry: Set<string> = new Set()
 
   handleTreeNodeClick(obj:{inputItem:any,node:TreeComponent},searchResult:any){
diff --git a/src/ui/fileviewer/dedicated/dedicated.component.ts b/src/ui/fileviewer/dedicated/dedicated.component.ts
index ca9f143b8125d23ae8c3c5ad4fe4252fa5d2219e..73f0904ddf0179c69f36d1cadc5726244978a411 100644
--- a/src/ui/fileviewer/dedicated/dedicated.component.ts
+++ b/src/ui/fileviewer/dedicated/dedicated.component.ts
@@ -1,8 +1,9 @@
 import { Component, OnDestroy, Input } from "@angular/core";
 import { Store, select } from "@ngrx/store";
-import { DedicatedViewState, File, UNLOAD_DEDICATED_LAYER, LOAD_DEDICATED_LAYER } from "../../../services/stateStore.service";
+import { DedicatedViewState, File, ADD_NG_LAYER, REMOVE_NG_LAYER, NgViewerStateInterface } from "../../../services/stateStore.service";
 import { Observable, Subscription } from "rxjs";
 import { filter, map } from "rxjs/operators";
+import { getActiveColorMapFragmentMain } from "../../nehubaContainer/nehubaContainer.component";
 
 
 @Component({
@@ -16,50 +17,44 @@ import { filter, map } from "rxjs/operators";
 export class DedicatedViewer implements OnDestroy{
   @Input() searchResultFile : File
 
-  private dedicatedView$ : Observable<string|null>
-  private dedicatedViewSubscription : Subscription
-  private dedicatedView : string | null
+  private ngLayers$ : Observable<NgViewerStateInterface>
+  private ngLayersSubscription : Subscription
+  private ngLayers : Set<string> = new Set()
 
   constructor(private store:Store<DedicatedViewState>){
-    this.dedicatedView$ = this.store.pipe(
-      select('viewerState'),
-      filter(state=>typeof state !== 'undefined' && state !== null),
-      map(state=>state.dedicatedView)
+    this.ngLayers$ = this.store.pipe(
+      select('ngViewerState')
     )
 
-    this.dedicatedViewSubscription = this.dedicatedView$.subscribe(url => this.dedicatedView = url)
+    this.ngLayersSubscription = this.ngLayers$.subscribe(layersInterface => this.ngLayers = new Set(layersInterface.layers.map(l => l.source)))
   }
 
   get isShowing(){
-    return this.dedicatedView === `nifti://${this.searchResultFile.url}`
-  }
-
-  get isObstructed(){
-    return typeof this.dedicatedView !== 'undefined' &&
-      this.dedicatedView !== null &&
-      this.dedicatedView !== `nifti://${this.searchResultFile.url}`
+    return this.ngLayers.has(`nifti://${this.searchResultFile.url}`)
   }
 
   ngOnDestroy(){
-    this.dedicatedViewSubscription.unsubscribe()
+    this.ngLayersSubscription.unsubscribe()
   }
 
   showDedicatedView(){
     this.store.dispatch({
-      type : LOAD_DEDICATED_LAYER,
-      dedicatedView : `nifti://${this.searchResultFile.url}`
+      type : ADD_NG_LAYER,
+      layer : {
+        name : this.searchResultFile.url,
+        source : `nifti://${this.searchResultFile.url}`,
+        mixability : 'nonmixable',
+        shader : getActiveColorMapFragmentMain()
+      }
     })
   }
 
   removeDedicatedView(){
     this.store.dispatch({
-      type : UNLOAD_DEDICATED_LAYER,
+      type : REMOVE_NG_LAYER,
+      layer : {
+        name : this.searchResultFile.url
+      }
     })
   }
-  
-  get nowShowing():string|null{
-    return this.dedicatedView ? 
-      this.dedicatedView.split('/')[this.dedicatedView.split('/').length-1]:
-      null
-  }
 }
\ No newline at end of file
diff --git a/src/ui/fileviewer/dedicated/dedicated.template.html b/src/ui/fileviewer/dedicated/dedicated.template.html
index 254a40c5468b52dfff470c246bcdc0f7cde758ea..4b4fd2b39b9bba46dafff4fa23be6a9f7e94c33a 100644
--- a/src/ui/fileviewer/dedicated/dedicated.template.html
+++ b/src/ui/fileviewer/dedicated/dedicated.template.html
@@ -1,32 +1,10 @@
-<span *ngIf = "!isShowing" >
-  <span 
-    *ngIf = "isObstructed">
-
-    <span class = "obstructedText">
-      The viewer is currently displaying another dataset:
-    </span>
-    
-    <div class = "well">
-      {{ nowShowing }}
-    </div>
-    <span class = "obstructedText">
-      This dataset can be displayed after the currently shown dataset is cleared.
-    </span>
-    <span (click)="removeDedicatedView()" class = "btn btn-link">
-      clear the currently shown dataset
-    </span>
-  </span>
-
-  <span
-    (click) = "showDedicatedView()"
-    class = "btn btn-link"
-    *ngIf = "!isObstructed">
-
-    show this dataset in the viewer 
-  </span>
+<span 
+  (click) = "showDedicatedView()"
+  *ngIf = "!isShowing"
+  class = "btn btn-link">
 
+  show this dataset in the viewer 
 </span>
-
 <span 
   (click) = "removeDedicatedView()"
   *ngIf = "isShowing"
diff --git a/src/ui/layerbrowser/layerbrowser.component.ts b/src/ui/layerbrowser/layerbrowser.component.ts
index 20a83899274e0ba1bc7d9a97b3a66d967e71e7a7..0c011deb385eb0589b904b074478d28da8cd3434 100644
--- a/src/ui/layerbrowser/layerbrowser.component.ts
+++ b/src/ui/layerbrowser/layerbrowser.component.ts
@@ -1,5 +1,9 @@
-import { Component, Input } from "@angular/core";
+import { Component, Input, OnDestroy } from "@angular/core";
 import { AtlasViewerLayerInterface } from "../../util/pipes/newViewerDistinctViewToLayer.pipe";
+import { Observable, Subscription } from "rxjs";
+import { isDefined, ViewerStateInterface } from "../../services/stateStore.service";
+import { Store, select } from "@ngrx/store";
+import { filter, delay, distinctUntilChanged } from "rxjs/operators";
 
 
 @Component({
@@ -8,9 +12,47 @@ import { AtlasViewerLayerInterface } from "../../util/pipes/newViewerDistinctVie
   styleUrls : [ './layerbrowser.style.css' ]
 })
 
-export class LayerBrowser{
+export class LayerBrowser implements OnDestroy{
   @Input() layers : AtlasViewerLayerInterface[] = []
 
+  ngLayers : NgLayerInterface[] = []
+  newViewer$ : Observable<any>
+  subscription : Subscription
+  disposeHandler : any
+
+  constructor(private store : Store<ViewerStateInterface>){
+    this.newViewer$ = this.store.pipe(
+      select('viewerState'),
+      filter(state=>isDefined(state) && isDefined(state.templateSelected)),
+      distinctUntilChanged((o,n) => o.templateSelected.name === n.templateSelected.name)
+    )
+
+    this.subscription = this.newViewer$.pipe(
+      delay(0)
+    ).subscribe(() => {
+      this.layerChangedHandler()
+      this.disposeHandler = window['viewer'].layerManager.layersChanged.add(() => this.layerChangedHandler())
+      window['viewer'].registerDisposer(this.disposeHandler)
+    })
+  }
+
+  ngOnDestroy(){
+    this.disposeHandler()
+    this.subscription.unsubscribe()
+  }
+
+  layerChangedHandler(){
+    console.log('handle layer change',window['viewer'].layerManager.managedLayers)
+
+    this.ngLayers = (window['viewer'].layerManager.managedLayers as any[]).map(obj => ({
+      name : obj.name,
+      type : obj.initialSpecification.type,
+      source : obj.sourceUrl,
+      visible : obj.visible
+    }) as NgLayerInterface)
+    
+  }
+
   public muteClass(layer:AtlasViewerLayerInterface):boolean{
     if(this.layers.length === 0)
       return false
@@ -18,4 +60,19 @@ export class LayerBrowser{
       ? this.layers.some(l => l.type === 'nonmixable')
       : false
   }
-}
\ No newline at end of file
+
+  public classVisible(layer:NgLayerInterface):boolean{
+    return typeof layer.visible === 'undefined'
+      ? true
+      : layer.visible
+  }
+}
+
+interface NgLayerInterface{
+  name : string
+  visible : boolean
+  source : string
+  type : string // image | segmentation | etc ...
+  transform? : [[number, number, number, number],[number, number, number, number],[number, number, number, number],[number, number, number, number]] | null
+  // colormap : string
+}
diff --git a/src/ui/layerbrowser/layerbrowser.template.html b/src/ui/layerbrowser/layerbrowser.template.html
index d98b3f89d5f8700ef27e68ec62435b5132f957f4..26c068997bc9983a155c0797a39121f668e22327 100644
--- a/src/ui/layerbrowser/layerbrowser.template.html
+++ b/src/ui/layerbrowser/layerbrowser.template.html
@@ -1,5 +1,18 @@
 <div container>
   <panel-component
+    [ngClass] = "{'muted' : !classVisible(ngLayer)}"
+    class = "layerContainer"
+    *ngFor = "let ngLayer of ngLayers">
+
+    <div heading>
+      {{ ngLayer.name }} : {{ ngLayer.type }}
+    </div>
+
+    <div body>
+      {{ ngLayer.source }}
+    </div>
+  </panel-component>
+  <!-- <panel-component
     [ngClass] = "{'muted' : muteClass(layer)}"
     class = "layerContainer"
     *ngFor = "let layer of layers">
@@ -10,5 +23,5 @@
     <div body>
       {{ layer.url }}
     </div>
-  </panel-component>
+  </panel-component> -->
 </div>
\ No newline at end of file
diff --git a/src/ui/nehubaContainer/nehubaContainer.component.ts b/src/ui/nehubaContainer/nehubaContainer.component.ts
index dfaff17a39d5dd4ef06da41ddfc0035a2f575411..8c955e73bd32a578500254d0dd7884fe741a2122 100644
--- a/src/ui/nehubaContainer/nehubaContainer.component.ts
+++ b/src/ui/nehubaContainer/nehubaContainer.component.ts
@@ -30,7 +30,7 @@ export class NehubaContainer implements OnInit, OnDestroy{
   private newViewer$ : Observable<any>
   private selectedParcellation$ : Observable<any>
   private selectedRegions$ : Observable<any[]>
-  private dedicatedView$ : Observable<string|null>
+  private dedicatedView$ : Observable<string[]|null>
   private fetchedSpatialDatasets$ : Observable<any[]>
   private userLandmarks$ : Observable<UserLandmark[]>
   public onHoverSegmentName$ : Observable<string>
@@ -316,6 +316,7 @@ export class NehubaContainer implements OnInit, OnDestroy{
         if(newLayers.length > 0){
           const newLayersObj:any = {}
           newLayers.forEach(obj => newLayersObj[obj.name] = obj)
+          debugger
           this.nehubaViewer.loadLayer(newLayersObj)
           this.ngLayersRegister.layers = this.ngLayersRegister.layers.concat(newLayers)
         }
@@ -356,14 +357,13 @@ export class NehubaContainer implements OnInit, OnDestroy{
 
       /* TODO abit hacky. test what happens when: select dedicated view, then change template... check ngLayerRegister */
       if(dedicatedView){
-        const dedicatedViewLayer = {
-          name : 'niftiViewer',
-          source : dedicatedView,
-          visible: true,
+        this.ngLayersRegister.layers = this.ngLayersRegister.layers.concat(dedicatedView.map((layer, index) => ({
+          name : `dedicatedview-${index}`,
+          source : layer,
+          visible : true,
           mixability : 'nonmixable',
-          transform:null
-        }
-        this.ngLayersRegister.layers.push(dedicatedViewLayer)
+          transform : null
+        })))
       }
     })
 
@@ -418,17 +418,18 @@ export class NehubaContainer implements OnInit, OnDestroy{
     this.selectedParcellation = parcellation
   }
 
-  private handleDedicatedView(dedicatedView:string){
-    this.handleNifti(dedicatedView)
-  }
-
-  private handleNifti(url:string|null){
+  private handleDedicatedView(dedicatedView:string[]){
     if(!this.nehubaViewer || !this.nehubaViewer.nehubaViewer){
       /* if nehubaviewer has not yet been initialised for one reason or another, return */
       console.warn('handling nifti view, nehubaviewer has not yet been initialised.')
       return
     }
-    if(url === null){
+
+    /* for now */
+    return
+    if(dedicatedView.length === 0){
+
+      /* remove ng layer (?) */
       this.store.dispatch({
         type : REMOVE_NG_LAYER,
         layer : {
@@ -459,8 +460,8 @@ export class NehubaContainer implements OnInit, OnDestroy{
       this.store.dispatch({
         type : ADD_NG_LAYER,
         layer : {
-          name : 'niftiViewer',
-          source : url,
+          name : null,
+          source : dedicatedView,
           mixability : 'nonmixable',
           shader : getActiveColorMapFragmentMain()
         }
diff --git a/src/ui/nehubaContainer/nehubaViewer/nehubaViewer.component.ts b/src/ui/nehubaContainer/nehubaViewer/nehubaViewer.component.ts
index 98c5cdea961c8b6221324cac1921379b8da45745..82d79e510bc96a3fd6a03c8a3ca4997c8a1997e8 100644
--- a/src/ui/nehubaContainer/nehubaViewer/nehubaViewer.component.ts
+++ b/src/ui/nehubaContainer/nehubaViewer/nehubaViewer.component.ts
@@ -20,7 +20,7 @@ export class NehubaViewerUnit implements AfterViewInit,OnDestroy{
   /* only used to set initial navigation state */
   initNav : any
   initRegions : any[]
-  initDedicatedView : string
+  initDedicatedView : string[]
 
   config : any
   
@@ -327,13 +327,17 @@ export class NehubaViewerUnit implements AfterViewInit,OnDestroy{
 
     if(this.initDedicatedView){
       this.hideAllSeg()
-      this.loadLayer({
-        niftiViewer : {
+      const _ = {}
+      
+      this.initDedicatedView.forEach((layer,index) => {
+        _[`dedicatedview-${index}`] = {
           type : 'image',
-          source : this.initDedicatedView,
+          source : layer,
           shader : getActiveColorMapFragmentMain()
         }
       })
+      
+      this.loadLayer(_)
     }
 
     this._s8$ = this.nehubaViewer.mouseOver.segment.subscribe(({segment})=>{