hexo-theme-stellar 1.29.1 → 1.30.0

package/_config.yml

@@ -1,6 +1,6 @@
 ######## Stellar info ########
 stellar:
-  version: '1.29.1'
+  version: '1.30.0'
   homepage: 'https://xaoxuu.com/wiki/stellar/'
   repo: 'https://github.com/xaoxuu/hexo-theme-stellar'
   main_css: /css/main.css
@@ -197,10 +197,12 @@ search:
     field: all # post, page, all
     path: /search.json # 搜索文件存放位置
     content: true # 是否搜索内容
+    skip_search:  # 指定 path 中的内容不被搜索。
   algolia_search: # Docsearch https://docsearch.algolia.com/apply/ 申请
     appId: 
     apiKey: 
     indexName: 
+    js: https://gcore.jsdelivr.net/algoliasearch/3/algoliasearch.min.js
 
 
 ######## Comments ########
@@ -416,6 +418,8 @@ tag_plugins:
     layout: grid # grid / flow
     size: mix # s / m / l / xl / mix
     ratio: square # origin / square
+  chat:
+    api: https://siteinfo.listentothewind.cn/api/v1
 
 
 # 基础依赖
@@ -451,6 +455,22 @@ data_services:
     js: /js/services/weibo.js
   memos:
     js: /js/services/memos.js
+  # chat
+  voice: 
+    js: /js/plugins/voice.js
+  video: 
+    js: /js/plugins/video.js
+  download-file: 
+    js: /js/plugins/download-file.js
+  # 最新评论获取类
+  twikoo:
+    js: /js/services/twikoo_latest_comment.js
+  waline:
+    js: /js/services/waline_latest_comment.js
+  artalk:
+    js: /js/services/artalk_latest_comment.js
+  giscus:
+    js: /js/services/giscus_latest_comment.js
 
 
 # 扩展插件接入方法：(插件名下面用 #plugin# 代替)

package/_data/widgets.yml

@@ -71,6 +71,13 @@ timeline:
   type: # 默认不用写，如果是友链朋友圈数据请写 fcircle
   limit: # 默认通过 api 上增加 per_page 来设置，如果是友链朋友圈，可通过这个设置数量
 
+latest_comment:
+  layout: timeline
+  title: 最新评论
+  api: # 参照文档获取服务对应的api
+  type: # 选择评论服务
+  limit: 16 # 限制获取数量
+
 tagtree:
   layout: tagtree
   expand_all: false # 是否展开所有节点

package/layout/_partial/head.ejs

@@ -119,7 +119,8 @@ function custom_inject() {
     <%- feed_tag(config.feed.path, {title: config.title}) %>
   <% } %>
 
