jschulthess/qortal-ui
1
0
Fork 0
forked from Qortal/qortal-ui
Code Issues Pull Requests Projects Releases Wiki Activity

added formattedMessages to group

Browse Source
This commit is contained in:
Phillip Lang Martinez 2022-11-09 18:12:03 +02:00
parent 6cbb77a625
commit 107e3b6a6f
1 changed files with 56 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
qortal-ui-plugins/plugins/core/components/ChatScroller.js
View File

@ -49,7 +49,7 @@ class ChatScroller extends LitElement {
render() { render() {
console.log({messages: this.messages}) console.log({messages: this.messages})
let testMessages = this.messages.reduce((messageArray, message)=> { let formattedMessages = this.messages.reduce((messageArray, message)=> {
const lastGroupedMessage = messageArray[messageArray.length - 1] const lastGroupedMessage = messageArray[messageArray.length - 1]
let timestamp let timestamp
let sender let sender
@ -72,11 +72,55 @@ class ChatScroller extends LitElement {
return messageArray return messageArray
}, []) }, [])
console.log({testMessages}) console.log({formattedMessages})
return html` return html`
<ul id="viewElement" class="chat-list clearfix"> <ul id="viewElement" class="chat-list clearfix">
<div id="upObserver"></div> <div id="upObserver"></div>
${repeat( ${formattedMessages.map((formattedMessage)=> {
return repeat(
formattedMessage.messages,
(message) => message.reference,
(message, indexMessage) => html`
<message-template
.emojiPicker=${this.emojiPicker}
.escapeHTML=${this.escapeHTML}
.messageObj=${message}
.hideMessages=${this.hideMessages}
.setRepliedToMessageObj=${this.setRepliedToMessageObj}
.setEditedMessageObj=${this.setEditedMessageObj}
.focusChatEditor=${this.focusChatEditor}
.sendMessage=${this.sendMessage}
?isfirstmessage=${indexMessage === 0}
?isSingleMessageInGroup=${formattedMessage.messages.length > 1}
>
</message-template>`
)
})}
<!-- ${repeat(
testMessages,
(testMessage)=> testMessage.signature,
(testMessage)=> {
return repeat(
testMessage.messages,
(message) => message.reference,
(message, indexMessage) => html`
<message-template
.emojiPicker=${this.emojiPicker}
.escapeHTML=${this.escapeHTML}
.messageObj=${message}
.hideMessages=${this.hideMessages}
.setRepliedToMessageObj=${this.setRepliedToMessageObj}
.setEditedMessageObj=${this.setEditedMessageObj}
.focusChatEditor=${this.focusChatEditor}
.sendMessage=${this.sendMessage}
?isfirstmessage=${indexMessage === 0}
>
</message-template>`
)
}
)} -->
<!-- ${repeat(
this.messages, this.messages,
(message) => message.reference, (message) => message.reference,
(message) => html` (message) => html`
@ -91,7 +135,7 @@ class ChatScroller extends LitElement {
.sendMessage=${this.sendMessage} .sendMessage=${this.sendMessage}
> >
</message-template>` </message-template>`
)} )} -->
<div id='downObserver'></div> <div id='downObserver'></div>
<div class='last-message-ref'> <div class='last-message-ref'>
<vaadin-icon icon='vaadin:arrow-circle-down' slot='icon' @click=${() => { <vaadin-icon icon='vaadin:arrow-circle-down' slot='icon' @click=${() => {
@ -191,7 +235,9 @@ class MessageTemplate extends LitElement {
focusChatEditor: { type: Function }, focusChatEditor: { type: Function },
sendMessage: { type: Function }, sendMessage: { type: Function },
openDialogImage: {type: Function}, openDialogImage: {type: Function},
isImageLoaded: {type: Boolean} isImageLoaded: {type: Boolean},
isFirstMessage: {type: Boolean},
isSingleMessageInGroup: {type: Boolean}
} }
} }
@ -205,6 +251,8 @@ class MessageTemplate extends LitElement {
this.imageFetches = 0 this.imageFetches = 0
this.openDialogImage = false this.openDialogImage = false
this.isImageLoaded = false this.isImageLoaded = false
this.isFirstMessage = false
this.isSingleMessageInGroup = false
} }
static styles = [chatStyles] static styles = [chatStyles]
@ -238,7 +286,7 @@ class MessageTemplate extends LitElement {
render() { render() {
console.log('isFirst', this.isFirstMessage)
const hidemsg = this.hideMessages const hidemsg = this.hideMessages
let message = "" let message = ""
let reactions = [] let reactions = []
@ -339,6 +387,8 @@ class MessageTemplate extends LitElement {
} }
} }
return hideit ? html`<li class="clearfix"></li>` : html` return hideit ? html`<li class="clearfix"></li>` : html`
<li class="clearfix message-parent"> <li class="clearfix message-parent">
<div class="message-data ${this.messageObj.sender === this.myAddress ? "" : ""}"> <div class="message-data ${this.messageObj.sender === this.myAddress ? "" : ""}">