bump 2.0

Author: QingWei-Li

lib/docsify.js

@@ -2447,8 +2447,8 @@ function corner (data) {
 /**
  * Render main content
  */
-function main (tpl) {
-  var aside = tpl + "<aside class=\"sidebar\"></aside>";
+function main () {
+  var aside = (toggle()) + "<aside class=\"sidebar\"></aside>";
 
   return (isMobile() ? (aside + "<main>") : ("<main>" + aside)) +
     "<section class=\"content\">\n      <article class=\"markdown-section\"></article>\n    </section>\n    </main>"
@@ -2493,7 +2493,34 @@ function helper (className, content) {
   return ("<p class=\"" + className + "\">" + (content.slice(5).trim()) + "</p>")
 }
 
-var OPTIONS$1 = {};
+function theme (color) {
+  return ("<style>:root{--theme-color: " + color + ";}</style>")
+}
+
+function replaceVar (block) {
+  block.innerHTML = block.innerHTML.replace(/var\(\s*--theme-color.*?\)/g, __docsify__.themeColor);
+}
+
+function cssVars () {
+  // variable support
+  if (window.CSS && window.CSS.supports && window.CSS.supports('(--foo: red)')) { return }
+
+  var styleBlocks = document.querySelectorAll('style:not(.inserted),link');[].forEach.call(styleBlocks, function (block) {
+    if (block.nodeName === 'STYLE') {
+      replaceVar(block);
+    } else if (block.nodeName === 'LINK') {
+      load(block.getAttribute('href'))
+        .then(function (res) {
+          var style = document.createElement('style');
+
+          style.innerHTML = res;
+          document.head.appendChild(style);
+          replaceVar(style);
+        });
+    }
+  });
+}
+
 var markdown = marked;
 var toc = [];
 var CACHE = {};
@@ -2508,11 +2535,8 @@ var renderTo = function (dom, content) {
 
 /**
  * init render
- * @param  {Object} options
  */
-function init (options) {
-  OPTIONS$1 = options;
-
+function init () {
   var renderer = new marked.Renderer();
   /**
    * render anchor tag
@@ -2522,10 +2546,7 @@ function init (options) {
     var slug = slugify(text);
     var route = '';
 
-    if (OPTIONS$1.router) {
-      route = "#/" + (getRoute());
-    }
-
+    route = "#/" + (getRoute());
     toc.push({ level: level, slug: (route + "#" + (encodeURIComponent(slug))), title: text });
 
     return ("<h" + level + " id=\"" + slug + "\"><a href=\"" + route + "#" + slug + "\" data-id=\"" + slug + "\" class=\"anchor\"><span>" + text + "</span></a></h" + level + ">")
@@ -2539,7 +2560,7 @@ function init (options) {
     return ("<pre v-pre data-lang=\"" + lang + "\"><code class=\"lang-" + lang + "\">" + (hl.replace(/:/g, '__colon__')) + "</code></pre>")
   };
   renderer.link = function (href, title, text) {
-    if (OPTIONS$1.router && !/:/.test(href)) {
+    if (!/:/.test(href)) {
       href = ("#/" + href).replace(/\/\//g, '/');
     }
 
@@ -2554,11 +2575,11 @@ function init (options) {
     return ("<p>" + text + "</p>")
   };
 
-  if (typeof OPTIONS$1.markdown === 'function') {
+  if (typeof __docsify__.markdown === 'function') {
     markdown.setOptions({ renderer: renderer });
-    markdown = OPTIONS$1.markdown.call(this, markdown);
+    markdown = __docsify__.markdown.call(this, markdown);
   } else {
-    markdown.setOptions(merge({ renderer: renderer }, OPTIONS$1.markdown));
+    markdown.setOptions(merge({ renderer: renderer }, __docsify__.markdown));
   }
 
   var md = markdown;
@@ -2572,17 +2593,23 @@ function init (options) {
 function renderApp (dom, replace) {
   var nav = document.querySelector('nav') || document.createElement('nav');
 
-  if (!OPTIONS$1.repo) { nav.classList.add('no-badge'); }
+  if (!__docsify__.repo) { nav.classList.add('no-badge'); }
 
-  dom[replace ? 'outerHTML' : 'innerHTML'] = corner(OPTIONS$1.repo) +
-    (OPTIONS$1.coverpage ? cover() : '') +
-    main(OPTIONS$1.sidebarToggle ? toggle() : '');
+  dom[replace ? 'outerHTML' : 'innerHTML'] = corner(__docsify__.repo) +
+    (__docsify__.coverpage ? cover() : '') +
+    main();
   document.body.insertBefore(nav, document.body.children[0]);
 
+  // theme color
+  if (__docsify__.themeColor) {
+    document.head.innerHTML += theme(__docsify__.themeColor);
+    cssVars();
+  }
+
   // bind toggle
   bindToggle('button.sidebar-toggle');
   // bind sticky effect
-  if (OPTIONS$1.coverpage) {
+  if (__docsify__.coverpage) {
     !isMobile() && window.addEventListener('scroll', sticky);
   } else {
     document.body.classList.add('sticky');
@@ -2594,7 +2621,7 @@ function renderApp (dom, replace) {
  */
 function renderArticle (content) {
   renderTo('article', content ? markdown(content) : 'not found');
-  if (!OPTIONS$1.sidebar && !OPTIONS$1.loadSidebar) { renderSidebar(); }
+  if (!__docsify__.loadSidebar) { renderSidebar(); }
 
   if (content && typeof Vue !== 'undefined') {
     CACHE.vm && CACHE.vm.$destroy();
@@ -2611,7 +2638,7 @@ function renderArticle (content) {
       : new Vue({ el: 'main' }); // eslint-disable-line
     CACHE.vm && CACHE.vm.$nextTick(function (_) { return scrollActiveSidebar(); });
   }
-  if (OPTIONS$1.auto2top) { setTimeout(function () { return scroll2Top(OPTIONS$1.auto2top); }, 0); }
+  if (__docsify__.auto2top) { setTimeout(function () { return scroll2Top(__docsify__.auto2top); }, 0); }
 }
 
 /**
@@ -2635,13 +2662,11 @@ function renderSidebar (content) {
     html = markdown(content);
     // find url tag
     html = html.match(/<ul[^>]*>([\s\S]+)<\/ul>/g)[0];
-  } else if (OPTIONS$1.sidebar) {
-    html = tree(OPTIONS$1.sidebar, '<ul>');
   } else {
-    html = tree(genTree(toc, OPTIONS$1.maxLevel), '<ul>');
+    html = tree(genTree(toc, __docsify__.maxLevel), '<ul>');
   }
 
-  html = (OPTIONS$1.name ? ("<h1><a href=\"" + (OPTIONS$1.nameLink) + "\">" + (OPTIONS$1.name) + "</a></h1>") : '') + html;
+  html = (__docsify__.name ? ("<h1><a href=\"" + (__docsify__.nameLink) + "\">" + (__docsify__.name) + "</a></h1>") : '') + html;
   renderTo('aside.sidebar', html);
   var target = activeLink('aside.sidebar', true);
   if (target) { renderSubSidebar(target); }
@@ -2651,8 +2676,8 @@ function renderSidebar (content) {
 }
 
 function renderSubSidebar (target) {
-  if (!OPTIONS$1.subMaxLevel) { return }
-  target.parentNode.innerHTML += tree(genTree(toc, OPTIONS$1.subMaxLevel), '<ul>');
+  if (!__docsify__.subMaxLevel) { return }
+  target.parentNode.innerHTML += tree(genTree(toc, __docsify__.subMaxLevel), '<ul>');
 }
 
 /**
@@ -2735,16 +2760,14 @@ var OPTIONS = merge({
   repo: '',
   maxLevel: 6,
   subMaxLevel: 0,
-  sidebar: '',
-  sidebarToggle: false,
   loadSidebar: null,
   loadNavbar: null,
-  router: false,
   homepage: 'README.md',
   coverpage: '',
   basePath: '',
   auto2top: false,
   name: '',
+  themeColor: '',
   nameLink: window.location.pathname
 }, window.$docsify);
 var script = document.currentScript || [].slice.call(document.getElementsByTagName('script')).pop();
@@ -2760,9 +2783,11 @@ if (script) {
   if (OPTIONS.coverpage === true) { OPTIONS.coverpage = '_coverpage.md'; }
   if (OPTIONS.repo === true) { OPTIONS.repo = ''; }
   if (OPTIONS.name === true) { OPTIONS.name = ''; }
-  if (OPTIONS.sidebar) { OPTIONS.sidebar = window[OPTIONS.sidebar]; }
 }
 
+// utils
+window.__docsify__ = OPTIONS;
+
 // load options
 init(OPTIONS);
 
@@ -2833,10 +2858,8 @@ var Docsify = function () {
   // Render app
   renderApp(dom, replace);
   main();
-  if (OPTIONS.router) {
-    if (!/^#\//.test(window.location.hash)) { window.location.hash = '#/'; }
-    window.addEventListener('hashchange', main);
-  }
+  if (!/^#\//.test(window.location.hash)) { window.location.hash = '#/'; }
+  window.addEventListener('hashchange', main);
 };
 
 var index = Docsify();