add tag link handling with :tag:#tag syntax

Author: AWolf81

browser/components/MarkdownPreview.js

@@ -23,6 +23,7 @@ import i18n from 'browser/lib/i18n'
 import fs from 'fs'
 import { render } from 'react-dom'
 import Carousel from 'react-image-carousel'
+import { hashHistory } from 'react-router'
 import ConfigManager from '../main/lib/ConfigManager'
 
 const { remote, shell } = require('electron')
@@ -1015,15 +1016,19 @@ export default class MarkdownPreview extends React.Component {
     e.preventDefault()
     e.stopPropagation()
 
-    const href = e.target.getAttribute('href')
-    const linkHash = href.split('/').pop()
+    const rawHref = e.target.getAttribute('href')
+    const parser = document.createElement('a')
+    parser.href = e.target.getAttribute('href')
+    const { href, hash } = parser
+    const linkHash = hash === '' ? rawHref : hash // needed because we're having special link formats that are removed by parser e.g. :line:10
 
-    if (!href) return
+    if (!rawHref) return // not checked href because parser will create file://... string for [empty link]()
 
-    const regexNoteInternalLink = /main.html#(.+)/
-    if (regexNoteInternalLink.test(linkHash)) {
-      const targetId = mdurl.encode(linkHash.match(regexNoteInternalLink)[1])
-      const targetElement = this.refs.root.contentWindow.document.getElementById(
+    const regexNoteInternalLink = /.*[main.\w]*.html#/
+
+    if (regexNoteInternalLink.test(href)) {
+      const targetId = mdurl.encode(linkHash)
+      const targetElement = this.refs.root.contentWindow.document.querySelector(
         targetId
       )
 
@@ -1061,6 +1066,13 @@ export default class MarkdownPreview extends React.Component {
       return
     }
 
+    const regexIsTagLink = /^:tag:#([\w]+)$/
+    if (regexIsTagLink.test(rawHref)) {
+      const tag = rawHref.match(regexIsTagLink)[1]
+      hashHistory.push(`/tags/${encodeURIComponent(tag)}`)
+      return
+    }
+
     // other case
     shell.openExternal(href)
   }

extra_scripts/codemirror/addon/hyperlink/hyperlink.js

@@ -16,7 +16,7 @@
   const modifier = macOS ? 'metaKey' : 'ctrlKey'
 
   class HyperLink {
-    constructor(cm) {
+    constructor (cm) {
       this.cm = cm
       this.lineDiv = cm.display.lineDiv
 
@@ -47,7 +47,7 @@
         passive: true
       })
     }
-    getUrl(el) {
+    getUrl (el) {
       const className = el.className.split(' ')
 
       if (className.indexOf('cm-url') !== -1) {
@@ -60,7 +60,7 @@
 
       return null
     }
-    onMouseDown(e) {
+    onMouseDown (e) {
       const { target } = e
       if (!e[modifier]) {
         return
@@ -73,39 +73,37 @@
         shell.openExternal(url)
       }
     }
-    onMouseEnter(e) {
+    onMouseEnter (e) {
       const { target } = e
 
       const url = this.getUrl(target)
       if (url) {
         if (e[modifier]) {
           target.classList.add('CodeMirror-activeline-background', 'CodeMirror-hyperlink')
-        }
-        else {
+        } else {
           target.classList.add('CodeMirror-activeline-background')
         }
 
         this.showInfo(target)
       }
     }
-    onMouseLeave(e) {
+    onMouseLeave (e) {
       if (this.tooltip.parentElement === this.lineDiv) {
         e.target.classList.remove('CodeMirror-activeline-background', 'CodeMirror-hyperlink')
 
         this.lineDiv.removeChild(this.tooltip)
       }
     }
-    onMouseMove(e) {
+    onMouseMove (e) {
       if (this.tooltip.parentElement === this.lineDiv) {
         if (e[modifier]) {
           e.target.classList.add('CodeMirror-hyperlink')
-        }
-        else {
+        } else {
           e.target.classList.remove('CodeMirror-hyperlink')
         }
       }
     }
-    showInfo(relatedTo) {
+    showInfo (relatedTo) {
       const b1 = relatedTo.getBoundingClientRect()
       const b2 = this.lineDiv.getBoundingClientRect()
       const tdiv = this.tooltip
@@ -117,8 +115,7 @@
       const top = b1.top - b2.top - b3.height - yOffset
       if (top < 0) {
         tdiv.style.top = (b1.top - b2.top + b1.height + yOffset) + 'px'
-      }
-      else {
+      } else {
         tdiv.style.top = top + 'px'
       }
     }
@@ -127,4 +124,4 @@
   CodeMirror.defineOption('hyperlink', true, (cm) => {
     const addon = new HyperLink(cm)
   })
-})
+})

yarn.lock

@@ -5685,6 +5685,13 @@ levn@^0.3.0, levn@~0.3.0:
     prelude-ls "~1.1.2"
     type-check "~0.3.2"
 
+linkify-it@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-2.1.0.tgz#c4caf38a6cd7ac2212ef3c7d2bde30a91561f9db"
+  integrity sha512-4REs8/062kV2DSHxNfq5183zrqXMl7WP0WzABH9IeJI+NLm429FgE1PDecltYfnOoFDFlZGh2T8PfZn0r+GTRg==
+  dependencies:
+    uc.micro "^1.0.1"
+
 linkify-it@~1.2.0, linkify-it@~1.2.2:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-1.2.4.tgz#0773526c317c8fd13bd534ee1d180ff88abf881a"
@@ -5968,6 +5975,17 @@ markdown-it-sup@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/markdown-it-sup/-/markdown-it-sup-1.0.0.tgz#cb9c9ff91a5255ac08f3fd3d63286e15df0a1fc3"
 
+[email protected]:
+  version "8.4.2"
+  resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-8.4.2.tgz#386f98998dc15a37722aa7722084f4020bdd9b54"
+  integrity sha512-GcRz3AWTqSUphY3vsUqQSFMbgR38a4Lh3GWlHRh/7MRwz8mcu9n2IO7HOh+bXHrR9kOPDl5RNCaEsrneb+xhHQ==
+  dependencies:
+    argparse "^1.0.7"
+    entities "~1.1.1"
+    linkify-it "^2.0.0"
+    mdurl "^1.0.1"
+    uc.micro "^1.0.5"
+
 markdown-it@^5.0.3:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-5.1.0.tgz#25286b8465bac496f3f1b77eed544643e9bd718d"
@@ -6009,6 +6027,13 @@ markdown-toc@^1.2.0:
     repeat-string "^1.6.1"
     strip-color "^0.1.0"
 
+markdownlint@^0.11.0:
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/markdownlint/-/markdownlint-0.11.0.tgz#3858bbdbc1ab78abf0c098d841c72b63dd3206a0"
+  integrity sha512-wE5WdKD6zW2DQaPQ5TFBTXh5j76DnWd/IFffnDQgHmi6Y61DJXBDfLftZ/suJHuv6cwPjM6gKw2GaRLJMOR+Mg==
+  dependencies:
+    markdown-it "8.4.2"
+
 match-at@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/match-at/-/match-at-0.1.1.tgz#25d040d291777704d5e6556bbb79230ec2de0540"
@@ -9048,6 +9073,11 @@ uc.micro@^1.0.0, uc.micro@^1.0.1:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
 
+uc.micro@^1.0.5:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.6.tgz#9c411a802a409a91fc6cf74081baba34b24499ac"
+  integrity sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==
+
 uglify-js@^2.6:
   version "2.8.29"
   resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-2.8.29.tgz#29c5733148057bb4e1f75df35b7a9cb72e6a59dd"