Enabling the basic Media Viewer in DSpace-CRIS 9.2 CRIS custom Layout

[Maruthu Pandian]

Dear Members,

We have been working on DSpace-CRIS 9.2 for the past few months. We would like to enable the basic media viewer in CRIS custom layout. DSpace supports basic media viewer in default interface, but in CRIS custom layout this feature is missing. When we checked the documentation of the CRIS, it mentions we may need to get the additional addon from 4Science to have advanced media viewer.

As of now, we would like to have the basic media viewer in our system instead of additional addon.

Any suggestions on enabling the basic media viewer,

Regards

Maruthu Pandiyan B

The Institute of Mathematical Sciences, Chennai

[Frank]

For DSpace-CRIS 9.2, the "basic media viewer" works in the default XMLUI/JSPUI, but CRIS custom layout uses Angular UI which doesn’t include it out-of-the-box. You’re right - 4Science docs point to their paid “Advanced Media Viewer” addon.

But you can enable the basic media viewer without buying the addon. Here’s how:

Option 1: Backport the default Media Viewer component to Angular UI

This is the “basic” viewer DSpace uses - just a simple HTML5 `<video>` / `<audio>` / PDF `<iframe>` player.

Steps:

1. Check if bitstream is downloadable

   In `config/cris/cris.cfg` or `local.cfg`:

   webui.bitstream.inline = true

   If `false`, the basic viewer won’t trigger because Angular UI won’t render inline.

2. Modify Angular UI theme to render bitstreams

   CRIS custom layout hides the `item-bitstreams` component by default. Edit your custom layout:

   `src/app/item-page/simple/item-types/cris-layout/cris-layout-item/cris-layout-item.component.html`

   Add the basic viewer component where you want media to show:

   <ds-media-viewer [bitstream]="bitstream"></ds-media-viewer>

   The `<ds-media-viewer>` component already exists in DSpace 7+ Angular UI for default items. CRIS layouts just don’t include it.

3. Update MIME type mapping

   In `dspace.cfg`:

   mimetype.supported = video/mp4, audio/mpeg, application/pdf, image/jpeg, image/png

   Basic viewer only works for browser-native formats. No http://PDF.js, no IIIF - just native playback.

4. Rebuild Angular UI

   `yarn install && yarn build:prod` then restart Tomcat.

Option 2: Quick hack - Use bitstream link + browser player

If you don’t want to touch Angular code:

1. Go to `src/app/item-page/field-components/bitstreams/bitstreams.component.html` in CRIS layout

2. For `bitstream.mimeType` starting with `video/` or `audio/`, render:

   <video controls ngIf="bitstream.mimeType.startsWith('video/')" [src]="bitstreamLink"></video>

   <audio controls ngIf="bitstream.mimeType.startsWith('audio/')" [src]="bitstreamLink"></audio>

This gives you the exact same “basic” viewer as default UI, no addon needed.

Best regards Frank