Merge pull request #1409 from appsembler/vladyslav/hide-html-elements…

…-in-iframe Hide site elements if render in iframe
appsembler · Aug 14, 2024 · 6290527 · 6290527
2 parents cd7be06 + 9c2f374
commit 6290527
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 0 deletions.
diff --git a/common/static/js/src/iframe-render.js b/common/static/js/src/iframe-render.js
@@ -0,0 +1,13 @@
+// List of the classes to hide while rendered in an iframe
+const classesToHide = ['.global-header', '.wrapper-course-material', '.a--footer'];
+
+document.addEventListener('DOMContentLoaded', function () {
+  // Check if rendered in iframe
+  if (window.self !== window.top) {
+    classesToHide.forEach(function (className) {
+      document.querySelectorAll(className).forEach(function (element) {
+        element.classList.add('hidden-in-iframe');
+      });
+    });
+  }
+});
diff --git a/lms/static/sass/shared-v2/_base.scss b/lms/static/sass/shared-v2/_base.scss
@@ -24,3 +24,8 @@
   @extend .sr-only;
 }
 
+// Hide element when rendered in iFrame
+.hidden-in-iframe {
+    display: none !important;
+}
+
diff --git a/lms/templates/main.html b/lms/templates/main.html
@@ -211,6 +211,7 @@
   <script type="text/javascript" src="${static.url('js/header/header.js')}"></script>
   <%static:optional_include_mako file="body-extra.html" is_theming_enabled="True" />
   <script type="text/javascript" src="${static.url('js/src/jquery_extend_patch.js')}"></script>
+  <script type="text/javascript" src="${static.url('js/src/iframe-render.js')}"></script>
 </body>
 </html>