-> v1.1.7

bump 1.1.7
Optimize progress bar
2026-08-09 13:26:34 +10:00 · 2016-12-19 21:53:42 +08:00 · 2016-12-19 21:53:25 +08:00 · 2016-12-19 21:52:33 +08:00 · 2016-12-19 20:38:35 +08:00 · 2016-12-18 19:43:58 +08:00
20 changed files with 215 additions and 77 deletions
@@ -1,3 +1,40 @@
+## 1.1.7
+### Bug fixes
+- Optimize progress bar
+
+## 1.1.6
+### Features
+- Add logo 😂
+
+### Bug fixes
+- Remove table background color
+- Fixed highlight sidebar using chinese ids
+
+## 1.1.5
+### Features
+- Add table style
+
+### Bug fixes
+- Not fixed position of hte navbar in the mobile browser
+- Correct calculation of whether the mobile browser
+
+## 1.1.4
+### Bug fixes
+- Fixed chinese auchor link
+
+## 1.1.3
+### Bug fixes
+- Optimize progress bar again
+
+## 1.1.2
+### Bug fixes
+- fix failed `auto2top` in mobile
+
+
+## 1.1.1
+### Bug fixes
+- Optimize progress bar
+
 ## 1.1.0
 ## Features
 - Add progress bar
