Change the order of post meta & improve timeago

This commit is contained in:
Cotes Chung 2021-03-03 18:32:06 +08:00
parent c6b0a8247b
commit d2bb423220
7 changed files with 24 additions and 14 deletions

View file

@ -1,5 +1,6 @@
<!-- <!--
Date format snippet Date format snippet
See: /assets/js/_utils/timeage.js
--> -->
{% assign tooltip_df = site.data.date_format.tooltip | default: '%a, %b %e, %Y, %l:%M %p %z' %} {% assign tooltip_df = site.data.date_format.tooltip | default: '%a, %b %e, %Y, %l:%M %p %z' %}
@ -11,7 +12,10 @@
data-toggle="tooltip" data-toggle="tooltip"
data-placement="bottom" data-placement="bottom"
title="{{ include.date | date: tooltip_df }}" title="{{ include.date | date: tooltip_df }}"
{% endif %}> {% endif %}
{% if include.prefix %}prefix="{{ include.prefix }} "{% endif%}
{% if include.prep %}prep="{{ include.prep }}"{% endif %} >
{% assign this_year = site.time | date: "%Y" %} {% assign this_year = site.time | date: "%Y" %}
{% assign post_year = include.date | date: "%Y" %} {% assign post_year = include.date | date: "%Y" %}

View file

@ -14,19 +14,18 @@ layout: default
<div class="post-meta text-muted d-flex flex-column"> <div class="post-meta text-muted d-flex flex-column">
<!-- Published date and author --> <!-- Published date and author -->
<div> <div>
{% include timeago.html date=page.date tooltip=true %} <span class="semi-bold">
by
<span class="author">
{{ page.author | default: site.author }} {{ page.author | default: site.author }}
</span> </span>
{% include timeago.html date=page.date prep="on" tooltip=true %}
</div> </div>
<div> <div>
<!-- lastmod --> <!-- lastmod -->
{% if page.last_modified_at %} {% if page.last_modified_at %}
<span> <span>
Updated {% include timeago.html date=page.last_modified_at
{% include timeago.html date=page.last_modified_at class="lastmod" tooltip=true %} class="lastmod" prefix="Updated" tooltip=true %}
</span> </span>
{% endif %} {% endif %}

View file

