web: add anchor to the title

src/resources/common.css

@@ -186,3 +186,25 @@ span.modal-close:focus {
     border-color: #c6c8ca;
 }
 /* Alert */
+
+/* Anchor */
+.vnote-anchor {
+    font-weight: 400;
+    color: rgba(0,123,255,.5);
+    transition: color .16s linear;
+    padding-left: 0.375em;
+    -webkit-font-smoothing: antialiased;
+    text-decoration: none;
+    opacity: 0;
+}
+
+.vnote-anchor:hover {
+    color: rgba(0,123,255,1);
+    text-decoration: none;
+    opacity: 1;
+}
+
+.vnote-anchor::after {
+    content: attr(data-anchor-icon);
+}
+/* Anchor */

src/resources/export/outline.js

@@ -46,6 +46,19 @@ window.addEventListener('load', function() {
     var outlineContent = document.getElementById('outline-content');
     var postContent = document.getElementById('post-content');
 
+    // Escape @text to Html.
+    var escapeHtml = function(text) {
+        var map = {
+            '&': '&',
+            '<': '&lt;',
+            '>': '&gt;',
+            '"': '&quot;',
+            "'": '&#039;'
+        };
+
+        return text.replace(/[&<>"']/g, function(m) { return map[m]; });
+    }
+
     // Fetch the outline.
     var headers = postContent.querySelectorAll("h1, h2, h3, h4, h5, h6");
     toc = [];
@@ -55,7 +68,7 @@ window.addEventListener('load', function() {
         toc.push({
             level: parseInt(header.tagName.substr(1)),
             anchor: header.id,
-            title: header.textContent
+            title: escapeHtml(header.textContent)
         });
     }
 

src/resources/markdown-it.js

@@ -60,6 +60,7 @@ mdit = mdit.use(window.markdownitHeadingAnchor, {
     anchorClass: 'vnote-anchor',
     addHeadingID: true,
     addHeadingAnchor: true,
+    anchorIcon: '#',
     slugify: function(md, s) {
         return 'toc_' + nameCounter++;
     },

src/utils/markdown-it/README.md

@@ -39,6 +39,7 @@ Vitaly Puzrin
 # [markdown-it-texmath](https://github.com/goessner/markdown-it-texmath)
 v0.0.0  
 Stefan Goessner
+Modified by Le Tan
 
 # [markdown-it-container](https://github.com/markdown-it/markdown-it-container)
 v2.0.0  

src/utils/markdown-it/markdown-it-headinganchor.js

@@ -39,14 +39,21 @@ function makeRule(md, options) {
 
       if (options.addHeadingAnchor) {
         var anchorToken = new state.Token('html_inline', '', 0);
-        anchorToken.content =
+        if (options.addHeadingID) {
-          '<a name="' +
+          // No need to add id in anchor.
-          anchorName +
+          anchorToken.content = '<a class="' + options.anchorClass + '" ' +
-          '" class="' +
+                                'href="#' + anchorName + '" ' +
-          options.anchorClass +
+                                'data-anchor-icon="' + options.anchorIcon + '" ' +
-          '" href="#"></a>';
+                                '></a>';
+        } else {
+          anchorToken.content = '<a id="' + anchorName + '" ' +
+                                'class="' + options.anchorClass + '" ' +
+                                'href="#' + anchorName + '" ' +
+                                'data-anchor-icon="' + options.anchorIcon + '" ' +
+                                '></a>';
+        }
 
-        headingInlineToken.children.unshift(anchorToken);
+        headingInlineToken.children.push(anchorToken);
       }
 
       // Advance past the inline and heading_close tokens.
@@ -61,6 +68,7 @@ module.exports = function headinganchor_plugin(md, opts) {
     addHeadingID: true,
     addHeadingAnchor: true,
     // Added by Le Tan (github.com/tamlok)
+    anchorIcon: '#',
     slugify: slugify,
     headingHook: function(openToken, inlineToken, anchor) {}
   };

src/vfile.cpp

@@ -88,19 +88,20 @@ QUrl VFile::getBaseUrl() const
 {
     // Need to judge the path: Url, local file, resource file.
     QUrl baseUrl;
-    QString basePath = fetchBasePath();
+    // Use file path to make in page anchor work.
-    QFileInfo pathInfo(basePath);
+    QString filePath = fetchPath();
+    QFileInfo pathInfo(filePath);
     if (pathInfo.exists()) {
         if (pathInfo.isNativePath()) {
             // Local file.
-            baseUrl = QUrl::fromLocalFile(basePath + QDir::separator());
+            baseUrl = QUrl::fromLocalFile(filePath);
         } else {
             // Resource file.
-            baseUrl = QUrl("qrc" + basePath + QDir::separator());
+            baseUrl = QUrl("qrc" + filePath);
         }
     } else {
         // Url.
-        baseUrl = QUrl(basePath + QDir::separator());
+        baseUrl = QUrl(filePath);
     }
 
     return baseUrl;