Skip to content

D
driver.js

wjy_0214 / driver.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 1
Fork 0
D
driver.js

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 a98e9c86 编写于 作者: K Kamran Ahmed
浏览文件
操作

Refactor demo template

上级 7d210983
展开全部 隐藏空白更改
内联 并排
Showing with 810 addition and 19 deletion
config/webpack.config.demo.js
浏览文件 @ a98e9c86
......@@ -2,6 +2,7 @@ const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const isProduction = process.env.NODE_ENV === 'production';
const scriptFileName = 'driver-demo.min.js';
......@@ -17,7 +18,7 @@ module.exports = {
],
output: {
path: path.join(__dirname, '/../dist/demo'),
publicPath: '/dist/demo/',
publicPath: './',
filename: scriptFileName,
libraryTarget: 'umd',
library: 'Driver',
......@@ -71,9 +72,12 @@ module.exports = {
canPrint: true,
}),
new CopyWebpackPlugin([
'./demo/images/separator.png',
'./demo/images/driver.png',
{ from: './demo/images/', to: 'images' }
]),
new HtmlWebpackPlugin({
template: 'demo/index.html',
favicon: 'demo/images/favicon.png',
}),
],
stats: {
colors: true,
......
index.html → demo/index.html
浏览文件 @ a98e9c86
......@@ -6,16 +6,14 @@
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Driver</title>
<meta name="description" itemprop="description"
content="A light-weight, no-dependency, vanilla JavaScript library to drive the user's focus across the page"/>
<link rel="stylesheet" href="./dist/demo/driver-demo.min.css">
<meta name="description" itemprop="description" content="A light-weight, no-dependency, vanilla JavaScript library to drive the user's focus across the page"/>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/monokai.min.css">
</head>
<body>
<div class="page-wrap">
<section class="section__header" id="driver-demo-head">
<h1 class="brand">
<img id="logo_img" src="./dist/demo/driver.png"/>
<img id="logo_img" src="./images/driver.png"/>
<span id="name_driver">Driver.js</span>
</h1>
<p class="text-muted tagline">Light-weight, no-dependency, vanilla JavaScript engine to drive user's focus across
......@@ -377,11 +375,8 @@ activeElement.getNode(); // Gets the DOM Element behind this element
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<script async defer src="//buttons.github.io/buttons.js"></script>
<script src="//twemoji.maxcdn.com/2/twemoji.min.js?2.5"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
<script src="./dist/demo/driver-demo.min.js"></script>
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
......
demo/styles/base.scss
浏览文件 @ a98e9c86
......@@ -61,7 +61,7 @@ hr, .hr {
height: 1px;
&.hr__fancy {
background: url("./separator.png") repeat-y;
background: url("./images/separator.png") repeat-y;
height: 5px;
background-size: cover;
}
......
dist/demo/driver-demo.min.css
浏览文件 @ a98e9c86
*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}*,:after,:before{box-sizing:border-box}body,html{position:relative;margin:0;width:100%;height:100%}body{padding-top:1px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:16px;line-height:1.4;color:#fff;background-color:#2e2e30;overflow-x:hidden}label{display:block;margin-bottom:8px;font-size:14px;font-weight:500;cursor:pointer}p{margin-top:0;margin-bottom:20px;line-height:1.5}.hr,hr{display:block;margin:30px 0;border:0;border-bottom:1px solid #eaeaea;height:1px}.hr.hr__fancy,hr.hr__fancy{background:url(separator.png) repeat-y;height:5px;background-size:cover}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:12px;font-weight:700;line-height:1.2}a,a:focus,a:visited{color:#fff;text-decoration:none;font-weight:600}.form-control{display:block;width:100%;background-color:#f9f9f9;padding:12px;border:1px solid #ddd;border-radius:2.5px;font-size:14px;-webkit-appearance:none;appearance:none;outline:none;margin-bottom:24px}.h1,h1{font-size:32px}.h2,h2{font-size:24px}.h3,h3{font-size:20px}.h4,h4{font-size:18px}.h5,h5{font-size:16px}.h6,h6{font-size:14px}ol li,ul li{list-style-type:none;line-height:1.5;margin-bottom:3px}blockquote{background:#f5f3f1;padding:10px;margin-bottom:35px;border-radius:10px}.top-20{margin-top:20px}.top-30{margin-top:30px}.zero-bottom{margin-bottom:0}.zero-top{margin-top:0}.text-center{text-align:center}div#driver-popover-item{display:none;position:absolute;background:#fff;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px rgba(0,0,0,.4);z-index:1000000000}div#driver-popover-item .driver-popover-tip{border:5px solid #fff;content:"";position:absolute}div#driver-popover-item .driver-popover-tip.bottom{bottom:-10px;border-color:#fff transparent transparent}div#driver-popover-item .driver-popover-tip.bottom.position-center{left:49%}div#driver-popover-item .driver-popover-tip.bottom.position-right{right:20px}div#driver-popover-item .driver-popover-tip.left{left:-10px;top:10px;border-color:transparent #fff transparent transparent}div#driver-popover-item .driver-popover-tip.left.position-center{top:46%}div#driver-popover-item .driver-popover-tip.left.position-bottom{top:auto;bottom:20px}div#driver-popover-item .driver-popover-tip.right{right:-10px;top:10px;border-color:transparent transparent transparent #fff}div#driver-popover-item .driver-popover-tip.right.position-center{top:46%}div#driver-popover-item .driver-popover-tip.right.position-bottom{top:auto;bottom:20px}div#driver-popover-item .driver-popover-tip.top{top:-10px;border-color:transparent transparent #fff}div#driver-popover-item .driver-popover-tip.top.position-center{left:49%}div#driver-popover-item .driver-popover-tip.top.position-right{right:20px}div#driver-popover-item .driver-popover-footer{display:block;clear:both;margin-top:5px}div#driver-popover-item .driver-popover-footer button{display:inline-block;padding:3px 10px;border:1px solid #d4d4d4;text-decoration:none;text-shadow:1px 1px 0 #fff;color:#2d2d2d;font:11px/normal sans-serif;cursor:pointer;outline:0;background-color:#f1f1f1;border-radius:2px;zoom:1;margin:10px 0 0;line-height:1.3}div#driver-popover-item .driver-popover-footer button.driver-disabled{color:grey;cursor:default;pointer-events:none}div#driver-popover-item .driver-popover-footer .driver-close-btn{float:left}div#driver-popover-item .driver-popover-footer .driver-btn-group{float:right}div#driver-popover-item .driver-popover-title{font:19px/normal sans-serif;margin:0 0 5px;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1}div#driver-popover-item .driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;color:#2d2d2d;font-weight:400;zoom:1}.driver-stage-no-animation{-webkit-transition:none!important;-moz-transition:none!important;-ms-transition:none!important;-o-transition:none!important;transition:none!important;background:transparent!important;outline:5000px solid rgba(0,0,0,.75)}div#driver-page-overlay{background:#000;position:fixed;bottom:0;right:0;display:block;width:100%;height:100%;zoom:1;filter:alpha(opacity=75);opacity:.75;z-index:100002!important}div#driver-highlighted-element-stage,div#driver-page-overlay{top:0;left:0;-webkit-transition:all .4s;-moz-transition:all .4s;-ms-transition:all .4s;-o-transition:all .4s;transition:all .4s}div#driver-highlighted-element-stage{position:absolute;height:50px;width:300px;background:#fff;z-index:100003!important;display:none;border-radius:2px}.driver-highlighted-element{z-index:100004!important}.driver-position-relative{position:relative!important}.driver-fix-stacking{z-index:auto!important;opacity:1!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;-o-transform:none!important;transform:none!important;-webkit-filter:none!important;-moz-filter:none!important;-ms-filter:none!important;-o-filter:none!important;filter:none!important;-webkit-perspective:none!important;-moz-perspective:none!important;-ms-perspective:none!important;-o-perspective:none!important;perspective:none!important;-webkit-transform-style:flat!important;-moz-transform-style:flat!important;-ms-transform-style:flat!important;transform-style:flat!important;-webkit-transform-box:border-box!important;-moz-transform-box:border-box!important;-ms-transform-box:border-box!important;-o-transform-box:border-box!important;transform-box:border-box!important;will-change:unset!important}img.emoji{height:1em;width:1em;margin:0 .05em 0 .1em;vertical-align:-.1em}.brand,.brand img{position:relative}.brand img{height:67px;top:10px}.page-wrap{max-width:550px;margin:50px auto;background:#fff;padding:10px 30px;border-radius:5px;color:#1f1f1f}.page-wrap a,.page-wrap a:focus,.page-wrap a:visited{color:#1f1f1f;text-decoration:underline}.page-wrap a.btn__dark{text-decoration:none;color:#fff;background-color:#f44336;padding:0 18px;height:40px;line-height:40px;border-radius:8px;cursor:pointer;transition:background-color .2s,color .2s;font-weight:500;width:195px;font-size:17px;display:inline-block;margin-top:2px}.page-wrap a.btn__run-demo{text-decoration:none;background:#f54336;padding:5px;border-radius:20px;color:#fff;display:block;margin:15px 0 10px;text-align:center}section{margin-bottom:30px}.section__header{margin:10px 0 20px;text-align:center;display:block;padding:10px}.section__header h1{font-size:55px}.section__header h1 .emoji{font-size:45px;top:-4px;margin-right:3px;position:relative}.section__header .tagline{max-width:450px;margin:0 auto 25px;text-align:center}.section__examples .section__example{margin-bottom:20px}.section__examples #creation-input{margin-top:20px}.section__examples input{padding:10px;background-color:#fafbfc;border:3px solid #e1e4e8;border-radius:3px;box-shadow:inset 0 0 10px rgba(27,31,35,.05);margin-bottom:0;margin-top:7px}.position-btns a{text-decoration:none;font-size:13px;padding:10px 15px;background:#f54336;color:#fff!important;border-radius:6px}
\ No newline at end of file
*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0}*,:after,:before{box-sizing:border-box}body,html{position:relative;margin:0;width:100%;height:100%}body{padding-top:1px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:16px;line-height:1.4;color:#fff;background-color:#2e2e30;overflow-x:hidden}label{display:block;margin-bottom:8px;font-size:14px;font-weight:500;cursor:pointer}p{margin-top:0;margin-bottom:20px;line-height:1.5}.hr,hr{display:block;margin:30px 0;border:0;border-bottom:1px solid #eaeaea;height:1px}.hr.hr__fancy,hr.hr__fancy{background:url(images/separator.png) repeat-y;height:5px;background-size:cover}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:12px;font-weight:700;line-height:1.2}a,a:focus,a:visited{color:#fff;text-decoration:none;font-weight:600}.form-control{display:block;width:100%;background-color:#f9f9f9;padding:12px;border:1px solid #ddd;border-radius:2.5px;font-size:14px;-webkit-appearance:none;appearance:none;outline:none;margin-bottom:24px}.h1,h1{font-size:32px}.h2,h2{font-size:24px}.h3,h3{font-size:20px}.h4,h4{font-size:18px}.h5,h5{font-size:16px}.h6,h6{font-size:14px}ol li,ul li{list-style-type:none;line-height:1.5;margin-bottom:3px}blockquote{background:#f5f3f1;padding:10px;margin-bottom:35px;border-radius:10px}.top-20{margin-top:20px}.top-30{margin-top:30px}.zero-bottom{margin-bottom:0}.zero-top{margin-top:0}.text-center{text-align:center}div#driver-popover-item{display:none;position:absolute;background:#fff;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px rgba(0,0,0,.4);z-index:1000000000}div#driver-popover-item .driver-popover-tip{border:5px solid #fff;content:"";position:absolute}div#driver-popover-item .driver-popover-tip.bottom{bottom:-10px;border-color:#fff transparent transparent}div#driver-popover-item .driver-popover-tip.bottom.position-center{left:49%}div#driver-popover-item .driver-popover-tip.bottom.position-right{right:20px}div#driver-popover-item .driver-popover-tip.left{left:-10px;top:10px;border-color:transparent #fff transparent transparent}div#driver-popover-item .driver-popover-tip.left.position-center{top:46%}div#driver-popover-item .driver-popover-tip.left.position-bottom{top:auto;bottom:20px}div#driver-popover-item .driver-popover-tip.right{right:-10px;top:10px;border-color:transparent transparent transparent #fff}div#driver-popover-item .driver-popover-tip.right.position-center{top:46%}div#driver-popover-item .driver-popover-tip.right.position-bottom{top:auto;bottom:20px}div#driver-popover-item .driver-popover-tip.top{top:-10px;border-color:transparent transparent #fff}div#driver-popover-item .driver-popover-tip.top.position-center{left:49%}div#driver-popover-item .driver-popover-tip.top.position-right{right:20px}div#driver-popover-item .driver-popover-footer{display:block;clear:both;margin-top:5px}div#driver-popover-item .driver-popover-footer button{display:inline-block;padding:3px 10px;border:1px solid #d4d4d4;text-decoration:none;text-shadow:1px 1px 0 #fff;color:#2d2d2d;font:11px/normal sans-serif;cursor:pointer;outline:0;background-color:#f1f1f1;border-radius:2px;zoom:1;margin:10px 0 0;line-height:1.3}div#driver-popover-item .driver-popover-footer button.driver-disabled{color:grey;cursor:default;pointer-events:none}div#driver-popover-item .driver-popover-footer .driver-close-btn{float:left}div#driver-popover-item .driver-popover-footer .driver-btn-group{float:right}div#driver-popover-item .driver-popover-title{font:19px/normal sans-serif;margin:0 0 5px;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1}div#driver-popover-item .driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;color:#2d2d2d;font-weight:400;zoom:1}.driver-stage-no-animation{-webkit-transition:none!important;-moz-transition:none!important;-ms-transition:none!important;-o-transition:none!important;transition:none!important;background:transparent!important;outline:5000px solid rgba(0,0,0,.75)}div#driver-page-overlay{background:#000;position:fixed;bottom:0;right:0;display:block;width:100%;height:100%;zoom:1;filter:alpha(opacity=75);opacity:.75;z-index:100002!important}div#driver-highlighted-element-stage,div#driver-page-overlay{top:0;left:0;-webkit-transition:all .4s;-moz-transition:all .4s;-ms-transition:all .4s;-o-transition:all .4s;transition:all .4s}div#driver-highlighted-element-stage{position:absolute;height:50px;width:300px;background:#fff;z-index:100003!important;display:none;border-radius:2px}.driver-highlighted-element{z-index:100004!important}.driver-position-relative{position:relative!important}.driver-fix-stacking{z-index:auto!important;opacity:1!important;-webkit-transform:none!important;-moz-transform:none!important;-ms-transform:none!important;-o-transform:none!important;transform:none!important;-webkit-filter:none!important;-moz-filter:none!important;-ms-filter:none!important;-o-filter:none!important;filter:none!important;-webkit-perspective:none!important;-moz-perspective:none!important;-ms-perspective:none!important;-o-perspective:none!important;perspective:none!important;-webkit-transform-style:flat!important;-moz-transform-style:flat!important;-ms-transform-style:flat!important;transform-style:flat!important;-webkit-transform-box:border-box!important;-moz-transform-box:border-box!important;-ms-transform-box:border-box!important;-o-transform-box:border-box!important;transform-box:border-box!important;will-change:unset!important}img.emoji{height:1em;width:1em;margin:0 .05em 0 .1em;vertical-align:-.1em}.brand,.brand img{position:relative}.brand img{height:67px;top:10px}.page-wrap{max-width:550px;margin:50px auto;background:#fff;padding:10px 30px;border-radius:5px;color:#1f1f1f}.page-wrap a,.page-wrap a:focus,.page-wrap a:visited{color:#1f1f1f;text-decoration:underline}.page-wrap a.btn__dark{text-decoration:none;color:#fff;background-color:#f44336;padding:0 18px;height:40px;line-height:40px;border-radius:8px;cursor:pointer;transition:background-color .2s,color .2s;font-weight:500;width:195px;font-size:17px;display:inline-block;margin-top:2px}.page-wrap a.btn__run-demo{text-decoration:none;background:#f54336;padding:5px;border-radius:20px;color:#fff;display:block;margin:15px 0 10px;text-align:center}section{margin-bottom:30px}.section__header{margin:10px 0 20px;text-align:center;display:block;padding:10px}.section__header h1{font-size:55px}.section__header h1 .emoji{font-size:45px;top:-4px;margin-right:3px;position:relative}.section__header .tagline{max-width:450px;margin:0 auto 25px;text-align:center}.section__examples .section__example{margin-bottom:20px}.section__examples #creation-input{margin-top:20px}.section__examples input{padding:10px;background-color:#fafbfc;border:3px solid #e1e4e8;border-radius:3px;box-shadow:inset 0 0 10px rgba(27,31,35,.05);margin-bottom:0;margin-top:7px}.position-btns a{text-decoration:none;font-size:13px;padding:10px 15px;background:#f54336;color:#fff!important;border-radius:6px}
\ No newline at end of file
dist/demo/driver-demo.min.js
浏览文件 @ a98e9c86
此差异已折叠。
dist/demo/images/driver.svg 0 → 100644
浏览文件 @ a98e9c86
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="512px" height="512px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve">
<g>
<g>
<g>
<path fill="#C56528" d="M246.5,197.8c-2.3-16.2-4.8-32.4-8.1-48.4c-3.2-15.1-7.2-30.1-9.2-45.4c-1.9-14.3-1-29.7-6.9-43.2
c-2.1-4.8-5.7-12.1-11.7-12.8c-4.9-0.5-8.6,4.1-10.7,7.9c-5.7,10.8-5.3,23.5-3.1,35.2c1.5,7.7,4.1,15.3,6.1,22.9
c1.9,7.3,3.6,14.6,5,21.9c6.1,30.1,19.4,58.2,28.3,87.5c4.1-1.8,8.5-3.1,13-4C248.8,212.3,247.5,205,246.5,197.8z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M214.6,246.3c-1.3,0.6-2.9,0.6-4.6-0.4c-5.5-3.3-10.9-6.8-16.1-10.6c-12.4-8.8-24.2-18.5-37-26.7
c-12.7-8.1-26.8-14.2-39.8-22c-11.7-7-24.1-15.1-37.5-18.4c-4.9-1.2-12.2-3-16.9,0c-5,3.3-3.8,8.1-0.5,12.3
c7.4,9.5,20.1,14.8,31.1,18.8c12.5,4.6,25.5,8,37.8,13.2c13.8,5.7,26.9,13,40.5,19.1c13.8,6.2,27.7,12.3,41,19.5
c0.6-1.1,1.3-2.1,2-3.1C214.5,247.5,214.5,246.9,214.6,246.3z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M191.5,114c-1.2-4.4-2.5-8.8-3.6-13.2c-9.1,3.8-17.9,8.2-26.1,13.7c-16.9,11.1-31.4,25.5-44.7,40.6
c-0.2,0.3-0.4,0.7-0.6,1c-3.3,4-6.5,8-9.6,12c7.5,4.1,14.8,8.5,22.2,12.8c2.8-3.9,5.7-7.8,8.8-11.5c5.6-6.7,11.4-13.3,17.6-19.7
c3.5-2.4,6.8-5,9.9-7.8c0.6-0.4,1.2-0.8,1.8-1.2c2.6-1.9,5.4-3.8,8.2-5.5c6.5-2.6,13-5.1,19.6-7.4
C193.8,123.2,192.7,118.6,191.5,114z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M373.7,62.3c-4.1-8.7-21.5,8.8-24.4,11.9c-17.9,19.2-22.2,46.1-31.4,69.8c-5.2,13.5-12.5,26.2-19.1,39.1
c-6.5,12.6-12.6,25.4-17.6,38.7c2.3,0.7,4.5,1.6,6.7,2.5c12-18.7,24.4-37.2,36.3-56.1c15-24,31.5-48.2,42.6-74.3
c2.5-6,5-12.1,6.5-18.5C374.2,71.5,375.5,66.3,373.7,62.3z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M304.4,249.8c-3.9-4.9-8.7-9.2-14.1-12.5c-2.6,0.4-5.4-1.1-6.3-3.4c-1.4-0.6-2.8-1.2-4.2-1.7
c-14.4-5-37.2-4.9-49,6.8c0.3,0.3,0.5,0.7,0.7,1c-3.4,2.8-6.1,7-8.3,10.6c-2.1,3.4-4.7,7.9-4.4,12.2c-5.4,13.9-3.5,29.9,8,41.6
c13.2,13.4,33.2,17.8,51.2,12.4c17.6-5.2,32.2-19.7,34-38.6C312.9,268,311,258,304.4,249.8z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M370.8,111.3c-3.9,7.6-8.2,15.1-12.6,22.5c5.2,3.3,10.3,6.9,15.1,10.8c18.6,15.2,33.2,34.4,43.3,55.7
c7.9-2.7,15.8-5.5,23.9-7.9C425.6,159.3,402,130.2,370.8,111.3z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M238.6,87.3c0.9,9.2,1.8,18.4,3.3,27.6c9-1.7,18.2-2.8,27.4-3.3c15.8-0.8,31.5,0.6,46.6,4.4
c2.7-8.2,5.6-16.3,9.2-23.9C297.1,84.4,267.2,83.2,238.6,87.3z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M94.5,271c1.4-19,6.3-37.5,14-54.8c-8.7-2.8-17.5-5.5-25.9-9.1c-8.1,17.8-13.4,37-15.1,56.5
c-1.6,17.9-1.7,36,1.1,53.7c0.6-0.1,1.1-0.2,1.7-0.4c7.9-1.7,16-2.5,23.9-4.2c1-0.2,2.1-0.5,3.1-0.7
C94.5,298.6,93.5,284.8,94.5,271z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M455.2,240.2c-5.9,1.1-11.8,1.8-17.6,3.2c-2.4,0.6-4.7,1.2-7.1,1.9c0.7,4.5,1.3,9.1,1.6,13.7
c1.8,25-2.2,49.9-11.2,72.9c8.8,2.4,17.7,4.8,26,8.2C457.7,307.8,460.9,273.6,455.2,240.2z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M396.1,375.2c-2.2,2.8-4.6,5.6-7,8.4c-15.2,17-33.7,30.8-54.1,40.7c4.4,11,9.7,21.6,13.6,32.7
c0.1,0.4,0.3,0.8,0.4,1.2c1.7-0.8,3.3-1.6,5-2.5c28.2-15,51.5-38.1,68.8-65C413.4,386.5,404.5,381,396.1,375.2z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M479.1,200.2c-8.6-4.2-19.7-1.8-28.5,0.8c-15.4,4.5-30.5,9.7-45.7,14.9c-30.1,10.2-61.1,17.8-90.7,29.8
c2.3,3.4,4.2,7,5.6,10.9c0.2,0.7,0.5,1.3,0.7,2c4.6-0.9,9.3-1.8,13.9-2.7c16-2.9,32.1-5.3,48-8.8c15.6-3.4,30.6-8.5,46-12.6
c14.8-3.9,30.8-4,44-12.6C478.7,217.8,490.5,205.8,479.1,200.2z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M458.5,359.8c-18.9-15.9-45-15.8-66.7-25.9c-24.8-11.6-46.8-29.5-73.7-36.6c-0.4-0.1-0.7-0.2-1-0.4
c-1,2.2-2.2,4.2-3.5,6.2c16.6,10.7,32.8,21.9,48.8,33.5c22.5,16.4,44.2,36,70.5,46.3c6.1,2.4,12.5,4.4,19,5.2
c4.5,0.5,11,1.3,15.1-1.3C477.3,380.1,464.7,364.9,458.5,359.8z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M146.3,397.5c-13.8-12.5-25.3-27.4-33.9-43.8c-2.8,1.2-5.6,2.5-8.4,3.9c-6,3-12,6.1-18.2,8.8
c4.7,8.3,10.3,16.1,16.7,23.4c14.7,16.6,32.3,30.2,51.4,41.4c2.8-5.5,5.8-10.8,9-16c0.6-1,1.3-2,2-3
C158.3,407.6,152.1,402.8,146.3,397.5z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M335.3,453.7c-6.3-14-12.5-28-16.4-42.9c-7.9-29.9-16.6-59.3-26.7-88.5c-4.1,2.2-8.5,3.9-13.1,5.1
c0.1,1.7,0.2,3.3,0.3,5c2.4,31.9,10.7,62.8,17.1,94c1.6,7.9,3.2,15.9,4.5,23.9c1,6.4,1.4,13.1,3.7,19.2c0.2,0.4,0.3,0.8,0.5,1.2
c0.4,0,0.7-0.1,1.1-0.1l1.1,4.4c5.2,8.6,14.7,16.1,24.9,11.3C345.5,480.2,339.7,463.5,335.3,453.7z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M208.9,296.3c-1.3-3.2-2.2-6.4-2.8-9.7c-9.7,3.5-19.6,6.6-29.6,9.6c-15.2,4.6-30.5,9.5-45.3,15.3
c-14.6,5.8-28.6,11-44.2,13.5c-12.3,2-26.8,3.5-37.2,11c-4.5,3.2-9.6,8.4-9,14.5c0.5,5.2,4.6,9.3,9.7,10.6
c12.9,3.2,26.6-2.6,38.1-8.2c12.5-6,24.4-12,37.5-16.4c29.2-9.8,56.1-25.3,85.7-34.1C210.8,300.4,209.8,298.4,208.9,296.3z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M228.2,319.2c-5.1,4.9-8.1,11.6-10.7,18c-5.2,13-10.6,25.9-16.7,38.5c-3.4,7-7.1,13.8-11.4,20.3
c-3.7,5.7-8.2,11-11.9,16.7c-8,12-15.4,24.7-20.5,38.3c-2,5.3-4.9,11.8-4.1,17.6c0.6,4.8,4.9,8,9.9,6.5
c12.5-3.8,19.6-19.1,25.3-29.7c7.2-13.4,13.6-27.5,17.8-42.2c3.9-13.8,7.4-27.3,12.9-40.6c5.4-13.1,11.4-25.9,15.5-39.5
c0-0.1,0.1-0.2,0.1-0.4C232.2,321.7,230.1,320.5,228.2,319.2z"></path>
</g>
</g>
<g>
<g>
<path fill="#C56528" d="M292,464.1c-1.6-8.2-2.9-16.4-4.3-24.6c-6,1-12.1,1.7-18.2,2c-21.3,1.2-42.8-2-63-8.9
c-1.2,2.7-2.4,5.3-3.7,7.9c-1.9,3.8-3.8,7.8-5.9,11.8c7.8,3.2,15.8,6.1,23.9,8.7c23.7,7.5,48.7,11.8,73.2,10.6
C293.1,469.2,292.4,466.7,292,464.1z"></path>
</g>
</g>
<g>
<g>
<path d="M486,191.6c-8.6-5.6-19.8-5-29.4-3.2c-2.4,0.4-4.8,1-7.1,1.5c-13.9-31.5-35.5-59.7-63.6-79.8c-3.6-2.6-7.2-4.9-11-7.2
c3.3-7.2,6.2-14.5,8.4-22.2c2.7-9.1,4.2-20.4-3.1-27.8c-8.4-8.4-21.9-1.1-29.3,4.8c-9.3,7.3-16.1,16.2-21.5,25.9
c-25.8-7.1-53.2-9.1-80-6.8c-3.9,0.3-7.8,0.8-11.7,1.3c-1.5-12.2-4.7-25.3-13.2-34.3c-7.6-8-19.1-9.2-27.6-1.9
c-9.2,8-12.2,20.9-12.7,32.6c-0.2,5.8,0.4,11.5,1.5,17.1c-6.1,2.5-12,5.2-17.8,8.3c-24.2,13-43.9,32.7-61.6,53.4
c-0.4,0.5-0.7,1-0.9,1.6c-2.4,2.9-4.7,5.8-7,8.8c-10.1-4.9-21.7-9.1-33-7.6c-11.9,1.5-19.8,11.8-16.1,23.6
c3.4,11,15.2,18.2,24.7,23.2c0.1,0.1,0.3,0.1,0.4,0.2c-2.2,4.7-4.2,9.6-6,14.4c-8.6,23.3-11.6,48.4-11.3,73.2
c0.1,9.7,1,19.3,2.6,28.8c-7.7,2.4-15,5.9-21.2,11.6c-8.7,8-11.5,21.1-4.7,31.1c7.1,10.4,21.2,11.8,32.6,9.9
c3.5-0.6,7-1.5,10.4-2.5c8.5,15.1,19.8,28.5,32.4,40.2c12.3,11.4,26.1,21.1,40.6,29.5c-2,4.6-3.9,9.4-5.5,14.2
c-3.3,9.7-4.9,22.2,4.6,29.1c10.8,7.9,23.6,1.4,31.8-6.8c4.5-4.5,8.3-9.9,11.7-15.5c12.7,5.3,25.6,9.8,38.9,13.3
c21.7,5.8,44.3,8.6,66.8,7.1c3.4,5.7,8,10.6,14.2,14.2c9.8,5.7,23.6,4.7,31.6-3.5c6.7-6.8,8.3-15.4,7.2-24.1
c3.9-1.8,7.8-3.8,11.6-5.9c28.3-15.9,51.2-39.8,68.5-67.2c6.8,2.5,13.9,4.3,21.2,5c10.8,1.1,23.6-0.7,28.2-12
c4.5-10.9-2.9-23-10-30.9c-4.5-5-9.7-8.9-15.3-12.1c11.8-34.1,15-70.7,8.8-106.2c10.5-3.4,20.9-9.7,26.9-19
C497,209.5,495.7,197.9,486,191.6z M440.5,192.4c-8,2.4-16,5.3-23.9,7.9c-10.1-21.4-24.7-40.5-43.3-55.7
c-4.8-4-9.9-7.6-15.1-10.8c4.4-7.4,8.7-14.8,12.6-22.5C402,130.2,425.6,159.3,440.5,192.4z M311.9,278.3
c-1.8,18.8-16.4,33.3-34,38.6c-17.9,5.3-38,1-51.2-12.4c-11.5-11.7-13.4-27.7-8-41.6c-0.3-4.3,2.3-8.8,4.4-12.2
c2.2-3.6,4.8-7.8,8.3-10.6c-0.2-0.4-0.4-0.7-0.7-1c11.8-11.7,34.6-11.8,49-6.8c1.4,0.5,2.8,1.1,4.2,1.7c0.9,2.3,3.7,3.7,6.3,3.4
c5.4,3.3,10.2,7.6,14.1,12.5C311,258,312.9,268,311.9,278.3z M382,365c1.8,1.4,3.7,2.8,5.6,4.1c-15.1,18.9-34.4,34.5-56.1,45.3
c-4.7-14.6-7.8-29.8-12.1-44.6c-5.3-18.1-11.4-35.9-17.6-53.7c1.8-1.4,3.5-2.9,5.1-4.4C332.7,328.3,357.4,346.5,382,365z
M283.7,418.7c0.8,3.5,1.5,7,2.1,10.5c-25.3,4-51.1,1.7-75.3-6.3c3.1-7.9,5.7-16.1,7.8-24.3c6.1-24.9,18.5-47.4,26.2-71.8
c3.7,1.1,7.5,1.9,11.3,2.4c4.1,0.5,8.3,0.5,12.5,0.1C270.1,359.6,277.3,389.2,283.7,418.7z M219.7,312.3c-7,7.4-11,17-14.7,26.7
c-5.1,13.5-11.4,27-18.2,39.7c-4.6,8.7-10.5,16.7-16.2,24.8c-20.4-13.8-37.1-32.3-48.6-53.7c7.2-2.7,14.6-5.2,21.9-8.1
c24.6-9.7,48.1-22.3,73.6-29.6c0.5-0.1,0.9-0.3,1.3-0.6C219.2,311.8,219.4,312.1,219.7,312.3z M215,236.1
c-13-7.8-24.9-17.2-37.1-26.1c-5.8-4.2-11.6-8.3-17.6-12.1c-6.6-4.2-13.8-7.4-20.7-11c-0.5-0.3-1-0.5-1.4-0.8
c9.9-13.8,21.3-26.5,33.6-37.8c0.2-0.2,0.4-0.4,0.5-0.6c8.1-3.3,16.4-6.6,24.8-9.6c1.5,7.1,3.1,14.2,5.2,21.2
c7.2,23.6,17.2,46.3,24.2,70c-3.6,2.8-6.6,6.2-8.9,10.1C217.2,238.1,216.4,236.9,215,236.1z M254,174
c-2.6-15.8-5.6-31.6-9.5-47.1c-0.2-0.6-0.3-1.3-0.5-1.9c20.8-3.9,42-4.8,63-0.7c1.9,0.4,3.8,0.8,5.8,1.3c-2,6.1-4,12.1-6.5,18
c-3.5,8.7-8.2,16.9-12.5,25.2c-8.5,16.3-16.9,32.7-23.1,50c-0.1,0.2-0.1,0.3-0.2,0.5c-3.3-0.5-6.8-0.8-10.3-0.8
C259.3,203.7,256.3,188.7,254,174z M309.2,235.8c-0.8,0.3-1.5,0.8-2,1.4c-2.9-2.8-6.2-5.4-9.6-7.6c15.9-24.8,32.2-49.3,47.5-74.4
c2.5-4.2,5.1-8.3,7.7-12.5c23.1,14.7,41.9,36.1,54,61c-12.1,4.1-24.2,8.2-36.5,11.8C349.6,221.4,329.1,227.7,309.2,235.8z
M349.3,74.3c2.9-3.1,20.3-20.6,24.4-11.9c1.9,3.9,0.5,9.2-0.4,13.2c-1.5,6.4-3.9,12.5-6.5,18.5c-11.1,26.1-27.6,50.3-42.6,74.3
c-11.8,18.9-24.3,37.3-36.3,56.1c-2.2-1-4.4-1.8-6.7-2.5c4.9-13.3,11.1-26.1,17.6-38.7c6.6-12.9,13.9-25.6,19.1-39.1
C327.1,120.4,331.3,93.5,349.3,74.3z M325.1,92c-3.6,7.7-6.5,15.8-9.2,23.9c-15.1-3.7-30.8-5.2-46.6-4.4
c-9.2,0.5-18.3,1.6-27.4,3.3c-1.6-9.1-2.5-18.3-3.3-27.6C267.2,83.2,297.1,84.4,325.1,92z M199.8,55.9c2.1-3.9,5.8-8.5,10.7-7.9
c6,0.7,9.6,8,11.7,12.8c5.9,13.5,5,28.9,6.9,43.2c2.1,15.4,6.1,30.3,9.2,45.4c3.3,16,5.8,32.2,8.1,48.4c1,7.2,2.3,14.4,2.8,21.7
c-4.5,0.8-8.9,2.1-13,4c-8.9-29.3-22.2-57.4-28.3-87.5c-1.5-7.4-3.1-14.7-5-21.9c-2-7.6-4.7-15.2-6.1-22.9
C194.5,79.4,194.1,66.7,199.8,55.9z M116.4,156.1c0.3-0.3,0.5-0.7,0.6-1c13.3-15.2,27.8-29.5,44.7-40.6c8.2-5.4,17-9.9,26.1-13.7
c1.1,4.4,2.4,8.8,3.6,13.2c1.3,4.6,2.3,9.2,3.3,13.8c-6.6,2.3-13.1,4.8-19.6,7.4c-2.8,1.7-5.5,3.6-8.2,5.5
c-0.6,0.4-1.2,0.8-1.8,1.2c-3.2,2.8-6.5,5.4-9.9,7.8c-6.1,6.3-12,13-17.6,19.7c-3.1,3.7-6,7.5-8.8,11.5
c-7.4-4.3-14.7-8.7-22.2-12.8C109.9,164.1,113.1,160.1,116.4,156.1z M62.2,180.7c-3.3-4.2-4.5-9,0.5-12.3c4.6-3,12-1.2,16.9,0
c13.4,3.3,25.7,11.4,37.5,18.4c13,7.7,27.1,13.9,39.8,22c12.8,8.2,24.6,17.9,37,26.7c5.2,3.7,10.6,7.3,16.1,10.6
c1.7,1,3.3,1,4.6,0.4c-0.1,0.6,0,1.3,0.1,1.8c-0.7,1-1.4,2.1-2,3.1c-13.4-7.1-27.2-13.3-41-19.5c-13.6-6.1-26.8-13.4-40.5-19.1
c-12.3-5.1-25.3-8.5-37.8-13.2C82.3,195.4,69.7,190.2,62.2,180.7z M208.1,261.2c-1.5,4.5-2.4,9.2-2.7,13.9
c-14.9,5.6-30.2,9.9-45.4,14.7c-15,4.7-29.7,10.4-44.3,16.1c-2.8,1.1-5.5,2.1-8.4,3.1c-1.1-5.4-1.9-10.9-2.3-16.5
c-2.1-25.6,3.3-50.2,13.5-72.8c10.7,4.1,20.8,9.1,31.2,14C169.2,243,189.1,251.1,208.1,261.2z M67.5,263.5
c1.7-19.5,7-38.7,15.1-56.5c8.4,3.6,17.2,6.3,25.9,9.1c-7.7,17.3-12.6,35.9-14,54.8c-1,13.8,0,27.6,2.7,41c-1,0.3-2,0.5-3.1,0.7
c-7.9,1.7-16,2.5-23.9,4.2c-0.6,0.1-1.1,0.2-1.7,0.4C65.8,299.5,65.9,281.5,67.5,263.5z M50.6,361.1c-5.1-1.3-9.2-5.4-9.7-10.6
c-0.6-6.1,4.5-11.3,9-14.5c10.4-7.5,25-9,37.2-11c15.6-2.5,29.6-7.7,44.2-13.5c14.8-5.9,30.1-10.7,45.3-15.3
c9.9-3,19.8-6.1,29.6-9.6c0.6,3.2,1.5,6.5,2.8,9.7c0.8,2.1,1.8,4.2,3,6.1c-29.5,8.8-56.5,24.3-85.7,34.1
c-13.1,4.4-25.1,10.4-37.5,16.4C77.2,358.5,63.6,364.3,50.6,361.1z M102.4,389.7c-6.4-7.3-12-15.1-16.7-23.4
c6.2-2.7,12.3-5.8,18.2-8.8c2.8-1.4,5.6-2.7,8.4-3.9c8.7,16.4,20.1,31.3,33.9,43.8c5.8,5.3,12,10.1,18.6,14.5c-0.7,1-1.3,2-2,3
c-3.3,5.2-6.3,10.5-9,16C134.7,419.9,117.1,406.3,102.4,389.7z M187.9,445.3c-5.7,10.6-12.9,25.9-25.3,29.7
c-5,1.5-9.2-1.7-9.9-6.5c-0.8-5.9,2.1-12.3,4.1-17.6c5.2-13.5,12.6-26.2,20.5-38.3c3.8-5.7,8.2-11,11.9-16.7
c4.3-6.5,8-13.3,11.4-20.3c6.2-12.6,11.5-25.5,16.7-38.5c2.6-6.4,5.7-13.2,10.7-18c2,1.3,4,2.5,6.1,3.5c0,0.1-0.1,0.2-0.1,0.4
c-4.2,13.6-10.1,26.4-15.5,39.5c-5.5,13.3-9,26.8-12.9,40.6C201.5,417.8,195.1,431.9,187.9,445.3z M220.7,461
c-8-2.5-16-5.4-23.9-8.7c2.1-4,4-7.9,5.9-11.8c1.3-2.6,2.5-5.3,3.7-7.9c20.2,6.9,41.7,10,63,8.9c6.1-0.3,12.2-1,18.2-2
c1.4,8.2,2.8,16.4,4.3,24.6c0.5,2.6,1.1,5.1,1.9,7.5C269.4,472.8,244.4,468.5,220.7,461z M332.3,486.3
c-10.2,4.7-19.7-2.7-24.9-11.3l-1.1-4.4c-0.4,0-0.7,0.1-1.1,0.1c-0.2-0.4-0.3-0.8-0.5-1.2c-2.3-6.2-2.7-12.8-3.7-19.2
c-1.3-8-2.9-15.9-4.5-23.9c-6.4-31.2-14.6-62.1-17.1-94c-0.1-1.7-0.2-3.3-0.3-5c4.5-1.2,8.9-2.9,13.1-5.1
c10.1,29.2,18.8,58.6,26.7,88.5c3.9,14.9,10.2,28.9,16.4,42.9C339.7,463.5,345.5,480.2,332.3,486.3z M353.9,455.7
c-1.6,0.9-3.3,1.7-5,2.5c-0.1-0.4-0.3-0.8-0.4-1.2c-3.9-11.2-9.2-21.7-13.6-32.7c20.4-9.9,38.9-23.8,54.1-40.7
c2.4-2.7,4.8-5.5,7-8.4c8.4,5.8,17.3,11.3,26.6,15.5C405.4,417.6,382.1,440.8,353.9,455.7z M458.5,359.8
c6.1,5.2,18.8,20.3,8.5,27c-4.1,2.6-10.6,1.9-15.1,1.3c-6.6-0.8-12.9-2.8-19-5.2c-26.3-10.3-47.9-29.9-70.5-46.3
c-16-11.6-32.2-22.8-48.8-33.5c1.3-2,2.5-4.1,3.5-6.2c0.3,0.1,0.6,0.3,1,0.4c26.8,7.1,48.8,25,73.7,36.6
C413.5,344,439.6,343.9,458.5,359.8z M322.6,269.2c31.1-6.4,62.5-10.4,93.1-19.6c1.6-0.5,3.2-1,4.8-1.4c4,27.2,0.7,55.3-9.5,80.9
c-1.6-0.5-3.1-0.9-4.7-1.4c-14.7-4.7-28-13.3-41.2-21.1c-14-8.2-28.4-15.7-44.1-20C322.4,281,323,275,322.6,269.2z M446.9,340.1
c-8.3-3.5-17.2-5.9-26-8.2c9-23,13-47.9,11.2-72.9c-0.3-4.6-0.9-9.2-1.6-13.7c2.4-0.7,4.7-1.3,7.1-1.9c5.8-1.4,11.7-2.1,17.6-3.2
C460.9,273.6,457.7,307.8,446.9,340.1z M472.5,221.8c-13.2,8.6-29.2,8.7-44,12.6c-15.4,4.1-30.4,9.1-46,12.6
c-15.9,3.5-32,5.9-48,8.8c-4.7,0.8-9.3,1.7-13.9,2.7c-0.2-0.7-0.4-1.3-0.7-2c-1.4-3.9-3.3-7.5-5.6-10.9
c29.6-11.9,60.5-19.5,90.7-29.8c15.2-5.1,30.3-10.3,45.7-14.9c8.8-2.6,19.9-5,28.5-0.8C490.5,205.8,478.7,217.8,472.5,221.8z"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file
dist/demo/index.html 0 → 100644
浏览文件 @ a98e9c86
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Driver</title>
<meta name="description" itemprop="description" content="A light-weight, no-dependency, vanilla JavaScript library to drive the user's focus across the page"/>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/monokai.min.css">
<link rel="shortcut icon" href="./favicon.png"><link href="./driver-demo.min.css" rel="stylesheet"></head>
<body>
<div class="page-wrap">
<section class="section__header" id="driver-demo-head">
<h1 class="brand">
<img id="logo_img" src="./images/driver.png"/>
<span id="name_driver">Driver.js</span>
</h1>
<p class="text-muted tagline">Light-weight, no-dependency, vanilla JavaScript engine to drive user's focus across
the
page</p>
<a id="animated-tour" href="javascript:void(0)" class="btn btn__example btn__dark">With Animation</a>
<a id="boring-tour" href="javascript:void(0)" class="btn btn__example btn__dark">Without Animation</a>
<div class="github-button top-30">
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/kamranahmedse/driver.js" data-size="large"
data-show-count="true" aria-label="Star kamranahmedse/driver.js on GitHub">Star</a>
</div>
</section>
<blockquote>
<p>A lightweight (~4kb gzipped) yet powerful JavaScript engine that helps you drive the user's focus on page.</p>
<p class="zero-bottom">Some sample use-cases can be creating powerful feature introductions, call-to-action
components, focus shifters etc.</p>
</blockquote>
<section class="section__purpose">
<h3>What are the features?</h3>
<p>Driver is compatible with all the major browsers and can be used for any of your overlay needs. Feature
introductions, focus shifters, call-to-action are just a few examples.</p>
<ul>
<li id="highlight_feature">🔆 <strong>Highlight</strong> any (literally any) item on page</li>
<li id="interactions_feature">✋ <strong>Block user interactions</strong></li>
<li id="feature_introductions_feature">📣 Create <strong>feature introductions</strong></li>
<li id="focus_shifters_feature">👓 Add <strong>focus shifters</strong> for users</li>
<li id="customizable_feature">🛠️ Highly customizable – <strong>Use it anywhere</strong> for overlay</li>
<li id="keyboard_feature">⌨️ User Friendly – <strong>Controllable by keys</strong></li>
<li id="free_use_feature">🆓 <strong>MIT Licensed</strong> – Free for personal and commercial use</li>
<li id="lightweight_feature">🕊️ Lightweight – Only <strong>~4kb</strong> when gzipped</li>
<li id="major_browsers_feature">🌀 <strong>Consistent behavior</strong> across all major browsers</li>
</ul>
</section>
<hr class="hr__fancy">
<section class="section__how">
<h3>How does it do that?</h3>
<p>In it simplest, it puts the canvas on top of the whole page and then cuts the part that is over the element to be
highlighted and provides you several hooks when highlighting, highlighted or un-highlighting elements making it
highly customizable.</p>
</section>
<hr class="hr__fancy">
<section class="section__examples">
<div id="examples_section">
<h3>Can you show some Examples?</h3>
<p>Below you find some of the examples and sample use-cases on how you can use it. Run by clicking the
<code>RUN</code> button.</p>
</div>
<div id="single-element-no-popover" class="section__example">
<h4>Highlighting a Single Element – Without Popover</h4>
<p class="zero-bottom">If all you want is just highlight a single element, you can do that simply by passing the
selector</p>
<a href="#" class="btn__run-demo" id="run-single-element-no-popover">Show Demo</a>
<pre><code class="javascript">const driver = new Driver();
driver.highlight('#create-post');
</code></pre>
</div>
<hr class="hr__fancy">
<div class="section__example">
<p>A <strong>real world use-case</strong> for this could be highlighting an element when user is interacting with
it</p>
<pre><code class="javascript">const focusDriver = new Driver();
// Highlight the section on focus
document.getElementById('creation-input')
.addEventListener('focus', (e) => {
focusDriver.focus('#creation-input');
});
</code></pre>
<p class="top-20">Focus any of the inputs and see how it moves the highlight from one element to the other</p>
<div id="creation-forms">
<input type="text" id="creation-input" class="form-control" placeholder="Focus any of the inputs">
<input type="text" id="creation-input-2" class="form-control" placeholder="Focus any of the inputs">
<input type="text" id="creation-input-3" class="form-control" placeholder="Focus any of the inputs">
<input type="text" id="creation-input-4" class="form-control" placeholder="Focus any of the inputs">
</div>
</div>
<p>You can also turn off the animation or set the padding around the corner. More on it later.</p>
<hr class="hr__fancy">
<div id="single-element-with-popover" class="section__example">
<h4>Highlighting a Single Element – With Popover</h4>
<p>If you would like to show some details alongside the highlighted element, you can do that easily by specifying
title and description</p>
<a href="#" class="btn__run-demo" id="run-single-element-with-popover">Show Demo</a>
<pre><code class="javascript">const driver = new Driver();
driver.highlight({
element: '#some-element',
popover: {
title: 'Title for the Popover',
description: 'Description for it',
}
});
</code></pre>
<p class="top-20">You can modify the behavior of this popover also by a certain set of options. More on it
below.</p>
</div>
<hr class="hr__fancy">
<div id="single-element-with-popover-position" class="section__example">
<h4>Popover Positioning</h4>
<p>You can also, change the position of the popover to be either <code>left</code>, <code>left-center</code>, <code>left-bottom</code>, <code>top</code>, <code>top-center</code>, <code>top-right</code>,
<code>right</code>, <code>right-center</code>, <code>right-bottom</code> or <code>bottom</code>, <code>bottom-center</code>, <code>bottom-right</code>.</p>
<a href="#" class="btn__run-demo" id="run-single-element-with-popover-position">Show Demo</a>
<pre><code class="javascript">const driver = new Driver();
driver.highlight({
element: '#some-element',
popover: {
title: 'Title for the Popover',
description: 'Description for it',
// position can be left, left-center, left-bottom, top,
// top-center, top-right, right, right-center, right-bottom,
// bottom, bottom-center, bottom-right
position: 'left',
}
});
</code></pre>
</div>
<div class="section__example">
<div class="top-20 position-btns">
<a href="#" id="position-btn-left">On my Left</a>
<a href="#" id="position-btn-top">On my Top</a>
<a href="#" id="position-btn-bottom">On my Bottom</a>
<a href="#" id="position-btn-right">On my Right</a>
</div>
<p class="top-20">If you don't specify the position or specify it to be <code>auto</code>, it will automatically
find the suitable position for the popover and show it</p>
</div>
<hr class="hr__fancy">
<div id="single-element-with-popover-html" class="section__example">
<h4>HTML in Popovers</h4>
<p>You can also specify HTML in the body or the title of the popovers. Here is an example:</p>
<a href="#" class="btn__run-demo" id="run-single-element-with-popover-html">Show Demo</a>
<pre><code class="javascript">const driver = new Driver();
driver.highlight({
element: '#some-element',
popover: {
title: '&lt;em&gt;An italicized title&lt;/em&gt;',
description: 'Description may also contain &lt;strong&gt;HTML&lt;/strong&gt;'
}
});
</code></pre>
</div>
<p class="top-20">And of course it can be any valid HTML.</p>
<hr class="hr__fancy">
<div id="single-element-no-close" class="section__example">
<h4>Disable Close on Outside Click</h4>
<p>By default, driver.js gets reset if user clicks outside the highlighted element, you can disable this:</p>
<a href="#" class="btn__run-demo" id="run-single-element-no-close">Show Demo</a>
<pre><code class="javascript">const driver = new Driver({
allowClose: false,
});
driver.highlight({
element: '#some-element',
popover: {
title: '&lt;em&gt;An italicized title&lt;/em&gt;',
description: 'Description may also contain &lt;strong&gt;HTML&lt;/strong&gt;'
}
});
</code></pre>
<p class="top-20">
If you use this option, for multi-step driver, it would close after you are done with the popover or you can close it programmatically. For single element popover, you need to close it properly, otherwise it won't be closed
</p>
<pre><code class="javascript">driver.reset()</code>
</div>
<hr class="hr__fancy">
<div id="third-element-introduction" class="section__example">
<h4 id="first-element-introduction">Creating Feature Introductions</h4>
<p id="second-para-feature-introductions">You can also make powerful feature introductions to guide the users
about the features. Just provide an array of steps where each step specifies an element to highlight.</p>
<p id="third-para-feature-introductions">Below is just a quick example showing you how to combine the steps in
introduction.</p>
<a href="#" class="btn__run-demo" id="run-multi-element-popovers">Show Demo</a>
</div>
<pre><code class="javascript">const driver = new Driver();
// Define the steps for introduction
driver.defineSteps([
{
element: '#first-element-introduction',
popover: {
title: 'Title on Popover',
description: 'Body of the popover',
position: 'left'
}
},
{
element: '#second-element-introduction',
popover: {
title: 'Title on Popover',
description: 'Body of the popover',
position: 'top'
}
},
{
element: '#third-element-introduction',
popover: {
title: 'Title on Popover',
description: 'Body of the popover',
position: 'right'
}
},
]);
// Start the introduction
driver.start();
</code></pre>
<p class="top-20">This is just a quick example for the feature introduction. For a richer one, please have a look at
the
<a href="#" class="btn__example">"Quick Tour"</a></p>
<p>You may also turn off the footer buttons in popover, in which case user can control the popover using the arrows
keys on keyboard. Or you may control it using the methods provided by Driver.</p>
<hr class="hr__fancy">
<div id="element-without-popover" class="section__example">
<h4>Without Overlay</h4>
<p>You can create feature introductions and do everything listed above without overlays also. All you have to do
is just set the opacity to `0`.</p>
<a href="#" class="btn__run-demo" id="run-element-without-popover">Show Demo</a>
<pre><code class="javascript">const driver = new Driver({
opacity: 0,
});
driver.highlight({
element: '#run-element-without-popover',
popover: {
title: 'Title for the Popover',
description: 'Description for it',
position: 'top', // can be `top`, `left`, `right`, `bottom`
}
});
</code></pre>
<p class="top-20">..and you can do the same for the feature introductions</p>
</div>
<hr class="hr__fancy">
<div class="section__example">
<div id="api_section">
<h3>..and much much more</h3>
<p>Driver comes with many options that you can manipulate to make driver behave as you may like</p>
</div>
<h4>Driver Definition</h4>
<p>Here are the options that Driver understands</p>
<pre><code class="javascript">const driver = new Driver({
animate: true, // Animate while changing highlighted element
opacity: 0.75, // Background opacity (0 means only popovers and without overlay)
padding: 10, // Distance of element from around the edges
allowClose: true, // Whether clicking on overlay should close or not
overlayClickNext: false, // Should it move to next step on overlay click
doneBtnText: 'Done', // Text on the final button
closeBtnText: 'Close', // Text on the close button for this step
nextBtnText: 'Next', // Next button text for this step
prevBtnText: 'Previous', // Previous button text for this step
showButtons: false, // Do not show control buttons in footer
keyboardControl: true, // Allow controlling through keyboard (escape to close, arrow keys to move)
scrollIntoViewOptions: {}, // We use `scrollIntoView()` when possible, pass here the options for it if you want any
onHighlightStarted: (Element) {}, // Called when element is about to be highlighted
onHighlighted: (Element) {}, // Called when element is fully highlighted
onDeselected: (Element) {}, // Called when element has been deselected
onReset: (Element) {}, // Called when overlay is about to be cleared
onNext: (Element) => {}, // Called when moving to next step on any step
onPrevious: (Element) => {}, // Called when moving to next step on any step
});
</code></pre>
</div>
<p class="top-20">Note that all the button options that you provide in the driver definition can be overridden for a
specific step by giving them in the step definition</p>
<div class="section__example">
<h4>Step Definition</h4>
<p>Here are the set of options that you can pass in each step i.e. an item in array of steps or the object that
you pass to <code>highlight</code> method</p>
<pre><code class="javascript">const stepDefinition = {
element: '#some-item', // Query selector string or Node to be highlighted
popover: { // There will be no popover if empty or not given
title: 'Title', // Title on the popover
description: 'Description', // Body of the popover
showButtons: false, // Do not show control buttons in footer
closeBtnText: 'Close', // Text on the close button for this step
nextBtnText: 'Next', // Next button text for this step
prevBtnText: 'Previous', // Previous button text for this step
}
};
</code></pre>
</div>
<div class="section__example">
<h4>API Methods</h4>
<p>Below are the set of methods that are available to you</p>
<pre><code class="javascript">const driver = new Driver(driverOptions);
const isActivated = driver.isActivated; // Checks if the driver is active or not
driver.moveNext(); // Moves to next step in the steps list
driver.movePrevious(); // Moves to previous step in the steps list
driver.start(stepNumber = 0); // Starts driving through the defined steps
driver.highlight(string|stepDefinition); // highlights the element using query selector or the step definition
driver.reset(); // Resets the overlay and clears the screen
driver.hasHighlightedElement(); // Checks if there is any highlighted element
driver.hasNextStep(); // Checks if there is next step to move to
driver.hasPreviousStep(); // Checks if there is previous step to move to
// Prevents the current move. Useful in `onNext` or `onPrevious` if you want to
// perform some asynchronous task and manually move to next step
driver.preventMove();
// Gets the currently highlighted element on screen
const activeElement = driver.getHighlightedElement();
const lastActiveElement = driver.getLastHighlightedElement();
activeElement.getCalculatedPosition(); // Gets screen co-ordinates of the active element
activeElement.hidePopover(); // Hide the popover
activeElement.showPopover(); // Show the popover
activeElement.getNode(); // Gets the DOM Element behind this element
</code></pre>
</div>
<p class="top-20">You can use a variety of options to achieve whatever you may want. I have some plans on improving
it further, make sure to keep an eye on the <a href="https://github.com/kamranahmedse/driver.js" target="_blank">GitHub
page</a></p>
</section>
<hr class="hr__fancy">
<div class="section__example">
<h4>Contributing</h4>
<p>You can find the contribution instructions on the <a href="https://github.com/kamranahmedse/driver.js"
target="_blank">GitHub page</a>. Feel free to submit an
issue, create a pull request or spread the word</p>
</div>
<hr class="hr__fancy">
<div class="section__example">
<p>A product by <a href="http://twitter.com/kamranahmedse" target="_blank">Kamran</a> produced out of boredom and
frustration after he gave up on trying to find a perfect solution to integrate journey introduction
and overlays.</p>
<a href="https://twitter.com/kamranahmedse?ref_src=twsrc%5Etfw"
class="twitter-follow-button mr-3"
data-show-screen-name="false"
data-size="large"
target="_blank"
data-show-count="true">Follow @kamranahmedse</a>
<a class="github-button" href="https://github.com/kamranahmedse"
data-size="large"
target="_blank"
data-show-count="true"
aria-label="Follow @kamranahmedse on GitHub">Follow</a>
</div>
</div>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<script async defer src="//buttons.github.io/buttons.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments);
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m);
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-58155965-1', 'auto');
ga('send', 'pageview');
</script>
<script type="text/javascript" src="./driver-demo.min.js"></script></body>
</html>
dist/driver.min.css.map 已删除 100644 → 0
浏览文件 @ 7d210983
{"version":3,"file":"driver.min.css","sources":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","sourceRoot":""}
\ No newline at end of file
package.json
浏览文件 @ a98e9c86
......@@ -8,7 +8,7 @@
"start": "node server.js",
"build-demo": "NODE_ENV=production webpack --config config/webpack.config.demo.js",
"build": "webpack --config config/webpack.config.prod.js",
"deploy-demo": "gh-pages -d dist/demo"
"deploy-demo": "NODE_DEBUG=gh-pages gh-pages -d dist/demo"
},
"bugs": {
"url": "https://github.com/kamranahmedse/driver.js/issues"
......@@ -36,6 +36,7 @@
"extract-text-webpack-plugin": "next",
"file-loader": "^2.0.0",
"gh-pages": "^2.0.1",
"html-webpack-plugin": "^3.2.0",
"node-sass": "^4.7.2",
"opn": "^5.2.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
......
server.js
浏览文件 @ a98e9c86
......@@ -6,7 +6,7 @@ const config = require('./config/webpack.config.demo');
const PORT = 3000;
const HOST = 'localhost';
const URL = `http://${HOST}:${PORT}`;
const URL = `http://${HOST}:${PORT}/dist/demo`;
new WebpackDevServer(webpack(config), {
publicPath: config.output.publicPath,
......
yarn.lock
浏览文件 @ a98e9c86
......@@ -1354,6 +1354,14 @@ callsites@^0.2.0:
resolved "https://registry.yarnpkg.com/callsites/-/callsites-0.2.0.tgz#afab96262910a7f33c19a5775825c69f34e350ca"
integrity sha1-r6uWJikQp/M8GaV3WCXGnzTjUMo=
camel-case@3.0.x:
version "3.0.0"
resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-3.0.0.tgz#ca3c3688a4e9cf3a4cda777dc4dcbc713249cf73"
integrity sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M=
dependencies:
no-case "^2.2.0"
upper-case "^1.1.1"
camelcase-keys@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
......@@ -1482,6 +1490,13 @@ class-utils@^0.3.5:
isobject "^3.0.0"
static-extend "^0.1.1"
clean-css@4.2.x:
version "4.2.1"
resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.1.tgz#2d411ef76b8569b6d0c84068dabe85b0aa5e5c17"
integrity sha512-4ZxI6dy4lrY6FHzfiy1aEOXgu4LIsW2MhwG0VBKdcoGoH/XLFgaHSdLTGr4O8Be6A8r3MOphEiI8Gc1n0ecf3g==
dependencies:
source-map "~0.6.0"
cli-cursor@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/cli-cursor/-/cli-cursor-2.1.0.tgz#b35dac376479facc3e94747d41d0d0f5238ffcb5"
......@@ -1604,6 +1619,11 @@ combined-stream@^1.0.5, combined-stream@~1.0.5:
dependencies:
delayed-stream "~1.0.0"
commander@2.17.x, commander@~2.17.1:
version "2.17.1"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.17.1.tgz#bd77ab7de6de94205ceacc72f1716d29f20a77bf"
integrity sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg==
commander@^2.18.0:
version "2.19.0"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
......@@ -1897,6 +1917,16 @@ css-select-base-adapter@~0.1.0:
resolved "https://registry.yarnpkg.com/css-select-base-adapter/-/css-select-base-adapter-0.1.0.tgz#0102b3d14630df86c3eb9fa9f5456270106cf990"
integrity sha1-AQKz0UYw34bD65+p9UVicBBs+ZA=
css-select@^1.1.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/css-select/-/css-select-1.2.0.tgz#2b3a110539c5355f1cd8d314623e870b121ec858"
integrity sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=
dependencies:
boolbase "~1.0.0"
css-what "2.1"
domutils "1.5.1"
nth-check "~1.0.1"
css-select@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/css-select/-/css-select-2.0.0.tgz#7aa2921392114831f68db175c0b6a555df74bbd5"
......@@ -2261,6 +2291,13 @@ doctrine@^2.1.0:
dependencies:
esutils "^2.0.2"
dom-converter@~0.2:
version "0.2.0"
resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
integrity sha512-gd3ypIPfOMr9h5jIKq8E3sHOTCjeirnl0WK5ZdS1AW0Odt0b1PaWaHdJ4Qk4klv+YB9aJBS7mESXjFoDQPu6DA==
dependencies:
utila "~0.4"
dom-serializer@0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
......@@ -2284,6 +2321,28 @@ domelementtype@~1.1.1:
resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.1.3.tgz#bd28773e2642881aec51544924299c5cd822185b"
integrity sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=
domhandler@2.1:
version "2.1.0"
resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.1.0.tgz#d2646f5e57f6c3bab11cf6cb05d3c0acf7412594"
integrity sha1-0mRvXlf2w7qxHPbLBdPArPdBJZQ=
dependencies:
domelementtype "1"
domutils@1.1:
version "1.1.6"
resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.1.6.tgz#bddc3de099b9a2efacc51c623f28f416ecc57485"
integrity sha1-vdw94Jm5ou+sxRxiPyj0FuzFdIU=
dependencies:
domelementtype "1"
domutils@1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.5.1.tgz#dcd8488a26f563d61079e48c9f7b7e32373682cf"
integrity sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=
dependencies:
dom-serializer "0"
domelementtype "1"
domutils@^1.7.0:
version "1.7.0"
resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
......@@ -3382,6 +3441,11 @@ hawk@~3.1.3:
hoek "2.x.x"
sntp "1.x.x"
he@1.1.x:
version "1.1.1"
resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
integrity sha1-k0EP0hsAlzUVH4howvJx80J+I/0=
hex-color-regex@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/hex-color-regex/-/hex-color-regex-1.1.0.tgz#4c06fccb4602fe2602b3c93df82d7e7dbf1a8a8e"
......@@ -3436,6 +3500,42 @@ html-entities@^1.2.0:
resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-1.2.1.tgz#0df29351f0721163515dfb9e5543e5f6eed5162f"
integrity sha1-DfKTUfByEWNRXfueVUPl9u7VFi8=
html-minifier@^3.2.3:
version "3.5.20"
resolved "https://registry.yarnpkg.com/html-minifier/-/html-minifier-3.5.20.tgz#7b19fd3caa0cb79f7cde5ee5c3abdf8ecaa6bb14"
integrity sha512-ZmgNLaTp54+HFKkONyLFEfs5dd/ZOtlquKaTnqIWFmx3Av5zG6ZPcV2d0o9XM2fXOTxxIf6eDcwzFFotke/5zA==
dependencies:
camel-case "3.0.x"
clean-css "4.2.x"
commander "2.17.x"
he "1.1.x"
param-case "2.1.x"
relateurl "0.2.x"
uglify-js "3.4.x"
html-webpack-plugin@^3.2.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/html-webpack-plugin/-/html-webpack-plugin-3.2.0.tgz#b01abbd723acaaa7b37b6af4492ebda03d9dd37b"
integrity sha1-sBq71yOsqqeze2r0SS69oD2d03s=
dependencies:
html-minifier "^3.2.3"
loader-utils "^0.2.16"
lodash "^4.17.3"
pretty-error "^2.0.2"
tapable "^1.0.0"
toposort "^1.0.0"
util.promisify "1.0.0"
htmlparser2@~3.3.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.3.0.tgz#cc70d05a59f6542e43f0e685c982e14c924a9efe"
integrity sha1-zHDQWln2VC5D8OaFyYLhTJJKnv4=
dependencies:
domelementtype "1"
domhandler "2.1"
domutils "1.1"
readable-stream "1.0"
http-deceiver@^1.2.7:
version "1.2.7"
resolved "https://registry.yarnpkg.com/http-deceiver/-/http-deceiver-1.2.7.tgz#fa7168944ab9a519d337cb0bec7284dc3e723d87"
......@@ -3978,6 +4078,11 @@ is-wsl@^1.1.0:
resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d"
integrity sha1-HxbkqiKwTRM2tmGIpmrzxgDDpm0=
isarray@0.0.1:
version "0.0.1"
resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
integrity sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=
isarray@1.0.0, isarray@^1.0.0, isarray@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
......@@ -4215,6 +4320,16 @@ loader-runner@^2.3.0:
resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.3.0.tgz#f482aea82d543e07921700d5a46ef26fdac6b8a2"
integrity sha1-9IKuqC1UPgeSFwDVpG7yb9rGuKI=
loader-utils@^0.2.16:
version "0.2.17"
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-0.2.17.tgz#f86e6374d43205a6e6c60e9196f17c0299bfb348"
integrity sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=
dependencies:
big.js "^3.1.3"
emojis-list "^2.0.0"
json5 "^0.5.0"
object-assign "^4.0.1"
loader-utils@^1.0.1, loader-utils@^1.0.2, loader-utils@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.1.0.tgz#c98aef488bcceda2ffb5e2de646d6a754429f5cd"
......@@ -4285,6 +4400,11 @@ lodash@^4.0.0, lodash@^4.17.10, lodash@^4.17.4, lodash@^4.17.5, lodash@~4.17.10:
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
integrity sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg==
lodash@^4.17.3:
version "4.17.11"
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
integrity sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==
log-symbols@^2.1.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-2.2.0.tgz#5740e1c5d6f0dfda4ad9323b5332107ef6b4c40a"
......@@ -4325,6 +4445,11 @@ loud-rejection@^1.0.0, loud-rejection@^1.6.0:
currently-unhandled "^0.4.1"
signal-exit "^3.0.0"
lower-case@^1.1.1:
version "1.1.4"
resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-1.1.4.tgz#9a2cabd1b9e8e0ae993a4bf7d5875c39c42e8eac"
integrity sha1-miyr0bno4K6ZOkv31YdcOcQujqw=
lru-cache@^4.0.1, lru-cache@^4.1.1:
version "4.1.3"
resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.3.tgz#a1175cf3496dfc8436c156c334b4955992bce69c"
......@@ -4673,6 +4798,13 @@ nice-try@^1.0.4:
resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.4.tgz#d93962f6c52f2c1558c0fbda6d512819f1efe1c4"
integrity sha512-2NpiFHqC87y/zFke0fC0spBXL3bBsoh/p5H1EFhshxjCR5+0g2d6BiXbUFz9v1sAcxsk2htp2eQnNIci2dIYcA==
no-case@^2.2.0:
version "2.3.2"
resolved "https://registry.yarnpkg.com/no-case/-/no-case-2.3.2.tgz#60b813396be39b3f1288a4c1ed5d1e7d28b464ac"
integrity sha512-rmTZ9kz+f3rCvK2TD1Ue/oZlns7OGoIWP4fc3llxxRXlOkHKoWPPWJOfFYpITabSow43QJbRIoHQXtt10VldyQ==
dependencies:
lower-case "^1.1.1"
node-forge@0.7.5:
version "0.7.5"
resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.7.5.tgz#6c152c345ce11c52f465c2abd957e8639cd674df"
......@@ -4850,7 +4982,7 @@ npm-run-path@^2.0.0:
gauge "~2.7.3"
set-blocking "~2.0.0"
nth-check@^1.0.1:
nth-check@^1.0.1, nth-check@~1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-1.0.1.tgz#9929acdf628fc2c41098deab82ac580cf149aae4"
integrity sha1-mSms32KPwsQQmN6rgqxYDPFJquQ=
......@@ -5128,6 +5260,13 @@ parallel-transform@^1.1.0:
inherits "^2.0.3"
readable-stream "^2.1.5"
param-case@2.1.x:
version "2.1.1"
resolved "https://registry.yarnpkg.com/param-case/-/param-case-2.1.1.tgz#df94fd8cf6531ecf75e6bef9a0858fbc72be2247"
integrity sha1-35T9jPZTHs915r75oIWPvHK+Ikc=
dependencies:
no-case "^2.2.0"
parse-asn1@^5.0.0:
version "5.1.1"
resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.1.tgz#f6bf293818332bd0dab54efb16087724745e6ca8"
......@@ -5660,6 +5799,14 @@ prepend-http@^1.0.0:
resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"
integrity sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw=
pretty-error@^2.0.2:
version "2.1.1"
resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-2.1.1.tgz#5f4f87c8f91e5ae3f3ba87ab4cf5e03b1a17f1a3"
integrity sha1-X0+HyPkeWuPzuoerTPXgOxoX8aM=
dependencies:
renderkid "^2.0.1"
utila "~0.4"
private@^0.1.6:
version "0.1.8"
resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
......@@ -5876,6 +6023,16 @@ read-pkg@^2.0.0:
string_decoder "~1.1.1"
util-deprecate "~1.0.1"
readable-stream@1.0:
version "1.0.34"
resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
integrity sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=
dependencies:
core-util-is "~1.0.0"
inherits "~2.0.1"
isarray "0.0.1"
string_decoder "~0.10.x"
readdirp@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-2.1.0.tgz#4ed0ad060df3073300c48440373f72d1cc642d78"
......@@ -5984,11 +6141,27 @@ regjsparser@^0.3.0:
dependencies:
jsesc "~0.5.0"
relateurl@0.2.x:
version "0.2.7"
resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
integrity sha1-VNvzd+UUQKypCkzSdGANP/LYiKk=
remove-trailing-separator@^1.0.1:
version "1.1.0"
resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
integrity sha1-wkvOKig62tW8P1jg1IJJuSN52O8=
renderkid@^2.0.1:
version "2.0.2"
resolved "https://registry.yarnpkg.com/renderkid/-/renderkid-2.0.2.tgz#12d310f255360c07ad8fde253f6c9e9de372d2aa"
integrity sha512-FsygIxevi1jSiPY9h7vZmBFUbAOcbYm9UwyiLNdVsLRs/5We9Ob5NMPbGYUTWiLq5L+ezlVdE0A8bbME5CWTpg==
dependencies:
css-select "^1.1.0"
dom-converter "~0.2"
htmlparser2 "~3.3.0"
strip-ansi "^3.0.0"
utila "^0.4.0"
repeat-element@^1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.2.tgz#ef089a178d1483baae4d93eb98b4f9e4e11d990a"
......@@ -6519,7 +6692,7 @@ source-map@^0.5.0, source-map@^0.5.3, source-map@^0.5.6:
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
source-map@^0.6.1, source-map@~0.6.1:
source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
version "0.6.1"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
......@@ -6701,6 +6874,11 @@ string_decoder@^1.0.0, string_decoder@~1.1.1:
dependencies:
safe-buffer "~5.1.0"
string_decoder@~0.10.x:
version "0.10.31"
resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
integrity sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=
stringstream@~0.0.4:
version "0.0.6"
resolved "https://registry.yarnpkg.com/stringstream/-/stringstream-0.0.6.tgz#7880225b0d4ad10e30927d167a1d6f2fd3b33a72"
......@@ -6933,6 +7111,11 @@ to-regex@^3.0.1, to-regex@^3.0.2:
regex-not "^1.0.2"
safe-regex "^1.1.0"
toposort@^1.0.0:
version "1.0.7"
resolved "https://registry.yarnpkg.com/toposort/-/toposort-1.0.7.tgz#2e68442d9f64ec720b8cc89e6443ac6caa950029"
integrity sha1-LmhELZ9k7HILjMieZEOsbKqVACk=
tough-cookie@~2.3.0:
version "2.3.4"
resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.3.4.tgz#ec60cee38ac675063ffc97a5c18970578ee83655"
......@@ -7019,6 +7202,14 @@ uglify-es@^3.3.4:
commander "~2.13.0"
source-map "~0.6.1"
uglify-js@3.4.x:
version "3.4.9"
resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.4.9.tgz#af02f180c1207d76432e473ed24a28f4a782bae3"
integrity sha512-8CJsbKOtEbnJsTyv6LE6m6ZKniqMiFWmm9sRbopbkGs3gMPPfd3Fh8iIA4Ykv5MgaTbqHr4BaoGLJLZNhsrW1Q==
dependencies:
commander "~2.17.1"
source-map "~0.6.1"
uglifyjs-webpack-plugin@^1.2.4:
version "1.2.7"
resolved "https://registry.yarnpkg.com/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.2.7.tgz#57638dd99c853a1ebfe9d97b42160a8a507f9d00"
......@@ -7118,6 +7309,11 @@ upath@^1.0.5:
resolved "https://registry.yarnpkg.com/upath/-/upath-1.1.0.tgz#35256597e46a581db4793d0ce47fa9aebfc9fabd"
integrity sha512-bzpH/oBhoS/QI/YtbkqCg6VEiPYjSZtrHQM6/QnJS6OL9pKUFLqb3aFh4Scvwm45+7iAgiMkLhSbaZxUqmrprw==
upper-case@^1.1.1:
version "1.1.3"
resolved "https://registry.yarnpkg.com/upper-case/-/upper-case-1.1.3.tgz#f6b4501c2ec4cdd26ba78be7222961de77621598"
integrity sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=
uri-js@^4.2.1, uri-js@^4.2.2:
version "4.2.2"
resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.2.2.tgz#94c540e1ff772956e2299507c010aea6c8838eb0"
......@@ -7163,7 +7359,7 @@ util-deprecate@~1.0.1:
resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
util.promisify@^1.0.0, util.promisify@~1.0.0:
util.promisify@1.0.0, util.promisify@^1.0.0, util.promisify@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/util.promisify/-/util.promisify-1.0.0.tgz#440f7165a459c9a16dc145eb8e72f35687097030"
integrity sha512-i+6qA2MPhvoKLuxnJNpXAGhg7HphQOSUq2LKMZD0m15EiskXUkMvKdF4Uui0WYeCUGea+o2cw/ZuwehtfsrNkA==
......@@ -7185,6 +7381,11 @@ util@^0.10.3:
dependencies:
inherits "2.0.3"
utila@^0.4.0, utila@~0.4:
version "0.4.0"
resolved "https://registry.yarnpkg.com/utila/-/utila-0.4.0.tgz#8a16a05d445657a3aea5eecc5b12a4fa5379772c"
integrity sha1-ihagXURWV6Oupe7MWxKk+lN5dyw=
utils-merge@1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或