热门分类改为随机图片API获取

[shiker1996]

你当前使用的版本

1.0.10

你的建议是否涉及到一些现有的问题？

建议热门分类图片换为随机图片api，这样加载更快

描述你想实现的效果

描述一些方案

hot_category.ftl改动：

    <ul class="joe_index__hot-list hotlist">
      <#assign random_img_ok=settings.enable_random_img_api==true && settings.random_img_api!=''>
      <#if settings.hot_category_source == 'hot'>
        <@categoryTag method="list">
          <#list categories?sort_by("postCount")?reverse as category>
            <#if category_index lt 4>
              <li class="item animated fadeIn">
                <a class="link" target="_blank" href="${category.fullPath!}" title="${category.name!}">
                  <figure class="inner">
                    <#if settings.enabel_category_celcius!true>
                      <#include "post_num.ftl">
                      <@post_num type="category" id="${category.id?c}" suffix="℃" />
                    </#if>
                    <#assign cover=(category.thumbnail?? && category.thumbnail!='')?then(category.thumbnail,(random_img_ok==true)?then(settings.random_img_api + ((settings.random_img_api?index_of('?')!=-1)?then('&','?')) + '_r=' + category.id,'https://picsum.photos/id/2${category_index}/350/200')) >
                    <img width="100%" height="120" class="image lazyload" data-src="${cover}" src="${LAZY_IMG}" onerror="Joe.errorImg(this)" alt="${category.name!}">
                    <figcaption class="title">${category.name!}</figcaption>
                  </figure>
                </a>
              </li>
            </#if>
          </#list>
        </@categoryTag>
      <#else>
        <#if settings.custom_category_data?? && settings.custom_category_data != ''>
          <#list settings.custom_category_data?split('=====') as categorys>
            <#if categorys_index lt 4>
              <#assign category = categorys?split('-|||-')>
              <#assign cur_title = (category[0]?? && category[0]?trim!='')?then(category[0]?replace('\n','')?replace('\r','')?trim,'')>
              <#assign cur_img = (category[1]?? && category[1]!='')?then(category[1]?replace('\n','')?replace('\r','')?trim,'')>
              <#assign cur_link = (category[2]?? && category[2]!='')?then(category[2]?replace('\n','')?replace('\r','')?trim,'')>
              <#assign clickable = cur_link != '' && cur_link != '#'>
              <li class="item animated fadeIn">
                <a class="link${clickable?then(' clickable','')}" href="${clickable?then(cur_link,'javascript:;')}" ${clickable?then('target="_blank"','')} rel="noopener noreferrer nofollow" href="${cur_link!}" title="${cur_title!}">
                  <figure class="inner">
                    <#assign cover=(category.thumbnail?? && category.thumbnail!='')?then(category.thumbnail,(random_img_ok==true)?then(settings.random_img_api + ((settings.random_img_api?index_of('?')!=-1)?then('&','?')) + '_r=' + category.id,'https://picsum.photos/id/2${category_index}/350/200')) >
                    <img width="100%" height="120" class="image lazyload" data-src="${cover}" src="${LAZY_IMG}" onerror="Joe.errorImg(this)" alt="${cur_title!}">
                    <figcaption class="title">${cur_title!}</figcaption>
                  </figure>
                </a>
              </li>
            </#if>
          </#list> 
        <#else>
          <div class="joe_nodata"><i class="joe-font joe-icon-tips"></i>没有配置分类数据</div>
        </#if>
      </#if>
    </ul>

附加信息

No response

[qinhua]

@shiker1996 随机图 api 可能不稳定，为了避免页面崩掉，这里可以允许用户自行切换数据源