From bc8f4118ac2b0b848305dbc5f33b0b603799c81a Mon Sep 17 00:00:00 2001
From: Ferran Recio <ferran@moodle.com>
Date: Fri, 22 Jan 2021 16:43:54 +0100
Subject: [PATCH] MDL-70634 h5p: minimizing height glitch

---
 h5p/templates/h5pembed.mustache | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/h5p/templates/h5pembed.mustache b/h5p/templates/h5pembed.mustache
index a0808404fcb..7a3502af5be 100644
--- a/h5p/templates/h5pembed.mustache
+++ b/h5p/templates/h5pembed.mustache
@@ -18,6 +18,9 @@
     @template core_h5p/h5pembed
 
     This template will render the embed code shown in the H5P content embed popup.
+    H5P implements iframe autoheight but if the content is not available it does
+    not work and we need ensure a minimum height using javascript. Otherwise the user
+    will not see the error.
 
     Variables required for this template:
     * embedurl - The URL with the H5P file to embed
@@ -30,5 +33,12 @@
 }}
 <iframe src="{{embedurl}}" name="h5player" width=":w" height=":h"
    allowfullscreen="allowfullscreen" class="h5p-player w-100 border-0"
-   style="min-height: 230px;">
+   style="height: 0px;" id="{{uniqid}}-h5player">
 </iframe>
+{{#js}}
+window.onload=function(){
+    setTimeout(() => {
+        document.getElementById('{{uniqid}}-h5player').style.minHeight = '230px';
+    }, 1000);
+};
+{{/js}}