diff --git a/_config.yml b/_config.yml index accbebc..ee2c223 100755 --- a/_config.yml +++ b/_config.yml @@ -30,6 +30,10 @@ sidebar: post: [toc, ghrepo, ghissues] # for pages using 'layout:post' wiki: [toc, ghrepo, ghissues, related] # for pages using 'layout:wiki' +######## Index ######## +post-index: # 近期发布 分类 标签 归档 and ... + # '朋友文章': /friends/rss/ + ######## Main ######## breadcrumb: @@ -251,9 +255,10 @@ plugins: ghinfo: /js/plugins/ghinfo.js timeline: /js/plugins/timeline.js linkcard: /js/plugins/linkcard.js + fcircle: /js/plugins/fcircle.js marked: https://cdn.bootcdn.net/ajax/libs/marked/4.0.18/marked.min.js - + ## optional plugins ## # preload preload: diff --git a/layout/_partial/main/navbar/list_post.ejs b/layout/_partial/main/navbar/list_post.ejs index 771ba99..a0e5ecc 100644 --- a/layout/_partial/main/navbar/list_post.ejs +++ b/layout/_partial/main/navbar/list_post.ejs @@ -1,34 +1,57 @@ -
- -
+<% +function layoutDiv() { + var el = ''; + el += '
'; + el += ''; + el += '
'; + return el; +} +%> + +<%- layoutDiv() %> diff --git a/layout/page.ejs b/layout/page.ejs index 47b1562..f46681f 100755 --- a/layout/page.ejs +++ b/layout/page.ejs @@ -7,14 +7,23 @@ function layoutTitle() { return ''; } } +function layoutDiv() { + var el = ''; + if (page.post_list) { + el += partial('_partial/main/navbar/list_post'); + } + if (page.h1 || page.title || (page.content && page.content.length > 0)) { + el += partial('_partial/main/navbar/breadcrumb'); + } + el += '
'; + el += layoutTitle(); + if (page.content && page.content.length > 0) { + el += page.content; + } + el += '
'; + el += partial('_partial/plugins/comments/layout'); + return el; +} %> -<% if (page.h1 || page.title || (page.content && page.content.length > 0)) { %> - <%- partial('_partial/main/navbar/breadcrumb') %> -
<%- scrollreveal() %>'> - <%- layoutTitle() %> - <% if (page.content && page.content.length > 0) { %> - <%- page.content %> - <% } %> -
-<% } %> -<%- partial('_partial/plugins/comments/layout') %> + +<%- layoutDiv() %> diff --git a/scripts/tags/timeline.js b/scripts/tags/timeline.js index 5baca2f..58b7505 100644 --- a/scripts/tags/timeline.js +++ b/scripts/tags/timeline.js @@ -36,12 +36,14 @@ function layoutNodeContent(content) { function postTimeline(args, content) { - args = hexo.args.map(args, ['api', 'user']); + args = hexo.args.map(args, ['api', 'user', 'type', 'limit']); var el = ''; - + if (!args.type) { + args.type = 'timeline'; + } if (args.api && args.api.length > 0) { - el += '
div> + >.cell + margin: 1rem 0 + >.cell> p line-height: 1.5 :first-child @@ -18,11 +18,15 @@ .tag-plugin.split - &[bg]>div + @media screen and (max-width: $device-tablet) + display: block + +.tag-plugin.split + &[bg]>.cell padding: 1rem border-radius: $border-card - &[bg='block']>div + &[bg='block']>.cell background: var(--block) - &[bg='card']>div + &[bg='card']>.cell background: var(--card) box-shadow: $boxshadow-card \ No newline at end of file diff --git a/source/css/_layout/tag-plugins/timeline.styl b/source/css/_layout/tag-plugins/timeline.styl index eef45bd..d7ff3d4 100644 --- a/source/css/_layout/tag-plugins/timeline.styl +++ b/source/css/_layout/tag-plugins/timeline.styl @@ -113,15 +113,32 @@ .tag-plugin.copy width: 240px +.tag-plugin.timeline[api] + &.stellar-fcircle-api .timenode:hover .header + .user-info + background: inherit + span + color: inherit + a.body + color: var(--text-p1) + trans2: transform box-shadow + line-height: 1.25 + padding: 0.75rem 1rem + &:hover + transform: translateY(-1px) + box-shadow: $boxshadow-card-float -.tag-plugin.timeline.stellar-timeline-api .body - max-height: convert(hexo-config('tag_plugins.timeline.max-height')) + +.tag-plugin.timeline[api] .body overflow: scroll - p.title + p.title font-size: 1rem font-weight: 700 margin: 0.5rem 0 0.75rem line-height: 1.25 + &:only-child + margin-bottom: 0.5rem + font-weight: 500 a color: inherit &:hover @@ -136,7 +153,7 @@ pre code font-size: $fs-12 -.tag-plugin.timeline.stellar-timeline-api .body .footer +.tag-plugin.timeline[api] .body .footer margin: 0 0 -0.5rem padding: 0.5rem 0 1rem user-select: none @@ -159,7 +176,7 @@ font-size: $fs-12 align-items: stretch -.tag-plugin.timeline.stellar-timeline-api .body .footer +.tag-plugin.timeline[api] .body .footer .item border-width: 1px border-style: solid diff --git a/source/js/plugins/fcircle.js b/source/js/plugins/fcircle.js new file mode 100644 index 0000000..00e7249 --- /dev/null +++ b/source/js/plugins/fcircle.js @@ -0,0 +1,91 @@ +const FCircle = { + requestAPI: (url, callback, timeout) => { + let retryTimes = 5; + function request() { + return new Promise((resolve, reject) => { + let status = 0; // 0 等待 1 完成 2 超时 + let timer = setTimeout(() => { + if (status === 0) { + status = 2; + timer = null; + reject('请求超时'); + if (retryTimes == 0) { + timeout(); + } + } + }, 5000); + fetch(url).then(function(response) { + if (status !== 2) { + clearTimeout(timer); + resolve(response); + timer = null; + status = 1; + } + if (response.ok) { + return response.json(); + } + throw new Error('Network response was not ok.'); + }).then(function(data) { + retryTimes = 0; + callback(data); + }).catch(function(error) { + if (retryTimes > 0) { + retryTimes -= 1; + setTimeout(() => { + request(); + }, 5000); + } else { + timeout(); + } + }); + }); + } + request(); + }, + layoutDiv: (cfg) => { + const el = $(cfg.el)[0]; + $(el).append('
'); + FCircle.requestAPI(cfg.api, function(data) { + $(el).find('.loading-wrap').remove(); + const arr = data.article_data || []; + const limit = el.getAttribute('limit'); + arr.forEach((item, i) => { + if (limit && i >= limit) { + return; + } + var cell = '
'; + cell += '
'; + cell += ''; + cell += '

' + item.updated + '

'; + cell += '
'; + cell += ''; + cell += item.title; + cell += ''; + cell += '
'; + $(el).append(cell); + }); + }, function() { + $(el).find('.loading-wrap svg').remove(); + $(el).find('.loading-wrap').append(''); + $(el).find('.loading-wrap').addClass('error'); + }); + }, +} + +$(function () { + const els = document.getElementsByClassName('stellar-fcircle-api'); + for (var i = 0; i < els.length; i++) { + const el = els[i]; + const api = el.getAttribute('api'); + if (api == null) { + continue; + } + var obj = new Object(); + obj.el = el; + obj.api = api; + FCircle.layoutDiv(obj); + } +});