Add functionality to open external links in jupyter notebooks in new …

…tab (alshedivat#2233) See alshedivat#2230 --------- Co-authored-by: Scherrmann <scherrmann@bwl.uni-muenchen.de>
karapostK · Jul 4, 2024 · 3230f05 · 3230f05
1 parent 389ed9f
commit 3230f05
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 0 deletions.
diff --git a/_includes/scripts/misc.liquid b/_includes/scripts/misc.liquid
@@ -31,3 +31,6 @@
 <script src="{{ '/assets/js/no_defer.js' | relative_url | bust_file_cache }}"></script>
 <script defer src="{{ '/assets/js/common.js' | relative_url | bust_file_cache }}"></script>
 <script defer src="{{ '/assets/js/copy_code.js' | relative_url | bust_file_cache }}" type="text/javascript"></script>
+
+<!-- Jupyter Open External Links New Tab -->
+<script defer src="{{ '/assets/js/jupyter_new_tab.js' | relative_url | bust_file_cache }}"></script>
diff --git a/assets/js/jupyter_new_tab.js b/assets/js/jupyter_new_tab.js
@@ -0,0 +1,18 @@
+$(document).ready(function () {
+  // Let external links in jupyter notebooks open in new tab
+  let jupyterNotebooks = $(".jupyter-notebook-iframe-container");
+  jupyterNotebooks.each(function () {
+    let iframeBody = $(this).find("iframe").get(0).contentWindow.document.body;
+    // Get all <a> elements in the bodyElement
+    let links = $(iframeBody).find("a");
+
+    // Loop through each <a> element
+    links.each(function () {
+      // Check if the <a> element has an 'href' attribute
+      if ($(this).attr("href")) {
+        // Set the 'target' attribute to '_blank' to open the link in a new tab/window
+        $(this).attr("target", "_blank");
+      }
+    });
+  });
+});