Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
大大大太阳yt
driver.js
提交
1114a703
D
driver.js
项目概览
大大大太阳yt
/
driver.js
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
driver.js
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
1114a703
编写于
3月 13, 2018
作者:
K
Kamran Ahmed
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Add ability to disable animation and perf
上级
c2c28803
变更
7
隐藏空白更改
内联
并排
Showing
7 changed file
with
42 addition
and
12 deletion
+42
-12
demo/scripts/demo.js
demo/scripts/demo.js
+1
-1
src/common/constants.js
src/common/constants.js
+1
-0
src/core/element.js
src/core/element.js
+6
-2
src/core/overlay.js
src/core/overlay.js
+13
-3
src/core/stage.js
src/core/stage.js
+8
-4
src/driver.scss
src/driver.scss
+13
-1
src/index.js
src/index.js
+0
-1
未找到文件。
demo/scripts/demo.js
浏览文件 @
1114a703
/* eslint-disable */
document
.
addEventListener
(
"
DOMContentLoaded
"
,
function
()
{
const
tourDriver
=
new
Driver
({
animate
:
tru
e
,
animate
:
fals
e
,
opacity
:
0.8
,
padding
:
5
,
showButtons
:
true
,
...
...
src/common/constants.js
浏览文件 @
1114a703
...
...
@@ -12,6 +12,7 @@ export const ID_POPOVER = 'driver-popover-item';
export
const
CLASS_DRIVER_HIGHLIGHTED_ELEMENT
=
'
driver-highlighted-element
'
;
export
const
CLASS_NO_ANIMATION
=
'
sholo-no-animation
'
;
export
const
CLASS_POPOVER_TIP
=
'
driver-popover-tip
'
;
export
const
CLASS_POPOVER_TITLE
=
'
driver-popover-title
'
;
export
const
CLASS_POPOVER_DESCRIPTION
=
'
driver-popover-description
'
;
...
...
src/core/element.js
浏览文件 @
1114a703
...
...
@@ -251,11 +251,15 @@ export default class Element {
const
showAtPosition
=
this
.
getCalculatedPosition
();
// For first highlight, show it immediately because there won't be any animation
const
animationDuration
=
!
this
.
overlay
.
lastHighlightedElement
?
0
:
ANIMATION_DURATION_MS
;
let
showAfterMs
=
ANIMATION_DURATION_MS
;
// If animation is disabled or if it is the first display, show it immediately
if
(
!
this
.
options
.
animate
||
!
this
.
overlay
.
lastHighlightedElement
)
{
showAfterMs
=
0
;
}
this
.
animationTimeout
=
this
.
window
.
setTimeout
(()
=>
{
this
.
popover
.
show
(
showAtPosition
);
},
animationDuration
);
},
showAfterMs
);
}
/**
...
...
src/core/overlay.js
浏览文件 @
1114a703
import
Position
from
'
./position
'
;
import
{
ANIMATION_DURATION_MS
,
ID_OVERLAY
,
OVERLAY_HTML
}
from
'
../common/constants
'
;
import
{
ANIMATION_DURATION_MS
,
CLASS_NO_ANIMATION
,
ID_OVERLAY
,
OVERLAY_HTML
}
from
'
../common/constants
'
;
import
{
createNodeFromString
}
from
'
../common/utils
'
;
/**
...
...
@@ -36,6 +36,12 @@ export default class Overlay {
this
.
node
=
pageOverlay
;
this
.
node
.
style
.
opacity
=
'
0
'
;
if
(
!
this
.
options
.
animate
)
{
this
.
node
.
classList
.
add
(
CLASS_NO_ANIMATION
);
}
else
{
this
.
node
.
classList
.
remove
(
CLASS_NO_ANIMATION
);
}
}
/**
...
...
@@ -75,13 +81,17 @@ export default class Overlay {
this
.
highlightedElement
=
element
;
this
.
positionToHighlight
=
position
;
this
.
show
Overlay
();
this
.
show
();
// Element has been highlighted
this
.
highlightedElement
.
onHighlighted
();
}
showOverlay
()
{
show
()
{
if
(
this
.
node
&&
this
.
node
.
parentElement
)
{
return
;
}
this
.
makeNode
();
window
.
setTimeout
(()
=>
{
...
...
src/core/stage.js
浏览文件 @
1114a703
import
{
ID_STAGE
,
STAGE_HTML
}
from
'
../common/constants
'
;
import
{
CLASS_NO_ANIMATION
,
ID_STAGE
,
STAGE_HTML
}
from
'
../common/constants
'
;
import
{
createNodeFromString
}
from
'
../common/utils
'
;
import
Element
from
'
./element
'
;
...
...
@@ -18,9 +18,6 @@ export default class Stage extends Element {
this
.
options
=
options
;
this
.
window
=
window
;
this
.
document
=
document
;
this
.
makeNode
();
this
.
hide
();
}
/**
...
...
@@ -34,6 +31,12 @@ export default class Stage extends Element {
}
this
.
node
=
stage
;
if
(
!
this
.
options
.
animate
)
{
this
.
node
.
classList
.
add
(
CLASS_NO_ANIMATION
);
}
else
{
this
.
node
.
classList
.
remove
(
CLASS_NO_ANIMATION
);
}
}
removeNode
()
{
...
...
@@ -49,6 +52,7 @@ export default class Stage extends Element {
*/
hide
()
{
this
.
node
.
style
.
display
=
'
none
'
;
this
.
removeNode
();
}
...
...
src/driver.scss
浏览文件 @
1114a703
...
...
@@ -107,9 +107,21 @@ div#driver-popover-item {
}
}
.sholo-no-animation
{
-webkit-transition
:
none
!
important
;
-moz-transition
:
none
!
important
;
-ms-transition
:
none
!
important
;
-o-transition
:
none
!
important
;
transition
:
none
!
important
;
}
div
#driver-page-overlay
{
background
:
black
;
position
:
absolute
;
position
:
fixed
;
top
:
0
;
left
:
0
;
bottom
:
0
;
right
:
0
;
display
:
block
;
width
:
100%
;
height
:
100%
;
...
...
src/index.js
浏览文件 @
1114a703
...
...
@@ -184,7 +184,6 @@ export default class Driver {
return
;
}
// Refresh with animation
this
.
overlay
.
refresh
();
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录