Merge pull request #131 from akinomyoga/relative_link

内部リンクを相対リンクで生成する機能 (cpprefjp/site_generator#81)

css/kunai/site/navbar.css

@@ -48,7 +48,7 @@ nav[role="navigation"] {
         height: 0;
         padding: 32px 32px 0 0;
         margin: 0 4px 0 0;
-        background-image: url(https://cpprefjp.github.io/static/original-icons/cpprefjp-icon-v2.0-transparent.png);
+        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='26.000004mm' height='26.000004mm' viewBox='0 0 26.000004 26.000004' version='1.1' id='svg1' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cdefs id='defs1'%3E%3CclipPath clipPathUnits='userSpaceOnUse' id='clipPath12'%3E%3Crect style='fill:%232ca9e1;stroke:none;stroke-width:0.45729;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0' id='rect13' width='26' height='26' x='92.05806' y='113.9539' /%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='layer1' transform='translate(-92.058062,-113.95391)'%3E%3Cg id='g12' clip-path='url(%23clipPath12)'%3E%3Cpath id='path2-6' style='fill:none;stroke:%2300a3af;stroke-width:1.05833;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none' d='m 92.803909,132.76018 -9.95492,5.62988 -9.85309,-5.80628 0.10185,-11.43616 9.95493,-5.62987 9.85308,5.80627 z' /%3E%3Cpath id='path2-2' style='fill:none;stroke:%2300a3af;stroke-width:1.05833;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none' d='m 137.01837,132.76018 -9.95492,5.62988 -9.85309,-5.80628 0.10185,-11.43616 9.95493,-5.62988 9.85308,5.80628 z' /%3E%3Cpath id='path2-9' style='fill:none;stroke:%2300a3af;stroke-width:2.11666;stroke-linecap:round;stroke-linejoin:round' d='m 112.76826,132.84545 -7.86126,4.70835 -9.038106,-5.38578 0.09342,-10.60799 9.131526,-5.22216 7.51379,4.6151' /%3E%3Cpath style='fill:%232ca9e1;stroke:none;stroke-width:0.945904;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0' id='path3-6' d='m 68.619675,152.01895 -1.306347,-4.85182 -4.851829,-1.30635 4.851829,-1.30635 1.306347,-4.85183 1.306346,4.85183 4.851829,1.30635 -4.851829,1.30635 z' transform='matrix(0.8119288,0,0,0.82328669,47.479406,6.8605971)' /%3E%3Cpath style='fill:%232ca9e1;stroke:none;stroke-width:0.945904;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0' id='path3-6-1' d='m 68.619675,152.01895 -1.306347,-4.85182 -4.851829,-1.30635 4.851829,-1.30635 1.306347,-4.85183 1.306346,4.85183 4.851829,1.30635 -4.851829,1.30635 z' transform='matrix(0.8119288,0,0,0.82328669,55.018249,6.8605971)' /%3E%3Cg id='g5' transform='translate(0.20305)'%3E%3Cpath id='path2-6-4' style='fill:none;stroke:%2300a3af;stroke-width:1.05833;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none' d='m 103.65447,152.06483 -9.954911,5.62988 -9.85309,-5.80628 0.10185,-11.43616 9.95493,-5.62987 9.853071,5.80627 z' /%3E%3Cpath id='path2-5' style='fill:none;stroke:%2300a3af;stroke-width:1.05833;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none' d='m 125.7617,152.06483 -9.95492,5.62988 -9.85308,-5.80628 0.10184,-11.43616 9.95493,-5.62988 9.85308,5.80628 z' /%3E%3C/g%3E%3Cg id='g6' transform='translate(0.0998685)'%3E%3Cpath id='path2-6-4-9' style='fill:none;stroke:%2300a3af;stroke-width:1.05833;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none' d='m 103.75765,113.45553 -9.954908,5.62988 -9.85309,-5.80628 0.10185,-11.43616 9.95493,-5.629874 9.853068,5.806274 z' /%3E%3Cpath id='path2-5-1' style='fill:none;stroke:%2300a3af;stroke-width:1.05833;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none' d='m 125.86488,113.45553 -9.95492,5.62988 -9.85308,-5.80628 0.10184,-11.43616 9.95493,-5.629884 9.85308,5.806284 z' /%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
         background-size: contain;
         background-repeat: no-repeat;
       }

js/kunai.js

@@ -107,6 +107,7 @@ class Kunai {
 
   async onDatabase(db) {
     // this.log.debug(`onDatabase`, db)
+    UI.Badge.onDatabase(db)
     await this.ui.sidebar.onDatabase(db)
     await this.ui.sidebar.treeview.onPageID(this.meta.page_id)
   }
@@ -116,10 +117,73 @@ class Kunai {
 
     await this.initSidebar()
 
+    // Dynamically set the base_url
+    const dynamic_base_url = (() => {
+      // Determine the location of the website base
+      const current_script = document.currentScript || document.querySelector('script[src*="static/kunai/js/kunai.js"]')
+      if (current_script) {
+        // Try to determine the base_url based on the location of this script
+        // ({base_url}/static/kunai/js/kunai.js).
+        const url_kunai = current_script.getAttribute("src")
+        const url = url_kunai.replace(/\bstatic\/kunai\/js\/kunai\.js([?#].*)?$/, "")
+        if (url != url_kunai) return url == "" ? "/" : url
+      }
+      // Fallback case assuming that the website is hosted at the top level
+      return "/"
+    })()
+
+    // Determine the project website URL, which is assumed to be stored in
+    // <meta name="twietter:url" content="..." /> or in <meta property="og:url"
+    // content="..." />.
+    const online_base_url = (() => {
+      const meta = document.querySelector('meta[name="twitter:url"]') || document.querySelector('meta[property="og:url"]')
+      if (meta && meta.content) {
+        const m = meta.content.toString().match(/^https?:\/\/[^/]*\//)
+        if (m) return m[0]
+      }
+      return null
+    })()
+
+    const database_url = (() => {
+      // Determine the location of the database file "crsearch.json".
+      const current_script = document.currentScript || document.querySelector('script[src*="kunai/js/kunai.js"]')
+      if (current_script) {
+        // A special care is needed for local HTML files (file://...).  When a
+        // HTML in a local file system is directly opened in a Web browser,
+        // "static/crsearch/crsearch.json" cannot be read using XHR due to the
+        // CORS (cross-origin resource sharing) policy for the local files.
+        if (/^file:\/\//.test(current_script.src)) {
+          const url_kunai = current_script.getAttribute("src")
+
+          // When the current script file (kunai.js) is located in an expected
+          // path in the tree, we try to load the local database file
+          // "crsearch/crsearch.js" in JSONP format.
+          const url = url_kunai.replace(/\bkunai\/js\/kunai\.js([?#].*)?$/, "crsearch/crsearch.js")
+          if (url != url_kunai) return url
+
+          // Try to download "crsearch.json" from the project website.
+          if (online_base_url)
+            return online_base_url + "static/crsearch/crsearch.json"
+        }
+
+        // Try to determine the position of crsearch.json
+        // ({base_url}/static/crsearch/crsearch.json) based on the location of
+        // this script ({base_url}/static/kunai/js/kunai.js).
+        const url_kunai = current_script.getAttribute("src")
+        const url = url_kunai.replace(/\bkunai\/js\/kunai\.js([?#].*)?$/, "crsearch/crsearch.json")
+        if (url != url_kunai) return url
+      }
+
+      // Fallback case assuming that the website is hosted at the top level
+      return "/static/crsearch/crsearch.json"
+    })();
+
     let crs = new CRSearch({
       onDatabase: this.onDatabase.bind(this),
+      base_url: dynamic_base_url,
+      online_base_url: online_base_url
     })
-    crs.database('/static/crsearch/crsearch.json')
+    crs.database(database_url)
 
     let e = $('.crsearch')
     await crs.searchbox(e)

js/kunai/ui.js

@@ -1,4 +1,5 @@
 export {Content} from './ui/content'
 export {Sidebar} from './ui/sidebar'
 export {Navbar} from './ui/navbar'
-
+import * as Badge from './ui/badge'
+export {Badge}

js/kunai/ui/badge.js

@@ -1,3 +1,13 @@
+let base_url = null
+const unresolved_links = []
+
+const onDatabase = (db) => {
+  base_url = db.base_url.toString()
+  for (let a_elem of unresolved_links)
+    a_elem.attr('href', base_url.replace(/\/$/, '') + a_elem.attr('href'))
+  unresolved_links.length = 0
+}
+
 const sanitize = (badges) => {
   let i = 0
 
@@ -46,15 +56,18 @@ const sanitize = (badges) => {
     const lang_path = cppv ? `/lang/cpp${cppv}` :
                       named_version ? `/lang/${named_version}` :
                       `/lang`
+    const a_elem = $('<a>', {href: `${lang_path}.html`})
+      .append($('<i>'))
+      // .append($('<span>').text(clean_txt))
+      .appendTo(b.empty())
 
-    b.empty().append(
-      $('<a>', {href: `${lang_path}.html`})
-        .append($('<i>'))
-        // .append($('<span>').text(clean_txt))
-    )
+    if (base_url)
+      a_elem.attr('href', base_url.replace(/\/$/, '') + a_elem.attr('href'))
+    else
+      unresolved_links.push(a_elem)
   }
   return i
 }
 
-export {sanitize}
+export {onDatabase, sanitize}
 

js/kunai/ui/content.js

@@ -12,7 +12,7 @@ const _hitElementRects = (elem, x, y) => {
 class Content {
   constructor(log) {
     this.log = log.makeContext('Content')
-    this.log.debug('initialzing...')
+    this.log.debug('initializing...')
 
     this.log.debug(`found ${Badge.sanitize($('main[role="main"] div[itemtype="http://schema.org/Article"] .content-body span.cpp'))} badges`)
 

js/kunai/ui/sidebar.js

@@ -5,7 +5,7 @@ import {KC} from 'crsearch'
 class Sidebar {
   constructor(log) {
     this.log = log.makeContext('Sidebar')
-    this.log.info('initialzing...')
+    this.log.info('initializing...')
 
     this.kc = new KC.Config({
       'article.md': require('../../../kunai_configs/current/article.md').default,

js/kunai/ui/treeview.js

@@ -283,7 +283,7 @@ class Treeview {
     this.opts = Object.assign({}, opts)
     this.legacy = this.opts.legacy
 
-    this.log.debug('initialzing...')
+    this.log.debug('initializing...')
 
     if (this.legacy) {
       const c = Badge.sanitize(this.e.find('.cpp-sidebar'))