github/hexo-theme-next
1
0
Fork 0
mirror of https://github.com/next-theme/hexo-theme-next.git synced 2026-01-19 18:42:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

New method NexT.utils.activateSidebarPanel

Browse Source 
* See: https://github.com/next-theme/hexo-theme-next/issues/368
This commit is contained in:
Mimi 2021-09-13 14:25:49 +08:00
parent debbe5bdc9
commit 292b8a258e
4 changed files with 31 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
scripts/events/lib/config.js
View File

@ -1,6 +1,6 @@
'use strict'; 'use strict';
const merge = require('hexo-util').deepMerge || require('lodash/merge'); const merge = require('hexo-util').deepMerge;
module.exports = hexo => { module.exports = hexo => {
const data = hexo.locals.get('data'); const data = hexo.locals.get('data');

25
source/js/next-boot.js
View File

@ -16,32 +16,9 @@ NexT.boot.registerEvents = function() {
document.body.classList.toggle('site-nav-on'); document.body.classList.toggle('site-nav-on');
}); });
const duration = 200;
document.querySelectorAll('.sidebar-nav li').forEach((element, index) => { document.querySelectorAll('.sidebar-nav li').forEach((element, index) => {
element.addEventListener('click', () => { element.addEventListener('click', () => {
if (element.matches('.sidebar-toc-active .sidebar-nav-toc, .sidebar-overview-active .sidebar-nav-overview')) return; NexT.utils.activateSidebarPanel(index);
const sidebar = document.querySelector('.sidebar-inner');
const panel = document.querySelector('.sidebar-panel-container');
const activeClassName = ['sidebar-toc-active', 'sidebar-overview-active'];
window.anime({
duration,
targets : panel,
easing : 'linear',
opacity : 0,
translateY: [0, -20],
complete : () => {
// Prevent adding TOC to Overview if Overview was selected when close & open sidebar.
sidebar.classList.replace(activeClassName[1 - index], activeClassName[index]);
window.anime({
duration,
targets : panel,
easing : 'linear',
opacity : [0, 1],
translateY: [-20, 0]
});
}
});
}); });
}); });

2
source/js/pjax.js
View File

@ -27,6 +27,6 @@ document.addEventListener('pjax:success', () => {
} }
const hasTOC = document.querySelector('.post-toc'); const hasTOC = document.querySelector('.post-toc');
document.querySelector('.sidebar-inner').classList.toggle('sidebar-nav-active', hasTOC); document.querySelector('.sidebar-inner').classList.toggle('sidebar-nav-active', hasTOC);
document.querySelector(hasTOC ? '.sidebar-nav-toc' : '.sidebar-nav-overview').click(); NexT.utils.activateSidebarPanel(hasTOC ? 0 : 1);
NexT.utils.updateSidebarPosition(); NexT.utils.updateSidebarPosition();
}); });

28
source/js/utils.js
View File

@ -305,6 +305,34 @@ NexT.utils = {
} }
}, },
activateSidebarPanel: function(index) {
const duration = 200;
const sidebar = document.querySelector('.sidebar-inner');
const panel = document.querySelector('.sidebar-panel-container');
const activeClassName = ['sidebar-toc-active', 'sidebar-overview-active'];
if (sidebar.classList.contains(activeClassName[index])) return;
window.anime({
duration,
targets : panel,
easing : 'linear',
opacity : 0,
translateY: [0, -20],
complete : () => {
// Prevent adding TOC to Overview if Overview was selected when close & open sidebar.
sidebar.classList.replace(activeClassName[1 - index], activeClassName[index]);
window.anime({
duration,
targets : panel,
easing : 'linear',
opacity : [0, 1],
translateY: [-20, 0]
});
}
});
},
getScript: function(src, options = {}, legacyCondition) { getScript: function(src, options = {}, legacyCondition) {
if (typeof options === 'function') { if (typeof options === 'function') {
return this.getScript(src, { return this.getScript(src, {