Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenDocCN
theme-apachecn
提交
348d784c
T
theme-apachecn
项目概览
OpenDocCN
/
theme-apachecn
通知
0
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
theme-apachecn
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
348d784c
编写于
6月 06, 2016
作者:
J
Johan Preynat
浏览文件
操作
浏览文件
下载
差异文件
Merge pull request #19 from GitbookIO/summary/scrolling
Automatically update summary when scrolling
上级
d6a12a34
405a33c9
变更
7
隐藏空白更改
内联
并排
Showing
7 changed file
with
192 addition
and
20 deletion
+192
-20
.eslintrc
.eslintrc
+1
-0
src/js/core/page.js
src/js/core/page.js
+9
-9
src/js/theme/navigation.js
src/js/theme/navigation.js
+167
-11
src/js/theme/platform.js
src/js/theme/platform.js
+6
-0
src/less/website/header.less
src/less/website/header.less
+4
-0
src/less/website/page.less
src/less/website/page.less
+1
-0
src/less/website/summary.less
src/less/website/summary.less
+4
-0
未找到文件。
.eslintrc
浏览文件 @
348d784c
{
"rules": {
"no-extra-boolean-cast": [ 0 ],
"indent": [ 2, 4 ],
"quotes": [ 2, "single" ],
"linebreak-style": [ 2, "unix" ],
...
...
src/js/core/page.js
浏览文件 @
348d784c
...
...
@@ -11,7 +11,7 @@ var state = {};
themes after page is loaded and when navigation changed
*/
function
hasChanged
(
ctx
)
{
console
.
log
(
'
page has changed
'
,
ctx
);
console
.
log
(
'
page has changed
'
,
ctx
);
// eslint-disable-line no-console
setState
(
ctx
);
if
(
!
started
)
{
...
...
@@ -26,7 +26,7 @@ function hasChanged(ctx) {
/*
Update current state
data-level="{{ page.level }}"
data-level="{{ page.level }}"
data-chapter-title="{{ page.title }}"
data-filepath="{{ file.path }}"
data-basepath="{{ './'|resolveFile }}"
...
...
@@ -43,11 +43,11 @@ function setState(newState) {
state
.
book
=
newState
.
book
;
// Deprecated
state
.
$book
=
$
(
'
.book
'
);
state
.
revision
=
state
.
gitbook
.
time
;
state
.
level
=
state
.
page
.
level
;
state
.
filepath
=
state
.
file
.
path
;
state
.
chapterTitle
=
state
.
page
.
title
;
state
.
$book
=
$
(
'
.book
'
);
state
.
revision
=
state
.
gitbook
.
time
;
state
.
level
=
state
.
page
.
level
;
state
.
filepath
=
state
.
file
.
path
;
state
.
chapterTitle
=
state
.
page
.
title
;
state
.
innerLanguage
=
state
.
book
.
language
||
''
;
// Absolute url to the root of the book (inner book)
...
...
@@ -70,6 +70,6 @@ function getState() {
module
.
exports
=
{
hasChanged
:
hasChanged
,
setState
:
setState
,
getState
:
getState
setState
:
setState
,
getState
:
getState
};
src/js/theme/navigation.js
浏览文件 @
348d784c
...
...
@@ -12,7 +12,7 @@ var usePushState = (typeof history.pushState !== 'undefined');
Get current scroller element
*/
function
getScroller
()
{
if
(
platform
.
is
Mobile
())
{
if
(
platform
.
is
SmallScreen
())
{
return
$
(
'
.book-body
'
);
}
else
{
return
$
(
'
.body-inner
'
);
...
...
@@ -23,16 +23,144 @@ function getScroller() {
Scroll to a specific hash tag in the content
*/
function
scrollToHash
(
hash
)
{
var
$scroller
=
getScroller
()
;
var
dest
=
0
;
var
$scroller
=
getScroller
()
,
dest
=
0
;
if
(
hash
)
{
dest
=
$scroller
.
find
(
hash
).
position
().
top
;
dest
=
getElementTopPosition
(
hash
)
;
}
// Unbind scroll detection
$scroller
.
unbind
(
'
scroll
'
);
$scroller
.
animate
({
scrollTop
:
dest
},
800
,
'
swing
'
);
},
800
,
'
swing
'
,
function
()
{
// Reset scroll binding when finished
$scroller
.
scroll
(
handleScrolling
);
});
// Directly set chapter as active
setChapterActive
(
null
,
hash
);
}
/*
Return the top position of an element
*/
function
getElementTopPosition
(
id
)
{
// Get actual position of element if nested
var
$scroller
=
getScroller
(),
$container
=
$scroller
.
find
(
'
.page-inner
'
),
$el
=
$scroller
.
find
(
id
),
$parent
=
$el
.
offsetParent
(),
dest
=
0
;
dest
=
$el
.
position
().
top
;
while
(
!
$parent
.
is
(
$container
))
{
$el
=
$parent
;
dest
+=
$el
.
position
().
top
;
$parent
=
$el
.
offsetParent
();
}
// Return rounded value since
// jQuery scrollTop() returns an integer
return
Math
.
floor
(
dest
);
}
/*
Handle updating summary at scrolling
*/
var
$chapters
,
$activeChapter
;
// Set a chapter as active in summary and update state
function
setChapterActive
(
$chapter
,
hash
)
{
// No chapter and no hash means first chapter
if
(
!
$chapter
&&
!
hash
)
{
$chapter
=
$chapters
.
first
();
}
// If hash is provided, set as active chapter
if
(
!!
hash
)
{
$chapter
=
$chapters
.
filter
(
function
()
{
var
titleId
=
getChapterHash
(
$
(
this
));
return
titleId
==
hash
;
}).
first
();
}
// Don't update current chapter
if
(
$chapter
.
is
(
$activeChapter
))
{
return
;
}
// Update current active chapter
$activeChapter
=
$chapter
;
// Add class to selected chapter
$chapters
.
removeClass
(
'
active
'
);
$chapter
.
addClass
(
'
active
'
);
// Update history state if needed
hash
=
getChapterHash
(
$chapter
);
var
oldUri
=
window
.
location
.
pathname
+
window
.
location
.
hash
,
uri
=
window
.
location
.
pathname
+
hash
;
if
(
uri
!=
oldUri
)
{
history
.
replaceState
({
path
:
uri
},
null
,
uri
);
}
}
// Return the hash of link for a chapter
function
getChapterHash
(
$chapter
)
{
var
$link
=
$chapter
.
children
(
'
a
'
),
hash
=
$link
.
attr
(
'
href
'
).
split
(
'
#
'
)[
1
];
if
(
hash
)
hash
=
'
#
'
+
hash
;
return
(
!!
hash
)?
hash
:
''
;
}
// Handle user scrolling
function
handleScrolling
()
{
// Get current page scroll
var
$scroller
=
getScroller
(),
scrollTop
=
$scroller
.
scrollTop
(),
scrollHeight
=
$scroller
.
prop
(
'
scrollHeight
'
),
clientHeight
=
$scroller
.
prop
(
'
clientHeight
'
),
nbChapters
=
$chapters
.
length
,
$chapter
=
null
;
// Find each title position in reverse order
$
(
$chapters
.
get
().
reverse
()).
each
(
function
(
index
)
{
var
titleId
=
getChapterHash
(
$
(
this
)),
titleTop
;
if
(
!!
titleId
&&
!
$chapter
)
{
titleTop
=
getElementTopPosition
(
titleId
);
// Set current chapter as active if scroller passed it
if
(
scrollTop
>=
titleTop
)
{
$chapter
=
$
(
this
);
}
}
// If no active chapter when reaching first chapter, set it as active
if
(
index
==
(
nbChapters
-
1
)
&&
!
$chapter
)
{
$chapter
=
$
(
this
);
}
});
// ScrollTop is at 0, set first chapter anyway
if
(
!
$chapter
&&
!
scrollTop
)
{
$chapter
=
$chapters
.
first
();
}
// Set last chapter as active if scrolled to bottom of page
if
(
!!
scrollTop
&&
(
scrollHeight
-
scrollTop
==
clientHeight
))
{
$chapter
=
$chapters
.
last
();
}
setChapterActive
(
$chapter
);
}
/*
...
...
@@ -133,22 +261,20 @@ function handleNavigation(relativeUrl, push) {
$
(
'
.book
'
).
attr
(
'
class
'
,
bodyClass
);
$
(
'
.book-summary
'
).
scrollTop
(
scrollPosition
);
// Update state
gitbook
.
state
.
$book
=
$
(
'
.book
'
);
preparePage
(
!
hash
);
// Scroll to hashtag position
if
(
hash
)
{
scrollToHash
(
hash
);
}
// Update state
gitbook
.
state
.
$book
=
$
(
'
.book
'
);
preparePage
(
!
hash
);
deferred
.
resolve
();
}
});
}).
promise
();
return
loading
.
show
(
promise
.
fail
(
function
(
e
)
{
...
...
@@ -164,6 +290,12 @@ function updateNavigationPosition() {
bodyInnerWidth
=
parseInt
(
$
(
'
.body-inner
'
).
css
(
'
width
'
),
10
);
pageWrapperWidth
=
parseInt
(
$
(
'
.page-wrapper
'
).
css
(
'
width
'
),
10
);
$
(
'
.navigation-next
'
).
css
(
'
margin-right
'
,
(
bodyInnerWidth
-
pageWrapperWidth
)
+
'
px
'
);
// Reset scroll to get current scroller
var
$scroller
=
getScroller
();
// Unbind existing scroll event
$scroller
.
unbind
(
'
scroll
'
);
$scroller
.
scroll
(
handleScrolling
);
}
function
preparePage
(
resetScroll
)
{
...
...
@@ -180,6 +312,30 @@ function preparePage(resetScroll) {
// Reset scroll
if
(
resetScroll
!==
false
)
$bookInner
.
scrollTop
(
0
);
$bookBody
.
scrollTop
(
0
);
// Get current page summary chapters
$chapters
=
$
(
'
.book-summary .summary .chapter
'
)
.
filter
(
function
()
{
var
$link
=
$
(
this
).
children
(
'
a
'
),
href
=
null
;
// Chapter doesn't have a link
if
(
!
$link
.
length
)
{
return
false
;
}
else
{
href
=
$link
.
attr
(
'
href
'
).
split
(
'
#
'
)[
0
];
}
var
resolvedRef
=
url
.
resolve
(
window
.
location
.
pathname
,
href
);
return
window
.
location
.
pathname
==
resolvedRef
;
});
// Bind scrolling if summary contains more than one link to this page
var
$scroller
=
getScroller
();
if
(
$chapters
.
length
>
1
)
{
$scroller
.
scroll
(
handleScrolling
);
}
}
function
isLeftClickEvent
(
e
)
{
...
...
src/js/theme/platform.js
浏览文件 @
348d784c
var
$
=
require
(
'
jquery
'
);
module
.
exports
=
{
isMobile
:
function
()
{
return
(
$
(
document
).
width
()
<=
600
);
},
// Breakpoint for navigation links position
isSmallScreen
:
function
()
{
return
(
$
(
document
).
width
()
<=
1240
);
}
};
src/less/website/header.less
浏览文件 @
348d784c
...
...
@@ -28,6 +28,10 @@
color: @header-button-hover-color;
background: @header-button-hover-background;
}
&:focus {
outline: none;
}
}
h1 {
...
...
src/less/website/page.less
浏览文件 @
348d784c
...
...
@@ -4,6 +4,7 @@
}
.page-inner {
position: relative;
max-width: 800px;
margin: 0px auto;
padding: 20px 15px 40px 15px;
...
...
src/less/website/summary.less
浏览文件 @
348d784c
...
...
@@ -75,6 +75,10 @@
text-decoration: underline;
}
a:focus {
outline: none;
}
&.active > a {
color: @sidebar-link-hover-color;
background: @sidebar-link-hover-background;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录