Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
大大大太阳yt
driver.js
提交
a47eab3e
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,发现更多精彩内容 >>
提交
a47eab3e
编写于
3月 10, 2018
作者:
K
Kamran Ahmed
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Add JSDoc
上级
e5c37ad5
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
66 addition
and
34 deletion
+66
-34
assets/scripts/src/element.js
assets/scripts/src/element.js
+22
-6
assets/scripts/src/overlay.js
assets/scripts/src/overlay.js
+21
-17
assets/scripts/src/popover.js
assets/scripts/src/popover.js
+18
-6
assets/scripts/src/position.js
assets/scripts/src/position.js
+4
-4
assets/scripts/src/sholo.js
assets/scripts/src/sholo.js
+1
-1
未找到文件。
assets/scripts/src/element.js
浏览文件 @
a47eab3e
...
...
@@ -7,12 +7,12 @@ import Position from './position';
export
default
class
Element
{
/**
* DOM element object
* @param node
* @param options
* @param popover
* @param overlay
* @param window
* @param document
* @param
{Node}
node
* @param
{Object}
options
* @param
{Popover}
popover
* @param
{Overlay}
overlay
* @param
{Window}
window
* @param
{Document}
document
*/
constructor
(
node
,
options
,
popover
,
overlay
,
window
,
document
)
{
this
.
node
=
node
;
...
...
@@ -43,6 +43,10 @@ export default class Element {
return
{
x
,
y
};
}
/**
* Checks if the current element is visible in viewport
* @returns {boolean}
*/
isInView
()
{
let
top
=
this
.
node
.
offsetTop
;
let
left
=
this
.
node
.
offsetLeft
;
...
...
@@ -65,6 +69,9 @@ export default class Element {
);
}
/**
* Brings the element to middle of the view port if not in view
*/
bringInView
()
{
if
(
this
.
isInView
())
{
return
;
...
...
@@ -127,6 +134,9 @@ export default class Element {
this
.
showPopover
();
}
/**
* Is called when the element has been successfully highlighted
*/
onHighlighted
()
{
if
(
this
.
popover
)
{
this
.
showPopover
();
...
...
@@ -152,12 +162,18 @@ export default class Element {
}
}
/**
* Shows the popover on the current element
*/
showPopover
()
{
const
position
=
this
.
getCalculatedPosition
();
this
.
popover
.
show
(
position
);
}
/**
* @returns {{height: number, width: number}}
*/
getFullPageSize
()
{
// eslint-disable-next-line prefer-destructuring
const
body
=
this
.
document
.
body
;
...
...
assets/scripts/src/overlay.js
浏览文件 @
a47eab3e
...
...
@@ -7,9 +7,9 @@ import { ID_OVERLAY, OVERLAY_ZINDEX } from './constants';
*/
export
default
class
Overlay
{
/**
* @param options
* @param window
* @param document
* @param
{Object}
options
* @param
{Window}
window
* @param
{Document}
document
*/
constructor
(
options
,
window
,
document
)
{
this
.
options
=
options
;
...
...
@@ -56,8 +56,8 @@ export default class Overlay {
/**
* Highlights the dom element on the screen
* @param
element E
lement
* @param
animate bool
* @param
{Element} e
lement
* @param
{boolean} animate
*/
highlight
(
element
,
animate
=
true
)
{
if
(
!
element
||
!
element
.
node
)
{
...
...
@@ -124,7 +124,7 @@ export default class Overlay {
}
/**
* `draw` is called for
in requestAnimationFrame
. Puts back the
* `draw` is called for
every frame
. Puts back the
* filled overlay on body (i.e. while removing existing highlight if any) and
* Slowly eases towards the item to be selected.
*/
...
...
@@ -200,6 +200,10 @@ export default class Overlay {
}
}
/**
* Checks if there as any position highlighted
* @returns {boolean}
*/
hasPositionHighlighted
()
{
return
this
.
positionToHighlight
.
equals
(
this
.
highlightedPosition
)
&&
this
.
overlayAlpha
>
(
this
.
options
.
opacity
-
0.05
);
...
...
@@ -210,10 +214,10 @@ export default class Overlay {
* i.e. cuts the chunk of layout which is over the element
* to be highlighted
*
* @param
posX number
* @param
posY number
* @param
width number
* @param
height number
* @param
{number} posX
* @param
{number} posY
* @param
{number} width
* @param
{number} height
*/
removeCloak
({
posX
=
0
,
...
...
@@ -228,10 +232,10 @@ export default class Overlay {
* Adds the overlay i.e. to cover the given
* position with dark overlay
*
* @param
posX number
* @param
posY number
* @param
width number
* @param
height number
* @param
{number} posX
* @param
{number} posY
* @param
{number} width
* @param
{number} height
*/
addCloak
({
posX
=
0
,
...
...
@@ -246,8 +250,8 @@ export default class Overlay {
/**
* Sets the size for the overlay
*
* @param
width number
* @param
height number
* @param
{number|null} width
* @param
{number|null} height
*/
setSize
(
width
=
null
,
height
=
null
)
{
// By default it is going to cover the whole page and then we will
...
...
@@ -260,7 +264,7 @@ export default class Overlay {
* Refreshes the overlay i.e. sets the size according to current window size
* And moves the highlight around if necessary
*
* @param
animate bool
* @param
{boolean} animate
*/
refresh
(
animate
=
true
)
{
this
.
setSize
();
...
...
assets/scripts/src/popover.js
浏览文件 @
a47eab3e
...
...
@@ -14,6 +14,11 @@ import {
* Popover that is displayed on top of the highlighted element
*/
export
default
class
Popover
extends
Element
{
/**
* @param {Object} options
* @param {Window} window
* @param {Document} document
*/
constructor
(
options
,
window
,
document
)
{
super
();
...
...
@@ -35,6 +40,9 @@ export default class Popover extends Element {
this
.
hide
();
}
/**
* Prepares the dom element for popover
*/
makeNode
()
{
let
popover
=
this
.
document
.
getElementById
(
ID_POPOVER
);
if
(
!
popover
)
{
...
...
@@ -65,6 +73,10 @@ export default class Popover extends Element {
return
div
.
firstChild
;
}
/**
* Gets the size for popover
* @returns {{height: number, width: number}}
*/
getSize
()
{
return
{
height
:
Math
.
max
(
this
.
node
.
scrollHeight
,
this
.
node
.
offsetHeight
),
...
...
@@ -91,7 +103,7 @@ export default class Popover extends Element {
/**
* Shows the popover at the given position
* @param position
* @param
{Position}
position
*/
show
(
position
)
{
this
.
reset
();
...
...
@@ -154,7 +166,7 @@ export default class Popover extends Element {
/**
* Shows the popover on the left of the given position
* @param elementPosition
* @param
{Position}
elementPosition
*/
positionOnLeft
(
elementPosition
)
{
const
popoverWidth
=
this
.
getSize
().
width
;
...
...
@@ -170,7 +182,7 @@ export default class Popover extends Element {
/**
* Shows the popover on the right of the given position
* @param elementPosition
* @param
{Position}
elementPosition
*/
positionOnRight
(
elementPosition
)
{
const
popoverMargin
=
this
.
options
.
padding
+
10
;
// adding 10 to give it a little distance from the element
...
...
@@ -185,7 +197,7 @@ export default class Popover extends Element {
/**
* Shows the popover on the top of the given position
* @param elementPosition
* @param
{Position}
elementPosition
*/
positionOnTop
(
elementPosition
)
{
const
popoverHeight
=
this
.
getSize
().
height
;
...
...
@@ -201,7 +213,7 @@ export default class Popover extends Element {
/**
* Shows the popover on the bottom of the given position
* @param elementPosition
* @param
{Position}
elementPosition
*/
positionOnBottom
(
elementPosition
)
{
const
popoverMargin
=
this
.
options
.
padding
+
10
;
// adding 10 to give it a little distance from the element
...
...
@@ -218,7 +230,7 @@ export default class Popover extends Element {
* Automatically positions the popover around the given position
* such that the element and popover remain in view
* @todo add the left and right positioning decisions
* @param elementPosition
* @param
{Position}
elementPosition
*/
autoPosition
(
elementPosition
)
{
const
pageSize
=
this
.
getFullPageSize
();
...
...
assets/scripts/src/position.js
浏览文件 @
a47eab3e
...
...
@@ -4,10 +4,10 @@
*/
export
default
class
Position
{
/**
* @param
left number
* @param
top number
* @param
right number
* @param
bottom number
* @param
{number} left
* @param
{number} top
* @param
{number} right
* @param
{number} bottom
*/
constructor
({
left
=
0
,
...
...
assets/scripts/src/sholo.js
浏览文件 @
a47eab3e
...
...
@@ -18,7 +18,7 @@ import {
*/
export
default
class
Sholo
{
/**
* @param options
* @param
{Object}
options
*/
constructor
(
options
=
{})
{
this
.
options
=
Object
.
assign
({
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录