-> v1.1.7

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 1.1.7
+### Bug fixes
+- Optimize progress bar
+
 ## 1.1.6
 ### Features
 - Add logo 😂

README.md

@@ -9,8 +9,8 @@
 </p>
 
 <p align="center">
-  <a href="https://travis-ci.org/QingWei-Li/docsify"><img alt="Travis Status" src="https://travis-ci.org/QingWei-Li/docsify.svg?branch=master"></a>
-  <a href="https://www.npmjs.com/package/docsify"><img alt="npm" src="https://img.shields.io/npm/v/docsify.svg"></a>
+  <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>
 
@@ -19,7 +19,7 @@
 - [CLI](https://github.com/QingWei-Li/docsify-cli)
 
 ## Features
-- Easy and lightweight (~12kB gzipped)
+- Easy and lightweight (~12kb gzipped)
 - Custom themes
 - No build
 

docs/README.md

@@ -7,7 +7,7 @@
 </p>
 
 ## Features
-- Easy and lightweight (~12kB gzipped)
+- Easy and lightweight (~12kb gzipped)
 - Custom themes
 - No build
 

docs/zh-cn.md

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

lib/docsify.js

@@ -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) {
@@ -2466,8 +2471,9 @@ 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) {
     var div = document.createElement('div');
@@ -2476,13 +2482,19 @@ function renderLoading (ref) {
     document.body.appendChild(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 (_) {
+    clearTimeout(renderLoading.cacheTimeout);
+    renderLoading.cacheTimeout = setTimeout(function (_) {
       CACHE.loading.style.opacity = 0;
       CACHE.loading.style.width = '0%';
     }, 200);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docsify",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "description": "A magical documentation generator.",
   "main": "lib/docsify.js",
   "files": [

src/render.js

@@ -114,8 +114,8 @@ 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) {
     const div = document.createElement('div')
@@ -124,13 +124,19 @@ export function renderLoading ({ loaded, total }) {
     document.body.appendChild(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(_ => {
+    clearTimeout(renderLoading.cacheTimeout)
+    renderLoading.cacheTimeout = setTimeout(_ => {
       CACHE.loading.style.opacity = 0
       CACHE.loading.style.width = '0%'
     }, 200)

src/util.js

@@ -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 }) => {