From 9eb4e2e0dc2209b95fc0c77a3d3c705a255174b8 Mon Sep 17 00:00:00 2001 From: yflory Date: Mon, 10 Sep 2018 15:32:07 +0200 Subject: [PATCH] Reorder the chat rooms in the list based on the time of the last message --- .../src/less2/include/messenger.less | 14 +++++++--- www/contacts/messenger-ui.js | 27 +++++++++++++++++++ 2 files changed, 38 insertions(+), 3 deletions(-) diff --git a/customize.dist/src/less2/include/messenger.less b/customize.dist/src/less2/include/messenger.less index 1725edd7b..2680371d8 100644 --- a/customize.dist/src/less2/include/messenger.less +++ b/customize.dist/src/less2/include/messenger.less @@ -58,10 +58,13 @@ height: 100%; background-color: lighten(@bg-color, 10%); overflow-y: auto; + display: flex; + flex-flow: column; .cp-app-contacts-friend { background: rgba(0,0,0,0.1); padding: 5px; margin: 10px; + margin-bottom: 0; cursor: pointer; position: relative; height: 48px; @@ -93,10 +96,12 @@ .cp-app-contacts-category { display: flex; flex-flow: column; + flex-grow: 0; + flex-shrink: 0; .cp-app-contacts-category-title { order: 1; font-size: 18px; - margin: 0 5px; + margin: 0px 5px; text-align: center; background: rgba(0,0,0,0.1); font-weight: bold; @@ -105,6 +110,9 @@ } .cp-app-contacts-category-content { order: 2; + display: flex; + flex-flow: column-reverse; + padding-bottom: 10px; &:empty { display: none; & ~ .cp-app-contacts-category-title { @@ -125,12 +133,12 @@ } .cp-app-contacts-category-title { transition: font-size 0.2s ease-in-out 0.2s; - margin: 0 2px; + margin: 0px 2px; font-size: 16px; } &:hover { transition-delay: 1.5s; - width: 200px; + width: 200px !important; .cp-app-contacts-category-title { transition-delay: 1.5s; font-size: 18px; diff --git a/www/contacts/messenger-ui.js b/www/contacts/messenger-ui.js index 59207b589..93ac1bd09 100644 --- a/www/contacts/messenger-ui.js +++ b/www/contacts/messenger-ui.js @@ -103,6 +103,30 @@ define([ find.inList(id).removeClass('cp-app-contacts-notify'); }; + var reorderRooms = function () { + var channels = Object.keys(state.channels).sort(function (a, b) { + var m1 = state.channels[a].messages.slice(-1)[0]; + var m2 = state.channels[b].messages.slice(-1)[0]; + if (!m2) { return !m1 ? 0 : 1; } + if (!m1) { return -1; } + return m1.time - m2.time; + }); + + channels.forEach(function (c, i) { + var m1 = state.channels[c].messages.slice(-1)[0]; + $userlist.find(dataQuery(c)).css('order', i); + }); + + // Make sure the width is correct even if there is a scrollbar + var w = $userlist[0].offsetWidth - $userlist[0].clientWidth; + $userlist.css('width', (70 + w)+'px'); + }; + + $(window).on('resize', function () { + var w = $userlist[0].offsetWidth - $userlist[0].clientWidth; + $userlist.css('width', (70 + w)+'px'); + }); + var m = function (md) { var d = h('div.cp-app-contacts-content'); try { @@ -504,6 +528,7 @@ define([ $messagebox.scrollTop($messagebox.outerHeight()); } normalizeLabels($messagebox); + reorderRooms(); if (isActive(chanId)) { channel.HEAD = message.sig; @@ -631,6 +656,8 @@ define([ } $parentEl.find('.cp-app-contacts-category-content').append(roomEl); + reorderRooms(); + updateStatus(id); }); };