Automatically remove leave/enter and enter/leave messages

after 10 seconds.
This commit is contained in:
JC Brand 2018-08-30 23:13:28 +02:00
parent 4b5b517390
commit 1294d682e1
2 changed files with 29 additions and 5 deletions

View File

@ -320,6 +320,15 @@ body.reset {
100% { opacity: 1 }
}
@-webkit-keyframes fadeOut {
0% { opacity: 1; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
@keyframes fadeOut {
0% { opacity: 1; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
.fade-in {
@include fade-in;
}
@ -336,6 +345,14 @@ body.reset {
opacity: 0 !important;
display: none !important;
}
.fade-out {
animation-duration: 1s;
animation-fill-mode: forwards;
animation-name: fadeOut;
animation-timing-function: ease-in-out;
}
.collapsed {
height: 0 !important;
overflow: hidden !important;

View File

@ -1441,12 +1441,13 @@
if (this.model.get('connection_status') !== converse.ROOMSTATUS.ENTERED) {
return;
}
const nick = occupant.get('nick');
const stat = occupant.get('status');
const last_el = this.content.lastElementChild;
const nick = occupant.get('nick'),
stat = occupant.get('status');
let last_el = this.content.lastElementChild;
if (_.includes(_.get(last_el, 'classList', []), 'chat-info') &&
_.get(last_el, 'dataset', {}).leave === `"${nick}"`) {
last_el.outerHTML =
tpl_info({
'data': `data-leavejoin="${nick}"`,
@ -1454,6 +1455,9 @@
'extra_classes': 'chat-event',
'message': __('%1$s has left and re-entered the groupchat', nick)
});
last_el = this.content.lastElementChild;
setTimeout(() => u.addClass('fade-out', last_el), 10000);
setTimeout(() => last_el.parentElement.removeChild(last_el), 11500);
} else {
let message;
if (_.isNil(stat)) {
@ -1482,8 +1486,8 @@
showLeaveNotification (occupant) {
const nick = occupant.get('nick'),
stat = occupant.get('status'),
last_el = this.content.lastElementChild;
stat = occupant.get('status');
let last_el = this.content.lastElementChild;
if (last_el &&
_.includes(_.get(last_el, 'classList', []), 'chat-info') &&
@ -1503,6 +1507,9 @@
'extra_classes': 'chat-event',
'message': message
});
last_el = this.content.lastElementChild;
setTimeout(() => u.addClass('fade-out', last_el), 10000);
setTimeout(() => last_el.parentElement.removeChild(last_el), 11500);
} else {
let message;
if (_.isNil(stat)) {