[IIIF-104] New canvasId for mirador viewer

Author: vins01-4science

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

@@ -31,6 +31,11 @@ export class MiradorViewerComponent implements OnInit {
    */
   @Input() searchable: boolean;
 
+  /**
+   * Is used as index of the element to show.
+   */
+  @Input() canvasIndex: number;
+
   /**
    * Hides embedded viewer in dev mode.
    */
@@ -87,6 +92,9 @@ export class MiradorViewerComponent implements OnInit {
     if (this.notMobile) {
       viewerPath += '&notMobile=true';
     }
+    if (this.canvasIndex) {
+      viewerPath += `&canvasId=${this.canvasIndex}`;
+    }
 
     // TODO: Should the query term be trusted here?
     return this.sanitizer.bypassSecurityTrustResourceUrl(viewerPath);

src/mirador-viewer/config.default.js

@@ -17,13 +17,16 @@ import miradorSharePlugin from 'mirador-share-plugin/es/miradorSharePlugin';
 import miradorDownloadPlugin from 'mirador-dl-plugin/es/miradorDownloadPlugin';
 import miradorDownloadDialog from 'mirador-dl-plugin/es/MiradorDownloadDialog';
 
+const MANIFEST_URL_PART = /\/manifest$/;
+
 const embedURL = location.href;
 const params = new URLSearchParams(location.search);
 const manifest = params.get('manifest');
 const searchOption = params.get('searchable');
 const query = params.get('query');
 const multi = params.get('multi');
 const notMobile = params.get('notMobile');
+const canvasId = params.get('canvasId');
 
 let windowSettings = {};
 let sidbarPanel = 'info';
@@ -52,6 +55,10 @@ windowSettings.manifestId = manifest;
       }
     }
   }
+  if (canvasId != null && canvasId !== 'null' && +canvasId >= 0) {
+    windowSettings.canvasId =
+      `${(manifest.replace(MANIFEST_URL_PART, ''))}/canvas/c${canvasId}`;
+  }
 })();
 
 (Mirador.viewer(