diff --git a/sib-chat.js b/sib-chat.js index ca9a62e1d7aa4786ad630bab7fd2e70ca11aacfc..9f8f8e9c35122ed06fc54c1e665d471f17a8aed6 100644 --- a/sib-chat.js +++ b/sib-chat.js @@ -1,5 +1,5 @@ -import 'https://cdn.happy-dev.fr/conversejs/dist/converse.min.js'; -import 'https://cdn.happy-dev.fr/conversejs/dist/emojis.js'; +import 'https://unpkg.com/converse.js@6.0/dist/converse.min.js'; +import 'https://unpkg.com/converse.js@6.0/dist/emojis.js'; import { Helpers, store } from 'https://unpkg.com/@startinblox/core@0.9'; import { Sib } from "https://unpkg.com/@startinblox/core@0.9/dist/libs/Sib.js"; import { StoreMixin } from 'https://unpkg.com/@startinblox/core@0.9/dist/mixins/storeMixin.js'; @@ -46,8 +46,8 @@ export const SibChat = { mode: "open" }); this.element.shadowRoot.append(...Helpers.importCSS( - 'https://cdn.happy-dev.fr/conversejs/dist/converse.min.css', - 'https://unpkg.com/@startinblox/component-chat@0.4/themes/converse-hd.css' + 'https://unpkg.com/converse.js@6.0/dist/converse.min.css', + 'https://unpkg.com/@startinblox/component-chat@0.5/themes/converse-hd.css' )); if (window.converse_sib === undefined) { this.initializeConverse(); @@ -125,23 +125,9 @@ export const SibChat = { if (converse_el) { root.appendChild(converse_el); } - if(this._converse.auto_join_rooms[0]) { - if(this._converse.chatboxviews.get(this._converse.auto_join_rooms[0])) { - this._converse.chatboxviews.get(this._converse.auto_join_rooms[0]).close(); - } - } - if(this._converse.auto_join_private_chats[0]) { - if(this._converse.chatboxviews.get(this._converse.auto_join_private_chats[0])) { - this._converse.chatboxviews.get(this._converse.auto_join_private_chats[0]).close(); - } - } if (is_groupchat) { - this._converse.auto_join_private_chats = []; - this._converse.auto_join_rooms = [jid]; this._converse.api.rooms.open(jid); } else { - this._converse.auto_join_rooms = []; - this._converse.auto_join_private_chats = [jid]; this._converse.api.chats.open(jid); } } @@ -204,9 +190,6 @@ export const SibChat = { 'auto_join_on_invite': true, 'auto_reconnect': true, 'auto_register_muc_nickname': true, - // Quick fix : auto join yourself & target of current route - 'auto_join_private_chats': [], - 'auto_join_rooms': [], 'bosh_service_url': this.element.dataset.boshServiceUrl, "clear_messages_on_reconnection": true, 'i18n': 'en', @@ -226,7 +209,7 @@ export const SibChat = { // 'show_send_button': true, 'singleton': true, 'sounds_path': 'https://cdn.happy-dev.fr/conversejs/sounds/', - 'view_mode': 'embedded', + 'view_mode': 'fullscreen', 'visible_toolbar_buttons': { call: false, spoiler: false, diff --git a/themes/converse-hd.css b/themes/converse-hd.css index 7fdfdf5d1182ef8d298fd9c1ae0d8fb90514b9cf..86edb964f9d3fd9865c6c25e53287c6aa00356ce 100644 --- a/themes/converse-hd.css +++ b/themes/converse-hd.css @@ -86,8 +86,58 @@ --chatroom-separator-border-bottom: 1px solid var(--chatroom-head-color); --avatar-border-radius: 50%; --avatar-background-color: lightgrey; - --fullpage-chat-height: calc(var(--vh, 1vh) * 100); --chatroom-correcting-color: var(--hd-chat-correcting-color); + --fullpage-chat-height: 100%; +} + +/* To hide the trash icon because you can't remove a message for now */ +#conversejs>.converse-chatboxes .chat-body .chat-msg__actions>button.chat-msg__action.fa-trash-alt { + display: none; +} + +/* Chat window fits the SIB app size */ +#conversejs.converse-fullscreen.converse-singleton { + box-sizing: border-box; + bottom: auto; + height: 100%; + position: relative; + right: auto; + width: 100%; +} + +#conversejs.converse-embedded .converse-chatboxes, +#conversejs.converse-fullscreen .converse-chatboxes { + bottom: auto; + flex-wrap: nowrap; + height: 100%; + position: inherit; + width: 100%; +} +/* end */ + +#conversejs .flyout .chat-head { + display: none; +} + +/* Custom scrollbar of chat history */ +#conversejs .flyout .chat-body .chat-content { + scrollbar-width: thin; + scrollbar-color: var(--hd-subdued-color) white; +} + +#conversejs .flyout .chat-body .chat-content::-webkit-scrollbar-track { + background: white; +} + +#conversejs .flyout .chat-body .chat-content::-webkit-scrollbar-thumb { + background-color: var(--hd-subdued-color); + border-radius: 6px; + border: 3px solid white; +} +/* end */ + +#conversejs .flyout .chat-body .chat-content::-webkit-scrollbar { + width: 11px; } #conversejs ::selection { @@ -416,16 +466,6 @@ overflow: hidden; } -#conversejs.converse-embedded .converse-chatboxes { - z-index: 1031; - position: inherit; - flex-wrap: nowrap; - bottom: auto; - height: 100%; - width: 100%; - margin-left: -15px; -} - #conversejs.converse-embedded .chatbox .box-flyout { bottom: 0; height: 100%; @@ -527,6 +567,10 @@ border-top: none; } +#conversejs.converse-fullscreen .chatroom .box-flyout .chatroom-body .occupants { + display: none; +} + #conversejs.converse-embedded .chatroom .box-flyout .sendXMPPMessage .chat-textarea { font-size: var(--font-size); } @@ -626,7 +670,7 @@ } #conversejs .message.chat-msg { - padding: 0.8rem 6.4rem 0.4rem 3rem; + padding: 0.8rem 4rem 0.4rem 3rem; } #conversejs .message.chat-msg.correcting.groupchat {