www: iframe aspect ratio fix

1 files changed, 4 insertions, 3 deletions

diff --git a/juick-www/src/main/js/killy/index.js b/juick-www/src/main/js/killy/index.js
index fe249fae..b96613c2 100644
--- a/juick-www/src/main/js/killy/index.js
+++ b/juick-www/src/main/js/killy/index.js
@@ -47,6 +47,7 @@ function makeIframe(src, w, h, scrolling='no') {
   iframe.scrolling = scrolling;
   iframe.setAttribute('allowFullScreen', '');
   iframe.src = src;
+  iframe.innerHTML = 'Cannot show iframes.';
   return iframe;
 }
 
@@ -65,7 +66,7 @@ function makeResizableToRatio(element, ratio) {
 // calcHeight :: Number -> Number -- calculate element height for a given width
 function makeResizable(element, calcHeight) {
   const setHeight = el => {
-    if (el.offsetWidth > 0) {
+    if (document.body.contains(el) && (el.offsetWidth > 0)) {
       el.style.height = (calcHeight(el.offsetWidth)).toFixed(2) + 'px';
     }
   };
@@ -217,7 +218,7 @@ function getEmbeddableLinkTypes() {
           iframeUrl = `//www.youtube-nocookie.com/embed/${v}?${argsStr}`;
         }
         let iframe = makeIframe(iframeUrl, '100%', '360px');
-        setTimeout(() => makeResizableToRatio(iframe, 9.0 / 16.0), 10);
+        iframe.onload = () => makeResizableToRatio(iframe, 9.0 / 16.0);
         return wrapIntoTag(iframe, 'div', 'youtube resizableV');
       }
     },
@@ -230,7 +231,7 @@ function getEmbeddableLinkTypes() {
       re: /^(?:https?:)?\/\/(?:www\.)?(?:player\.)?vimeo\.com\/(?:video\/|album\/[\d]+\/video\/)?([\d]+)/i,
       makeNode: function(aNode, reResult) {
         let iframe = makeIframe('//player.vimeo.com/video/' + reResult[1], '100%', '360px');
-        setTimeout(() => makeResizableToRatio(iframe, 9.0 / 16.0), 10);
+        iframe.onload = () => makeResizableToRatio(iframe, 9.0 / 16.0);
         return wrapIntoTag(iframe, 'div', 'vimeo resizableV');
       }
     }