-  <link rel="stylesheet" href="<%- `${theme.stellar.main_css}?v=${stellar_info('version')}` %>">
+  <link rel="stylesheet" href="<%- url_for(`${theme.stellar.main_css}?v=${stellar_info('version')}`) %>">
+
 
   <% if (config.favicon) { %>
     <%- favicon_tag(config.favicon) %>

package/layout/_partial/main/navbar/nav_tabs_blog.ejs

@@ -11,37 +11,37 @@ function layoutDiv() {
 
   if (site.categories && site.categories.length > 0) {
     if (page.category) {
-      el += '<a class="active" href="' + url_for(config.category_dir) + '">' + __("btn.category") + __("symbol.colon") + page.category + '</a>';
+      el += '<a class="active" href="' + url_for(config.category_dir) + '/">' + __("btn.category") + __("symbol.colon") + page.category + '</a>';
     } else if (page.layout == "categories") {
-      el += '<a class="active" href="' + url_for(config.category_dir) + '">' + __("btn.categories") + '</a>';
+      el += '<a class="active" href="' + url_for(config.category_dir) + '/">' + __("btn.categories") + '</a>';
     } else {
-      el += '<a href="' + url_for(config.category_dir) + '">' + __("btn.categories") + '</a>';
+      el += '<a href="' + url_for(config.category_dir) + '/">' + __("btn.categories") + '</a>';
     }
   }
 
   if (site.tags && site.tags.length > 0) {
     if (page.tag) {
-      el += '<a class="active" href="' + url_for(config.tag_dir) + '">' + __("btn.tag") + __("symbol.colon") + page.tag + '</a>';
+      el += '<a class="active" href="' + url_for(config.tag_dir) + '/">' + __("btn.tag") + __("symbol.colon") + page.tag + '</a>';
     } else if (page.layout == "tags") {
-      el += '<a class="active" href="' + url_for(config.tag_dir) + '">' + __("btn.tags") + '</a>';
+      el += '<a class="active" href="' + url_for(config.tag_dir) + '/">' + __("btn.tags") + '</a>';
     } else {
-      el += '<a href="' + url_for(config.tag_dir) + '">' + __("btn.tags") + '</a>';
+      el += '<a href="' + url_for(config.tag_dir) + '/">' + __("btn.tags") + '</a>';
     }
   }
   
   if (theme.topic?.publish_list?.length > 0) {
     if (page.layout == 'index_topic') {
-      el += '<a class="active" href="' + url_for(theme.site_tree.index_topic.base_dir) + '">' + __("btn.topic") + '</a>';
+      el += '<a class="active" href="' + url_for(theme.site_tree.index_topic.base_dir) + '/">' + __("btn.topic") + '</a>';
     } else {
-      el += '<a href="' + url_for(theme.site_tree.index_topic.base_dir) + '">' + __("btn.topic") + '</a>';
+      el += '<a href="' + url_for(theme.site_tree.index_topic.base_dir) + '/">' + __("btn.topic") + '</a>';
     }
   }
   
   if (site.posts && site.posts.length > 0) {
     if (is_archive()) {
-      el += '<a class="active" href="' + url_for(config.archive_dir) + '">' + __("btn.archives") + '</a>';
+      el += '<a class="active" href="' + url_for(config.archive_dir) + '/">' + __("btn.archives") + '</a>';
     } else {
-      el += '<a href="' + url_for(config.archive_dir) + '">' + __("btn.archives") + '</a>';
+      el += '<a href="' + url_for(config.archive_dir) + '/">' + __("btn.archives") + '</a>';
     }
   }
   

package/layout/_partial/scripts/defines.ejs

@@ -7,6 +7,9 @@
       day: `<%- __('meta.date_suffix.day') %>`,
     },
     root : `<%- config.root %>`,
+    tag_plugins: {
+      chat: Object.assign(<%- JSON.stringify(theme.tag_plugins.chat) %>),
+    }
   };
 
   // required plugins (only load if needs)

package/layout/_partial/scripts/services.ejs

@@ -10,6 +10,27 @@
             setCardLink(ctx.cardlinks);
           });
         }
+      } else if (id == 'voice') {
+        ctx.voiceAudios = document.querySelectorAll('.voice>audio');
+        if (ctx.voiceAudios?.length > 0) {
+          utils.js(js, { defer: true }).then(function () {
+            createVoiceDom(ctx.voiceAudios);
+          });
+        }
+      } else if (id == 'video') {
+        ctx.videos = document.querySelectorAll('.video>video');
+        if (ctx.videos?.length > 0) {
+          utils.js(js, { defer: true }).then(function () {
+            videoEvents(ctx.videos);
+          });
+        }
+      } else if (id == 'download-file') {
+        ctx.files = document.querySelectorAll('.file');
+        if (ctx.files?.length > 0) {
+          utils.js(js, { defer: true }).then(function () {
+            downloadFileEvent(ctx.files);
+          });
+        }
       } else {
         const els = document.getElementsByClassName(`ds-${id}`);
         if (els?.length > 0) {
@@ -25,5 +46,75 @@
         }
       }
     }
