BaseMediaPreview
Component allowing for the display of images or streaming of audio and video (currently only hls format) and by using browser pdf viewer also pdfs
CAVEAT: this component will be deprecated and replaced by BaseMediaCarousel! Usage not recommended!
Props
| Prop name | Description | Type | Values | Default |
|---|---|---|---|---|
| showPreview | steer the display of the lightbox | boolean | - | false |
| mediaUrl | url of the medium to be displayed | string | - | '' |
| mediaPosterUrl | url of image for poster property in html5 video tag | string | - | '' |
| displayName | filename that will be displayed for the medium | string | - | '' |
| downloadUrl | url for downloading the file | string | - | '' |
| mediaType | define the media type | string | image, video, audio, pdf | '' |
| displaySize | set height and with from outside | object | - | { height: '720px', width: '1280px' } |
| allowDownload | define if download button should be shown and download be enabled | boolean | - | true |
| infoTexts | define information texts for download and view (for pdfs) buttons | object | - | { download: 'Download', view: 'View' } |
| orientation | define how the image should be rotated (EXIF orientation values) | number | - | 0 |
| previews | specify an image srcset as an array of objects in the form{ [mediawidth]: 'url' } | array | - | [] |
| additionalInfo | Additional info text below file name | array | - | [] |
| hlsStartLevel | set initial hls-video size | number | - | undefined |
Events
| Event name | Properties | Description |
|---|---|---|
| hide-preview | triggered on clicking outside image area or when close action is triggered | |
| download | url string - the download urlname string - the file name | download button clicked |
Demo
Image View Box
An audio example
An video example
An pdf example