Fixes #1437. List of groupchats doesn't scroll

This commit is contained in:
JC Brand 2019-02-26 11:05:15 +01:00
parent 36b912f052
commit 2ddd918f6a
7 changed files with 40 additions and 15 deletions

View File

@ -1,5 +1,9 @@
# Changelog
## 4.1.3 (Unreleased)
- #1437: List of groupchats in modal doesn't scroll
## 4.1.2 (2019-02-22)
- Updated translations: af, cz, de, es, he, it, nl, nl_BE, pt_BR, zh_CN

View File

@ -11400,6 +11400,16 @@ body.converse-fullscreen {
#conversejs .add-chatroom input[type="button"] {
margin: 0.3em 0; }
#conversejs.converse-embedded #list-chatrooms-modal .modal-body,
#conversejs #list-chatrooms-modal .modal-body {
max-height: 70vh;
padding-bottom: 0; }
#conversejs.converse-embedded #list-chatrooms-modal .available-chatrooms,
#conversejs #list-chatrooms-modal .available-chatrooms {
overflow: auto;
padding-bottom: 1rem; }
#conversejs.converse-embedded #room-details-modal .features-list,
#conversejs #room-details-modal .features-list {
margin-left: 1em; }

4
dist/converse.js vendored
View File

@ -53533,8 +53533,6 @@ _converse_headless_converse_core__WEBPACK_IMPORTED_MODULE_3__["default"].plugins
this.rooms = iq.querySelectorAll('query item');
if (this.rooms.length) {
// For translators: %1$s is a variable and will be
// replaced with the XMPP server name
available_chatrooms.innerHTML = templates_rooms_results_html__WEBPACK_IMPORTED_MODULE_24___default()({
'feedback_text': __('Groupchats found:')
});
@ -93672,7 +93670,7 @@ module.exports = function(o) {
var __t, __p = '', __e = _.escape;
__p += '<!-- src/templates/list_chatrooms_modal.html -->\n<div class="modal fade" id="list-chatrooms-modal" tabindex="-1" role="dialog" aria-labelledby="list-chatrooms-modal-label" aria-hidden="true">\n <div class="modal-dialog" role="document">\n <div class="modal-content">\n <div class="modal-header">\n <h5 class="modal-title"\n id="list-chatrooms-modal-label">' +
__e(o.heading_list_chatrooms) +
'</h5>\n <button type="button" class="close" data-dismiss="modal" aria-label="Close">\n <span aria-hidden="true">×</span>\n </button>\n </div>\n <div class="modal-body">\n <form class="converse-form list-chatrooms">\n <div class="form-group">\n <label for="chatroom">' +
'</h5>\n <button type="button" class="close" data-dismiss="modal" aria-label="Close">\n <span aria-hidden="true">×</span>\n </button>\n </div>\n <div class="modal-body d-flex flex-column">\n <form class="converse-form list-chatrooms">\n <div class="form-group">\n <label for="chatroom">' +
__e(o.label_server_address) +
':</label>\n <input type="text" value="' +
__e(o.muc_domain) +

View File

@ -12,6 +12,17 @@
}
}
#list-chatrooms-modal {
.modal-body {
max-height: 70vh;
padding-bottom: 0; // When the list of chats overflows, we don't want bottom padding
}
.available-chatrooms {
overflow: auto;
padding-bottom: 1rem;
}
}
#room-details-modal {
.features-list {
margin-left: 1em;

View File

@ -3974,8 +3974,11 @@
await test_utils.waitUntil(() => sizzle('.chatroom', _converse.el).filter(u.isVisible).length === 1);
done();
}));
});
it("contains a link to a modal which can list groupchats publically available on the server",
describe("The \"Groupchats\" List modal", function () {
it("can be opened from a link in the \"Groupchats\" section of the controlbox",
mock.initConverse(
null, ['rosterGroupsFetched', 'chatBoxesFetched'], {},
async function (done, _converse) {
@ -4017,11 +4020,16 @@
.c('item', { jid:'heath@chat.shakespeare.lit', name:'A Lonely Heath'}).up()
.c('item', { jid:'coven@chat.shakespeare.lit', name:'A Dark Cave'}).up()
.c('item', { jid:'forres@chat.shakespeare.lit', name:'The Palace'}).up()
.c('item', { jid:'inverness@chat.shakespeare.lit', name:'Macbeth&apos;s Castle'}).nodeTree;
.c('item', { jid:'inverness@chat.shakespeare.lit', name:'Macbeth&apos;s Castle'}).up()
.c('item', { jid:'orchard@chat.shakespeare.lit', name:'Capulet\'s Orchard'}).up()
.c('item', { jid:'friar@chat.shakespeare.lit', name:'Friar Laurence\'s cell'}).up()
.c('item', { jid:'hall@chat.shakespeare.lit', name:'Hall in Capulet\'s house'}).up()
.c('item', { jid:'chamber@chat.shakespeare.lit', name:'Juliet\'s chamber'}).up()
.c('item', { jid:'public@chat.shakespeare.lit', name:'A public place'}).up()
.c('item', { jid:'street@chat.shakespeare.lit', name:'A street'}).nodeTree;
_converse.connection._dataRecv(test_utils.createRequest(iq));
await test_utils.waitUntil(() => modal.el.querySelectorAll('.available-chatrooms li').length === 5);
const rooms = modal.el.querySelectorAll('.available-chatrooms li');
expect(rooms[0].textContent.trim()).toBe("Groupchats found:");
expect(rooms[1].textContent.trim()).toBe("A Lonely Heath");

View File

@ -323,9 +323,7 @@ converse.plugins.add('converse-muc-views', {
informNoRoomsFound () {
const chatrooms_el = this.el.querySelector('.available-chatrooms');
chatrooms_el.innerHTML = tpl_rooms_results({
'feedback_text': __('No groupchats found')
});
chatrooms_el.innerHTML = tpl_rooms_results({'feedback_text': __('No groupchats found')});
const input_el = this.el.querySelector('input[name="server"]');
input_el.classList.remove('hidden')
this.removeSpinner();
@ -338,11 +336,7 @@ converse.plugins.add('converse-muc-views', {
const available_chatrooms = this.el.querySelector('.available-chatrooms');
this.rooms = iq.querySelectorAll('query item');
if (this.rooms.length) {
// For translators: %1$s is a variable and will be
// replaced with the XMPP server name
available_chatrooms.innerHTML = tpl_rooms_results({
'feedback_text': __('Groupchats found:')
});
available_chatrooms.innerHTML = tpl_rooms_results({'feedback_text': __('Groupchats found:')});
const fragment = document.createDocumentFragment();
const children = _.reject(_.map(this.rooms, this.roomStanzaItemToHTMLElement), _.isNil)
_.each(children, (child) => fragment.appendChild(child));

View File

@ -8,7 +8,7 @@
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="modal-body d-flex flex-column">
<form class="converse-form list-chatrooms">
<div class="form-group">
<label for="chatroom">{{{o.label_server_address}}}:</label>