hexo笔记：文章排序

说实话这个寒假真的是挺久的，希望疫情快点好转起来！
之前一直想着要让自己博客中的文章按照更新时间来排序，因为自己在学习的过程中总是会去更新之前的文章，特别是有时候更新量还挺大的，不放到前面来感觉有点可惜哈哈。但是由于没有时间而且不知道怎么做，一直没实现。今天突然想起这个事情，琢磨了好久终于搞出来了。
此次改动之后，我将博客侧栏中的“归档”修改为“最新发布”，依然是按照文章发布时间归档的。

主页文章按更新时间排序

实现前提：使用hexo搭建博客。
我先看了看hexo的配置文件中有没有可以直接设置的地方，试了几个关键词搜索之后发现果然有，这里原本是按照发布日期排序的。

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date

看了一些hexo自动生成的代码之后，我发现了几个与date用法类似的参数，其中updated与date相对应。于是我将-date替换成了-updated，然后hexo start之后发现没起作用。
于是我参照着官方文档里的仅有的一点点说明，改成了-name试试能不能按名称排序，but failed。
没办法，我只好开始了漫长的对所有但凡是包含“date”的文件的阅览过程…网上也找不到任何资料，估计有这种想法的只有我吧哈哈。
终于，我在node_modules\hexo-generator-index-pin-top\lib\generator.js文件中找到了似乎是用于排序的代码，该文件是为了添加文章置顶功能的，但当置顶等级设置相同时，按照发布日期进行排序。
由于本人对JavaScript只是粗略了解，因此依样画葫芦作了一些修改，改完之后该文件中的内容如下所示。

'use strict';
var pagination = require('hexo-pagination');
module.exports = function(locals){
  var config = this.config;
  var posts = locals.posts;
    posts.data = posts.data.sort(function(a, b) {
        if(a.top && b.top) { // 当两篇文章top都有定义时
            if(a.top == b.top) return b.updated - a.updated; // 若top值一样，则按照文章更新日期降序排列
            else return b.top - a.top; // 否则按照top值降序排列
        }
        else if(a.top && !b.top) { // 以下两种情况是若只有一篇文章top有定义，则将有top的排在前面（这里用异或操作居然不行233）
            return -1;
        }
        else if(!a.top && b.top) { //上一条已解释
            return 1;
        }
        else return b.updated - a.updated; // 若都没定义，则按照文章更新日期降序排列
    });
  var paginationDir = config.pagination_dir || 'page';
  return pagination('', posts, {
    perPage: config.index_generator.per_page,
    layout: ['index', 'archive'],
    format: paginationDir + '/%d/',
    data: {
      __index: true
    }
  });
};

再次hexo s，生效，开心。

侧栏按文章更新时间排序

实现前提：使用hexo搭建博客。
这是我在网上找到的另一种方法，由于和next主题不是特别搭配，因此最终没有使用。
首先在侧栏对应的目录下创建一个名为blog-sidebar.swig的渲染文件。（比如我的侧栏在header.swig中编辑，对应的目录为themes\next\layout\_partials，这里我使用了next主题，不同的话自行更改）
在该文件中添加如下代码。

<div class="recent-posts">
    <div class="item_headline" style="Text-align:center">
        <span>最近更新<span>
    </div>
    <ul class="posts-list-block">
        {% set posts = site.posts.sort('-updated') %}
        {% for post in posts.slice('0', '10') %}
        <li>
            <a href="{{ url_for(post.path) }}" title="{{ post.title }}" target="_blank">{{ post.title }}</a>
        </li>
        {% endfor %}
    </ul>
</div>

然后来到编辑侧栏的文件，在合适的位置添加如下代码。

<div class="blog-sidebar-left">
    {% include 'blog-sidebar.swig' %}
</div>

建议添加在nav标签内部，原因我在front-end笔记：使用div实现居中显示一文中曾作说明。

侧栏添加其它文章排序方式

实现前提：使用hexo搭建博客，使用next主题并使用leancloud做站点统计。
实现上面的功能之后，我又添加了“最近阅读”和“热度排名”两项。下面来说说我具体是怎么做的。

注：由于leancloud访问不是很稳定，在线浏览时或许会出错，但下面的方法确实是可行的。

按阅读量排行

在博客目录下执行hexo n page rank新建一个rank页面，编辑其中的index.md文件，添加如下代码。

<div id="rank"></div>
<script src="https://cdn1.lncld.net/static/js/av-core-mini-0.6.4.js"></script>
<script>AV.initialize("YOUR_APPID", "YOUR_APPKEY");</script>
<script type="text/javascript">
    var time=0
    var title=""
    var url=""
    var query = new AV.Query('Counter');
    query.notEqualTo('id',0);
    query.descending('time');
    query.limit(10);
    query.find().then(function (todo) {
        for (var i=0;i<10;i++){
        var result=todo[i].attributes;
        time=result.time;
        title=result.title;
        url=result.url;
        var content="<p>"+"<font color='#1C1C1C'>"+time+"<i class='fa fa-eye' aria-hidden='true'></i>->"+"</font>"+"<a href='"+"YOUR_URL"+url+"'>"+title+"</a>"+"</p>";
        document.getElementById("rank").innerHTML+=content
        }
    }, function (error) {
    console.log("error");
    });
</script>

注意，请将上面代码中的YOUR_APPID和YOUR_APPKEY替换为你learncloud中的对应ID和key，可在设置中查看。此外，还要将YOUR_URL替换为你的博客地址，包含协议并以/结束，例如我的：https://Gsy00517.github.io/。

注意：请务必注意定义content变量时单引号和双引号的使用。

这时部署的话还是看不到这个page的，要看到排序，还需如下设置。
打开主题配置文件，在对应menu的位置添加rank: /rank/ || signal。这里的图标可以到Font Awesome上去找，非常丰富，我这里用的是signal。
如果你使用了语言包，别忘了到语言包内添加对应的翻译，比如我在hexo\theme\next\languages\zh-Hans.yml文件中对应menu的位置添加了rank: 热度排名。

按最近阅读排行

在leancloud中，阅读量最近的更新时间用参数updatedAt表示，这是一个格式为YYYY-MM-DD HH:mm:ss的时间，不过我们也可以对它降序排列。
实现方法于上面的大同小异，这是我调整的代码，可在此基础上创造发挥，亲测有效。

<div id="new"></div>
<script src="https://cdn1.lncld.net/static/js/av-core-mini-0.6.4.js"></script>
<script>AV.initialize("YOUR_APPID", "YOUR_APPKEY");</script>
<script type="text/javascript">
    var updatedAt=""
    var title=""
    var url=""
    var query = new AV.Query('Counter');
    query.notEqualTo('id',0);
    query.descending('updatedAt');
    query.limit(10);
    query.find().then(function (todo) {
        for (var i=0;i<10;i++){
            var result=todo[i].attributes;
            title=result.title;
            updatedAt=result.updatedAt;
            url=result.url;
            var content="<p>"+"<a href='"+"YOUR_URL"+url+"' target='_blank'>"+title+"</a>"+"</p>";
            document.getElementById("new").innerHTML+=content
        }
    }, function (error) {
    console.log("error");
  });
</script>