Merge pull request #959 from kiwix/clickable_external_links4

Fixed external links in the viewer iframe (final version)
kiwix · Jun 21, 2023 · 550fc2f · 550fc2f
2 parents 144945c + 96fb65f
commit 550fc2f
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 9 deletions.
diff --git a/static/skin/viewer.js b/static/skin/viewer.js
@@ -259,9 +259,10 @@ function matchingAncestorElement(el, context, selector) {
 
 const block_path = `${root}/catch/external`;
 
-function blockLink(target) {
-  const encodedHref = encodeURIComponent(target.href);
-  target.setAttribute("href", block_path + "?source=" + encodedHref);
+function blockLink(url) {
+  return viewerSettings.linkBlockingEnabled
+       ? block_path + "?source=" + encodeURIComponent(url)
+       : url;
 }
 
 function isExternalUrl(url) {
@@ -278,9 +279,14 @@ function onClickEvent(e) {
   const target = matchingAncestorElement(e.target, iframeDocument, "a");
   if (target !== null && "href" in target) {
     if ( isExternalUrl(target.href) ) {
-      target.setAttribute("target", "_top");
-      if ( viewerSettings.linkBlockingEnabled ) {
-        return blockLink(target);
+      const possiblyBlockedLink = blockLink(target.href);
+      if ( e.ctrlKey || e.shiftKey ) {
+        // The link will be loaded in a new tab/window - update the link
+        // and let the browser handle the rest.
+        target.setAttribute("href", possiblyBlockedLink);
+      } else {
+        // Load the external URL in the viewer window (rather than iframe)
+        contentIframe.contentWindow.parent.location = possiblyBlockedLink;
       }
     }
   }
@@ -329,8 +335,8 @@ let viewerSetupComplete = false;
 function on_content_load() {
   if ( viewerSetupComplete ) {
     handle_content_url_change();
-    setup_external_link_blocker();
   }
+  setup_external_link_blocker();
 }
 
 function htmlDecode(input) {

diff --git a/test/server.cpp b/test/server.cpp
@@ -73,7 +73,7 @@ const ResourceCollection resources200Compressible{
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css" },
   { STATIC_CONTENT,  "/ROOT%23%3F/skin/taskbar.css?cacheid=bbdaf425" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/viewer.js" },
-  { STATIC_CONTENT,  "/ROOT%23%3F/skin/viewer.js?cacheid=725c95a2" },
+  { STATIC_CONTENT,  "/ROOT%23%3F/skin/viewer.js?cacheid=cb9b1f75" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/fonts/Poppins.ttf" },
   { STATIC_CONTENT,  "/ROOT%23%3F/skin/fonts/Poppins.ttf?cacheid=af705837" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/fonts/Roboto.ttf" },
@@ -312,7 +312,7 @@ R"EXPECTEDRESULT(    <link type="text/css" href="./skin/taskbar.css?cacheid=bbda
     <link type="text/css" href="./skin/css/autoComplete.css?cacheid=08951e06" rel="Stylesheet" />
     <script type="module" src="./skin/i18n.js?cacheid=2cf0f8c5" defer></script>
     <script type="text/javascript" src="./skin/languages.js?cacheid=648526e1" defer></script>
-    <script type="text/javascript" src="./skin/viewer.js?cacheid=725c95a2" defer></script>
+    <script type="text/javascript" src="./skin/viewer.js?cacheid=cb9b1f75" defer></script>
     <script type="text/javascript" src="./skin/autoComplete.min.js?cacheid=1191aaaf"></script>
       const blankPageUrl = root + "/skin/blank.html?cacheid=6b1fa032";
             <img src="./skin/langSelector.svg?cacheid=00b59961">