update method of communication between iframe and embed script

2018-02-16 00:07:17 +02:00
parent 1e4704d01e
commit fdc3188155
2 changed files with 19 additions and 8 deletions
@@ -17,7 +17,7 @@ function initEmbed() {

  node.innerHTML = `
    <iframe
-      src="http://demo.remark42.com/iframe.html"
+      src="https://demo.remark42.com/web/iframe.html"
      width="100%"
      frameborder="0"
      allowtransparency="true"
@@ -31,12 +31,14 @@ function initEmbed() {
  `;

  const iframe = node.getElementsByTagName('iframe')[0];
-  let lastHeight = 0;
-  setInterval(() => {
-    if (iframe.contentWindow.html.innerHeight !== lastHeight) {
-      lastHeight = iframe.contentWindow.html.innerHeight;
-      iframe.style.height = `${lastHeight}px`;
-    }
-  }, 200);
+
+  window.addEventListener('message', updateIframeHeight);
+
+  function updateIframeHeight(event) {
+    try {
+      const data = JSON.parse(event.data);
+      iframe.style.height = `${data.remarkIframeHeight}px`;
+    } catch (e) {}
+  }
 }

@@ -9,5 +9,14 @@
 <body>
 <div id="remark42"></div>
 <script type="text/javascript" src="/web/remark.js"></script>
+<script>
+  var lastHeight = 0;
+  setInterval(() => {
+    if (document.body.offsetHeight !== lastHeight) {
+      lastHeight = document.body.offsetHeight;
+      window.parent.postMessage(JSON.stringify({ remarkIframeHeight: lastHeight }), '*');
+    }
+  }, 200);
+</script>
 </body>
 </html>