Merge pull request #3 from JakubAndrysek/mkdocs-instant

Author: JakubAndrysek

.idea/mkdocs-open-in-new-tab.iml

@@ -8,8 +8,6 @@
 <img src="https://img.shields.io/github/forks/JakubAndrysek/mkdocs-open-in-new-tab?style=flat-square">
 <img src="https://img.shields.io/github/issues/JakubAndrysek/mkdocs-open-in-new-tab?style=flat-square">
 <img src="https://static.pepy.tech/personalized-badge/mkdocs-open-in-new-tab?period=month&units=international_system&left_color=black&right_color=orange&left_text=Downloads">
-
-
 </p>
 
 This plugin adds JS code to open outgoing links and PDFs in a new tab.
@@ -67,8 +65,8 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
 
 //open external links in a new window
 function external_new_window() {
-    for(var c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
-        var b = c[a];
+    for(let c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
+        let b = c[a];
         if(b.getAttribute("href") && b.hostname !== location.hostname) {
             b.target = "_blank";
             b.rel = "noopener";
@@ -78,9 +76,11 @@ function external_new_window() {
 //open PDF links in a new window
 function pdf_new_window ()
 {
-    if (!document.getElementsByTagName) return false;
-    var links = document.getElementsByTagName("a");
-    for (var eleLink=0; eleLink < links.length; eleLink ++) {
+    if (!document.getElementsByTagName) {
+      return false;
+    }
+    let links = document.getElementsByTagName("a");
+    for (let eleLink=0; eleLink < links.length; eleLink ++) {
     if ((links[eleLink].href.indexOf('.pdf') !== -1)||(links[eleLink].href.indexOf('.doc') !== -1)||(links[eleLink].href.indexOf('.docx') !== -1)) {
         links[eleLink].onclick =
         function() {
@@ -91,16 +91,26 @@ function pdf_new_window ()
     }
 }
 
-window.addEventListener("DOMContentLoaded", function() {
+function apply_rules() {
     external_new_window();
     pdf_new_window();
-});
+}
+
+if (typeof document$ !== "undefined") {
+    // compatibility with mkdocs-material's instant loading feature
+    // based on code from https://github.com/timvink/mkdocs-charts-plugin
+    // Copyright (c) 2021 Tim Vink - MIT License
+    // fixes [Issue #2](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2)
+    document$.subscribe(function() {
+        apply_rules();
+    })
+}
 ```
 </p>
 </details>
 
-## Known issues
-This extension does not work with mkdocs-material [navigation.instant](https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/#instant-loading). JS could not be loaded when the page is loaded instantly. If you know how to fix it, please let me know. Issue is [here](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2).
+<!-- ## Known issues
+This extension does not work with mkdocs-material [navigation.instant](https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/#instant-loading). JS could not be loaded when the page is loaded instantly. If you know how to fix it, please let me know. Issue is [here](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2). -->
 
 ## License
 

.idea/modules.xml

@@ -1,3 +1,5 @@
 # Relative Link
 
-This is a relative link back to the [README](README.md).
+This is a relative link back to the [README](README.md).
+
+This is outgoing link to [Github](https://github.com/).

.idea/workspace.xml

@@ -8,8 +8,6 @@
 <img src="https://img.shields.io/github/forks/JakubAndrysek/mkdocs-open-in-new-tab?style=flat-square">
 <img src="https://img.shields.io/github/issues/JakubAndrysek/mkdocs-open-in-new-tab?style=flat-square">
 <img src="https://static.pepy.tech/personalized-badge/mkdocs-open-in-new-tab?period=month&units=international_system&left_color=black&right_color=orange&left_text=Downloads">
-
-
 </p>
 
 This plugin adds JS code to open outgoing links and PDFs in a new tab.
@@ -67,8 +65,8 @@ Look at this source <a href="https://github.com/JakubAndrysek/mkdocs-open-in-new
 
 //open external links in a new window
 function external_new_window() {
-    for(var c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
-        var b = c[a];
+    for(let c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
+        let b = c[a];
         if(b.getAttribute("href") && b.hostname !== location.hostname) {
             b.target = "_blank";
             b.rel = "noopener";
@@ -78,9 +76,11 @@ function external_new_window() {
 //open PDF links in a new window
 function pdf_new_window ()
 {
-    if (!document.getElementsByTagName) return false;
-    var links = document.getElementsByTagName("a");
-    for (var eleLink=0; eleLink < links.length; eleLink ++) {
+    if (!document.getElementsByTagName) {
+      return false;
+    }
+    let links = document.getElementsByTagName("a");
+    for (let eleLink=0; eleLink < links.length; eleLink ++) {
     if ((links[eleLink].href.indexOf('.pdf') !== -1)||(links[eleLink].href.indexOf('.doc') !== -1)||(links[eleLink].href.indexOf('.docx') !== -1)) {
         links[eleLink].onclick =
         function() {
@@ -91,16 +91,27 @@ function pdf_new_window ()
     }
 }
 
-window.addEventListener("DOMContentLoaded", function() {
+function apply_rules() {
     external_new_window();
     pdf_new_window();
-});
+}
+
+if (typeof document$ !== "undefined") {
+    // compatibility with mkdocs-material's instant loading feature
+    // based on code from https://github.com/timvink/mkdocs-charts-plugin
+    // Copyright (c) 2021 Tim Vink - MIT License
+    // fixes [Issue #2](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2)
+    document$.subscribe(function() {
+        apply_rules();
+        console.log("Applying rules");
+    })
+}
 ```
 </p>
 </details>
 
-## Known issues
-This extension does not work with mkdocs-material [navigation.instant](https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/#instant-loading). JS could not be loaded when the page is loaded instantly. If you know how to fix it, please let me know. Issue is [here](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2).
+<!-- ## Known issues
+This extension does not work with mkdocs-material [navigation.instant](https://squidfunk.github.io/mkdocs-material/setup/setting-up-navigation/#instant-loading). JS could not be loaded when the page is loaded instantly. If you know how to fix it, please let me know. Issue is [here](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2). -->
 
 ## License
 

README.md

@@ -1,3 +1,5 @@
 # Relative Link
 
-This is a relative link back to the [README](README.md).
+This is a relative link back to the [README](README.md).
+
+This is outgoing link to [Github](https://github.com/).

RelativeLink.md

@@ -26,6 +26,7 @@ theme:
     - navigation.tracking
     - navigation.tabs
     - navigation.expand
+    # - navigation.instant for testing purposes
   icon:
     repo: fontawesome/brands/github
 

docs/README.md

@@ -3,8 +3,8 @@
 
 //open external links in a new window
 function external_new_window() {
-    for(var c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
-        var b = c[a];
+    for(let c = document.getElementsByTagName("a"), a = 0;a < c.length;a++) {
+        let b = c[a];
         if(b.getAttribute("href") && b.hostname !== location.hostname) {
             b.target = "_blank";
             b.rel = "noopener";
@@ -14,9 +14,11 @@ function external_new_window() {
 //open PDF links in a new window
 function pdf_new_window ()
 {
-    if (!document.getElementsByTagName) return false;
-    var links = document.getElementsByTagName("a");
-    for (var eleLink=0; eleLink < links.length; eleLink ++) {
+    if (!document.getElementsByTagName) {
+      return false;
+    }
+    let links = document.getElementsByTagName("a");
+    for (let eleLink=0; eleLink < links.length; eleLink ++) {
     if ((links[eleLink].href.indexOf('.pdf') !== -1)||(links[eleLink].href.indexOf('.doc') !== -1)||(links[eleLink].href.indexOf('.docx') !== -1)) {
         links[eleLink].onclick =
         function() {
@@ -27,7 +29,17 @@ function pdf_new_window ()
     }
 }
 
-window.addEventListener("DOMContentLoaded", function() {
+function apply_rules() {
     external_new_window();
     pdf_new_window();
-});
+}
+
+if (typeof document$ !== "undefined") {
+    // compatibility with mkdocs-material's instant loading feature
+    // based on code from https://github.com/timvink/mkdocs-charts-plugin
+    // Copyright (c) 2021 Tim Vink - MIT License
+    // fixes [Issue #2](https://github.com/JakubAndrysek/mkdocs-open-in-new-tab/issues/2)
+    document$.subscribe(function() {
+        apply_rules();
+    })
+}

docs/RelativeLink.md

@@ -6,13 +6,13 @@
 # PyPI: https://pypi.org/project/mkdocs-open-in-new-tab/
 # Inspired by: https://github.com/timvink/mkdocs-charts-plugin/tree/main
 
-import open_in_new_tab
 from mkdocs.plugins import BasePlugin
 from mkdocs.utils import copy_file
 import os
 
 HERE = os.path.dirname(os.path.abspath(__file__))
 
+
 class OpenInNewTabPlugin(BasePlugin):
     def on_config(self, config, **kwargs):
         """
@@ -23,8 +23,6 @@ def on_config(self, config, **kwargs):
         # which is added to the output directory during on_post_build() event
         config["extra_javascript"].append("js/open_in_new_tab.js")
 
-
-
     def on_post_build(self, config):
         """
         Event trigger on post build.
@@ -37,4 +35,4 @@ def on_post_build(self, config):
         copy_file(
             os.path.join(os.path.join(package, "js"), "open_in_new_tab.js"),
             js_file_path,
-        )
+        )

mkdocs.yml

@@ -8,7 +8,7 @@ def readme():
 # https://pypi.org/project/mkdocs-open-in-new-tab/
 setup(
     name='mkdocs-open-in-new-tab',
-    version='1.0.2',
+    version='1.0.3',
     description='MkDocs plugin to open outgoing links and PDFs in new tab.',
     long_description=readme(),
     long_description_content_type='text/markdown',