From 38dd8418eaf549a52096ee0c95c1b9c2edf8c586 Mon Sep 17 00:00:00 2001
From: Moritz Scherrmann <mscherrmann@outlook.de>
Date: Tue, 27 Feb 2024 16:25:16 +0100
Subject: [PATCH] Add functionality to open external links in jupyter notebooks
 in new tab (#2233)

See https://github.com/alshedivat/al-folio/pull/2230

---------

Co-authored-by: Scherrmann <scherrmann@bwl.uni-muenchen.de>
---
 _includes/scripts/misc.liquid |  3 +++
 assets/js/jupyter_new_tab.js  | 18 ++++++++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 assets/js/jupyter_new_tab.js

diff --git a/_includes/scripts/misc.liquid b/_includes/scripts/misc.liquid
index 61223b17acf4..07b117e46990 100644
--- 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
new file mode 100644
index 000000000000..4098af66edd5
--- /dev/null
+++ 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");
+      }
+    });
+  });
+});