@@ -1,15 +1,25 @@
-# docsify
-[![Build Status](https://travis-ci.org/QingWei-Li/docsify.svg?branch=master)](https://travis-ci.org/QingWei-Li/docsify)
-[![npm](https://img.shields.io/npm/v/docsify.svg)](https://www.npmjs.com/package/docsify)
+<p align="center">
+  <a href="https://docsify.js.org">
+    <img alt="docsify" src="./media/docsify.png">
+  </a>
+</p>

->🃏 A magical documentation site generator.
+<p align="center">
+  A magical documentation site generator.
+</p>
+
+<p align="center">
+  <a href="https://travis-ci.org/QingWei-Li/docsify"><img alt="Travis Status" src="https://img.shields.io/travis/rust-lang/rust/master.svg?style=flat-square"></a>
+  <a href="https://www.npmjs.com/package/docsify"><img alt="npm" src="https://img.shields.io/npm/v/docsify.svg?style=flat-square"></a>
+  <a href="https://beerpay.io/QingWei-Li/docsify"><img alt="npm" src="https://beerpay.io/QingWei-Li/docsify/badge.svg?style=beer-square"></a>
+</p>

 ## Links
 - [Documentation](https://docsify.js.org)
 - [CLI](https://github.com/QingWei-Li/docsify-cli)

 ## Features
- Easy and lightweight
+- Easy and lightweight (~12kb gzipped)
 - Custom themes
 - No build

@@ -25,7 +35,9 @@ Create a `404.html` and `README.md` into `/docs`.
  <meta charset="UTF-8">
  <link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css">
 </head>
-<body></body>
+<body>
+  <div id="app"></div>
+</body>
 <script src="//unpkg.com/docsify"></script>
 </html>
 ```
@@ -41,7 +53,9 @@ index.html
  <meta charset="UTF-8">
  <link rel="stylesheet" href="//unpkg.com/docsify/themes/vue.css">
 </head>
-<body></body>
+<body>
+  <div id="app"></div>
+</body>
 <script src="//unpkg.com/docsify" data-router></script>
 </html>
 ```
@@ -61,7 +75,3 @@ These open-source projects are using docsify to generate their sites. Pull reque
 ## License
 MIT

-## Support on Beerpay
-Hey dude! Help me out for a couple of :beers:!
-
-[![Beerpay](https://beerpay.io/QingWei-Li/docsify/badge.svg?style=beer-square)](https://beerpay.io/QingWei-Li/docsify)  [![Beerpay](https://beerpay.io/QingWei-Li/docsify/make-wish.svg?style=flat-square)](https://beerpay.io/QingWei-Li/docsify?focus=wish)
@@ -1,9 +1,13 @@
-# docsify
+<p align="center">
+  <img alt="docsify" src="https://cloud.githubusercontent.com/assets/7565692/21292094/5c206de4-c533-11e6-9493-29ea67b01dde.png">
+</p>

-> A magical documentation site generator.
+<p align="center">
+  A magical documentation site generator.
+</p>

 ## Features
- Easy and lightweight
+- Easy and lightweight (~12kb gzipped)
 - Custom themes
 - No build

@@ -213,7 +217,7 @@ If you write a sub level list, it will generate a dropdown list.
  - [chinese](/zh-cn)
 ```

-### router
+#### router

 Hash router. You can replace `404.html` with `index.html`.

@@ -221,7 +225,7 @@ Hash router. You can replace `404.html` with `index.html`.
 <script src="/lib/docsify.js" data-router></script>
 ```

-### auto2top
+#### auto2top

 Scroll to the top on changing hash.

@@ -3,6 +3,7 @@
 <head>
  <meta charset="UTF-8">
  <title>docsify - A magical documentation site generator.</title>
+  <link rel="icon" href="favicon.ico">
  <meta name="description" content="A magical documentation generator.">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css">
@@ -1,11 +1,15 @@
-# docsify
+<p align="center">
+  <img alt="docsify" src="https://cloud.githubusercontent.com/assets/7565692/21292094/5c206de4-c533-11e6-9493-29ea67b01dde.png">
+</p>

-> 无需构建快速生成文档页
+<p align="center">
+  无需构建快速生成文档页
+</p>

 ## 特性
 - 无需构建，写完 markdown 直接发布
 - 支持自定义主题
- 容易使用并且轻量
+- 容易使用并且轻量 (~12kb gzipped)

 ## 快速上手

@@ -214,7 +218,7 @@ Sidebar 开关按钮
 ```


-### router
+#### router

 开启 hash router 功能，此时可以创建 `index.html` 作为入口文件，同时多页面切换不会重新加载资源。资源路径会被替换成 `/#/` 的形式。

@@ -222,7 +226,7 @@ Sidebar 开关按钮
 <script src="/lib/docsify.js" data-router></script>
 ```

-### auto2top
+#### auto2top

 切换路由时自动跳转到页面顶部

@@ -21,8 +21,13 @@ function load (url, method, loading) {
      if ( error === void 0 ) error = function () {};

      if (loading) {
+        var id = setInterval(function (_) { return loading({ step: Math.floor(Math.random() * 5 + 1) }); },
+        500);
        xhr.addEventListener('progress', loading);
-        xhr.addEventListener('loaded', loading);
+        xhr.addEventListener('loadend', function (evt) {
+          loading(evt);
+          clearInterval(id);
+        });
      }
      xhr.addEventListener('error', error);
      xhr.addEventListener('load', function (ref) {
@@ -105,12 +110,16 @@ function getRoute () {
  return route
 }

+function isMobile () {
+  return document.body.clientWidth <= 600
+}
+
 /**
 * Active sidebar when scroll
 * @link https://buble.surge.sh/
 */
 function scrollActiveSidebar () {
-  if (/mobile/i.test(navigator.userAgent)) { return }
+  if (isMobile()) { return }

  var anchors = document.querySelectorAll('.anchor');
  var nav = {};
@@ -123,7 +132,7 @@ function scrollActiveSidebar () {

    if (href !== '/') { href = href.match(/#([^#]+)$/g)[0].slice(1); }

-    nav[href] = li;
+    nav[decodeURIComponent(href)] = li;
  }

  function highlight () {
@@ -154,7 +163,7 @@ function scrollActiveSidebar () {
 function scrollIntoView () {
  var id = window.location.hash.match(/#[^#\/]+$/g);
  if (!id || !id.length) { return }
-  var section = document.querySelector(id[0]);
+  var section = document.querySelector(decodeURIComponent(id[0]));

  if (section) { section.scrollIntoView(); }
 }
@@ -198,8 +207,11 @@ function bindToggle (dom) {
 }

 var cacheContentDOM;
-function scroll2Top (dom) {
-  cacheContentDOM = cacheContentDOM || document.querySelector(dom);
+function scroll2Top () {
+  if (!cacheContentDOM) {
+    var dom = isMobile() ? 'body' : 'section.content';
+    cacheContentDOM = document.querySelector(dom);
+  }
  cacheContentDOM.scrollTop = 0;
 }

@@ -2361,14 +2373,16 @@ var renderer = new marked.Renderer();
 * @link https://github.com/chjj/marked#overriding-renderer-methods
 */
 renderer.heading = function (text, level) {
-  var slug = text.toLowerCase().replace(/<(?:.|\n)*?>/gm, '').replace(/[^\w|\u4e00-\u9fa5]+/g, '-');
+  var slug = text.toLowerCase()
+      .replace(/<(?:.|\n)*?>/gm, '')
+      .replace(/[^\w|\u4e00-\u9fa5]+/g, '-');
  var route = '';

  if (OPTIONS$1.router) {
    route = "#/" + (getRoute());
  }

-  toc.push({ level: level, slug: (route + "#" + slug), title: text });
+  toc.push({ level: level, slug: (route + "#" + (encodeURIComponent(slug))), title: text });

  return ("<h" + level + " id=\"" + slug + "\"><a href=\"" + route + "#" + slug + "\" class=\"anchor\"></a>" + text + "</h" + level + ">")
 };
@@ -2412,15 +2426,15 @@ function renderArticle (content) {
  renderSidebar.rendered = false;
  renderNavbar.rendered = false;

-  if (OPTIONS$1.auto2top) { scroll2Top('section.content'); }
+  if (OPTIONS$1.auto2top) { scroll2Top(); }
 }

 /**
 * navbar
 */
 function renderNavbar (content) {
-  if (CACHE['navbar'] && CACHE['navbar'] === content) { return }
-  CACHE['navbar'] = content;
+  if (CACHE.navbar && CACHE.navbar === content) { return }
+  CACHE.navbar = content;
  renderNavbar.rendered = true;

  if (content) { renderTo('nav', marked(content)); }
@@ -2443,8 +2457,8 @@ function renderSidebar (content) {
  }

  renderSidebar.rendered = true;
-  if (CACHE['sidebar'] && CACHE['sidebar'] === content) { return }
-  CACHE['sidebar'] = content;
+  if (CACHE.sidebar && CACHE.sidebar === content) { return }
+  CACHE.sidebar = content;
  renderTo('aside.sidebar', content);
  if (isToc) { scrollActiveSidebar(); }
  toc = [];
@@ -2457,17 +2471,34 @@ function renderSidebar (content) {
 function renderLoading (ref) {
  var loaded = ref.loaded;
  var total = ref.total;
+  var step = ref.step;

-  var num = Math.floor(loaded / total * 100);
+  var num;

-  if (!CACHE['loading']) {
+  if (!CACHE.loading) {
    var div = document.createElement('div');

    div.classList.add('progress');
    document.body.appendChild(div);
-    CACHE['loading'] = div;
+    CACHE.loading = div;
+  }
+  if (step) {
+    num = parseInt(CACHE.loading.style.width, 10) + step;
+    num = num > 80 ? 80 : num;
+  } else {
+    num = Math.floor(loaded / total * 100);
+  }
+
+  CACHE.loading.style.opacity = 1;
+  CACHE.loading.style.width = num >= 95 ? '100%' : num + '%';
+
+  if (num >= 95) {
+    clearTimeout(renderLoading.cacheTimeout);
+    renderLoading.cacheTimeout = setTimeout(function (_) {
+      CACHE.loading.style.opacity = 0;
+      CACHE.loading.style.width = '0%';
+    }, 200);
  }
-  CACHE['loading'].style.width = num >= 95 ? '0%' : num + '%';
 }

 /**
@@ -1,6 +1,6 @@
 {
  "name": "docsify",
-  "version": "1.1.0",
+  "version": "1.1.7",
  "description": "A magical documentation generator.",
  "main": "lib/docsify.js",
  "files": [
@@ -1,10 +1,11 @@
+import { isMobile } from './util'

 /**
 * Active sidebar when scroll
 * @link https://buble.surge.sh/
 */
 export function scrollActiveSidebar () {
-  if (/mobile/i.test(navigator.userAgent)) return
+  if (isMobile()) return

  const anchors = document.querySelectorAll('.anchor')
  const nav = {}
@@ -17,7 +18,7 @@ export function scrollActiveSidebar () {

    if (href !== '/') href = href.match(/#([^#]+)$/g)[0].slice(1)

-    nav[href] = li
+    nav[decodeURIComponent(href)] = li
  }

  function highlight () {
@@ -48,7 +49,7 @@ export function scrollActiveSidebar () {
 export function scrollIntoView () {
  const id = window.location.hash.match(/#[^#\/]+$/g)
  if (!id || !id.length) return
-  const section = document.querySelector(id[0])
+  const section = document.querySelector(decodeURIComponent(id[0]))

  if (section) section.scrollIntoView()
 }
@@ -92,7 +93,10 @@ export function bindToggle (dom) {
 }

 let cacheContentDOM
-export function scroll2Top (dom) {
-  cacheContentDOM = cacheContentDOM || document.querySelector(dom)
+export function scroll2Top () {
+  if (!cacheContentDOM) {
+    const dom = isMobile() ? 'body' : 'section.content'
+    cacheContentDOM = document.querySelector(dom)
+  }
  cacheContentDOM.scrollTop = 0
 }
@@ -21,14 +21,16 @@ const renderer = new marked.Renderer()
 * @link https://github.com/chjj/marked#overriding-renderer-methods
 */
 renderer.heading = function (text, level) {
-  const slug = text.toLowerCase().replace(/<(?:.|\n)*?>/gm, '').replace(/[^\w|\u4e00-\u9fa5]+/g, '-')
+  const slug = text.toLowerCase()
+      .replace(/<(?:.|\n)*?>/gm, '')
+      .replace(/[^\w|\u4e00-\u9fa5]+/g, '-')
  let route = ''

  if (OPTIONS.router) {
    route = `#/${getRoute()}`
  }

-  toc.push({ level, slug: `${route}#${slug}`, title: text })
+  toc.push({ level, slug: `${route}#${encodeURIComponent(slug)}`, title: text })

  return `<h${level} id="${slug}"><a href="${route}#${slug}" class="anchor"></a>${text}</h${level}>`
 }
@@ -70,15 +72,15 @@ export function renderArticle (content) {
  renderSidebar.rendered = false
  renderNavbar.rendered = false

-  if (OPTIONS.auto2top) scroll2Top('section.content')
+  if (OPTIONS.auto2top) scroll2Top()
 }

 /**
 * navbar
 */
 export function renderNavbar (content) {
-  if (CACHE['navbar'] && CACHE['navbar'] === content) return
-  CACHE['navbar'] = content
+  if (CACHE.navbar && CACHE.navbar === content) return
+  CACHE.navbar = content
  renderNavbar.rendered = true

  if (content) renderTo('nav', marked(content))
@@ -101,8 +103,8 @@ export function renderSidebar (content) {
  }

  renderSidebar.rendered = true
-  if (CACHE['sidebar'] && CACHE['sidebar'] === content) return
-  CACHE['sidebar'] = content
+  if (CACHE.sidebar && CACHE.sidebar === content) return
+  CACHE.sidebar = content
  renderTo('aside.sidebar', content)
  if (isToc) scrollActiveSidebar()
  toc = []
@@ -112,17 +114,33 @@ export function renderSidebar (content) {
 * render loading bar
 * @return {[type]} [description]
 */
-export function renderLoading ({ loaded, total }) {
-  const num = Math.floor(loaded / total * 100)
+export function renderLoading ({ loaded, total, step }) {
+  let num

-  if (!CACHE['loading']) {
+  if (!CACHE.loading) {
    const div = document.createElement('div')

    div.classList.add('progress')
    document.body.appendChild(div)
-    CACHE['loading'] = div
+    CACHE.loading = div
+  }
+  if (step) {
+    num = parseInt(CACHE.loading.style.width, 10) + step
+    num = num > 80 ? 80 : num
+  } else {
+    num = Math.floor(loaded / total * 100)
+  }
+
+  CACHE.loading.style.opacity = 1
+  CACHE.loading.style.width = num >= 95 ? '100%' : num + '%'
+
+  if (num >= 95) {
+    clearTimeout(renderLoading.cacheTimeout)
+    renderLoading.cacheTimeout = setTimeout(_ => {
+      CACHE.loading.style.opacity = 0
+      CACHE.loading.style.width = '0%'
+    }, 200)
  }
-  CACHE['loading'].style.width = num >= 95 ? '0%' : num + '%'
 }

 /**
@@ -235,6 +235,33 @@ main {
  }
 }

+.markdown-section table {
+  display: block;
+  width: 100%;
+  overflow: auto;
+  border-spacing: 0;
+  border-collapse: collapse;
+  margin-bottom: 1em;
+}
+
+.markdown-section th {
+  font-weight: bold;
+  padding: 6px 13px;
+  border: 1px solid #ddd;
+}
+
+.markdown-section td {
+  padding: 6px 13px;
+  border: 1px solid #ddd;
+}
+
+.markdown-section tr {
+  border-top: 1px solid #ccc;
+  &:nth-child(2n) {
+    background-color: #f8f8f8;
+  }
+}
+
 body.close {
  .sidebar {
    transform: translateX(-$sidebar-width);
@@ -246,11 +273,12 @@ body.close {
 }

@media (max-width: 600px) {
-  nav, .github-corner, .sidebar-toggle, .sidebar {
+  .github-corner, .sidebar-toggle, .sidebar {
    position: fixed;
  }

  nav {
+    position: static;
    margin-top: 16px;
  }

@@ -54,6 +54,8 @@ body {
 .markdown-section ul,
 .markdown-section ol {
  word-spacing: 0.05em;
+  line-height: 1.6em;
+  margin: 0 0 1em 0;
 }

 .markdown-section h1 {
@@ -95,13 +97,6 @@ body {
  margin: 1.2em 0;
 }

-.markdown-section p,
-.markdown-section ul,
-.markdown-section ol {
-  margin: 0 0 1em 0;
-  line-height: 1.5;
-}
-
 .markdown-section ul,
 .markdown-section ol {
  padding-left: 1.5em;
@@ -55,12 +55,6 @@ body {
  font-weight: 600;
 }

-.markdown-section p,
-.markdown-section ul,
-.markdown-section ol {
-  word-spacing: 0.05em;
-}
-
 .markdown-section h1 {
  margin: 0 0 1em;
  font-size: 2em;
@@ -100,6 +94,7 @@ body {
 .markdown-section ul,
 .markdown-section ol {
  line-height: 1.6em;
+  word-spacing: 0.05em;
 }

 .markdown-section ul,
@@ -277,7 +272,7 @@ code .token {
 pre::after {
  color: #ccc;
  content: attr(data-lang);
-  font-size: 0.75em;
+  font-size: 0.6em;
  font-weight: 600;
  height: 15px;
  line-height: 15px;
@@ -14,8 +14,14 @@ export function load (url, method = 'GET', loading) {
  return {
    then: function (success, error = function () {}) {
      if (loading) {
+        const id = setInterval(_ =>
+          loading({ step: Math.floor(Math.random() * 5 + 1) }),
+        500)
        xhr.addEventListener('progress', loading)
-        xhr.addEventListener('loaded', loading)
+        xhr.addEventListener('loadend', evt => {
+          loading(evt)
+          clearInterval(id)
+        })
      }
      xhr.addEventListener('error', error)
      xhr.addEventListener('load', ({ target }) => {
@@ -95,3 +101,8 @@ export function getRoute () {

  return route
 }
+
+export function isMobile () {
+  return document.body.clientWidth <= 600
+}
+
Author	SHA1	Message	Date
qingwei.li	f2d894932b	-> v1.1.7	2016-12-19 21:53:42 +08:00
qingwei.li	48912a0b79	bump 1.1.7	2016-12-19 21:53:25 +08:00
qingwei.li	73a193d602	Optimize progress bar	2016-12-19 21:52:33 +08:00
qingwei.li	30b6644f21	fix typo	2016-12-19 20:38:35 +08:00
qingwei.li	d343ff5b21	Update badges	2016-12-18 19:43:58 +08:00
qingwei.li	3bf932a81c	-> v1.1.6	2016-12-18 15:37:57 +08:00
qingwei.li	c8bb66955d	bump 1.1.6	2016-12-18 15:37:47 +08:00
qingwei.li	e5e1e07e1a	Fixed highlight sidebar using chinese ids	2016-12-18 15:37:24 +08:00
cinwell.liandGitHub	9ba989c86c	Add logo (#28 ) * Fix table style * Add logo * Update index.html * Update doc	2016-12-18 15:30:50 +08:00
qingwei.li	ab34cc97f9	-> v1.1.5	2016-12-18 10:50:37 +08:00
qingwei.li	3fbcd876ae	bump 1.1.5	2016-12-18 10:50:02 +08:00
qingwei.li	3af5ca5cd4	Correct calculation of whether the mobile browser	2016-12-18 10:49:21 +08:00
qingwei.li	74ee0cf6bc	Add table style	2016-12-18 10:37:34 +08:00
qingwei.li	46dd542b48	-> v1.1.4	2016-12-17 16:08:45 +08:00
qingwei.li	cc7bdf5df2	bump 1.1.4	2016-12-17 15:56:55 +08:00
qingwei.li	9a1db6ed43	Fix chinese auchor link	2016-12-17 15:56:01 +08:00
qingwei.li	9d30ac7435	-> v1.1.3	2016-12-17 15:38:59 +08:00
qingwei.li	f8a68b87c7	bump 1.1.3	2016-12-17 15:38:00 +08:00
qingwei.li	7dc47cc4d4	Optimize progress bar again	2016-12-17 15:37:32 +08:00
qingwei.li	7d995d8362	Update readme	2016-12-17 15:25:03 +08:00
qingwei.li	1fdfaf0b6b	-> v1.1.2	2016-12-17 15:18:04 +08:00
qingwei.li	fe33e2d506	bump 1.1.2	2016-12-17 15:17:20 +08:00
qingwei.li	6463dd3bae	Optimize progress bar again	2016-12-17 15:14:52 +08:00
qingwei.li	299c31dff9	Fix auto2top in mobile	2016-12-17 15:08:44 +08:00
qingwei.li	aa1d84b513	1.1.1	2016-12-17 09:07:15 +08:00
qingwei.li	14a4c2f77d	bump 1.1.1	2016-12-17 09:01:41 +08:00
qingwei.li	e58c17fdc6	Optimize progress bar	2016-12-17 09:01:21 +08:00