diff --git a/src/frontend/plugins/edusharing-asset/renderer.tsx b/src/frontend/plugins/edusharing-asset/renderer.tsx index 6d8a7025..452a02c7 100644 --- a/src/frontend/plugins/edusharing-asset/renderer.tsx +++ b/src/frontend/plugins/edusharing-asset/renderer.tsx @@ -211,7 +211,7 @@ export function EdusharingAssetRenderer(props: { } } - // Video & audio + // Audio const isEmbedThatNeedsToFetchContent = detailsSnippet.includes('get_resource') if (isEmbedThatNeedsToFetchContent) { @@ -221,12 +221,31 @@ export function EdusharingAssetRenderer(props: { 'function get_resource(authstring)', ) - // Add iframe resizer script - const newEmbedHtml = + return { + html: appendIframeResizer(detailsSnippet), + renderMethod: 'iframe', + defineContainerHeight: false, + } + } + + // Video + const isVideo: boolean = htmlDocument.querySelector('video') !== null + if (isVideo) { + // Add style overwrites + detailsSnippet = detailsSnippet + - '' + ` + + ` return { - html: newEmbedHtml, + html: appendIframeResizer(detailsSnippet), renderMethod: 'iframe', defineContainerHeight: false, } @@ -238,9 +257,7 @@ export function EdusharingAssetRenderer(props: { const isH5P = iframe && iframe.getAttribute('src')?.includes('h5p') if (isH5P) { return { - html: - detailsSnippet + - '', + html: appendIframeResizer(detailsSnippet), renderMethod: 'iframe', defineContainerHeight: false, } @@ -280,9 +297,7 @@ export function EdusharingAssetRenderer(props: { // Backup when content type could not be determined above -> Render in iframe with iframe-resizer. // This will make sure ', + html: appendIframeResizer(detailsSnippet), renderMethod: 'iframe', defineContainerHeight: false, } @@ -375,6 +390,13 @@ function buildImageSnippet(image: HTMLImageElement): string { ` } +function appendIframeResizer(htmlSnippet: string) { + return ( + htmlSnippet + + '' + ) +} + // Only re-render if `srcDoc` prop changed. We do not want to re-render the Iframe every time when EdusharingAssetRenderer is re-rendered because the state within the iframe is lost. const MemoizedIframeResizer = memo( IframeResizer,