Chic/toc.php

61 lines
2.0 KiB
PHP

<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
<script src="<?php $this->options->themeUrl('tocbot.min.js'); ?>"></script>
<div class="post-toc">
<div class="tocbot-list">
</div>
<div class="tocbot-list-menu">
<a class="tocbot-toc-expand" onclick="expand_toc()">展开目录</a>
<a onclick="go_top()">文章顶部</a>
<a onclick="go_bottom()">文章底部</a>
</div>
</div>
<script>
var tocbot_timer;
var DEPTH_MAX = 6; // 为 6 时展开所有
var tocbot_default_config = {
tocSelector: '.tocbot-list',
contentSelector: '.post-content',
headingSelector: 'h1, h2, h3, h4, h5',
orderedList: false,
scrollSmooth: true,
onClick: extend_click,
};
function extend_click() {
clearTimeout(tocbot_timer);
tocbot_timer = setTimeout(function() {
tocbot.refresh(obj_merge(tocbot_default_config, {
hasInnerContainers: true
}));
}, 420); // 这个值是由 tocbot 源码里定义的 scrollSmoothDuration 得来的
}
document.ready(function() {
tocbot.init(obj_merge(tocbot_default_config, {
collapseDepth: 1
}));
});
function expand_toc() {
var b = document.querySelector('.tocbot-toc-expand');
var expanded = b.getAttribute('data-expanded');
expanded ? b.removeAttribute('data-expanded') : b.setAttribute('data-expanded', true);
tocbot.refresh(obj_merge(tocbot_default_config, {
collapseDepth: expanded ? 1 : DEPTH_MAX
}));
b.innerText = expanded ? 'Expand all' : 'Collapse all';
}
function go_top() {
window.scrollTo(0, 0);
}
function go_bottom() {
window.scrollTo(0, document.body.scrollHeight);
}
function obj_merge(target, source) {
for (var item in source) {
if (source.hasOwnProperty(item)) {
target[item] = source[item];
}
}
return target;
}
</script>