Viewer updates.

src/app/item-page/mirador-viewer/mirador-viewer.component.ts

@@ -16,6 +16,7 @@ import { of } from 'rxjs';
 import { isPlatformBrowser } from '@angular/common';
 import { BitstreamFormat } from '../../core/shared/bitstream-format.model';
 import { followLink, FollowLinkConfig } from '../../shared/utils/follow-link-config.model';
+import { HostWindowService } from '../../shared/host-window.service';
 
 @Component({
   selector: 'ds-mirador-viewer',
@@ -27,14 +28,29 @@ export class MiradorViewerComponent implements OnInit {
 
   @Input() item: Item;
 
+  /**
+   * A previous dspace search query.
+   */
   @Input() query: string;
 
+  /**
+   * True if searchable.
+   */
   @Input() searchable: boolean;
 
+  /**
+   * The url for the iframe.
+   */
   iframeViewerUrl: Observable<SafeResourceUrl>;
 
+  /**
+   * Sets the viewer to show or hide thumbnail side navigation menu.
+   */
   multi = false;
 
+  /**
+   * Hides the thumbnail navigation menu on smaller viewports.
+   */
   notMobile = false;
 
   LINKS_TO_FOLLOW: FollowLinkConfig<Bitstream>[] = [
@@ -43,6 +59,7 @@ export class MiradorViewerComponent implements OnInit {
 
   constructor(private sanitizer: DomSanitizer,
               private bitstreamDataService: BitstreamDataService,
+              private windowService: HostWindowService,
               @Inject(PLATFORM_ID) private platformId: any) {
   }
 
@@ -80,15 +97,14 @@ export class MiradorViewerComponent implements OnInit {
      * Initializes the iframe url observable.
      */
     if (isPlatformBrowser(this.platformId)) {
-      // This will not be responsive to resizing.
+      // The notMobile property affects only the thumbnail navigation
-      if (window.innerWidth > 768) {
+      // menu by hiding it for smaller viewports. This will not be
-        this.notMobile = true;
+      // responsive to resizing.
-      }
+      this.windowService.isMd().subscribe((s) => this.notMobile = s);
-
       // We need to set the multi property to true if the
       // item is searchable or the ORIGINAL bundle contains more
-      // than 1 image bitstream. The multi property controls the
+      // than 1 image bitstream. The multi property determine whether the
-      // Mirador side navigation panel.
+      // Mirador side navigation panel is shown.
       if (this.searchable) {
         // If it's searchable set multi to true.
         const observable = of({multi: true});

src/app/item-page/simple/item-types/shared/item-iiif-utils.ts

@@ -21,9 +21,7 @@ export const isIiifSearchEnabled = (item: Item) => {
  * @param routeService
  */
 export const getDSpaceQuery = (item: Item, routeService: RouteService): Observable<string> => {
-  return routeService.getHistory().pipe(
+  return routeService.getPreviousUrl().pipe(
-    take(1),
-    map(routes => routes[routes.length - 2 ]),
     filter(r => {
       return r.includes('/search');
     }),

src/app/item-page/simple/item-types/shared/item.component.ts

@@ -21,10 +21,19 @@ export class ItemComponent implements OnInit {
    */
   itemPageRoute: string;
 
+  /**
+   * Enables the mirador component.
+   */
   iiifEnabled: boolean;
 
+  /**
+   * Used to configure search in mirador.
+   */
   iiifSearchEnabled: boolean;
 
+  /**
+   * The query term from the previous dspace search.
+   */
   iiifQuery$: Observable<string>;
 
   mediaViewer = environment.mediaViewer;