hexo-theme-volantis 5.8.0 → 6.0.0

package/source/js/app.js

@@ -26,10 +26,16 @@ const locationHash = () => {
   if (window.location.hash) {
     let locationID = decodeURI(window.location.hash.split('#')[1]).replace(/\ /g, '-');
     let target = document.getElementById(locationID);
+    if (locationID && !target) {
+      locationID = decodeURIComponent(window.location.hash.split('#')[1]).replace(/\ /g, '-');
+      target = document.getElementById(locationID);
+    }
     if (target) {
       setTimeout(() => {
         if (window.location.hash.startsWith('#fn')) { // hexo-reference https://github.com/volantis-x/hexo-theme-volantis/issues/647
           volantis.scroll.to(target, { addTop: - volantis.dom.header.offsetHeight - 5, behavior: 'instant', observer: true })
+        } else if (window.location.hash.startsWith('#mjx')) { // mathjax
+          volantis.scroll.to(target, { addTop: - volantis.dom.header.offsetHeight - 25, behavior: 'instant', observer: true })
         } else {
           // 锚点中上半部有大片空白 高度大概是 volantis.dom.header.offsetHeight
           volantis.scroll.to(target, { addTop: 5, behavior: 'instant', observer: true })
@@ -119,7 +125,7 @@ const VolantisApp = (() => {
   // 校正页面定位（被导航栏挡住的区域）
   fn.scrolltoElement = (elem, correction = scrollCorrection) => {
     volantis.scroll.to(elem, {
-      top: elem.offsetTop - correction
+      top: elem.getBoundingClientRect().top + document.documentElement.scrollTop - correction
     })
   }
 
@@ -210,6 +216,7 @@ const VolantisApp = (() => {
       volantis.dom.comment.click(e => { // 评论按钮点击后 跳转到评论区域
         e.preventDefault();
         e.stopPropagation();
+        volantis.cleanContentVisibility();
         fn.scrolltoElement(volantis.dom.commentTarget);
         e.stopImmediatePropagation();
       });
@@ -234,7 +241,7 @@ const VolantisApp = (() => {
           }
           volantis.dom.toc.removeClass('active');
         });
-      } else volantis.dom.toc.style.display = 'none'; // 隐藏toc目录按钮
+      } else if (volantis.dom.toc) volantis.dom.toc.style.display = 'none'; // 隐藏toc目录按钮
     }
   }
 
@@ -285,73 +292,31 @@ const VolantisApp = (() => {
   fn.setGlobalHeaderMenuEvent = () => {
     if (volantis.isMobile) {
       // 【移动端】 关闭已经展开的子菜单 点击展开子菜单
-      document.querySelectorAll('#l_header .m-phone li').forEach(function (_e) {
-        if (_e.querySelector(".list-v")) {
+      document.querySelectorAll('#l_header .m-phone li').forEach(function (e) {
+        if (e.querySelector(".list-v")) {
           // 点击菜单
-          volantis.dom.$(_e).click(function (e) {  
+          volantis.dom.$(e).click(function (e) {
             e.stopPropagation();
-            let menuType = ''
-            // 关闭.menu-phone
-            Array.from(e.currentTarget.children).some(val => {
-              if(val.classList.contains('s-menu')) {
-                menuType = 'menu' // 代表点击的是一级菜单外层的icon
-                return
-              }
-              if(val.classList.contains('menuitem')) {
-                menuType = 'item' // 点击的是下拉一级菜单
-                return
+            // 关闭已经展开的子菜单
+            e.currentTarget.parentElement.childNodes.forEach(function (e) {
+              if (Object.prototype.toString.call(e) == '[object HTMLLIElement]') {
+                e.childNodes.forEach(function (e) {
+                  if (Object.prototype.toString.call(e) == '[object HTMLUListElement]') {
+                    volantis.dom.$(e).hide()
+                  }
+                })
               }
             })
-            if(menuType === 'item') {
-              // 关闭已经展开的子菜单, 这一步是针对点击多个拥有二级子菜单的一级菜单，关闭其他所有一级菜单的二级菜单
-              // ①
-              e.currentTarget.parentElement.childNodes.forEach(function (e2) {
-                if (Object.prototype.toString.call(e2) == '[object HTMLLIElement]') {
-                  e2.childNodes.forEach(function (e1) {
-                    if (Object.prototype.toString.call(e1) == '[object HTMLUListElement]') {
-                      volantis.dom.$(e1).hide()
-                    }
-                  })
-                }
-              })
-              // 点击展开二级子菜单
-
-              /* 
-                由于采用事件委托，因此此处点击， 两种情况，currentTarget指向菜单按钮a.s-menu和ul的共同父元素li， 第二，指向ul中的li元素，也就是子菜单
-                区分：情况一的第一个子元素a的类名是s-menu；情况二的子元素a的类名为menuitem
-                我们要点击外部的menu icon时要关闭的是.menu-phone而不是.menuitem
-              */
-              let array = e.currentTarget.children
-              for (let index = 0; index < array.length; index++) {
-                const element = array[index];
-                if (volantis.dom.$(element).title === 'menu') { // 移动端菜单栏异常
-                  volantis.dom.$(element).style.display = "flex"      // https://github.com/volantis-x/hexo-theme-volantis/issues/706
-                } else {
-                  volantis.dom.$(element).show()
-                }
-              }
-            } else {  
-              let menuPhone = document.querySelector('.switcher .menu-phone')
-              let isHiding = window.getComputedStyle(menuPhone).display === 'none'
-              if(isHiding) {
-                volantis.dom.$(menuPhone).show()
+            // 点击展开子菜单
+            let array = e.currentTarget.children
+            for (let index = 0; index < array.length; index++) {
+              const element = array[index];
+              if (volantis.dom.$(element).title === 'menu') { // 移动端菜单栏异常
+                volantis.dom.$(element).display = "flex"      // https://github.com/volantis-x/hexo-theme-volantis/issues/706
               } else {
-                volantis.dom.$(menuPhone).hide()
-                // 别忘了再执行①
-                // 准备关闭所有二级菜单, 注意此时的e和点击一级菜单时候的e层级不同
-                // 此处好像不能使用变量存储的menuPhone？要重新查询
-                document.querySelector('.switcher .menu-phone').childNodes.forEach(function (e2) {
-                  if (Object.prototype.toString.call(e2) == '[object HTMLLIElement]') {
-                    e2.childNodes.forEach(function (e1) {
-                      if (Object.prototype.toString.call(e1) == '[object HTMLUListElement]') {
-                        volantis.dom.$(e1).hide()
-                      }
-                    })
-                  }
-                })
+                volantis.dom.$(element).show()
               }
             }
-
           }, 0);
         }
       })
@@ -370,7 +335,7 @@ const VolantisApp = (() => {
     }
     fn.setPageHeaderMenuEvent();
   }
-  
+
   // 【移动端】隐藏子菜单
   fn.setPageHeaderMenuEvent = () => {
     if (!volantis.isMobile) return
@@ -423,6 +388,23 @@ const VolantisApp = (() => {
     })
   }
 
+  // mathjax 引用跳转
+  fn.mathjaxRef = () => {
+    let ref = document.querySelectorAll('mjx-container a[href]');
+    ref.forEach(function (e, i) {
+      ref[i].click = () => { }; // 强制清空原 click 事件
+      let targetID = decodeURIComponent(ref[i].getAttribute('href').split('#')[1]).replace(/\ /g, '-');
+      volantis.dom.$(e).on('click', (e) => {
+        e.stopPropagation();
+        e.preventDefault();
+        let target = document.getElementById(targetID);
+        if (target) {
+          volantis.scroll.to(target, { addTop: - volantis.dom.header.offsetHeight - 25, behavior: 'instant' })
+        }
+      });
+    })
+  }
+
   // hexo-reference 页脚跳转 https://github.com/volantis-x/hexo-theme-volantis/issues/647
   fn.footnotes = () => {
     let ref = document.querySelectorAll('#l_main .footnote-backref, #l_main .footnote-ref > a');
@@ -557,8 +539,8 @@ const VolantisApp = (() => {
   // 消息提示：标准
   fn.message = (title, message, option = {}, done = null) => {
     if (typeof iziToast === "undefined") {
-      volantis.css(volantis.GLOBAL_CONFIG.plugins.message.css)
-      volantis.js(volantis.GLOBAL_CONFIG.plugins.message.js, () => {
+      volantis.css(volantis.GLOBAL_CONFIG.cdn.izitoast_css)
+      volantis.js(volantis.GLOBAL_CONFIG.cdn.izitoast_js, () => {
         tozashMessage(title, message, option, done);
       });
     } else {
@@ -603,8 +585,8 @@ const VolantisApp = (() => {
   // 消息提示：询问
   fn.question = (title, message, option = {}, success = null, cancel = null, done = null) => {
     if (typeof iziToast === "undefined") {
-      volantis.css(volantis.GLOBAL_CONFIG.plugins.message.css)
-      volantis.js(volantis.GLOBAL_CONFIG.plugins.message.js, () => {
+      volantis.css(volantis.GLOBAL_CONFIG.cdn.izitoast_css)
+      volantis.js(volantis.GLOBAL_CONFIG.cdn.izitoast_js, () => {
         tozashQuestion(title, message, option, success, cancel, done);
       });
     } else {
@@ -664,8 +646,8 @@ const VolantisApp = (() => {
     }
 
     if (typeof iziToast === "undefined") {
-      volantis.css(volantis.GLOBAL_CONFIG.plugins.message.css)
-      volantis.js(volantis.GLOBAL_CONFIG.plugins.message.js, () => {
+      volantis.css(volantis.GLOBAL_CONFIG.cdn.izitoast_css)
+      volantis.js(volantis.GLOBAL_CONFIG.cdn.izitoast_js, () => {
         hideMessage(done);
       });
     } else {
@@ -710,6 +692,7 @@ const VolantisApp = (() => {
       fn.setScrollAnchor();
       fn.setTabs();
       fn.footnotes();
+      fn.mathjaxRef();
     },
     pjaxReload: () => {
       fn.event();
@@ -720,6 +703,7 @@ const VolantisApp = (() => {
       fn.setScrollAnchor();
       fn.setTabs();
       fn.footnotes();
+      fn.mathjaxRef();
 
       // 移除小尾巴的移除
       document.querySelector("#l_header .nav-main").querySelectorAll('.list-v:not(.menu-phone)').forEach(function (e) {
@@ -745,8 +729,8 @@ const VolantisFancyBox = (() => {
   const fn = {};
 
   fn.loadFancyBox = (done) => {
-    volantis.css(volantis.GLOBAL_CONFIG.plugins.fancybox.css);
-    volantis.js(volantis.GLOBAL_CONFIG.plugins.fancybox.js).then(() => {
+    volantis.css(volantis.GLOBAL_CONFIG.cdn.fancybox_css);
+    volantis.js(volantis.GLOBAL_CONFIG.cdn.fancybox_js).then(() => {
       if (done) done();
     })
   }
@@ -855,17 +839,6 @@ const VolantisFancyBox = (() => {
 Object.freeze(VolantisFancyBox);
 
 // highlightKeyWords 与 搜索功能搭配 https://github.com/next-theme/hexo-theme-next/blob/eb194a7258058302baf59f02d4b80b6655338b01/source/js/third-party/search/local-search.js
-// Question: 锚点稳定性未知
-// ToDo: 查找模式
-// 0. (/////////要知道浏览器自带全页面查找功能 CTRL + F)
-// 1. 右键开启查找模式 / 导航栏菜单开启?? / CTRL + F ???
-// 2. 查找模式面板 (可拖动? or 固定?)
-// 3. keyword mark id 从 0 开始编号 查找下一处 highlightKeyWords.scrollToNextHighlightKeywordMark() 查找上一处 scrollToPrevHighlightKeywordMark() 循环查找(取模%)
-// 4. 可输入修改 查找关键词 keywords(type:list)
-// 5. 区分大小写 caseSensitive (/ 全字匹配?? / 正则匹配??)
-// 6. 在选定区域中查找 querySelector ??
-// 7. 关闭查找模式
-// 8. 搜索跳转 (URL 入口) 自动开启查找模式 调用 scrollToNextHighlightKeywordMark()
 const highlightKeyWords = (() => {
   let fn = {}
   fn.markNum = 0
@@ -902,21 +875,21 @@ const highlightKeyWords = (() => {
     // Current target
     return target
   }
-  fn.scrollToPrevHighlightKeywordMark = (id) => {
-    // Prev Id
-    let input = id || (fn.markNextId - 1 + fn.markNum) % fn.markNum;
-    fn.markNextId = parseInt(input)
-    let target = document.getElementById("keyword-mark-" + fn.markNextId);
-    if (!target) {
-      fn.markNextId = (fn.markNextId - 1 + fn.markNum) % fn.markNum;
-      target = document.getElementById("keyword-mark-" + fn.markNextId);
-    }
-    if (target) {
-      volantis.scroll.to(target, { addTop: - volantis.dom.header.offsetHeight - 5, behavior: 'instant' })
-    }
-    // Current target
-    return target
-  }
+  // fn.scrollToPrevHighlightKeywordMark = (id) => {
+  //   // Prev Id
+  //   let input = id || (fn.markNextId - 1 + fn.markNum) % fn.markNum;
+  //   fn.markNextId = parseInt(input)
+  //   let target = document.getElementById("keyword-mark-" + fn.markNextId);
+  //   if (!target) {
+  //     fn.markNextId = (fn.markNextId - 1 + fn.markNum) % fn.markNum;
+  //     target = document.getElementById("keyword-mark-" + fn.markNextId);
+  //   }
+  //   if (target) {
+  //     volantis.scroll.to(target, { addTop: - volantis.dom.header.offsetHeight - 5, behavior: 'instant' })
+  //   }
+  //   // Current target
+  //   return target
+  // }
   fn.start = (keywords, querySelector) => {
     fn.markNum = 0
     if (!keywords.length || !querySelector || (keywords.length == 1 && keywords[0] == "null")) return;
@@ -1024,30 +997,30 @@ const highlightKeyWords = (() => {
     mark.style["font-weight"] = "bold";
     return mark
   }
-  fn.cleanHighlightStyle = () => {
-    document.querySelectorAll(".keyword").forEach(mark => {
-      mark.style.background = "transparent";
-      mark.style["border-bottom"] = null;
-      mark.style["color"] = null;
-      mark.style["font-weight"] = null;
-    })
-  }
+  // fn.cleanHighlightStyle = () => {
+  //   document.querySelectorAll(".keyword").forEach(mark => {
+  //     mark.style.background = "transparent";
+  //     mark.style["border-bottom"] = null;
+  //     mark.style["color"] = null;
+  //     mark.style["font-weight"] = null;
+  //   })
+  // }
   return {
-    start: (keywords, querySelector) => {
-      fn.start(keywords, querySelector)
-    },
+    // start: (keywords, querySelector) => {
+    //   fn.start(keywords, querySelector)
+    // },
     startFromURL: () => {
       fn.startFromURL()
     },
-    scrollToNextHighlightKeywordMark: (id) => {
-      fn.scrollToNextHighlightKeywordMark(id)
-    },
-    scrollToPrevHighlightKeywordMark: (id) => {
-      fn.scrollToPrevHighlightKeywordMark(id)
-    },
-    cleanHighlightStyle: () => {
-      fn.cleanHighlightStyle()
-    },
+    // scrollToNextHighlightKeywordMark: (id) => {
+    //   fn.scrollToNextHighlightKeywordMark(id)
+    // },
+    // scrollToPrevHighlightKeywordMark: (id) => {
+    //   fn.scrollToPrevHighlightKeywordMark(id)
+    // },
+    // cleanHighlightStyle: () => {
+    //   fn.cleanHighlightStyle()
+    // },
   }
 })()
 Object.freeze(highlightKeyWords);
@@ -1178,46 +1151,46 @@ const DOMController = {
 }
 Object.freeze(DOMController);
 
-const VolantisRequest = {
-  timeoutFetch: (url, ms, requestInit) => {
-    const controller = new AbortController()
-    requestInit.signal?.addEventListener('abort', () => controller.abort())
-    let promise = fetch(url, { ...requestInit, signal: controller.signal })
-    if (ms > 0) {
-      const timer = setTimeout(() => controller.abort(), ms)
-      promise.finally(() => { clearTimeout(timer) })
-    }
-    promise = promise.catch((err) => {
-      throw ((err || {}).name === 'AbortError') ? new Error(`Fetch timeout: ${url}`) : err
-    })
-    return promise
-  },
-
-  Fetch: async (url, requestInit, timeout = 15000) => {
-    const resp = await VolantisRequest.timeoutFetch(url, timeout, requestInit);
-    if (!resp.ok) throw new Error(`Fetch error: ${url} | ${resp.status}`);
-    let json = await resp.json()
-    if (!json.success) throw json
-    return json
-  },
-
-  POST: async (url, data) => {
-    const requestInit = {
-      method: 'POST',
-    }
-    if (data) {
-      const formData = new FormData();
-      Object.keys(data).forEach(key => formData.append(key, String(data[key])))
-      requestInit.body = formData;
-    }
-    const json = await VolantisRequest.Fetch(url, requestInit)
-    return json.data;
-  },
-
-  Get: async (url, data) => {
-    const json = await VolantisRequest.Fetch(url + (data ? (`?${new URLSearchParams(data)}`) : ''), {
-      method: 'GET'
-    })
-  }
-}
-Object.freeze(VolantisRequest);
+// const VolantisRequest = {
+//   timeoutFetch: (url, ms, requestInit) => {
+//     const controller = new AbortController()
+//     requestInit.signal?.addEventListener('abort', () => controller.abort())
+//     let promise = fetch(url, { ...requestInit, signal: controller.signal })
+//     if (ms > 0) {
+//       const timer = setTimeout(() => controller.abort(), ms)
+//       promise.finally(() => { clearTimeout(timer) })
+//     }
+//     promise = promise.catch((err) => {
+//       throw ((err || {}).name === 'AbortError') ? new Error(`Fetch timeout: ${url}`) : err
+//     })
+//     return promise
+//   },
+
+//   Fetch: async (url, requestInit, timeout = 15000) => {
+//     const resp = await VolantisRequest.timeoutFetch(url, timeout, requestInit);
+//     if (!resp.ok) throw new Error(`Fetch error: ${url} | ${resp.status}`);
+//     let json = await resp.json()
+//     if (!json.success) throw json
+//     return json
+//   },
+
+//   POST: async (url, data) => {
+//     const requestInit = {
+//       method: 'POST',
+//     }
+//     if (data) {
+//       const formData = new FormData();
+//       Object.keys(data).forEach(key => formData.append(key, String(data[key])))
+//       requestInit.body = formData;
+//     }
+//     const json = await VolantisRequest.Fetch(url, requestInit)
+//     return json.data;
+//   },
+
+//   Get: async (url, data) => {
+//     const json = await VolantisRequest.Fetch(url + (data ? (`?${new URLSearchParams(data)}`) : ''), {
+//       method: 'GET'
+//     })
+//   }
+// }
+// Object.freeze(VolantisRequest);

package/source/js/plugins/parallax.js

@@ -14,7 +14,7 @@ Parallax.slidein = () => {
       opac = opac + 0.1;
       slider.style.opacity = opac;
       setTimeout(Parallax.slidein, Parallax.options.fade / 10);
-    }else{
+    } else {
       slider.style.opacity = 1;
     }
   } else {

package/source/js/plugins/rightMenus.js

@@ -545,14 +545,17 @@ RightMenus.fun = (() => {
     DOMController.removeList([
       '.cus-article-bkg', '.iziToast-overlay', '.iziToast-wrapper', '.prev-next',
       'footer', '#l_header', '#l_cover', '#l_side', '#comments', '#s-top', '#BKG',
-      '#rightmenu-wrapper', '.nav-tabs', '.parallax-mirror', '.new-meta-item.share', 'div.footer'
+      '#rightmenu-wrapper', '.nav-tabs', '.parallax-mirror', '.new-meta-item.share',
+      '.new-meta-box', 'button.btn-copy', 'iframe'
     ]);
     DOMController.setStyleList([
-      ['body', 'backgroundColor', 'unset'], ['#l_main', 'width', '100%'], ['#post', 'boxShadow', 'none'],
-      ['#post', 'background', 'none'], ['#post', 'padding', '0'], ['h1', 'textAlign', 'center'],
-      ['h1', 'fontWeight', '600'], ['h1', 'fontSize', '2rem'], ['h1', 'marginBottom', '20px'],
+      ['body', 'backgroundColor', 'unset'], ['#l_main, .copyright.license', 'width', '100%'],
+      ['#post', 'boxShadow', 'none'], ['#post', 'background', 'none'], ['#post', 'padding', '0'],
+      ['h1', 'textAlign', 'center'], ['h1', 'fontWeight', '600'], ['h1', 'fontSize', '2rem'], ['h1', 'marginBottom', '20px'],
       ['.tab-pane', 'display', 'block'], ['.tab-content', 'borderTop', 'none'], ['.highlight>table pre', 'whiteSpace', 'pre-wrap'],
-      ['.highlight>table pre', 'wordBreak', 'break-all'], ['.fancybox img', 'height', 'auto'], ['.fancybox img', 'weight', 'auto']
+      ['.highlight>table pre', 'wordBreak', 'break-all'], ['.fancybox img', 'height', 'auto'], ['.fancybox img', 'weight', 'auto'],
+      ['.copyright.license', 'margin', '0'], ['.copyright.license', 'padding', '1.25em 20px'],
+      ['figure.highlight, .copyright.license', 'display', 'inline-block'],
     ]);
     setTimeout(() => {
       window.print();
@@ -563,20 +566,21 @@ RightMenus.fun = (() => {
 
   fn.readMode = () => {
     if (typeof ScrollReveal === 'function') ScrollReveal().clean('#comments');
-    DOMController.fadeToggleList([  
-      document.querySelector('#l_header'), document.querySelector('footer'),  
-      document.querySelector('#s-top'), document.querySelector('.article-meta#bottom'),  
-      document.querySelector('.prev-next'), document.querySelector('#l_side'),  
-      document.querySelector('#comments')  
-    ]);  
-    DOMController.toggleClassList([  
-      [document.querySelector('#l_main'), 'common_read'], [document.querySelector('#l_main'), 'common_read_main'],  
-      [document.querySelector('#l_body'), 'common_read'], [document.querySelector('#safearea'), 'common_read'],  
-      [document.querySelector('#pjax-container'), 'common_read'], [document.querySelector('#read_bkg'), 'common_read_hide'],  
-      [document.querySelector('h1'), 'common_read_h1'], [document.querySelector('#post'), 'post_read'],  
-      [document.querySelector('#l_cover'), 'read_cover'], [document.querySelector('.widget.toc-wrapper'), 'post_read']  
+    DOMController.setStyle('#l_header', 'opacity', 0);
+    DOMController.fadeToggleList([
+      document.querySelector('#l_cover'), document.querySelector('footer'),
+      document.querySelector('#s-top'), document.querySelector('.article-meta#bottom'),
+      document.querySelector('.prev-next'), document.querySelector('#l_side'),
+      document.querySelector('#comments'),
     ]);
-    DOMController.setStyle('.copyright.license', 'margin', '15px 0'); 
+    DOMController.toggleClassList([
+      [document.querySelector('#l_main'), 'common_read'], [document.querySelector('#l_main'), 'common_read_main'],
+      [document.querySelector('#l_body'), 'common_read'], [document.querySelector('#safearea'), 'common_read'],
+      [document.querySelector('#pjax-container'), 'common_read'], [document.querySelector('#read_bkg'), 'common_read_hide'],
+      [document.querySelector('h1'), 'common_read_h1'], [document.querySelector('#post'), 'post_read'],
+      [document.querySelector('#l_cover'), 'read_cover'], [document.querySelector('.widget.toc-wrapper'), 'post_read']
+    ]);
+    DOMController.setStyle('.copyright.license', 'margin', '15px 0');
     volantis.isReadModel = volantis.isReadModel === undefined ? true : !volantis.isReadModel;
     if (volantis.isReadModel) {
       if (RightMenus.messageRightMenu) VolantisApp.message('系统提示', '阅读模式已开启，您可以点击屏幕空白处退出。', {
@@ -594,8 +598,8 @@ RightMenus.fun = (() => {
     } else {
       document.querySelector('#l_body').removeEventListener('click', fn.readMode);
       document.querySelector('#post').removeEventListener('click', fn.readMode);
-      DOMController.setStyle('.prev-next', 'display', 'flex'); 
-      DOMController.setStyle('.copyright.license', 'margin', '15px -40px'); 
+      DOMController.setStyle('.prev-next', 'display', 'flex');
+      DOMController.setStyle('.copyright.license', 'margin', '15px -40px');
     }
   }