qortal.link/qortal-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Send Private Message Done in Chat Menu

Browse Source
This commit is contained in:
Justin Ferrari 2022-12-26 11:41:41 -05:00
parent 8be65cff5c
commit f1f0c93622
6 changed files with 148 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
qortal-ui-plugins/plugins/core/components/ChatModals.js
View File

@ -366,7 +366,6 @@ class ChatModals extends LitElement {
<textarea class='textarea' @keydown=${(e) => this._textArea(e)} ?disabled=${this.isLoading} id='messageBox' placeholder='${translate('welcomepage.wcchange5')}' rows='1'></textarea> <textarea class='textarea' @keydown=${(e) => this._textArea(e)} ?disabled=${this.isLoading} id='messageBox' placeholder='${translate('welcomepage.wcchange5')}' rows='1'></textarea>
</p> </p>
<mwc-button ?disabled='${this.isLoading}' slot='primaryAction' @click=${() => { <mwc-button ?disabled='${this.isLoading}' slot='primaryAction' @click=${() => {
console.log("here500");
this._sendMessage(); this._sendMessage();
} }
}>${translate('welcomepage.wcchange6')} }>${translate('welcomepage.wcchange6')}

118
qortal-ui-plugins/plugins/core/components/ChatPage.js
View File

@ -54,8 +54,9 @@ class ChatPage extends LitElement {
_initialMessages: { type: Array }, _initialMessages: { type: Array },
isUserDown: { type: Boolean }, isUserDown: { type: Boolean },
isPasteMenuOpen: { type: Boolean }, isPasteMenuOpen: { type: Boolean },
showNewMesssageBar: { attribute: false }, showNewMessageBar: { attribute: false },
hideNewMesssageBar: { attribute: false }, hideNewMessageBar: { attribute: false },
setOpenPrivateMessage: { attribute: false },
chatEditorPlaceholder: { type: String }, chatEditorPlaceholder: { type: String },
messagesRendered: { type: Array }, messagesRendered: { type: Array },
repliedToMessageObj: { type: Object }, repliedToMessageObj: { type: Object },
@ -75,6 +76,8 @@ class ChatPage extends LitElement {
openForwardOpen: {type: Boolean }, openForwardOpen: {type: Boolean },
userFound: { type: Array }, userFound: { type: Array },
userFoundModalOpen: { type: Boolean }, userFoundModalOpen: { type: Boolean },
webWorker: { type: Object },
webWorkerImage: { type: Object }
} }
} }
@ -693,10 +696,12 @@ class ChatPage extends LitElement {
name: "", name: "",
selected: false selected: false
} }
this.webWorker = null;
this.webWorkerImage = null;
} }
render() { render() {
console.log(25, 'here'); console.log(5, 'Chat Page Here');
return html` return html`
<div class="chat-container"> <div class="chat-container">
<div> <div>
@ -983,6 +988,18 @@ class ChatPage extends LitElement {
` `
} }
connectedCallback() {
super.connectedCallback();
this.webWorker = new WebWorker();
this.webWorkerImage = new WebWorkerImage();
}
disconnectedCallback() {
super.disconnectedCallback();
this.webWorker.terminate();
this.webWorkerImage.terminate();
}
async userSearch() { async userSearch() {
const nameValue = this.shadowRoot.getElementById('sendTo').value; const nameValue = this.shadowRoot.getElementById('sendTo').value;
if (!nameValue) { if (!nameValue) {
@ -1009,7 +1026,7 @@ class ChatPage extends LitElement {
let err4string = get("chatpage.cchange35"); let err4string = get("chatpage.cchange35");
parentEpml.request('showSnackBar', `${err4string}`) parentEpml.request('showSnackBar', `${err4string}`)
} }
} }
setForwardProperties(forwardedMessage){ setForwardProperties(forwardedMessage){
this.openForwardOpen = true this.openForwardOpen = true
@ -1175,9 +1192,6 @@ class ChatPage extends LitElement {
} }
} }
if (changedProperties && changedProperties.has('forwardActiveChatHeadUrl')) {
console.log(this.forwardActiveChatHeadUrl, "forwardActiveChatHeadUrl here");
}
} }
async renderPlaceholder() { async renderPlaceholder() {
@ -1224,6 +1238,7 @@ class ChatPage extends LitElement {
?isLoadingMessages=${this.isLoadingOldMessages} ?isLoadingMessages=${this.isLoadingOldMessages}
.setIsLoadingMessages=${(val) => this.setIsLoadingMessages(val)} .setIsLoadingMessages=${(val) => this.setIsLoadingMessages(val)}
.setForwardProperties=${(forwardedMessage)=> this.setForwardProperties(forwardedMessage)} .setForwardProperties=${(forwardedMessage)=> this.setForwardProperties(forwardedMessage)}
.setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}
> >
</chat-scroller> </chat-scroller>
` `
@ -1435,7 +1450,7 @@ class ChatPage extends LitElement {
this.messagesRendered = [...this.messagesRendered, newMessage] this.messagesRendered = [...this.messagesRendered, newMessage]
await this.getUpdateComplete(); await this.getUpdateComplete();
this.showNewMesssageBar(); this.showNewMessageBar();
} }
} }
@ -1673,7 +1688,6 @@ class ChatPage extends LitElement {
} }
async _sendMessage(outSideMsg) { async _sendMessage(outSideMsg) {
console.log(outSideMsg);
// have params to determine if it's a reply or not // have params to determine if it's a reply or not
// have variable to determine if it's a response, holds signature in constructor // have variable to determine if it's a response, holds signature in constructor
// need original message signature // need original message signature
@ -1681,7 +1695,7 @@ class ChatPage extends LitElement {
// create new var called repliedToData and use that to modify the UI // create new var called repliedToData and use that to modify the UI
// find specific object property in local // find specific object property in local
let typeMessage = 'regular'; let typeMessage = 'regular';
let workerImage;
this.isLoading = true; this.isLoading = true;
this.chatEditor.disable(); this.chatEditor.disable();
this.chatEditorNewChat.disable() this.chatEditorNewChat.disable()
@ -1714,26 +1728,32 @@ class ChatPage extends LitElement {
const identifier = outSideMsg.identifier const identifier = outSideMsg.identifier
let compressedFile = '' let compressedFile = ''
var str = "iVBORw0KGgoAAAANSUhEUgAAAsAAAAGMAQMAAADuk4YmAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAADlJREFUeF7twDEBAAAAwiD7p7bGDlgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAGJrAABgPqdWQAAAABJRU5ErkJggg=="; var str = "iVBORw0KGgoAAAANSUhEUgAAAsAAAAGMAQMAAADuk4YmAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAADlJREFUeF7twDEBAAAAwiD7p7bGDlgYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAGJrAABgPqdWQAAAABJRU5ErkJggg==";
if (this.webWorkerImage) {
workerImage = this.webWorkerImage;
} else {
this.webWorkerImage = new WebWorkerImage();
}
const b64toBlob = (b64Data, contentType='', sliceSize=512) => { const b64toBlob = (b64Data, contentType='', sliceSize=512) => {
const byteCharacters = atob(b64Data); const byteCharacters = atob(b64Data);
const byteArrays = []; const byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) { for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
const slice = byteCharacters.slice(offset, offset + sliceSize); const slice = byteCharacters.slice(offset, offset + sliceSize);
const byteNumbers = new Array(slice.length); const byteNumbers = new Array(slice.length);
for (let i = 0; i < slice.length; i++) { for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i); byteNumbers[i] = slice.charCodeAt(i);
} }
const byteArray = new Uint8Array(byteNumbers); const byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray); byteArrays.push(byteArray);
}
const blob = new Blob(byteArrays, {type: contentType});
return blob;
} }
const blob = new Blob(byteArrays, {type: contentType});
return blob;
}
const blob = b64toBlob(str, 'image/png'); const blob = b64toBlob(str, 'image/png');
await new Promise(resolve => { await new Promise(resolve => {
new Compressor(blob, { new Compressor(blob, {
@ -1762,7 +1782,7 @@ class ChatPage extends LitElement {
metaData: undefined, metaData: undefined,
uploadType: 'file', uploadType: 'file',
selectedAddress: this.selectedAddress, selectedAddress: this.selectedAddress,
worker: new WebWorkerImage() worker: workerImage
}) })
this.isDeletingImage = false this.isDeletingImage = false
} catch (error) { } catch (error) {
@ -1806,6 +1826,13 @@ class ChatPage extends LitElement {
this.chatEditorNewChat.enable() this.chatEditorNewChat.enable()
return; return;
} }
if (this.webWorkerImage) {
workerImage = this.webWorkerImage;
} else {
this.webWorkerImage = new WebWorkerImage();
}
const image = this.imageFile const image = this.imageFile
const id = this.uid(); const id = this.uid();
const identifier = `qchat_${id}`; const identifier = `qchat_${id}`;
@ -1845,7 +1872,7 @@ class ChatPage extends LitElement {
metaData: undefined, metaData: undefined,
uploadType: 'file', uploadType: 'file',
selectedAddress: this.selectedAddress, selectedAddress: this.selectedAddress,
worker: new WebWorkerImage() worker: workerImage
}); });
this.isUploadingImage = false; this.isUploadingImage = false;
this.imageFile = null; this.imageFile = null;
@ -2123,28 +2150,35 @@ class ChatPage extends LitElement {
const _computePow = async (chatBytes, isForward) => { const _computePow = async (chatBytes, isForward) => {
const difficulty = this.balance === 0 ? 12 : 8; const difficulty = this.balance === 0 ? 12 : 8;
const path = window.parent.location.origin + '/memory-pow/memory-pow.wasm.full' const path = window.parent.location.origin + '/memory-pow/memory-pow.wasm.full'
const worker = new WebWorker();
let nonce = null let worker;
let chatBytesArray = null
if (this.webWorker) {
worker = this.webWorker;
} else {
this.webWorker = new WebWorker();
}
let nonce = null;
let chatBytesArray = null;
await new Promise((res, rej) => { await new Promise((res, rej) => {
worker.postMessage({chatBytes, path, difficulty}); worker.postMessage({chatBytes, path, difficulty});
worker.onmessage = e => { worker.onmessage = e => {
worker.terminate() chatBytesArray = e.data.chatBytesArray;
chatBytesArray = e.data.chatBytesArray nonce = e.data.nonce;
nonce = e.data.nonce res();
res()
} }
}) });
let _response = await parentEpml.request('sign_chat', { let _response = await parentEpml.request('sign_chat', {
nonce: this.selectedAddress.nonce, nonce: this.selectedAddress.nonce,
chatBytesArray: chatBytesArray, chatBytesArray: chatBytesArray,
chatNonce: nonce chatNonce: nonce
}); });
getSendChatResponse(_response, isForward); getSendChatResponse(_response, isForward);
}; };
@ -2193,7 +2227,7 @@ class ChatPage extends LitElement {
if (entries[0].isIntersecting) { if (entries[0].isIntersecting) {
this.setIsUserDown(true) this.setIsUserDown(true)
this.hideNewMesssageBar() this.hideNewMessageBar()
} else { } else {
this.setIsUserDown(false) this.setIsUserDown(false)

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

@ -36,7 +36,8 @@ class ChatScroller extends LitElement {
isLoadingMessages: { type: Boolean}, isLoadingMessages: { type: Boolean},
setIsLoadingMessages: {attribute: false}, setIsLoadingMessages: {attribute: false},
chatId: { type: String }, chatId: { type: String },
setForwardProperties: {attribute: false}, setForwardProperties: { attribute: false },
setOpenPrivateMessage: { attribute: false },
} }
} }
@ -48,17 +49,27 @@ class ChatScroller extends LitElement {
this._upObserverhandler = this._upObserverhandler.bind(this) this._upObserverhandler = this._upObserverhandler.bind(this)
this._downObserverHandler = this._downObserverHandler.bind(this) this._downObserverHandler = this._downObserverHandler.bind(this)
this.myAddress = window.parent.reduxStore.getState().app.selectedAddress.address this.myAddress = window.parent.reduxStore.getState().app.selectedAddress.address
this.hideMessages = JSON.parse(localStorage.getItem("MessageBlockedAddresses") || "[]") this.hideMessages = JSON.parse(localStorage.getItem("MessageBlockedAddresses") || "[]")
} }
render() { render() {
console.log({messages: this.messages}) let formattedMessages = this.messages.reduce((messageArray, message, index) => {
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;
let repliedToData; let repliedToData;
let firstMessageInChat;
if (index === 0) {
firstMessageInChat = true;
} else {
firstMessageInChat = false;
}
message = {...message, firstMessageInChat}
if (lastGroupedMessage) { if (lastGroupedMessage) {
timestamp = lastGroupedMessage.timestamp; timestamp = lastGroupedMessage.timestamp;
sender = lastGroupedMessage.sender; sender = lastGroupedMessage.sender;
@ -105,6 +116,7 @@ class ChatScroller extends LitElement {
?isLastMessageInGroup=${indexMessage === formattedMessage.messages.length - 1} ?isLastMessageInGroup=${indexMessage === formattedMessage.messages.length - 1}
.setToggledMessage=${this.setToggledMessage} .setToggledMessage=${this.setToggledMessage}
.setForwardProperties=${this.setForwardProperties} .setForwardProperties=${this.setForwardProperties}
.setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}
> >
</message-template>` </message-template>`
) )
@ -132,21 +144,18 @@ class ChatScroller extends LitElement {
return true; return true;
} }
setToggledMessage(message){ setToggledMessage (message) {
toggledMessage = message toggledMessage = message;
} }
async firstUpdated() { async firstUpdated() {
this.emojiPicker.on('emoji', selection => { this.emojiPicker.on('emoji', selection => {
this.sendMessage({ this.sendMessage({
type: 'reaction', type: 'reaction',
editedMessageObj: toggledMessage, editedMessageObj: toggledMessage,
reaction: selection.emoji, reaction: selection.emoji,
})
})
}); });
this.viewElement = this.shadowRoot.getElementById('viewElement'); this.viewElement = this.shadowRoot.getElementById('viewElement');
this.upObserverElement = this.shadowRoot.getElementById('upObserver'); this.upObserverElement = this.shadowRoot.getElementById('upObserver');
@ -230,8 +239,9 @@ class MessageTemplate extends LitElement {
isFirstMessage: { type: Boolean }, isFirstMessage: { type: Boolean },
isSingleMessageInGroup: { type: Boolean }, isSingleMessageInGroup: { type: Boolean },
isLastMessageInGroup: { type: Boolean }, isLastMessageInGroup: { type: Boolean },
setToggledMessage: {attribute: false}, setToggledMessage: { attribute: false },
setForwardProperties: {attribute: false}, setForwardProperties: { attribute: false },
setOpenPrivateMessage : { attribute: false }
} }
} }
@ -508,6 +518,8 @@ class MessageTemplate extends LitElement {
.emojiPicker=${this.emojiPicker} .emojiPicker=${this.emojiPicker}
.setToggledMessage=${this.setToggledMessage} .setToggledMessage=${this.setToggledMessage}
.setForwardProperties=${this.setForwardProperties} .setForwardProperties=${this.setForwardProperties}
?firstMessageInChat=${this.messageObj.firstMessageInChat}
.setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}
> >
</chat-menu> </chat-menu>
</div> </div>
@ -582,11 +594,13 @@ class ChatMenu extends LitElement {
focusChatEditor: {attribute: false}, focusChatEditor: {attribute: false},
myAddress: { type: Object }, myAddress: { type: Object },
emojiPicker: { attribute: false }, emojiPicker: { attribute: false },
sendMessage: {attribute: false}, sendMessage: { attribute: false },
version: {type: String}, version: { type: String },
setToggledMessage: {attribute: false}, setToggledMessage: { attribute: false },
sendMessageForward: {attribute: false}, sendMessageForward: { attribute: false },
setForwardProperties: {attribute: false} setForwardProperties: { attribute: false },
firstMessageInChat: { type: Boolean },
setOpenPrivateMessage: { attribute: false }
} }
} }
@ -665,7 +679,7 @@ class ChatMenu extends LitElement {
return html` return html`
<div class="container"> <div class="container">
<div <div
class="menu-icon tooltip reaction" class=${`menu-icon reaction ${!this.firstMessageInChat ? "tooltip" : ""}`}
data-text="${translate("blockpage.bcchange13")}" data-text="${translate("blockpage.bcchange13")}"
@click=${(e) => { @click=${(e) => {
if(this.version === '0'){ if(this.version === '0'){
@ -684,24 +698,27 @@ class ChatMenu extends LitElement {
<vaadin-icon icon="vaadin:smiley-o" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:smiley-o" slot="icon"></vaadin-icon>
</div> </div>
<div <div
class="menu-icon tooltip" class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`}
data-text="${translate("blockpage.bcchange14")}" data-text="${translate("blockpage.bcchange14")}"
@click="${() => { @click="${() => {
this.messageForwardFunc() this.messageForwardFunc()
}}"> }}">
<vaadin-icon icon="vaadin:arrow-forward" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:arrow-forward" slot="icon"></vaadin-icon>
</div> </div>
<div class="menu-icon tooltip" data-text="${translate("blockpage.bcchange9")}" @click="${() => this.showPrivateMessageModal()}"> <div class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`} data-text="${translate("blockpage.bcchange9")}" @click="${() => this.setOpenPrivateMessage({
name: this.originalMessage.senderName ? this.originalMessage.senderName : this.originalMessage.sender,
open: true
})}">
<vaadin-icon icon="vaadin:paperplane" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:paperplane" slot="icon"></vaadin-icon>
</div> </div>
<div class="menu-icon tooltip" data-text="${translate("blockpage.bcchange8")}" @click="${() => this.copyToClipboard(this.toblockaddress)}"> <div class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`} data-text="${translate("blockpage.bcchange8")}" @click="${() => this.copyToClipboard(this.toblockaddress)}">
<vaadin-icon icon="vaadin:copy" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:copy" slot="icon"></vaadin-icon>
</div> </div>
<div <div
class="menu-icon tooltip" class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`}
data-text="${translate("blockpage.bcchange11")}" data-text="${translate("blockpage.bcchange11")}"
@click="${() => { @click="${() => {
if(this.version === '0'){ if (this.version === '0') {
this.versionErrorSnack() this.versionErrorSnack()
return return
} }
@ -714,7 +731,7 @@ class ChatMenu extends LitElement {
${this.myAddress === this.originalMessage.sender ? ( ${this.myAddress === this.originalMessage.sender ? (
html` html`
<div <div
class="menu-icon tooltip" class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`}
data-text="${translate("blockpage.bcchange12")}" data-text="${translate("blockpage.bcchange12")}"
@click=${() => { @click=${() => {
if(this.version === '0'){ if(this.version === '0'){
@ -728,7 +745,7 @@ class ChatMenu extends LitElement {
</div> </div>
` `
) : html`<div></div>`} ) : html`<div></div>`}
<div class="menu-icon tooltip" data-text="${translate("blockpage.bcchange10")}" @click="${() => this.showBlockIconFunc(true)}"> <div class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`} data-text="${translate("blockpage.bcchange10")}" @click="${() => this.showBlockIconFunc(true)}">
<vaadin-icon icon="vaadin:ellipsis-dots-h" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:ellipsis-dots-h" slot="icon"></vaadin-icon>
</div> </div>
${this.showBlockAddressIcon ${this.showBlockAddressIcon

12
qortal-ui-plugins/plugins/core/components/ChatWelcomePage.js
View File

@ -25,7 +25,8 @@ class ChatWelcomePage extends LitElement {
btnDisable: { type: Boolean }, btnDisable: { type: Boolean },
isLoading: { type: Boolean }, isLoading: { type: Boolean },
balance: { type: Number }, balance: { type: Number },
theme: { type: String, reflect: true } theme: { type: String, reflect: true },
setOpenPrivateMessage: { attribute: false }
} }
} }
@ -212,7 +213,14 @@ class ChatWelcomePage extends LitElement {
<div class="center-box"> <div class="center-box">
<mwc-icon class="img-icon">chat</mwc-icon><br> <mwc-icon class="img-icon">chat</mwc-icon><br>
<span style="font-size: 20px; color: var(--black);">${this.myAddress.address}</span> <span style="font-size: 20px; color: var(--black);">${this.myAddress.address}</span>
<div class="start-chat" @click=${() => this.shadowRoot.querySelector('#startSecondChatDialog').show()}>${translate("welcomepage.wcchange2")}</div> <div
class="start-chat"
@click="${() => this.setOpenPrivateMessage({
name: "",
open: true
})}">
${translate("welcomepage.wcchange2")}
</div>
</div> </div>
</div> </div>

6
qortal-ui-plugins/plugins/core/components/NameMenu.js
View File

@ -250,15 +250,15 @@ class NameMenu extends LitElement {
} }
firstUpdated() { firstUpdated() {
this.getChatBlockedAdresses() this.getChatBlockedAdresses();
setInterval(() => { setInterval(() => {
this.getChatBlockedAdresses(); this.getChatBlockedAdresses();
}, 60000) }, 60000)
window.addEventListener('storage', () => { window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage') const checkLanguage = localStorage.getItem('qortalLanguage');
use(checkLanguage) use(checkLanguage);
}) })
window.onclick = function(event) { window.onclick = function(event) {

22
qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
View File

@ -70,8 +70,9 @@ class Chat extends LitElement {
this.messages = [] this.messages = []
this.btnDisable = false this.btnDisable = false
this.isLoading = false this.isLoading = false
this.showNewMesssageBar = this.showNewMesssageBar.bind(this) this.showNewMessageBar = this.showNewMessageBar.bind(this)
this.hideNewMesssageBar = this.hideNewMesssageBar.bind(this) this.hideNewMessageBar = this.hideNewMessageBar.bind(this)
this.setOpenPrivateMessage = this.setOpenPrivateMessage.bind(this)
this._sendMessage = this._sendMessage.bind(this) this._sendMessage = this._sendMessage.bind(this)
this.insertImage = this.insertImage.bind(this) this.insertImage = this.insertImage.bind(this)
this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light'
@ -395,6 +396,11 @@ class Chat extends LitElement {
parentEpml.imReady() parentEpml.imReady()
} }
setOpenPrivateMessage(props) {
this.openPrivateMessage = props.open;
this.shadowRoot.getElementById("sendTo").value = props.name
}
async userSearch() { async userSearch() {
const nameValue = this.shadowRoot.getElementById('sendTo').value; const nameValue = this.shadowRoot.getElementById('sendTo').value;
if(!nameValue) { if(!nameValue) {
@ -720,7 +726,11 @@ class Chat extends LitElement {
} }
renderChatWelcomePage() { renderChatWelcomePage() {
return html`<chat-welcome-page myAddress=${JSON.stringify(this.selectedAddress)}></chat-welcome-page>` return html`
<chat-welcome-page
myAddress=${JSON.stringify(this.selectedAddress)}
.setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}>
</chat-welcome-page>`
} }
renderChatHead(chatHeadArr) { renderChatHead(chatHeadArr) {
@ -740,7 +750,7 @@ class Chat extends LitElement {
// Else render Welcome to Q-CHat // Else render Welcome to Q-CHat
// TODO: DONE: Do the above in the ChatPage // TODO: DONE: Do the above in the ChatPage
return html`<chat-page .chatHeads=${this.chatHeads} .hideNewMesssageBar=${this.hideNewMesssageBar} .showNewMesssageBar=${this.showNewMesssageBar} myAddress=${window.parent.reduxStore.getState().app.selectedAddress.address} chatId=${this.activeChatHeadUrl}></chat-page>` return html`<chat-page .chatHeads=${this.chatHeads} .hideNewMessageBar=${this.hideNewMessageBar} .showNewMessageBar=${this.showNewMessageBar} myAddress=${window.parent.reduxStore.getState().app.selectedAddress.address} chatId=${this.activeChatHeadUrl} .setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}></chat-page>`
} }
setChatHeads(chatObj) { setChatHeads(chatObj) {
@ -830,11 +840,11 @@ class Chat extends LitElement {
viewElement.scroll({ top: viewElement.scrollHeight, left: 0, behavior: 'smooth' }) viewElement.scroll({ top: viewElement.scrollHeight, left: 0, behavior: 'smooth' })
} }
showNewMesssageBar() { showNewMessageBar() {
this.shadowRoot.getElementById('newMessageBar').classList.remove('hide-new-message-bar') this.shadowRoot.getElementById('newMessageBar').classList.remove('hide-new-message-bar')
} }
hideNewMesssageBar() { hideNewMessageBar() {
this.shadowRoot.getElementById('newMessageBar').classList.add('hide-new-message-bar') this.shadowRoot.getElementById('newMessageBar').classList.add('hide-new-message-bar')
} }
} }