Compare commits

..
26 Commits
Author SHA1 Message Date
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
qingwei.li 8b719238e6 -> v1.1.0 2016-12-16 22:38:53 +08:00
qingwei.li 7f0b1089c0 bump 1.1.0 2016-12-16 22:38:44 +08:00
cinwell.liandGitHub 2610e25040 Add progress bar and auto2top (#27)
* Add progress bar

* Add abort ajax

* Remove console

* Add cache folder

* Add auto2top
2016-12-16 22:37:21 +08:00
cinwell.li ec53f1e307 Add Beerpay's badge 2016-12-15 19:11:15 +08:00
qingwei.li 670cc68a28 -> v1.0.3 2016-12-13 22:27:36 +08:00
qingwei.li 844ba3e022 bump 1.0.3 2016-12-13 22:27:26 +08:00
qingwei.li 9092b22246 Fix cache sidebar content 2016-12-13 22:26:56 +08:00
qingwei.li d175ba6913 -> v1.0.2 2016-12-13 22:12:18 +08:00
qingwei.li 2574778605 bump 1.0.2 2016-12-13 22:11:50 +08:00
cinwell.liandGitHub 44a255103c Fix/1.0.2 (#25)
* Fix regular expression, fixed #23

* Fix repeat binding events

* Add content cache

* Add changelog
2016-12-13 22:10:58 +08:00
qingwei.li 440635aeeb -> v1.0.1 2016-12-08 21:24:05 +08:00
qingwei.li a8cc8e46cd bump 1.0.1 2016-12-08 21:23:38 +08:00
qingwei.li 626227be4d Update changelog 2016-12-08 21:22:33 +08:00
qingwei.li c4f02027a8 Fix img style 2016-12-08 21:20:37 +08:00
qingwei.li 8f3eb17dbf Update doc 2016-12-08 21:18:01 +08:00
20 changed files with 388 additions and 157 deletions
+3
View File
@@ -1,3 +1,6 @@
sudo: false
cache:
directories:
- $HOME/.yarn-cache
language: node_js
node_js: stable
+1 -1
View File
@@ -8,5 +8,5 @@
<body class="">
<div id="app"></div>
</body>
<script src="/lib/docsify.js" data-repo="qingwei-li/docsify" data-sidebar-toggle data-router data-load-sidebar></script>
<script src="/lib/docsify.js" data-repo="qingwei-li/docsify" data-auto2top data-sidebar-toggle data-router></script>
</html>
+31
View File
@@ -1,3 +1,34 @@
## 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
- Add `auto2top` option for hash router
## 1.0.3
### Bug fixes
- Fix cache
## 1.0.2
### Bug fixes
- Fix binding events bug, fixed #24
- Fix regular expression, fixed #23
## 1.0.1
### Bug fixes
- `img` style
## 1.0.0
## Features
- Support hash router
+11 -2
View File
@@ -25,7 +25,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 +43,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>
```
@@ -60,3 +64,8 @@ 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)
+10
View File
@@ -220,3 +220,13 @@ Hash router. You can replace `404.html` with `index.html`.
```html
<script src="/lib/docsify.js" data-router></script>
```
### auto2top
Scroll to the top on changing hash.
```html
<script src="/lib/docsify.js" data-auto2top></script>
```
+2 -2
View File
@@ -9,8 +9,8 @@
</head>
<body>
<nav>
<a href="/">En</a>
<a href="/zh-cn">中文</a>
<a href="#/">En</a>
<a href="#/zh-cn">中文</a>
</nav>
<div id="app"></div>
</body>
+5 -5
View File
@@ -222,12 +222,12 @@ Sidebar 开关按钮
<script src="/lib/docsify.js" data-router></script>
```
## FAQ
### auto2top
### 为什么是 `404.html` 而不用 `index.html`
切换路由时自动跳转到页面顶部
docsify 想要实现的是用最简单的方式 **动态渲染内容**
例如我有两个文档分别为 `README.md``guide.md`,如果我用 `index.html` 作为文件名,`README.md` 可以被正确的渲染因为我们已经规定它为首页文件,但是如果我们访问 `my-domain.com/guide` 想要得到的结果是 `guide.md` 的内容,它将无法工作,因为目录下并不存在一个 `guide.html` 的文件。
```html
<script src="/lib/docsify.js" data-auto2top></script>
```
但是 GitHub Pages 服务器找不到资源, 就会回退并渲染 `404.html` 文件。😄
+193 -110
View File
@@ -4,11 +4,12 @@ var Docsify = (function () {
/**
* Simple ajax
* @param {String} url
* @param {String} [method=get]
* @param {String} [method=GET]
* @param {Function} [loading] handle loading
* @return {Promise}
*/
function load (url, method) {
if ( method === void 0 ) method = 'get';
function load (url, method, loading) {
if ( method === void 0 ) method = 'GET';
var xhr = new XMLHttpRequest();
@@ -19,13 +20,18 @@ function load (url, method) {
then: function (success, error) {
if ( error === void 0 ) error = function () {};
if (loading) {
xhr.addEventListener('progress', loading);
xhr.addEventListener('loaded', loading);
}
xhr.addEventListener('error', error);
xhr.addEventListener('load', function (ref) {
var target = ref.target;
target.status >= 400 ? error(target) : success(target.response);
});
}
},
abort: function () { return xhr.readyState !== 4 && xhr.abort(); }
}
}
@@ -99,6 +105,111 @@ function getRoute () {
return route
}
function isMobile () {
return /mobile/i.test(navigator.userAgent)
}
/**
* Active sidebar when scroll
* @link https://buble.surge.sh/
*/
function scrollActiveSidebar () {
if (isMobile()) { return }
var anchors = document.querySelectorAll('.anchor');
var nav = {};
var lis = document.querySelectorAll('.sidebar li');
var active = null;
for (var i = 0, len = lis.length; i < len; i += 1) {
var li = lis[i];
var href = li.querySelector('a').getAttribute('href');
if (href !== '/') { href = href.match(/#([^#]+)$/g)[0].slice(1); }
nav[href] = li;
}
function highlight () {
for (var i = 0, len = anchors.length; i < len; i += 1) {
var node = anchors[i].parentNode;
var bcr = node.getBoundingClientRect();
if (bcr.top < 10 && bcr.bottom > 10) {
var li = nav[node.id];
if (!li || li === active) { return }
if (active) { active.setAttribute('class', ''); }
li.setAttribute('class', 'active');
active = li;
return
}
}
}
var dom = document.querySelector('main .content');
dom.removeEventListener('scroll', highlight);
dom.addEventListener('scroll', highlight);
highlight();
}
function scrollIntoView () {
var id = window.location.hash.match(/#[^#\/]+$/g);
if (!id || !id.length) { return }
var section = document.querySelector(id[0]);
if (section) { section.scrollIntoView(); }
}
/**
* Acitve link
*/
function activeLink (dom, activeParent) {
var host = window.location.href;
dom = typeof dom === 'object' ? dom : document.querySelector(dom);
if (!dom) { return
; }[].slice.call(dom.querySelectorAll('a')).forEach(function (node) {
if (node.href === host) {
activeParent
? node.parentNode.setAttribute('class', 'active')
: node.setAttribute('class', 'active');
} else {
activeParent
? node.parentNode.removeAttribute('class')
: node.removeAttribute('class');
}
});
}
/**
* sidebar toggle
*/
function bindToggle (dom) {
dom = typeof dom === 'object' ? dom : document.querySelector(dom);
if (!dom) { return }
var body = document.body;
dom.addEventListener('click', function () { return body.classList.toggle('close'); });
if (!/mobile/i.test(navigator.userAgent)) { return }
document.querySelector('aside').addEventListener('click', function (event) {
body.classList.toggle('close');
});
}
var cacheContentDOM;
function scroll2Top () {
if (!cacheContentDOM) {
var dom = isMobile() ? 'body' : 'section.content';
cacheContentDOM = document.querySelector(dom);
}
cacheContentDOM.scrollTop = 0;
}
var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -2240,100 +2351,8 @@ function tree (toc, tpl) {
return tpl
}
/**
* Active sidebar when scroll
* @link https://buble.surge.sh/
*/
function scrollActiveSidebar () {
if (/mobile/i.test(navigator.userAgent)) { return }
var anchors = document.querySelectorAll('.anchor');
var nav = {};
var lis = document.querySelectorAll('.sidebar li');
var active = null;
for (var i = 0, len = lis.length; i < len; i += 1) {
var li = lis[i];
var href = li.querySelector('a').getAttribute('href');
if (href !== '/') { href = href.match(/#([^#]+)$/g)[0].slice(1); }
nav[href] = li;
}
function highlight () {
for (var i = 0, len = anchors.length; i < len; i += 1) {
var node = anchors[i].parentNode;
var bcr = node.getBoundingClientRect();
if (bcr.top < 10 && bcr.bottom > 10) {
var li = nav[node.id];
if (!li || li === active) { return }
if (active) { active.setAttribute('class', ''); }
li.setAttribute('class', 'active');
active = li;
return
}
}
}
document.querySelector('main .content').addEventListener('scroll', highlight);
highlight();
function scrollIntoView () {
var id = window.location.hash.match(/#[^#\/]+$/g);
if (!id || !id.length) { return }
var section = document.querySelector(id[0]);
if (section) { section.scrollIntoView(); }
}
window.addEventListener('hashchange', scrollIntoView);
scrollIntoView();
}
/**
* Acitve link
*/
function activeLink (dom, activeParent) {
var host = window.location.href;
dom = typeof dom === 'object' ? dom : document.querySelector(dom);
if (!dom) { return
; }[].slice.call(dom.querySelectorAll('a')).forEach(function (node) {
if (node.href === host) {
activeParent
? node.parentNode.setAttribute('class', 'active')
: node.setAttribute('class', 'active');
} else {
activeParent
? node.parentNode.removeAttribute('class')
: node.removeAttribute('class');
}
});
}
/**
* sidebar toggle
*/
function bindToggle (dom) {
dom = typeof dom === 'object' ? dom : document.querySelector(dom);
if (!dom) { return }
var body = document.body;
dom.addEventListener('click', function () { return body.classList.toggle('close'); });
if (!/mobile/i.test(navigator.userAgent)) { return }
document.querySelector('aside').addEventListener('click', function (event) {
body.classList.toggle('close');
});
}
var OPTIONS$1 = {};
var CACHE = {};
var renderTo = function (dom, content) {
dom = typeof dom === 'object' ? dom : document.querySelector(dom);
@@ -2399,12 +2418,16 @@ function renderArticle (content) {
if (!renderNavbar.rendered) { renderNavbar(null, OPTIONS$1); }
renderSidebar.rendered = false;
renderNavbar.rendered = false;
if (OPTIONS$1.auto2top) { scroll2Top(); }
}
/**
* navbar
*/
function renderNavbar (content) {
if (CACHE.navbar && CACHE.navbar === content) { return }
CACHE.navbar = content;
renderNavbar.rendered = true;
if (content) { renderTo('nav', marked(content)); }
@@ -2415,8 +2438,6 @@ function renderNavbar (content) {
* sidebar
*/
function renderSidebar (content) {
renderSidebar.rendered = true;
var isToc = false;
if (content) {
@@ -2428,11 +2449,48 @@ function renderSidebar (content) {
isToc = true;
}
renderSidebar.rendered = true;
if (CACHE.sidebar && CACHE.sidebar === content) { return }
CACHE.sidebar = content;
renderTo('aside.sidebar', content);
isToc ? scrollActiveSidebar() : activeLink('aside.sidebar', true);
if (isToc) { scrollActiveSidebar(); }
toc = [];
}
/**
* render loading bar
* @return {[type]} [description]
*/
function renderLoading (ref) {
var loaded = ref.loaded;
var total = ref.total;
var num = Math.floor(loaded / total * 100);
if (!CACHE.loading) {
var div = document.createElement('div');
div.classList.add('progress');
document.body.appendChild(div);
CACHE.loading = div;
}
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);
}
}
/**
* Load Config
* @param {Object} options
*/
function config (options) {
OPTIONS$1 = options;
}
@@ -2445,7 +2503,8 @@ var OPTIONS = {
sidebarToggle: false,
loadSidebar: null,
loadNavbar: null,
router: false
router: false,
auto2top: false
};
var script = document.currentScript || [].slice.call(document.getElementsByTagName('script')).pop();
@@ -2464,26 +2523,44 @@ if (script) {
config(OPTIONS);
var cacheRoute = null;
var cacheXhr = null;
var mainRender = function () {
var mainRender = function (cb) {
var route = getRoute();
if (cacheRoute === route) { return }
if (cacheRoute === route) { return cb() }
var wait;
var basePath = cacheRoute = route;
if (!/\//.test(basePath)) {
basePath = '';
} else if (basePath && !/\/$/.test(basePath)) {
basePath = basePath.match(/(\S+\/)[^\/]+$/)[1];
basePath = basePath.match(/(\S*\/)[^\/]+$/)[1];
}
cacheXhr && cacheXhr.abort && cacheXhr.abort();
// Render markdown file
load((!route || /\/$/.test(route)) ? (route + "README.md") : (route + ".md"))
.then(renderArticle, function (_) { return renderArticle(null); });
cacheXhr = load(
(!route || /\/$/.test(route)) ? (route + "README.md") : (route + ".md"),
'GET',
renderLoading);
cacheXhr.then(function (result) {
renderArticle(result);
if (OPTIONS.loadSidebar) {
if (wait === false) { cb(); }
wait = false;
} else {
cb();
}
}, function (_) { return renderArticle(null); });
// Render sidebar
if (OPTIONS.loadSidebar) {
load(basePath + OPTIONS.loadSidebar).then(renderSidebar);
load(basePath + OPTIONS.loadSidebar).then(function (result) {
renderSidebar(result);
if (wait === false) { cb(); }
wait = false;
});
}
// Render navbar
@@ -2495,13 +2572,19 @@ var mainRender = function () {
var Docsify = function () {
var dom = document.querySelector(OPTIONS.el) || document.body;
var replace = dom !== document.body;
var main = function () {
mainRender(function (_) {
activeLink('aside.sidebar', true);
scrollIntoView();
});
};
// Render app
renderApp(dom, replace);
mainRender();
main();
if (OPTIONS.router) {
if (!/^#\//.test(window.location.hash)) { window.location.hash = '#/'; }
window.addEventListener('hashchange', mainRender);
window.addEventListener('hashchange', main);
}
};
+2 -2
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "docsify",
"version": "1.0.0",
"version": "1.1.3",
"description": "A magical documentation generator.",
"main": "lib/docsify.js",
"files": [
+20 -11
View File
@@ -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 = {}
@@ -39,19 +40,18 @@ export function scrollActiveSidebar () {
}
}
document.querySelector('main .content').addEventListener('scroll', highlight)
const dom = document.querySelector('main .content')
dom.removeEventListener('scroll', highlight)
dom.addEventListener('scroll', highlight)
highlight()
}
function scrollIntoView () {
const id = window.location.hash.match(/#[^#\/]+$/g)
if (!id || !id.length) return
const section = document.querySelector(id[0])
export function scrollIntoView () {
const id = window.location.hash.match(/#[^#\/]+$/g)
if (!id || !id.length) return
const section = document.querySelector(id[0])
if (section) section.scrollIntoView()
}
window.addEventListener('hashchange', scrollIntoView)
scrollIntoView()
if (section) section.scrollIntoView()
}
/**
@@ -91,3 +91,12 @@ export function bindToggle (dom) {
body.classList.toggle('close')
})
}
let cacheContentDOM
export function scroll2Top () {
if (!cacheContentDOM) {
const dom = isMobile() ? 'body' : 'section.content'
cacheContentDOM = document.querySelector(dom)
}
cacheContentDOM.scrollTop = 0
}
+36 -10
View File
@@ -1,4 +1,5 @@
import { load, camel2kebab, isNil, getRoute } from './util'
import { activeLink, scrollIntoView } from './event'
import * as render from './render'
const OPTIONS = {
@@ -9,7 +10,8 @@ const OPTIONS = {
sidebarToggle: false,
loadSidebar: null,
loadNavbar: null,
router: false
router: false,
auto2top: false
}
const script = document.currentScript || [].slice.call(document.getElementsByTagName('script')).pop()
@@ -28,26 +30,44 @@ if (script) {
render.config(OPTIONS)
let cacheRoute = null
let cacheXhr = null
const mainRender = function () {
const mainRender = function (cb) {
const route = getRoute()
if (cacheRoute === route) return
if (cacheRoute === route) return cb()
let wait
let basePath = cacheRoute = route
if (!/\//.test(basePath)) {
basePath = ''
} else if (basePath && !/\/$/.test(basePath)) {
basePath = basePath.match(/(\S+\/)[^\/]+$/)[1]
basePath = basePath.match(/(\S*\/)[^\/]+$/)[1]
}
cacheXhr && cacheXhr.abort && cacheXhr.abort()
// Render markdown file
load((!route || /\/$/.test(route)) ? `${route}README.md` : `${route}.md`)
.then(render.renderArticle, _ => render.renderArticle(null))
cacheXhr = load(
(!route || /\/$/.test(route)) ? `${route}README.md` : `${route}.md`,
'GET',
render.renderLoading)
cacheXhr.then(result => {
render.renderArticle(result)
if (OPTIONS.loadSidebar) {
if (wait === false) cb()
wait = false
} else {
cb()
}
}, _ => render.renderArticle(null))
// Render sidebar
if (OPTIONS.loadSidebar) {
load(basePath + OPTIONS.loadSidebar).then(render.renderSidebar)
load(basePath + OPTIONS.loadSidebar).then(result => {
render.renderSidebar(result)
if (wait === false) cb()
wait = false
})
}
// Render navbar
@@ -59,13 +79,19 @@ const mainRender = function () {
const Docsify = function () {
const dom = document.querySelector(OPTIONS.el) || document.body
const replace = dom !== document.body
const main = function () {
mainRender(_ => {
activeLink('aside.sidebar', true)
scrollIntoView()
})
}
// Render app
render.renderApp(dom, replace)
mainRender()
main()
if (OPTIONS.router) {
if (!/^#\//.test(window.location.hash)) window.location.hash = '#/'
window.addEventListener('hashchange', mainRender)
window.addEventListener('hashchange', main)
}
}
+42 -4
View File
@@ -1,10 +1,11 @@
import marked from 'marked'
import Prism from 'prismjs'
import * as tpl from './tpl'
import { activeLink, scrollActiveSidebar, bindToggle } from './event'
import { activeLink, scrollActiveSidebar, bindToggle, scroll2Top } from './event'
import { genTree, getRoute } from './util'
let OPTIONS = {}
const CACHE = {}
const renderTo = function (dom, content) {
dom = typeof dom === 'object' ? dom : document.querySelector(dom)
@@ -68,12 +69,16 @@ export function renderArticle (content) {
if (!renderNavbar.rendered) renderNavbar(null, OPTIONS)
renderSidebar.rendered = false
renderNavbar.rendered = false
if (OPTIONS.auto2top) scroll2Top()
}
/**
* navbar
*/
export function renderNavbar (content) {
if (CACHE.navbar && CACHE.navbar === content) return
CACHE.navbar = content
renderNavbar.rendered = true
if (content) renderTo('nav', marked(content))
@@ -84,8 +89,6 @@ export function renderNavbar (content) {
* sidebar
*/
export function renderSidebar (content) {
renderSidebar.rendered = true
let isToc = false
if (content) {
@@ -97,11 +100,46 @@ export function renderSidebar (content) {
isToc = true
}
renderSidebar.rendered = true
if (CACHE.sidebar && CACHE.sidebar === content) return
CACHE.sidebar = content
renderTo('aside.sidebar', content)
isToc ? scrollActiveSidebar() : activeLink('aside.sidebar', true)
if (isToc) scrollActiveSidebar()
toc = []
}
/**
* render loading bar
* @return {[type]} [description]
*/
export function renderLoading ({ loaded, total }) {
const num = Math.floor(loaded / total * 100)
if (!CACHE.loading) {
const div = document.createElement('div')
div.classList.add('progress')
document.body.appendChild(div)
CACHE.loading = div
}
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)
}
}
/**
* Load Config
* @param {Object} options
*/
export function config (options) {
OPTIONS = options
}
+12 -2
View File
@@ -8,6 +8,18 @@
-webkit-font-smoothing: antialiased;
}
.progress {
background-color: $color-primary;
height: 2px;
left: 0px;
position: fixed;
right: 0px;
top: 0px;
transition: width 0.2s, opacity 0.4s;
width: 0%;
z-index: 999999;
}
html, body {
height: 100%;
}
@@ -24,8 +36,6 @@ body {
img {
max-width: 100%;
display: block;
margin: 0 auto;
}
/* navbar */
+1 -1
View File
@@ -36,7 +36,7 @@ body {
ul li.active>a {
color: $color-primary;
font-weight: 500;
font-weight: 600;
}
}
+1
View File
@@ -57,3 +57,4 @@ export function tree (toc, tpl = '') {
return tpl
}
+14 -3
View File
@@ -1,10 +1,11 @@
/**
* Simple ajax
* @param {String} url
* @param {String} [method=get]
* @param {String} [method=GET]
* @param {Function} [loading] handle loading
* @return {Promise}
*/
export function load (url, method = 'get') {
export function load (url, method = 'GET', loading) {
const xhr = new XMLHttpRequest()
xhr.open(method, url)
@@ -12,11 +13,16 @@ export function load (url, method = 'get') {
return {
then: function (success, error = function () {}) {
if (loading) {
xhr.addEventListener('progress', loading)
xhr.addEventListener('loaded', loading)
}
xhr.addEventListener('error', error)
xhr.addEventListener('load', ({ target }) => {
target.status >= 400 ? error(target) : success(target.response)
})
}
},
abort: () => xhr.readyState !== 4 && xhr.abort()
}
}
@@ -89,3 +95,8 @@ export function getRoute () {
return route
}
export function isMobile () {
return /mobile/i.test(navigator.userAgent)
}