diff --git a/CHANGES.md b/CHANGES.md index 1525c9960..555c5cb0d 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -2,6 +2,7 @@ ## 9.0.0 (Unreleased) +- Add initial support for XEP-0421 occupant Ids. - Use more specific types for form fields based on XEP-0122 - Fix trimming of chats in overlayed view mode - OMEMO bugfix: Always create device session based on real JID. diff --git a/demo/embedded.html b/demo/embedded.html index 4f3e8a635..afce8cd99 100644 --- a/demo/embedded.html +++ b/demo/embedded.html @@ -44,7 +44,7 @@
-

+

- + + +
${i18n_participants}
diff --git a/src/plugins/profile/templates/profile.js b/src/plugins/profile/templates/profile.js index 66560e7f5..83eac1978 100644 --- a/src/plugins/profile/templates/profile.js +++ b/src/plugins/profile/templates/profile.js @@ -3,31 +3,48 @@ import { api } from "@converse/headless/core"; import { html } from "lit"; -export default (o) => { +function tpl_signout (o) { const i18n_logout = __('Log out'); - const i18n_change_status = __('Click to change your chat status'); + return html` + + ` +} + +function tpl_user_settings_button (o) { const i18n_details = __('Show details about this chat client'); + return html` + + `; +} + +export default (o) => { + const i18n_change_status = __('Click to change your chat status'); const show_settings_button = api.settings.get('show_client_info') || api.settings.get('allow_adhoc_commands'); + let classes, color; + if (o.chat_status === 'online') { + [classes, color] = ['fa fa-circle chat-status', 'chat-status-online']; + } else if (o.chat_status === 'dnd') { + [classes, color] = ['fa fa-minus-circle chat-status', 'chat-status-busy']; + } else if (o.chat_status === 'away') { + [classes, color] = ['fa fa-circle chat-status', 'chat-status-away']; + } else { + [classes, color] = ['fa fa-circle chat-status', 'subdued-color']; + } return html` -
-
- - - - ${o.fullname} - ${show_settings_button ? html`` : ''} - ${api.settings.get('allow_logout') ? html`` : ''} -
-
- - - ${o.status_message} - -
-
-`}; +
+
+ + + + ${o.fullname} + ${show_settings_button ? tpl_user_settings_button(o) : ''} + ${api.settings.get('allow_logout') ? tpl_signout(o) : ''} +
+
+ + + ${o.status_message} + +
+
` +}; diff --git a/src/plugins/push/tests/push.js b/src/plugins/push/tests/push.js index 84bf1c1b3..db7932461 100644 --- a/src/plugins/push/tests/push.js +++ b/src/plugins/push/tests/push.js @@ -106,7 +106,7 @@ describe("XEP-0357 Push Notifications", function () { it("can be disabled", mock.initConverse( - [], { + ['chatBoxesFetched'], { 'push_app_servers': [{ 'jid': 'push-5@client.example', 'node': 'yxs32uqsflafdk3iuqo', diff --git a/src/shared/chat/templates/toolbar.js b/src/shared/chat/templates/toolbar.js new file mode 100644 index 000000000..5a0121a27 --- /dev/null +++ b/src/shared/chat/templates/toolbar.js @@ -0,0 +1,17 @@ +import { __ } from 'i18n'; +import { html } from 'lit'; +import { until } from 'lit/directives/until.js'; + +function tpl_send_button () { + const i18n_send_message = __('Send the message'); + return html`` +} + +export default (el) => { + return html` + ${until(el.getButtons(), '')} + ${ el.show_send_button ? tpl_send_button() : '' } + `; +} diff --git a/src/shared/chat/toolbar.js b/src/shared/chat/toolbar.js index d20c324f6..91e2ee80d 100644 --- a/src/shared/chat/toolbar.js +++ b/src/shared/chat/toolbar.js @@ -1,5 +1,6 @@ import './emoji-picker.js'; import 'shared/chat/message-limit.js'; +import tpl_toolbar from './templates/toolbar.js'; import { CustomElement } from 'shared/components/element.js'; import { __ } from 'i18n'; import { _converse, api, converse } from '@converse/headless/core'; @@ -33,11 +34,7 @@ export class ChatToolbar extends CustomElement { } render () { - const i18n_send_message = __('Send the message'); - return html` - ${until(this.getButtons(), '')} - ${ this.show_send_button ? html`` : '' } - `; + return tpl_toolbar(this); } firstUpdated () { diff --git a/src/shared/components/icons.js b/src/shared/components/icons.js index f2cdeb402..5aa100311 100644 --- a/src/shared/components/icons.js +++ b/src/shared/components/icons.js @@ -32,7 +32,7 @@ class ConverseIcon extends CustomElement { } getSource () { - return `#icon-${this.class_name.split(" ")[1].replace("fa-", "")}`; + return `#icon-${this.class_name.trim().split(" ")[1].replace("fa-", "")}`; } getStyles () { diff --git a/src/shared/components/styles/dropdown.scss b/src/shared/components/styles/dropdown.scss index 81b317761..6cd941ab8 100644 --- a/src/shared/components/styles/dropdown.scss +++ b/src/shared/components/styles/dropdown.scss @@ -5,36 +5,43 @@ .conversejs { @import "bootstrap/scss/dropdown"; converse-dropdown { - &.dropup { - &.dropup--left { - .dropdown-menu { - right: 100%; - left: auto; - } - } - } + &.dropup { + &.dropup--left { + .dropdown-menu { + right: 100%; + left: auto; + } + } + } - .btn--standalone { - padding: 0 0.2em; - margin: 0; - } - .dropdown-menu { - margin-top: -0.2em !important; - } + .btn--standalone { + padding: 0 0.2em; + margin: 0; + } - .dropdown-item { - padding: 0.5rem 1rem; - .fa { - width: 1.25em; - margin-right: 0.75rem; - } - &:active, &.selected { - color: white !important; - background-color: var(--list-item-open-color); - .fa { - color: white !important; - } - } - } + .dropdown-menu { + margin-top: -0.2em !important; + } + + .dropdown-item { + line-height: 1em; + color: var(--text-color); + padding: 0.5rem 1rem; + converse-icon { + margin-top: -0.1em; + width: 1.25em; + margin-right: 0; + } + &:active, &.selected { + color: white !important; + background-color: var(--list-item-open-color); + .fa { + color: white !important; + } + } + &:hover { + color: var(--text-color); + } + } } } diff --git a/src/shared/styles/_variables.scss b/src/shared/styles/_variables.scss index fc3dd9f6d..24e1b0de2 100644 --- a/src/shared/styles/_variables.scss +++ b/src/shared/styles/_variables.scss @@ -63,6 +63,8 @@ $mobile_portrait_length: 480px !default; --chat-toolbar-btn-color: var(--green); --chat-toolbar-btn-disabled-color: gray; + --toolbar-btn-text-color: white; + --chat-content-background-color: white; --chat-info-color: var(--chatroom-head-bg-color); diff --git a/src/shared/tests/mock.js b/src/shared/tests/mock.js index e73a1880e..221af8454 100644 --- a/src/shared/tests/mock.js +++ b/src/shared/tests/mock.js @@ -36,7 +36,7 @@ function initConverse (promise_names=[], settings=null, func) { async function waitUntilDiscoConfirmed (_converse, entity_jid, identities, features=[], items=[], type='info') { const sel = `iq[to="${entity_jid}"] query[xmlns="http://jabber.org/protocol/disco#${type}"]`; - const iq = await u.waitUntil(() => _converse.connection.IQ_stanzas.filter(iq => sizzle(sel, iq).length).pop(), 300); + const iq = await u.waitUntil(() => _converse.connection.IQ_stanzas.filter(iq => sizzle(sel, iq).length).pop()); const stanza = $iq({ 'type': 'result', 'from': entity_jid,