From 3cc5d544a274e3675185617079a82eecb56a4707 Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Fri, 10 May 2024 17:55:06 +0200 Subject: [PATCH] Add group avatar to chat select , fix typos in chat text editor, close edit and reply to on group change --- plugins/plugins/core/components/ChatPage.js | 20 +++++++--- plugins/plugins/core/components/ChatSelect.js | 40 +++++++++++++------ .../plugins/core/components/ChatTextEditor.js | 28 ++++++------- .../plugins/core/components/plugins-css.js | 6 +-- 4 files changed, 60 insertions(+), 34 deletions(-) diff --git a/plugins/plugins/core/components/ChatPage.js b/plugins/plugins/core/components/ChatPage.js index 3bb80f9c..030126b3 100644 --- a/plugins/plugins/core/components/ChatPage.js +++ b/plugins/plugins/core/components/ChatPage.js @@ -321,13 +321,13 @@ class ChatPage extends LitElement {

${this.repliedToMessageObj.senderName ? this.repliedToMessageObj.senderName : this.repliedToMessageObj.sender}

${this.repliedToMessageObj.version.toString() === '1' ? html` - ${this.repliedToMessageObj.message} + ${this.repliedToMessageObj.message} ` : '' } ${+this.repliedToMessageObj.version > 1 ? html` - ${unsafeHTML(generateHTML(this.repliedToMessageObj.message, [StarterKit, Underline, Highlight]))} + ${unsafeHTML(generateHTML(this.repliedToMessageObj.message, [StarterKit, Underline, Highlight]))} ` : '' } @@ -344,7 +344,7 @@ class ChatPage extends LitElement {

${translate("chatpage.cchange25")}

- ${unsafeHTML(generateHTML(this.editedMessageObj.message, [StarterKit, Underline, Highlight]))} + ${unsafeHTML(generateHTML(this.editedMessageObj.message, [StarterKit, Underline, Highlight]))}
this.closeEditMessageContainer()}> @@ -1366,11 +1366,23 @@ class ChatPage extends LitElement { shouldUpdate(changedProperties) { if (changedProperties.has('chatId')) { + if (this.repliedToMessageObj) { + this.closeRepliedToContainer() + return true + } + + if (this.editedMessageObj) { + this.closeEditMessageContainer() + return true + } + return true } + if (changedProperties.has('setActiveChatHeadUrl')) { return false } + if (changedProperties.has('setOpenPrivateMessage')) { return false } @@ -1666,8 +1678,6 @@ class ChatPage extends LitElement { let list = [...decodeMsgs] - - this.messagesRendered = { messages: list, type: 'old', diff --git a/plugins/plugins/core/components/ChatSelect.js b/plugins/plugins/core/components/ChatSelect.js index 2565fc52..7e175ddd 100644 --- a/plugins/plugins/core/components/ChatSelect.js +++ b/plugins/plugins/core/components/ChatSelect.js @@ -14,7 +14,9 @@ class ChatSelect extends LitElement { iconName: { type: String }, activeChatHeadUrl: { type: String }, isImageLoaded: { type: Boolean }, - setActiveChatHeadUrl: { attribute: false } + setActiveChatHeadUrl: { attribute: false }, + avatarImg: { type: String } + } } @@ -27,8 +29,7 @@ class ChatSelect extends LitElement { this.selectedAddress = {} this.config = { user: { - node: { - } + node: {} } } this.chatInfo = {} @@ -36,29 +37,44 @@ class ChatSelect extends LitElement { this.activeChatHeadUrl = '' this.isImageLoaded = false this.imageFetches = 0 + this.avatarImg = '' } render() { - let avatarImg = '' - let backupAvatarImg = '' + let groupString = 'Group_' + this.chatInfo.groupId + let groupAvatarString = 'qortal_group_avatar_' + this.chatInfo.groupId - if (this.chatInfo.name) { - const myNode = window.parent.reduxStore.getState().app.nodeConfig.knownNodes[window.parent.reduxStore.getState().app.nodeConfig.node] - const nodeUrl = myNode.protocol + '://' + myNode.domain + ':' + myNode.port + const myNode = window.parent.reduxStore.getState().app.nodeConfig.knownNodes[window.parent.reduxStore.getState().app.nodeConfig.node] + const nodeUrl = myNode.protocol + '://' + myNode.domain + ':' + myNode.port + + if (groupString === 'Group_0') { + const avatarUrl = `/img/qgcgroup.png` + this.avatarImg = this.createImage(avatarUrl) + } else if (groupString === 'Group_1') { + const avatarUrl = `/img/qdcgroup.png` + this.avatarImg = this.createImage(avatarUrl) + } else if (this.chatInfo.name) { const avatarUrl = `${nodeUrl}/arbitrary/THUMBNAIL/${this.chatInfo.name}/qortal_avatar?async=true` - avatarImg = this.createImage(avatarUrl) + this.avatarImg = this.createImage(avatarUrl) + } else if (this.chatInfo.ownerName) { + if (this.chatInfo.ownerName === undefined) { + // Nothing to do + } else { + const avatarUrl = `${nodeUrl}/arbitrary/THUMBNAIL/${this.chatInfo.ownerName}/${groupAvatarString}?async=true` + this.avatarImg = this.createImage(avatarUrl) + } } return html`
  • this.getUrl(this.chatInfo.url)} class="clearfix ${this.activeChatHeadUrl === this.chatInfo.url ? 'active' : ''}"> - ${this.isImageLoaded ? html`${avatarImg}` : html``} + ${this.isImageLoaded ? html`${this.avatarImg}` : html``} ${!this.isImageLoaded && !this.chatInfo.name && !this.chatInfo.groupName ? html`account_circle` : html``} ${!this.isImageLoaded && this.chatInfo.name ? html`
    ${this.chatInfo.name.charAt(0)}
    @@ -70,7 +86,7 @@ class ChatSelect extends LitElement {
    ${this.chatInfo.groupName.charAt(0)}
    diff --git a/plugins/plugins/core/components/ChatTextEditor.js b/plugins/plugins/core/components/ChatTextEditor.js index c989c169..3d6d07d4 100644 --- a/plugins/plugins/core/components/ChatTextEditor.js +++ b/plugins/plugins/core/components/ChatTextEditor.js @@ -60,12 +60,12 @@ class ChatTextEditor extends LitElement { render() { return html` -
    -
    +
    +
    @@ -104,7 +104,7 @@ class ChatTextEditor extends LitElement {
    ${this.iframeId === "_chatEditorDOM" ? html` -
    +
    @@ -126,8 +126,8 @@ class ChatTextEditor extends LitElement { : '' }
    -
    -
    {this.preventUserSendingImage(e)}}> +
    +
    {this.preventUserSendingImage(e)}}>
    - +
    ${this.editedMessageObj ? - (html` -
    + html` +
    ${this.isLoading === false ? html` {this.sendMessageFunc(this.messageQueue)}}> @@ -162,11 +162,11 @@ class ChatTextEditor extends LitElement { ` }
    - `) : html` + ` : html`
    ${this.isLoading === false ? html` - send-icon {this.sendMessageFunc(this.messageQueue)}} /> + send-icon {this.sendMessageFunc(this.messageQueue)}}> ` : html` ` @@ -178,7 +178,7 @@ class ChatTextEditor extends LitElement { ${this.chatMessageSize >= 750 ? html`
    -
    +
    ${`Your message size is of ${this.chatMessageSize} bytes out of a maximum of 4000`}
    diff --git a/plugins/plugins/core/components/plugins-css.js b/plugins/plugins/core/components/plugins-css.js index ee320917..e4b00fb1 100644 --- a/plugins/plugins/core/components/plugins-css.js +++ b/plugins/plugins/core/components/plugins-css.js @@ -120,7 +120,7 @@ export const chatpageStyles = css` .message-size { font-family: Roboto, sans-serif; font-size: 12px; - color: black; + color: var(--black); } .lds-grid { @@ -508,7 +508,7 @@ export const chatpageStyles = css` .message-size { font-family: Roboto, sans-serif; font-size: 12px; - color: black; + color: var(--black); } .lds-grid { @@ -3529,7 +3529,7 @@ export const chatTextEditorStyles = css` .message-size { font-family: Roboto, sans-serif; font-size: 12px; - color: black; + color: var(--black); } .paperclip-icon {