breaking changes: cover 的顯示優化 #1101

feature: default_cover 可配置顏色
fix: 修復使用本地搜索時，輸入特殊符號沒有顯示結果的 bug closed #1110
fix: 修復 頂部圖和 footer 配置帶有/的顏色參數時，無法顯示顏色的 bug
improvement: 鼠標移動到分頁時，文章分頁按鈕增加説明文字
improvement: 文章頁的頂部圖顯示次序為 top_img > cover > default_top_img
improvement: canonical 的鏈接根據配置生成 #1111

scripts/filters/random_cover.js

@@ -6,40 +6,40 @@
 'use strict'
 
 hexo.extend.filter.register('before_post_render', function (data) {
-  const { config } = this
-  if (config.post_asset_folder) {
-    const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/
+  const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/
+  let randomCover
+  let coverVal = data.cover
+
+  // Add path to top_img and cover if post_asset_folder is enabled
+  if (hexo.config.post_asset_folder) {
     const topImg = data.top_img
-    const cover = data.cover
     if (topImg && topImg.indexOf('/') === -1 && imgTestReg.test(topImg)) data.top_img = data.path + topImg
-    if (cover && cover.indexOf('/') === -1) data.cover = data.path + cover
+    if (coverVal && coverVal.indexOf('/') === -1 && imgTestReg.test(coverVal)) data.cover = data.path + coverVal
   }
 
-  if (data.cover === false) {
-    data.randomcover = randomCover()
-    return data
+  const randomCoverFn = () => {
+    const theme = hexo.theme.config
+    if (!(theme.cover && theme.cover.default_cover)) return false
+    if (!Array.isArray(theme.cover.default_cover)) return theme.cover.default_cover
+    const num = Math.floor(Math.random() * theme.cover.default_cover.length)
+    return theme.cover.default_cover[num]
+  }
+  
+  if (coverVal === false) return data
+
+  // If cover is not set, use random cover
+  if (!coverVal) {
+    randomCover = randomCoverFn()
+    data.cover = randomCover
+    coverVal = randomCover // update coverVal
   }
 
-  data.cover = data.cover || randomCover()
-  return data
-})
-
-function randomCover () {
-  const theme = hexo.theme.config
-  let cover
-  let num
-
-  if (theme.cover && theme.cover.default_cover) {
-    if (!Array.isArray(theme.cover.default_cover)) {
-      cover = theme.cover.default_cover
-      return cover
-    } else {
-      num = Math.floor(Math.random() * theme.cover.default_cover.length)
-      cover = theme.cover.default_cover[num]
-      return cover
+  if (coverVal) {
+    if (coverVal.indexOf('//') !== -1 || imgTestReg.test(coverVal)) {
+      data.cover_type = 'img'
+      return data
     }
-  } else {
-    cover = theme.default_top_img || 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
-    return cover
   }
-}
+
+  return data
+})

scripts/helpers/page.js

@@ -54,8 +54,8 @@ hexo.extend.helper.register('cloudTags', function (options = {}) {
   return result
 })
 
-hexo.extend.helper.register('urlNoIndex', function (url = null) {
-  return prettyUrls(url || this.url, { trailing_index: false, trailing_html: false })
+hexo.extend.helper.register('urlNoIndex', function (url = null, trailingIndex = false, trailingHtml = false) {
+  return prettyUrls(url || this.url, { trailing_index: trailingIndex, trailing_html: trailingHtml })
 })
 
 hexo.extend.helper.register('md5', function (path) {
@@ -95,3 +95,11 @@ hexo.extend.helper.register('findArchivesTitle', function (page, menu, date) {
 
   return loop(menu) || defaultTitle
 })
+
+hexo.extend.helper.register('isImgOrUrl', function (path) {
+  const imgTestReg = /\.(png|jpe?g|gif|svg|webp)(\?.*)?$/
+  if (path.indexOf('//') !== -1 || imgTestReg.test(path)) {
+    return true
+  }
+  return false
+})

scripts/helpers/related_post.js

@@ -15,7 +15,7 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
           title: post.title,
           path: post.path,
           cover: post.cover,
-          randomcover: post.randomcover,
+          cover_type: post.cover_type,
           weight: 1,
           updated: post.updated,
           created: post.date
@@ -50,13 +50,14 @@ hexo.extend.helper.register('related_posts', function (currentPost, allPosts) {
     result += '<div class="relatedPosts-list">'
 
     for (let i = 0; i < Math.min(relatedPosts.length, limitNum); i++) {
-      const cover =
-        relatedPosts[i].cover === false
-          ? relatedPosts[i].randomcover
-          : relatedPosts[i].cover
+      const cover = relatedPosts[i].cover || 'var(--default-bg-color)'
       const title = this.escape_html(relatedPosts[i].title)
       result += `<div><a href="${this.url_for(relatedPosts[i].path)}" title="${title}">`
-      result += `<img class="cover" src="${this.url_for(cover)}" alt="cover">`
+      if (relatedPosts[i].cover_type === 'img') {
+        result += `<img class="cover" src="${this.url_for(cover)}" alt="cover">`
+      } else {
+        result += `<div class="cover" style="background: ${cover}"></div>`
+      }
       if (dateType === 'created') {
         result += `<div class="content is-center"><div class="date"><i class="far fa-calendar-alt fa-fw"></i> ${this.date(relatedPosts[i].created, hexoConfig.date_format)}</div>`
       } else {