+
+    // chat iphone time
+    let phoneTimes = document.querySelectorAll('.chat .status-bar .time');
+
+    if (phoneTimes.length > 0) {
+      NowTime();
+      var date = new Date();
+      var sec = date.getSeconds();
+      var firstAdjustInterval = setInterval(firstAdjustTime, 1000 * (60 - sec));
+    }
+
+    function firstAdjustTime() {
+      NowTime();
+      clearInterval(firstAdjustInterval);
+      setInterval(NowTime, 1000 * 60);
+    }
+
+    function NowTime() {
+      for (let i = 0; i < phoneTimes.length; ++i) {
+        var timeSpan = phoneTimes[i];
+        var date = new Date();
+        var hour = date.getHours();
+        var min = date.getMinutes();
+        timeSpan.innerHTML = check(hour) + ":" + check(min);
+      }
+    };
+
+    function check(val) {
+      if (val < 10) {
+        return ("0" + val);
+      }
+      return (val);
+    }
+
+    // chat quote
+    const chat_quote_obverser = new IntersectionObserver((entries, observer) => {
+      entries.filter((entry) => { return entry.isIntersecting }).sort((a, b) => a.intersectionRect.y !== b.intersectionRect.y ? a.intersectionRect.y - b.intersectionRect.y : a.intersectionRect.x - b.intersectionRect.x).forEach((entry, index) => {
+          observer.unobserve(entry.target);
+          setTimeout(() => {
+            entry.target.classList.add('quote-blink');
+            setTimeout(() => {
+              entry.target.classList.remove('quote-blink');
+            }, 1000);
+          }, Math.max(100, 16) * (index + 1));
+        });
+    });
+
+    var chatQuotes = document.querySelectorAll(".chat .talk .quote");
+    chatQuotes.forEach((quote) => {
+      quote.addEventListener('click', function () {
+        var chatCellDom = document.getElementById("quote-" + quote.getAttribute("quotedCellTag"));
+        if (chatCellDom) {
+          var chatDiv = chatCellDom.parentElement;
+          var mid = chatDiv.clientHeight / 2;
+          var offsetTop = chatCellDom.offsetTop;
+          if (offsetTop > mid - chatCellDom.clientHeight / 2) {
+            chatDiv.scrollTo({
+              top: chatCellDom.offsetTop - mid + chatCellDom.clientHeight / 2,
+              behavior: "smooth"
+            });
+          } else {
+            chatDiv.scrollTo({
+              top: 0,
+              behavior: "smooth"
+            });
+          }
+          chat_quote_obverser.observe(chatCellDom);
+        }
+      });
+    });
   });
 </script>

package/layout/_partial/scripts/theme.ejs

@@ -43,6 +43,8 @@
     }
     applyTheme(newTheme)
     window.localStorage.setItem('Stellar.theme', newTheme)
+    utils.dark.mode = newTheme === 'auto' ? (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light") : newTheme;
+    utils.dark.method.toggle.start();
 
     const messages = {
       light: `<%- __('message.theme_switched.light') %>`,
@@ -57,6 +59,9 @@
     const theme = window.localStorage.getItem('Stellar.theme')
     if (theme !== null) {
       applyTheme(theme)
+    } else {
+      utils.dark.mode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
     }
+    utils.dark.method.toggle.start();
   })()
 </script>

package/layout/_partial/scripts/utils.ejs

@@ -1,4 +1,44 @@
 <script type="text/javascript">