@ -521,6 +521,10 @@ footer {
/* --- Effects classes --- */ /* --- Effects classes --- */
.semi-bold {
font-weight: 600 !important;
}
.loaded { .loaded {
display: block !important; display: block !important;

View file

@ -23,6 +23,10 @@
padding-right: $pr; padding-right: $pr;
} }
.timeago::before {
content: attr(prefix);
}
#post-wrapper .post-meta { #post-wrapper .post-meta {
> div:nth-child(2) { > div:nth-child(2) {
> span:not(:first-child)::before { > span:not(:first-child)::before {

View file

@ -10,13 +10,14 @@ $(function() {
let intervalId = void 0; let intervalId = void 0;
function timeago(iso, isLastmod) { function timeago(iso, prepData) {
let now = new Date(); let now = new Date();
let past = new Date(iso); let past = new Date(iso);
let prep = (typeof prepData !== "undefined" ? `${prepData} ` : "");
if (past.getFullYear() !== now.getFullYear()) { if (past.getFullYear() !== now.getFullYear()) {
toRefresh -= 1; toRefresh -= 1;
return past.toLocaleString("en-US", { return prep + past.toLocaleString("en-US", {
year: "numeric", year: "numeric",
month: "short", month: "short",
day: "numeric" day: "numeric"
@ -25,7 +26,7 @@ $(function() {
if (past.getMonth() !== now.getMonth()) { if (past.getMonth() !== now.getMonth()) {
toRefresh -= 1; toRefresh -= 1;
return past.toLocaleString("en-US", { return prep + past.toLocaleString("en-US", {
month: "short", month: "short",
day: "numeric" day: "numeric"
}); });
@ -55,11 +56,9 @@ $(function() {
function updateTimeago() { function updateTimeago() {
$(".timeago").each(function() { $(".timeago").each(function() {
if ($(this).children("i").length > 0) { if ($(this).children("i").length > 0) {
$(this).text();
let isLastmod = $(this).hasClass("lastmod");
let node = $(this).children("i"); let node = $(this).children("i");
let date = node.text(); /* ISO Date: "YYYY-MM-DDTHH:MM:SSZ" */ let date = node.text(); /* ISO Date: "YYYY-MM-DDTHH:MM:SSZ" */
$(this).text(timeago(date, isLastmod)); $(this).text(timeago(date, $(this).attr("prep")));
$(this).append(node); $(this).append(node);
} }
}); });

View file

@ -3,4 +3,4 @@
* © 2019 Cotes Chung * © 2019 Cotes Chung
* MIT Licensed * MIT Licensed
*/ */
function copyLink(e){e&&0!==e.length||(e=window.location.href);const t=$("<input>");$("body").append(t),t.val(e).select(),document.execCommand("copy"),t.remove(),alert("Link copied successfully!")}$(function(){$(window).scroll(()=>{$(this).scrollTop()>50&&"none"===$("#sidebar-trigger").css("display")?$("#back-to-top").fadeIn():$("#back-to-top").fadeOut()}),$("#back-to-top").click(()=>($("body,html").animate({scrollTop:0},800),!1))}),$(function(){$("input[type=checkbox]").addClass("unloaded"),$("input[type=checkbox][checked]").before('<i class="fas fa-check-circle checked"></i>'),$("input[type=checkbox]:not([checked])").before('<i class="far fa-circle"></i>')}),$(function(){const e=$("#sidebar-trigger"),t=$("#search-trigger"),o=$("#search-cancel"),a=$("#search-cleaner"),s=$("#main"),l=$("#topbar-title"),n=$("#search-wrapper"),r=$("#search-result-wrapper"),i=$("#search-results"),c=$("#search-input"),d=$("#search-hints"),u=function(){let e=0;return{block(){e=window.scrollY,$("html,body").scrollTop(0)},release(){$("html,body").scrollTop(e)},getOffset:()=>e}}(),h={on(){e.addClass("unloaded"),l.addClass("unloaded"),t.addClass("unloaded"),n.addClass("d-flex"),o.addClass("loaded")},off(){o.removeClass("loaded"),n.removeClass("d-flex"),e.removeClass("unloaded"),l.removeClass("unloaded"),t.removeClass("unloaded")}},f=function(){let e=!1;return{on(){e||(u.block(),r.removeClass("unloaded"),s.addClass("unloaded"),e=!0)},off(){e&&(i.empty(),d.hasClass("unloaded")&&d.removeClass("unloaded"),r.addClass("unloaded"),a.removeClass("visible"),s.removeClass("unloaded"),u.release(),c.val(""),e=!1)},isVisible:()=>e}}();function p(){return o.hasClass("loaded")}t.click(function(){h.on(),f.on(),c.focus()}),o.click(function(){h.off(),f.off()}),c.focus(function(){n.addClass("input-focus")}),c.focusout(function(){n.removeClass("input-focus")}),c.on("keyup",function(e){8===e.keyCode&&""===c.val()?p()?d.removeClass("unloaded"):f.off():""!==c.val()&&(f.on(),a.hasClass("visible")||a.addClass("visible"),p()&&d.addClass("unloaded"))}),a.on("click",function(){c.val(""),p()?(d.removeClass("unloaded"),i.empty()):f.off(),c.focus(),a.removeClass("visible")})}),$(function(){const e=function(){let e=!1;const t=$("body");return{toggle(){!1===e?t.attr("sidebar-display",""):t.removeAttr("sidebar-display"),e=!e}}}();$("#sidebar-trigger").click(e.toggle),$("#mask").click(e.toggle)}),$(function(){$('[data-toggle="tooltip"]').tooltip()}),$(function(){const e=$("#topbar-wrapper"),t=$("#toc-wrapper"),o=$(".access"),a=$("#search-input");let s,l=0;const n=5,r=e.outerHeight();$(window).scroll(function(e){$("#topbar-title").is(":hidden")&&(s=!0)}),setInterval(function(){s&&(!function(){var s=$(this).scrollTop();Math.abs(l-s)<=n||(s>l&&s>r?(e.removeClass("topbar-down").addClass("topbar-up"),t.length>0&&t.removeClass("topbar-down"),o.length>0&&o.removeClass("topbar-down"),a.is(":focus")&&a.blur()):s+$(window).height()<$(document).height()&&(e.removeClass("topbar-up").addClass("topbar-down"),t.length>0&&t.addClass("topbar-down"),o.length>0&&o.addClass("topbar-down")),l=s)}(),s=!1)},250)}),$(function(){const e=$("#topbar-title"),t=$("div.post>h1"),o=e.text().trim();let a=t.length>0?t.text().trim():$("h1").text().trim();($("#page-category").length||$("#page-tag").length)&&/\s/.test(a)&&(a=a.replace(/[0-9]/g,"").trim()),$(window).scroll(function(){if($("#post-list").length||t.is(":hidden")||e.is(":hidden")||$("#sidebar.sidebar-expand").length)return!1;$(this).scrollTop()>=95?e.text()!==a&&e.text(a):e.text()!==o&&e.text(o)}),e.click(function(){$("body,html").animate({scrollTop:0},800)})}),$(function(){let e=$(".timeago").length,t=void 0;function o(){return $(".timeago").each(function(){if($(this).children("i").length>0){$(this).text();let t=$(this).hasClass("lastmod"),o=$(this).children("i"),a=o.text();$(this).text(function(t,o){let a=new Date,s=new Date(t);if(s.getFullYear()!==a.getFullYear())return e-=1,s.toLocaleString("en-US",{year:"numeric",month:"short",day:"numeric"});if(s.getMonth()!==a.getMonth())return e-=1,s.toLocaleString("en-US",{month:"short",day:"numeric"});let l=Math.floor((a-s)/1e3),n=Math.floor(l/86400);if(n>=1)return e-=1,n+" day"+(n>1?"s":"")+" ago";let r=Math.floor(l/3600);if(r>=1)return r+" hour"+(r>1?"s":"")+" ago";let i=Math.floor(l/60);return i>=1?i+" minute"+(i>1?"s":"")+" ago":(o?"just":"Just")+" now"}(a,t)),$(this).append(o)}}),0===e&&void 0!==t&&clearInterval(t),e}0!==e&&o()>0&&(t=setInterval(o,6e4))}); function copyLink(e){e&&0!==e.length||(e=window.location.href);const t=$("<input>");$("body").append(t),t.val(e).select(),document.execCommand("copy"),t.remove(),alert("Link copied successfully!")}$(function(){$(window).scroll(()=>{$(this).scrollTop()>50&&"none"===$("#sidebar-trigger").css("display")?$("#back-to-top").fadeIn():$("#back-to-top").fadeOut()}),$("#back-to-top").click(()=>($("body,html").animate({scrollTop:0},800),!1))}),$(function(){$("input[type=checkbox]").addClass("unloaded"),$("input[type=checkbox][checked]").before('<i class="fas fa-check-circle checked"></i>'),$("input[type=checkbox]:not([checked])").before('<i class="far fa-circle"></i>')}),$(function(){const e=$("#sidebar-trigger"),t=$("#search-trigger"),o=$("#search-cancel"),a=$("#search-cleaner"),s=$("#main"),l=$("#topbar-title"),n=$("#search-wrapper"),r=$("#search-result-wrapper"),i=$("#search-results"),c=$("#search-input"),d=$("#search-hints"),u=function(){let e=0;return{block(){e=window.scrollY,$("html,body").scrollTop(0)},release(){$("html,body").scrollTop(e)},getOffset:()=>e}}(),f={on(){e.addClass("unloaded"),l.addClass("unloaded"),t.addClass("unloaded"),n.addClass("d-flex"),o.addClass("loaded")},off(){o.removeClass("loaded"),n.removeClass("d-flex"),e.removeClass("unloaded"),l.removeClass("unloaded"),t.removeClass("unloaded")}},h=function(){let e=!1;return{on(){e||(u.block(),r.removeClass("unloaded"),s.addClass("unloaded"),e=!0)},off(){e&&(i.empty(),d.hasClass("unloaded")&&d.removeClass("unloaded"),r.addClass("unloaded"),a.removeClass("visible"),s.removeClass("unloaded"),u.release(),c.val(""),e=!1)},isVisible:()=>e}}();function p(){return o.hasClass("loaded")}t.click(function(){f.on(),h.on(),c.focus()}),o.click(function(){f.off(),h.off()}),c.focus(function(){n.addClass("input-focus")}),c.focusout(function(){n.removeClass("input-focus")}),c.on("keyup",function(e){8===e.keyCode&&""===c.val()?p()?d.removeClass("unloaded"):h.off():""!==c.val()&&(h.on(),a.hasClass("visible")||a.addClass("visible"),p()&&d.addClass("unloaded"))}),a.on("click",function(){c.val(""),p()?(d.removeClass("unloaded"),i.empty()):h.off(),c.focus(),a.removeClass("visible")})}),$(function(){const e=function(){let e=!1;const t=$("body");return{toggle(){!1===e?t.attr("sidebar-display",""):t.removeAttr("sidebar-display"),e=!e}}}();$("#sidebar-trigger").click(e.toggle),$("#mask").click(e.toggle)}),$(function(){$('[data-toggle="tooltip"]').tooltip()}),$(function(){const e=$("#topbar-wrapper"),t=$("#toc-wrapper"),o=$(".access"),a=$("#search-input");let s,l=0;const n=5,r=e.outerHeight();$(window).scroll(function(e){$("#topbar-title").is(":hidden")&&(s=!0)}),setInterval(function(){s&&(!function(){var s=$(this).scrollTop();Math.abs(l-s)<=n||(s>l&&s>r?(e.removeClass("topbar-down").addClass("topbar-up"),t.length>0&&t.removeClass("topbar-down"),o.length>0&&o.removeClass("topbar-down"),a.is(":focus")&&a.blur()):s+$(window).height()<$(document).height()&&(e.removeClass("topbar-up").addClass("topbar-down"),t.length>0&&t.addClass("topbar-down"),o.length>0&&o.addClass("topbar-down")),l=s)}(),s=!1)},250)}),$(function(){const e=$("#topbar-title"),t=$("div.post>h1"),o=e.text().trim();let a=t.length>0?t.text().trim():$("h1").text().trim();($("#page-category").length||$("#page-tag").length)&&/\s/.test(a)&&(a=a.replace(/[0-9]/g,"").trim()),$(window).scroll(function(){if($("#post-list").length||t.is(":hidden")||e.is(":hidden")||$("#sidebar.sidebar-expand").length)return!1;$(this).scrollTop()>=95?e.text()!==a&&e.text(a):e.text()!==o&&e.text(o)}),e.click(function(){$("body,html").animate({scrollTop:0},800)})}),$(function(){let e=$(".timeago").length,t=void 0;function o(){return $(".timeago").each(function(){if($(this).children("i").length>0){let t=$(this).children("i"),o=t.text();$(this).text(function(t,o){let a=new Date,s=new Date(t),l=void 0!==o?`${o} `:"";if(s.getFullYear()!==a.getFullYear())return e-=1,l+s.toLocaleString("en-US",{year:"numeric",month:"short",day:"numeric"});if(s.getMonth()!==a.getMonth())return e-=1,l+s.toLocaleString("en-US",{month:"short",day:"numeric"});let n=Math.floor((a-s)/1e3),r=Math.floor(n/86400);if(r>=1)return e-=1,r+" day"+(r>1?"s":"")+" ago";let i=Math.floor(n/3600);if(i>=1)return i+" hour"+(i>1?"s":"")+" ago";let c=Math.floor(n/60);return c>=1?c+" minute"+(c>1?"s":"")+" ago":(isLastmod?"just":"Just")+" now"}(o,$(this).attr("prep"))),$(this).append(t)}}),0===e&&void 0!==t&&clearInterval(t),e}0!==e&&o()>0&&(t=setInterval(o,6e4))});

File diff suppressed because one or more lines are too long