Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: Add "ago" to the bottom of the timeline when relative

This commit is contained in:
Robin Ward 2016-05-24 15:20:13 -04:00
parent d8d1c7013e
commit 3cebba5b1f
No known key found for this signature in database
GPG Key ID: 0E091E2B4ED1B83D
3 changed files with 37 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
app/assets/javascripts/discourse/lib/formatter.js.es6
View File

@ -125,43 +125,46 @@ export function autoUpdatingRelativeAge(date,options) {
return "<span class='relative-date" + append + "' data-time='" + date.getTime() + "' data-format='" + format + "'>" + relAge + "</span>";
}
function wrapAgo(dateStr) {
return I18n.t("dates.wrap_ago", { date: dateStr });
}
function relativeAgeTiny(date){
function relativeAgeTiny(date, ageOpts) {
const format = "tiny";
const distance = Math.round((new Date() - date) / 1000);
const distanceInMinutes = Math.round(distance / 60.0);
let formatted;
const t = function(key,opts){
return I18n.t("dates." + format + "." + key, opts);
const t = function(key, opts) {
const result = I18n.t("dates." + format + "." + key, opts);
return (ageOpts && ageOpts.addAgo) ? wrapAgo(result) : result;
};
switch(true){
case(distanceInMinutes < 1):
formatted = t("less_than_x_minutes", {count: 1});
break;
case(distanceInMinutes >= 1 && distanceInMinutes <= 44):
formatted = t("x_minutes", {count: distanceInMinutes});
break;
case(distanceInMinutes >= 45 && distanceInMinutes <= 89):
formatted = t("about_x_hours", {count: 1});
break;
case(distanceInMinutes >= 90 && distanceInMinutes <= 1409):
formatted = t("about_x_hours", {count: Math.round(distanceInMinutes / 60.0)});
break;
case(Discourse.SiteSettings.relative_date_duration === 0 && distanceInMinutes <= 525599):
formatted = shortDateNoYear(date);
break;
case(distanceInMinutes >= 1410 && distanceInMinutes <= 2519):
formatted = t("x_days", {count: 1});
break;
case(distanceInMinutes >= 2520 && distanceInMinutes <= ((Discourse.SiteSettings.relative_date_duration||14) * 1440)):
formatted = t("x_days", {count: Math.round(distanceInMinutes / 1440.0)});
break;
default:
formatted = smartShortDate(date);
break;
switch(true) {
case(distanceInMinutes < 1):
formatted = t("less_than_x_minutes", {count: 1});
break;
case(distanceInMinutes >= 1 && distanceInMinutes <= 44):
formatted = t("x_minutes", {count: distanceInMinutes});
break;
case(distanceInMinutes >= 45 && distanceInMinutes <= 89):
formatted = t("about_x_hours", {count: 1});
break;
case(distanceInMinutes >= 90 && distanceInMinutes <= 1409):
formatted = t("about_x_hours", {count: Math.round(distanceInMinutes / 60.0)});
break;
case(Discourse.SiteSettings.relative_date_duration === 0 && distanceInMinutes <= 525599):
formatted = shortDateNoYear(date);
break;
case(distanceInMinutes >= 1410 && distanceInMinutes <= 2519):
formatted = t("x_days", {count: 1});
break;
case(distanceInMinutes >= 2520 && distanceInMinutes <= ((Discourse.SiteSettings.relative_date_duration||14) * 1440)):
formatted = t("x_days", {count: Math.round(distanceInMinutes / 1440.0)});
break;
default:
formatted = smartShortDate(date);
break;
}
return formatted;
@ -236,7 +239,7 @@ export function relativeAge(date, options) {
options = options || {};
const format = options.format || "tiny";
if(format === "tiny") {
if (format === "tiny") {
return relativeAgeTiny(date, options);
} else if (format === "medium") {
return relativeAgeMedium(date, options);

2
app/assets/javascripts/discourse/widgets/topic-timeline.js.es6
View File

@ -236,7 +236,7 @@ export default createWidget('topic-timeline', {
this.attach('link', {
className: 'now-date',
icon: 'dot-circle-o',
rawLabel: relativeAge(new Date(topic.last_posted_at)),
rawLabel: relativeAge(new Date(topic.last_posted_at), { addAgo: true }),
action: 'jumpBottom'
})
]);

3
config/locales/client.en.yml
View File

@ -49,6 +49,9 @@ en:
long_date_with_year_without_time: "MMM D, 'YY"
long_date_without_year_with_linebreak: "MMM D <br/>LT"
long_date_with_year_with_linebreak: "MMM D, 'YY <br/>LT"
wrap_ago: "%{date} ago"
tiny:
half_a_minute: "< 1m"
less_than_x_seconds: