From dbc4eaa1355bbf4a1885d91a12cfd46004385fb4 Mon Sep 17 00:00:00 2001
From: xaoxuu <me@xaoxuu.com>
Date: Sun, 25 Jul 2021 16:44:55 +0800
Subject: [PATCH] auto_cover

---
 _config.yml                                  |   4 +
 layout/_partial/main/post_list/post_card.ejs | 123 ++++++++++++-------
 scripts/helpers/related_posts.js             |  19 ++-
 3 files changed, 97 insertions(+), 49 deletions(-)

diff --git a/_config.yml b/_config.yml
index 1638619..824dde5 100755
--- a/_config.yml
+++ b/_config.yml
@@ -50,6 +50,8 @@ sidebar:
 
 ######## Article ########
 article:
+  # 如果没有指定封面，是否根据 tags 作为关键词搜索封面？
+  auto_cover: true # search from https://source.unsplash.com/
   # 如果没有指定 excerpt 和 description，将自动取多长的内容作为文章摘要？
   auto_excerpt: 200
   # 分类颜色
@@ -64,6 +66,8 @@ article:
   related_posts:
     enable: false
     max_count: 5
+    auto_cover: true # 如果没有封面就根据 tags 作为关键词搜索封面，开了此项将不会自动从文章中提取首张图片作为封面了。
+
 
 
 ######## Comments ########
diff --git a/layout/_partial/main/post_list/post_card.ejs b/layout/_partial/main/post_list/post_card.ejs
index 941e5fd..df597c6 100755
--- a/layout/_partial/main/post_list/post_card.ejs
+++ b/layout/_partial/main/post_list/post_card.ejs
@@ -1,55 +1,84 @@
 <%
-let showCat = false;
-if (post.categories && post.categories.length > 0) {
-  showCat = true;
-}
-%>
-<% if (post.cover) { %>
-  <div class='post-cover'>
-    <img src='<%- post.cover %>'/>
-  </div>
-<% } %>
-<h2 class="post-title">
-  <%- (post.title || post.seo_title) ? (post.title || post.seo_title) : date(post.date, config.date_format) %>
-</h2>
-<div class='excerpt'>
-  <% if (post.excerpt) { %>
-    <p><%- strip_html(post.excerpt) %></p>
-  <% } else if (post.description) { %>
-    <p><%- post.description %></p>
-  <% } else if (post.content && theme.article.auto_excerpt > 0) { %>
-    <p><%- truncate(strip_html(post.content), {length: theme.article.auto_excerpt}) %></p>
-  <% } %>
-</div>
-<div class='meta cap'>
-  <span class='cap' id='post-meta'>
-    <%- __('meta.created') %>&nbsp;<time datetime='<%- date_xml(post.date) %>'><%= date(post.date, config.date_format) %></time>
-  </span>
-  <% if (showCat) { %>
-    <% if (post.layout == 'post' && post.categories && post.categories.length > 0) { %>
-      <%
+function layoutDiv() {
+  var el = '';
+  // 封面
+  if (post.cover || theme.article.auto_cover) {
+    var cover_url;
+    if (post.cover !== undefined) {
+      if (post.cover.includes('/')) {
+        cover_url = post.cover;
+      } else {
+        cover_url = 'https://source.unsplash.com/1280x640/?' + post.cover;
+      }
+    } else {
+      // 自动以 tags 作为关键词搜索封面
+      if (post.tags) {
+        var params = '';
+        post.tags.reverse().forEach((tag, i) => {
+          if (i > 0) {
+            params += ',';
+          }
+          params += tag.name;
+        });
+        cover_url = 'https://source.unsplash.com/1280x640/?' + params;
+      } else {
+        cover_url = 'https://source.unsplash.com/random/1280x640';
+      }
+    }
+    if (cover_url) {
+      el += '<div class="post-cover">';
+      el += '<img src="' + cover_url + '"/>';
+      el += '</div>';
+    }
+  }
+
+  // 标题
+  el += '<h2 class="post-title">';
+  el += (post.title || post.seo_title) ? (post.title || post.seo_title) : date(post.date, config.date_format);
+  el += '</h2>';
+
+  // 摘要
+  el += '<div class="excerpt">';
+  el += '<p>';
+  if (post.excerpt) {
+    el += strip_html(post.excerpt);
+  } else if (post.description) {
+    el += post.description;
+  } else if (post.content && theme.article.auto_excerpt > 0) {
+    el += truncate(strip_html(post.content), {length: theme.article.auto_excerpt});
+  }
+  el += '</p>';
+  el += '</div>';
+
+  // meta
+  el += '<div class="meta cap">';
+  // time
+  el += '<span class="cap" id="post-meta">';
+  el += __("meta.created") + '&nbsp;' + '<time datetime="' + date_xml(post.date) + '">' + date(post.date, config.date_format) + '</time>';
+  el += '</span>';
+  // cat
+  if (post.categories && post.categories.length > 0) {
+    if (post.layout === 'post' && post.categories && post.categories.length > 0) {
       var cats = [];
       if (post.categories) {
         post.categories.forEach((cat, i) => {
           cats.push(cat.name);
         });
       }
-      function layoutCats() {
-        if (cats.length > 0) {
-          let cat = cats.shift();
-          var el = '<span class="cap breadcrumb"' + category_color(cat) + '>';
-          el += cat;
-          el += '</span>';
-          return el;
-        } else {
-          return '';
-        }
+      if (cats.length > 0) {
+        let cat = cats.shift();
+        el += '<span class="cap breadcrumb"' + category_color(cat) + '>';
+        el += cat;
+        el += '</span>';
       }
-      %>
-      <%- layoutCats() %>
-    <% } %>
-  <% } %>
-  <% if (post.pin) { %>
-    <span class='pin'><img src='https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/badge/3279dd441df8b.svg'/></span>
-  <% } %>
-</div>
+    }
+  }
+  if (post.pin) {
+    el += '<span class="pin"><img src="https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/badge/3279dd441df8b.svg"/></span>';
+  }
+  el += '<div>';
+
+  return el;
+}
+%>
+<%- layoutDiv() %>
diff --git a/scripts/helpers/related_posts.js b/scripts/helpers/related_posts.js
index e425339..139e48f 100644
--- a/scripts/helpers/related_posts.js
+++ b/scripts/helpers/related_posts.js
@@ -35,8 +35,23 @@ hexo.extend.helper.register('popular_posts_wrapper', function(args){
     if (p && p.length > 0) {
       p = p.data[0];
     }
-    if (p && p.cover) {
-      list.img = p.cover;
+    if (p) {
+      if (p.cover) {
+        if (p.cover.includes('/')) {
+          list.img = p.cover;
+        } else {
+          list.img = 'https://source.unsplash.com/1280x640/?' + p.cover;
+        }
+      } else if (cfg.auto_cover && p.tags.length > 0) {
+        var params = '';
+        p.tags.reverse().forEach((tag, i) => {
+          if (i > 0) {
+            params += ',';
+          }
+          params += tag.name;
+        });
+        list.img = 'https://source.unsplash.com/1280x640/?' + params;
+      }
     }
     if (hexo.theme.config.default.cover) {
       el += '<div class="img">'