+  function RunItem() {
+    this.list = []; // 存放回调函数
+    this.start = () => {
+      for (var i = 0; i < this.list.length; i++) {
+        this.list[i].run();
+      }
+    };
+    this.push = (fn, name, setRequestAnimationFrame = true) => {
+      let myfn = fn
+      if (setRequestAnimationFrame) {
+        myfn = () => {
+          utils.requestAnimationFrame(fn)
+        }
+      }
+      var f = new Item(myfn, name);
+      this.list.push(f);
+    };
+    this.remove = (name) => {
+      for (let index = 0; index < this.list.length; index++) {
+        const e = this.list[index];
+        if (e.name == name) {
+          this.list.splice(index, 1);
+        }
+      }
+    }
+    // 构造一个可以run的对象
+    function Item(fn, name) {
+      // 函数名称
+      this.name = name || fn.name;
+      // run方法
+      this.run = () => {
+        try {
+          fn()
+        } catch (error) {
+          console.log(error);
+        }
+      };
+    }
+  }
+
   const utils = {
     // 懒加载 css https://github.com/filamentgroup/loadCSS
     css: (href, before, media, attributes) => {
@@ -61,7 +101,7 @@
 
     js: (src, opt) => new Promise((resolve, reject) => {
       var script = document.createElement('script');
-      if (src.startsWith('/')){
+      if (src.startsWith('/')) {
         src = ctx.root + src.substring(1);
       }
       script.src = src;
@@ -74,7 +114,7 @@
         script.async = true
       }
       script.onerror = reject
-      script.onload = script.onreadystatechange = function() {
+      script.onload = script.onreadystatechange = function () {
         const loadState = this.readyState
         if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
         script.onload = script.onreadystatechange = null
@@ -90,7 +130,7 @@
         fn()
       }
     },
-    
+
     onLoading: (el) => {
       if (el) {
         $(el).append('<div class="loading-wrap"><svg xmlns="http://www.w3.org/2000/svg" width="2em" height="2em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2"><path stroke-dasharray="60" stroke-dashoffset="60" stroke-opacity=".3" d="M12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3Z"><animate fill="freeze" attributeName="stroke-dashoffset" dur="1.3s" values="60;0"/></path><path stroke-dasharray="15" stroke-dashoffset="15" d="M12 3C16.9706 3 21 7.02944 21 12"><animate fill="freeze" attributeName="stroke-dashoffset" dur="0.3s" values="15;0"/><animateTransform attributeName="transform" dur="1.5s" repeatCount="indefinite" type="rotate" values="0 12 12;360 12 12"/></path></g></svg></div>');
@@ -124,7 +164,7 @@
               }
             }
           }, 5000);
-          fetch(url).then(function(response) {
+          fetch(url).then(function (response) {
             if (status !== 2) {
               clearTimeout(timer);
               resolve(response);
@@ -135,11 +175,11 @@
               return response.json();
             }
             throw new Error('Network response was not ok.');
-          }).then(function(data) {
+          }).then(function (data) {
             retryTimes = 0;
             utils.onLoadSuccess(el);
             callback(data);
-          }).catch(function(error) {
+          }).catch(function (error) {
             if (retryTimes > 0) {
               retryTimes -= 1;
               setTimeout(() => {
@@ -154,5 +194,25 @@
       }
       req();
     },
+    /********************** requestAnimationFrame ********************************/
+    // 1、requestAnimationFrame 会把每一帧中的所有 DOM 操作集中起来，在一次重绘或回流中就完成，并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率，一般来说，这个频率为每秒60帧。
+    // 2、在隐藏或不可见的元素中，requestAnimationFrame 将不会进行重绘或回流，这当然就意味着更少的的 cpu，gpu 和内存使用量。
+    requestAnimationFrame: (fn) => {
+      if (!window.requestAnimationFrame) {
+        window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame;
+      }
+      window.requestAnimationFrame(fn)
+    },
+    dark: {},
+  };
+
+  // utils.dark.mode 当前模式 dark or light
+  // utils.dark.toggle() 暗黑模式触发器
+  // utils.dark.push(callBack[,"callBackName"]) 传入触发器回调函数
+  utils.dark.method = {
+    toggle: new RunItem(),
   };
-</script>
+  utils.dark = Object.assign(utils.dark, {
+    push: utils.dark.method.toggle.push,
+  });
+</script>

package/layout/_partial/scripts.ejs

@@ -21,7 +21,7 @@ function custom_inject() {
 <%- partial('scripts/tagtree') %>
 
 <!-- required -->
-<script src="<%- `${theme.stellar.main_js}?v=${stellar_info('version')}` %>" defer></script>
+<script src="<%- url_for(`${theme.stellar.main_js}?v=${stellar_info('version')}`) %>" defer></script>
 
 <%- partial('scripts/theme') %>
 

package/layout/_plugins/mermaid.ejs

@@ -4,7 +4,7 @@
     var mermaid_config = {
       startOnLoad: true,
       theme:
-        "<%- theme.style.darkmode %>" == "auto" &&
+        "<%- theme.style.prefers_theme %>" == "auto" &&
           window.matchMedia("(prefers-color-scheme: dark)").matches
           ? "dark"
           : "<%- conf.theme %>",

package/layout/_plugins/scrollreveal.ejs

@@ -11,5 +11,6 @@
     };
     ScrollReveal().reveal('.l_left .slide-up', slideUp);
     ScrollReveal().reveal('.l_main .slide-up', slideUp);
+    ScrollReveal().reveal('.l_right .slide-up', slideUp);
   });
 </script>

package/layout/_plugins/search/algolia_search.ejs

@@ -1,13 +1,12 @@
 <script>
-    window.addEventListener('DOMContentLoaded', (event) => {
-      window.searchConfig = {
-        appId: '<%- conf.appId %>', 
-        apiKey: '<%- conf.apiKey %>', 
-        indexName: '<%- conf.indexName %>', 
-        hitsPerPage: 100, 
-      };
-      utils.js('https://gcore.jsdelivr.net/algoliasearch/3/algoliasearch.min.js', { defer: true });
-      utils.js('/js/search/algolia-search.js', { defer: true });
-    });
-  </script>
-  
+  window.addEventListener('DOMContentLoaded', (event) => {
+    window.searchConfig = {
+      appId: '<%- conf.appId %>', 
+      apiKey: '<%- conf.apiKey %>', 
+      indexName: '<%- conf.indexName %>', 
+      js: '<%- conf.js %>',
+      hitsPerPage: 100, 
+    };
+    utils.js('/js/search/algolia-search.js', { defer: true });
+  });
+</script>

package/layout/layout.ejs

@@ -46,7 +46,7 @@ if (theme.style.prefers_theme === 'auto') {
   html += `<body>`
     html += site_background
     html += partial('_partial/cover/index')
-    html += `<div class="l_body s:aa ${page_type} ${article_type}" id="start" layout="${page.layout}" ${indent ? 'text-indent' : ''}>`
+    html += `<div class="l_body ${page_type} ${article_type}" id="start" layout="${page.layout}" ${indent ? 'text-indent' : ''}>`
       html += `<aside class="l_left">`
         html += `<div class="leftbar-container${theme.style.leftbar?.blur ? ' leftbar-blur' : ''}">`
           html += partial('_partial/sidebar/index_leftbar')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-stellar",
-  "version": "1.29.1",
+  "version": "1.30.0",
   "description": "Elegant and powerful theme for Hexo.",
   "main": "package.json",
   "scripts": {

package/scripts/events/lib/config.js

@@ -64,4 +64,7 @@ module.exports = ctx => {
     ctx.theme.config.menubar = {}
   }
 
+  // chat users
+  ctx.theme.config.chat_users = data.chat_users;
+
 }

package/scripts/events/lib/doc_tree.js

@@ -63,7 +63,7 @@ module.exports = ctx => {
   const pages = ctx.locals.get('pages')
   // wiki 所有页面
   const wiki_pages = pages.filter(p => (p.wiki != null)).map(p => new WikiPage(p))
-  const wiki_list = Object.keys(wiki.tree)
+  const wiki_list = Object.keys(wiki.tree).filter(id => wiki_pages.some(p => p.wiki === id))
   // 上架的项目列表
   wiki.shelf = ctx.locals.get('data').wiki || []
   
@@ -99,11 +99,6 @@ module.exports = ctx => {
     let id = wiki_list[i];
     let item = wiki.tree[id]
     let sub_pages = wiki_pages.filter(p => p.wiki === id)
-    if (!sub_pages || sub_pages.length == 0) {
-      wiki_list.splice(i, 1)
-      delete wiki.tree[id]
-      continue
-    }
 
     // 首页
     // 未特别指定首页时，获取TOC第一页作为首页

package/scripts/filters/index.js

@@ -2,3 +2,29 @@
 
 hexo.extend.filter.register('after_render:html', require('./lib/img_lazyload').processSite);
 hexo.extend.filter.register('after_render:html', require('./lib/img_onerror').processSite);
+
+function change_image(data) {
+    if (this.theme.config.tag_plugins.image.parse_markdown) {
+      // data.content = data.content.replace(
+      //     /!\[(.*?)\]\((.*?)\s*(?:"(.*?)")?\)/g,
+      //     '{% image $2 $3 %}'
+      // );
+      let splited_content = data.content.split(/(```[\s\S]*?```|{%\s*gallery\s*%}[\s\S]*?{%\s*endgallery\s*%})/g);
+      splited_content = splited_content.map((s) => {
+        let matches_no = s.match(/(```[\s\S]*?```|{%\s*gallery\s*%}[\s\S]*?{%\s*endgallery\s*%})/i);
+        let matches_img = s.match(/!\[(.*?)\]\((.*?)\s*(?:"(.*?)")?\)/i);
+        if (!matches_no && matches_img) {
+          s = s.replace(
+            /!\[(.*?)\]\((.*?)\s*(?:"(.*?)")?\)/g,
+            `{% image $2 $3 %}`
+          );
+        }
+        return s;
+      });
+      data.content = splited_content.join('');
+    }
+    return data;
+}
+
+hexo.extend.filter.register('before_post_render', change_image, 9);
+

package/scripts/generators/notebooks.js

@@ -30,7 +30,7 @@ function paginationWithEmpty(base, posts, options={}) {
 
 hexo.extend.generator.register('notebooks', function (locals) {
   const { site_tree, notebooks } = hexo.theme.config
-  if (notebooks.tree.length === 0) {
+  if (!notebooks?.tree || Object.keys(notebooks.tree).length === 0) {
     return []
   }
 

package/scripts/generators/search.js

@@ -31,11 +31,13 @@ hexo.extend.generator.register('search_json_generator', function (locals) {
       temp_post.path = root + post.path
     }
     if (cfg.content != false && post.content) {
-      var content = stripHTML(post.content).trim()
+      var content = stripHTML(post.content.replace(/<span class="line">\d+<\/span>/g, '')).trim()
       // 部分HTML标签
       content = content.replace(/<iframe[\s|\S]+iframe>/g, '')
       content = content.replace(/<hr>/g, '')
       content = content.replace(/<br>/g, '')
+      // 去除HTML实体
+      content = content.replace(/&[^\s;]+;/g, "")
       // 换行符换成空格
       content = content.replace(/\\n/g, ' ')
       content = content.replace(/\n/g, ' ')
@@ -60,8 +62,22 @@ hexo.extend.generator.register('search_json_generator', function (locals) {
     return temp_post
   }
 
+  function matchAndExit(path, patterns) {
+    for (let pattern of patterns) {
+        const regexPattern = new RegExp('^' + pattern.replace(/\*/g, '.*') + '$');
+        if (path.match(regexPattern)) {
+            // console.log("Matched pattern:", pattern);
+            return true;
+        }
+    }
+    return false;
+  }
+
   if (posts) {
     posts.each(function(post) {
+      var layout_list = ["post"]
+      if (!layout_list.includes(post.layout)) return
+      if (cfg.skip_search && matchAndExit(post.path, cfg.skip_search)) return
       if (post.indexing == false) return
       let temp_post = generateJson(post)
       res.push(temp_post)
@@ -69,6 +85,9 @@ hexo.extend.generator.register('search_json_generator', function (locals) {
   } 
   if (pages) {
     pages.each(function(page) {
+      var layout_list = ["page", "wiki"]
+      if (!layout_list.includes(page.layout)) return
+      if (cfg.skip_search && matchAndExit(page.path, cfg.skip_search)) return
       if (page.indexing == false) return
       let temp_post = generateJson(page)
       res.push(temp_post)
@@ -78,4 +97,4 @@ hexo.extend.generator.register('search_json_generator', function (locals) {
     path: cfg.path,
     data: JSON.stringify(res)
   }
-})
+})