deblan-mirror/thelounge
deblan-mirror/thelounge
1
0
Fork 0
mirror of https://github.com/thelounge/thelounge.git synced 2024-06-07 16:22:18 +02:00
Code Issues Projects Releases Wiki Activity

Move date formatting to DateMarker and stop listening to daychange when no longer necessary.

Browse source
This commit is contained in:
Richard Lewis 2018-09-12 21:00:03 +03:00 committed by Pavel Djundik
parent 7394e6b9f1
commit cc895e67ee
4 changed files with 24 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
client/components/DateMarker.vue
View file

@ -1,11 +1,10 @@
<template> <template>
<div <div
:data-time="message.time" :aria-label="localeDate"
:aria-label="message.time | localedate"
class="date-marker-container tooltipped tooltipped-s"> class="date-marker-container tooltipped tooltipped-s">
<div class="date-marker"> <div class="date-marker">
<span <span
:data-label="message.time | friendlydate" :data-label="friendlyDate()"
class="date-marker-text" /> class="date-marker-text" />
</div> </div>
</div> </div>
@ -20,18 +19,37 @@ export default {
message: Object, message: Object,
}, },
mounted() { mounted() {
const hoursPassed = moment.duration(moment().diff(moment(this.message.time))).asHours(); if (this.hoursPassed() < 48) {
if (hoursPassed < 48) {
this.$root.$on("daychange", this.dayChange); this.$root.$on("daychange", this.dayChange);
} }
}, },
beforeDestroy() { beforeDestroy() {
this.$root.$off("daychange", this.dayChange); this.$root.$off("daychange", this.dayChange);
}, },
computed: {
localeDate() {
return moment(this.message.time).format("D MMMM YYYY");
},
},
methods: { methods: {
hoursPassed() {
return moment.duration(moment().diff(moment(this.message.time))).asHours()
},
dayChange() { dayChange() {
this.$forceUpdate(); this.$forceUpdate();
if (this.hoursPassed() >= 48) {
this.$root.$off("daychange", this.dayChange);
}
},
friendlyDate() {
// See http://momentjs.com/docs/#/displaying/calendar-time/
return moment(this.message.time).calendar(null, {
sameDay: "[Today]",
lastDay: "[Yesterday]",
lastWeek: "D MMMM YYYY",
sameElse: "D MMMM YYYY",
});
}, },
}, },
}; };

13
client/js/libs/handlebars/friendlydate.js
View file

@ -1,13 +0,0 @@
"use strict";
const moment = require("moment");
module.exports = function(time) {
// See http://momentjs.com/docs/#/displaying/calendar-time/
return moment(time).calendar(null, {
sameDay: "[Today]",
lastDay: "[Yesterday]",
lastWeek: "D MMMM YYYY",
sameElse: "D MMMM YYYY",
});
};

7
client/js/libs/handlebars/localedate.js
View file

@ -1,7 +0,0 @@
"use strict";
const moment = require("moment");
module.exports = function(time) {
return moment(time).format("D MMMM YYYY");
};

4
client/js/vue.js
View file

@ -5,15 +5,11 @@ const App = require("../components/App.vue").default;
const roundBadgeNumber = require("./libs/handlebars/roundBadgeNumber"); const roundBadgeNumber = require("./libs/handlebars/roundBadgeNumber");
const tz = require("./libs/handlebars/tz"); const tz = require("./libs/handlebars/tz");
const localetime = require("./libs/handlebars/localetime"); const localetime = require("./libs/handlebars/localetime");
const localedate = require("./libs/handlebars/localedate");
const friendlydate = require("./libs/handlebars/friendlydate");
const friendlysize = require("./libs/handlebars/friendlysize"); const friendlysize = require("./libs/handlebars/friendlysize");
const colorClass = require("./libs/handlebars/colorClass"); const colorClass = require("./libs/handlebars/colorClass");
Vue.filter("tz", tz); Vue.filter("tz", tz);
Vue.filter("localetime", localetime); Vue.filter("localetime", localetime);
Vue.filter("localedate", localedate);
Vue.filter("friendlydate", friendlydate);
Vue.filter("friendlysize", friendlysize); Vue.filter("friendlysize", friendlysize);
Vue.filter("colorClass", colorClass); Vue.filter("colorClass", colorClass);
Vue.filter("roundBadgeNumber", roundBadgeNumber); Vue.filter("roundBadgeNumber", roundBadgeNumber);