From 90f06b8940b205dda9f529e4e052c196a919c32f Mon Sep 17 00:00:00 2001 From: XPoet Date: Tue, 24 Nov 2020 20:06:08 +0800 Subject: [PATCH] feat: display how long ago in home articles --- languages/en.yml | 8 ++ languages/zh-CN.yml | 8 ++ layout/_partial/comment/valine.ejs | 5 - layout/_partial/home-article-meta-info.ejs | 2 +- scripts/helpers/export-config.js | 46 +++++++--- source/js/left-side-toggle.js | 2 +- source/js/local-search.js | 12 +-- source/js/main.js | 11 +++ source/js/utils.js | 102 ++++++++++++--------- 9 files changed, 131 insertions(+), 65 deletions(-) diff --git a/languages/en.yml b/languages/en.yml index 1281036..7f71166 100644 --- a/languages/en.yml +++ b/languages/en.yml @@ -35,3 +35,11 @@ copyright: create_time: Create time license_title: Copyright Notice license_content: "All articles in this blog are licensed under %s unless stating additionally." +ago: + second: "%s seconds ago" + minute: "%s minutes ago" + hour: "%s hours ago" + day: "%s days age" + week: "%s weeks age" + month: "%s months age" + year: "%s years age" diff --git a/languages/zh-CN.yml b/languages/zh-CN.yml index e2f0867..5201a6e 100644 --- a/languages/zh-CN.yml +++ b/languages/zh-CN.yml @@ -35,3 +35,11 @@ copyright: create_time: 创建时间 license_title: 版权声明 license_content: "本博客所有文章除特别声明外，均采用 %s 许可协议。转载请注明出处！" +ago: + second: "%s 秒前" + minute: "%s 分钟前" + hour: "%s 小时前" + day: "%s 天前" + week: "%s 周前" + month: "%s 月前" + year: "%s 年前" diff --git a/layout/_partial/comment/valine.ejs b/layout/_partial/comment/valine.ejs index 0744b59..131d857 100755 --- a/layout/_partial/comment/valine.ejs +++ b/layout/_partial/comment/valine.ejs @@ -29,11 +29,6 @@ author = author.toLocaleLowerCase(); } - let email = '<%= theme.base_info.email %>'; - if (email) { - email = email.toLocaleLowerCase(); - } - for (let vcard of vcards) { const vnick = vcard.querySelector('.vhead .vnick'); if (vnick.innerHTML.toLocaleLowerCase() === author) { diff --git a/layout/_partial/home-article-meta-info.ejs b/layout/_partial/home-article-meta-info.ejs index 18d072d..d1d28de 100644 --- a/layout/_partial/home-article-meta-info.ejs +++ b/layout/_partial/home-article-meta-info.ejs @@ -1,6 +1,6 @@
- <%- moment(post.date, Date.now()).locale(config.language).fromNow() %> + <%= date(post.date, 'YYYY-MM-DD') %> <% if (post.categories.length && theme.home_article.category.enable === true) { %>
    diff --git a/scripts/helpers/export-config.js b/scripts/helpers/export-config.js index b64520f..b9bb2b8 100644 --- a/scripts/helpers/export-config.js +++ b/scripts/helpers/export-config.js @@ -3,27 +3,51 @@ 'use strict'; const url = require('url'); +const fs = require('fs'); +const path = require('path'); +const yaml = require('js-yaml'); /** * Export theme config to js */ hexo.extend.helper.register('export_config', function () { - let {config, theme} = this; - let exportConfig = { + + let { config, theme } = this; + + // ------ export language to js ------ + const languageDir = path.join(__dirname, '../../languages'); + let file = fs.readdirSync(languageDir).find(v => v === `${config.language}.yml`); + file = languageDir + '/' + (file ? file : 'en.yml'); + let languageContent = fs.readFileSync(file, 'utf8'); + try { + languageContent = yaml.safeLoad(languageContent); + } catch (e) { + console.log(e); + } + // --------------------------------- + + + + let hexo_config = { hostname: url.parse(config.url).hostname || config.url, - root: config.root, - localsearch: theme.local_search, - codeblock: theme.codeblock, - toc: theme.toc, - back2top: theme.back2top, - side_tools: theme.side_tools, - style: theme.style + root: config.root }; if (config.search) { - exportConfig.path = config.search.path; + hexo_config.path = config.search.path; } + + let theme_config = { + toc: theme.toc, + left_side_width: theme.left_side_width, + local_search: theme.local_search, + side_tools: theme.side_tools, + version: theme.version, + } + return ``; }); diff --git a/source/js/left-side-toggle.js b/source/js/left-side-toggle.js index 2f225f9..1dddc06 100644 --- a/source/js/left-side-toggle.js +++ b/source/js/left-side-toggle.js @@ -30,7 +30,7 @@ window.addEventListener('DOMContentLoaded', () => { }, changePageLayoutWhenOpenToggle(isOpen) { - const pageAsideWidth = CONFIG.style.left_side_width || '260px'; + const pageAsideWidth = KEEP.theme_config.left_side_width || '260px'; this.containerDom.style.paddingLeft = isOpen ? pageAsideWidth : '0'; this.pageTopDom.style.paddingLeft = isOpen ? pageAsideWidth : '0'; this.leftAsideDom.style.left = isOpen ? '0' : `-${pageAsideWidth}`; diff --git a/source/js/local-search.js b/source/js/local-search.js index 8670d5c..b295462 100644 --- a/source/js/local-search.js +++ b/source/js/local-search.js @@ -5,7 +5,7 @@ window.addEventListener('DOMContentLoaded', () => { let datas; let isXml = true; // Search DB path - let searchPath = CONFIG.path; + let searchPath = KEEP.hexo_config.path; if (!searchPath) return false; if (searchPath.length === 0) { searchPath = 'search.xml'; @@ -171,7 +171,7 @@ window.addEventListener('DOMContentLoaded', () => { }); // Select top N slices in content - let upperBound = parseInt(CONFIG.localsearch.top_n_per_article ? CONFIG.localsearch.top_n_per_article : 1, 10); + let upperBound = parseInt(KEEP.theme_config.local_search.top_n_per_article ? KEEP.theme_config.local_search.top_n_per_article : 1, 10); if (upperBound >= 0) { slicesOfContent = slicesOfContent.slice(0, upperBound); } @@ -222,7 +222,7 @@ window.addEventListener('DOMContentLoaded', () => { }; const fetchData = () => { - fetch(CONFIG.root + searchPath) + fetch(KEEP.theme_config.root + searchPath) .then(response => response.text()) .then(res => { // Get the contents from search data @@ -238,7 +238,7 @@ window.addEventListener('DOMContentLoaded', () => { datas = datas.filter(data => data.title).map(data => { data.title = data.title.trim(); data.content = data.content ? data.content.trim().replace(/<[^>]+>/g, '') : ''; - if (CONFIG.localsearch.unescape) { + if (KEEP.theme_config.local_search.unescape) { data.content = unescapeHtml(data.content); } data.url = decodeURIComponent(data.url).replace(/\/{2,}/g, '/'); @@ -249,11 +249,11 @@ window.addEventListener('DOMContentLoaded', () => { }); }; - if (CONFIG.localsearch.preload) { + if (KEEP.theme_config.local_search.preload) { fetchData(); } - if (CONFIG.localsearch.trigger === 'auto') { + if (KEEP.theme_config.local_search.trigger === 'auto') { if (input) { input.addEventListener('input', inputEventFunction); } diff --git a/source/js/main.js b/source/js/main.js index 904511d..fa9f35b 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -1,4 +1,12 @@ window.addEventListener('DOMContentLoaded', () => { + + KEEP.themeInfo = { + author: 'XPoet', + name: 'Keep', + version: KEEP.theme_config.version, + repository: 'https://github.com/XPoet/hexo-theme-keep' + } + // print theme info KEEP.utils.printThemeInfo(); @@ -19,4 +27,7 @@ window.addEventListener('DOMContentLoaded', () => { // big image viewer handle KEEP.utils.imageViewer(); + + // set how long age in home article block + KEEP.utils.setHowLongAgoInHome(); }); diff --git a/source/js/utils.js b/source/js/utils.js index 47f1080..00e6615 100644 --- a/source/js/utils.js +++ b/source/js/utils.js @@ -1,32 +1,19 @@ KEEP.utils = { - themeInfo: { - author: 'XPoet', - name: 'Keep', - version: '3.0.0', - repository: 'https://github.com/XPoet/hexo-theme-keep' - }, - - printThemeInfo() { - const themeInfo = `${this.themeInfo.name} v${this.themeInfo.version}`; - console.info(themeInfo + '\n' + this.themeInfo.repository); - const footThemeInfoDom = document.querySelector('.footer .info-container .theme-info a.theme-version'); - if (footThemeInfoDom) { - footThemeInfoDom.setAttribute('href', this.themeInfo.repository); - footThemeInfoDom.innerHTML = themeInfo; - } - - } -} - -KEEP.utils = { - - ...KEEP.utils, - headerProgress_dom: document.querySelector('.header-progress'), pageTop_dom: document.querySelector('.page-main-content-top'), firstScreen_dom: document.querySelector('.first-screen-container'), + printThemeInfo() { + const themeInfo = `${KEEP.themeInfo.name} v${KEEP.themeInfo.version}`; + console.info(themeInfo + '\n' + KEEP.themeInfo.repository); + const footThemeInfoDom = document.querySelector('.footer .info-container .theme-info a.theme-version'); + if (footThemeInfoDom) { + footThemeInfoDom.setAttribute('href', KEEP.themeInfo.repository); + footThemeInfoDom.innerHTML = themeInfo; + } + }, + // Scroll Style Handle prevScrollValue: 0, styleHandleWhenScroll() { @@ -57,7 +44,7 @@ KEEP.utils = { this.styleHandleWhenScroll(); // TOC scroll handle - if (CONFIG.toc.enable && KEEP.utils.hasOwnProperty('findActiveIndexByTOC')) { + if (KEEP.theme_config.toc.enable && KEEP.utils.hasOwnProperty('findActiveIndexByTOC')) { KEEP.utils.findActiveIndexByTOC(); } @@ -68,7 +55,7 @@ KEEP.utils = { // tools registerToolsButtonClick() { - if (!CONFIG.side_tools.enable) return; + if (!KEEP.theme_config.side_tools.enable) return; let isOpen = false; this.toolsMenuButton_dom = document.querySelector('.tools-button'); @@ -99,22 +86,6 @@ KEEP.utils = { }); }, - // calculate transform value - calculateTransformValue(index) { - const x = 3; - const y = Math.floor(index / x) + 1; - const z = index % x + 1; - - switch (z) { - case 1: - return `0, -${150 * y}%, 0`; - case 2: - return `-${150 * y}%, -${150 * y}%, 0`; - case 3: - return `-${150 * y}%, 0, 0`; - } - }, - // go comment goComment() { this.goComment_dom = document.querySelector('.go-comment'); @@ -178,5 +149,54 @@ KEEP.utils = { targetImg.setAttribute('src', img.getAttribute('src')) }); }); + }, + + + setLanguage(p1, p2) { + return p2.replace(/%s/g, p1) + }, + + getHowLongAgo(timestamp) { + + let l = KEEP.language + + timestamp /= 1000; + + const __Y = Math.floor(timestamp / (60 * 60 * 24 * 30) / 12) + const __M = Math.floor(timestamp / (60 * 60 * 24 * 30)) + const __W = Math.floor(timestamp / (60 * 60 * 24) / 7) + const __d = Math.floor(timestamp / (60 * 60 * 24)) + const __h = Math.floor(timestamp / (60 * 60) % 24) + const __m = Math.floor(timestamp / 60 % 60) + const __s = Math.floor(timestamp % 60) + + if (__Y > 0) { + return this.setLanguage(__Y, l.ago.year) + + } else if (__M > 0) { + return this.setLanguage(__M, l.ago.month) + + } else if (__W > 0) { + return this.setLanguage(__W, l.ago.week) + + } else if (__d > 0) { + return this.setLanguage(__d, l.ago.day) + + } else if (__h > 0) { + return this.setLanguage(__h, l.ago.hour) + + } else if (__m > 0) { + return this.setLanguage(__m, l.ago.minute) + + } else if (__s > 0) { + return this.setLanguage(__s, l.ago.second) + } + }, + + setHowLongAgoInHome() { + const post = document.querySelectorAll('.home-article-meta-info .home-article-date'); + post && post.forEach(v => { + v.innerHTML = this.getHowLongAgo(Date.now() - new Date(v.dataset.date).getTime()) + }) } }