diff --git a/qortal-ui-plugins/plugins/core/components/ChatHead.js b/qortal-ui-plugins/plugins/core/components/ChatHead.js
index a16b11fc..4e9c170c 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatHead.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatHead.js
@@ -14,6 +14,7 @@ class ChatHead extends LitElement {
iconName: { type: String },
activeChatHeadUrl: { type: String },
isImageLoaded: { type: Boolean },
+ setActiveChatHeadUrl: {attribute: false}
}
}
@@ -116,8 +117,6 @@ class ChatHead extends LitElement {
}
-
-
return html`
this.getUrl(this.chatInfo.url)} class="clearfix ${this.activeChatHeadUrl === this.chatInfo.url ? 'active' : ''}">
${this.isImageLoaded ? html`${avatarImg}` : html`` }
@@ -150,8 +149,19 @@ class ChatHead extends LitElement {
parentEpml.imReady()
}
+ shouldUpdate(changedProperties) {
+ if(changedProperties.has('activeChatHeadUrl')){
+ return true
+ }
+ if(changedProperties.has('chatInfo')){
+ return true
+ }
+
+ return false
+ }
+
getUrl(chatUrl) {
- this.onPageNavigation(`/app/q-chat/${chatUrl}`)
+ this.setActiveChatHeadUrl(chatUrl)
}
onPageNavigation(pageUrl) {
diff --git a/qortal-ui-plugins/plugins/core/components/ChatPage.js b/qortal-ui-plugins/plugins/core/components/ChatPage.js
index ad197b91..07b6c9ea 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatPage.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatPage.js
@@ -67,7 +67,8 @@ class ChatPage extends LitElement {
userLanguage: { type: String },
lastMessageRefVisible: { type: Boolean },
isLoadingOldMessages: {type: Boolean},
- isEditMessageOpen: { type: Boolean }
+ isEditMessageOpen: { type: Boolean },
+ webSocket: {attribute: false}
}
}
@@ -746,13 +747,11 @@ class ChatPage extends LitElement {
this.initChatEditor();
}
- async firstUpdated() {
- window.addEventListener('storage', () => {
- const checkLanguage = localStorage.getItem('qortalLanguage');
- use(checkLanguage);
- this.userLanguage = checkLanguage;
- })
-
+ async initUpdate(){
+ if(this.webSocket){
+ this.webSocket.close()
+ this.webSocket= ''
+ }
const getAddressPublicKey = () => {
parentEpml.request('apiCall', {
@@ -794,6 +793,16 @@ class ChatPage extends LitElement {
// this.initChatEditor();
}, 100)
+
+ }
+
+ async firstUpdated() {
+ window.addEventListener('storage', () => {
+ const checkLanguage = localStorage.getItem('qortalLanguage');
+ use(checkLanguage);
+ this.userLanguage = checkLanguage;
+ })
+
parentEpml.ready().then(() => {
parentEpml.subscribe('selected_address', async selectedAddress => {
this.selectedAddress = {}
@@ -817,10 +826,11 @@ class ChatPage extends LitElement {
})
})
parentEpml.imReady();
+
+ await this.initUpdate()
}
async updated(changedProperties) {
-
if (changedProperties && changedProperties.has('userLanguage')) {
const userLang = changedProperties.get('userLanguage')
@@ -830,6 +840,10 @@ class ChatPage extends LitElement {
}
}
+ if (changedProperties && changedProperties.has('chatId') && changedProperties.get('chatId')) {
+ await this.initUpdate()
+ }
+
}
async renderPlaceholder() {
@@ -862,6 +876,7 @@ class ChatPage extends LitElement {
renderChatScroller() {
return html`
{
+ this.webSocket.onopen = () => {
setTimeout(pingDirectSocket, 50)
}
// Message Event
- directSocket.onmessage = async (e) => {
+ this.webSocket.onmessage = async (e) => {
if (initial === 0) {
const isReceipient = this.chatId.includes('direct')
-
- const chatReference1 = isReceipient ? 'direct' : 'group';
- const chatReference2 = this.chatId.split('/')[1];
+ // commented out code= localstorage persistance
+ // const chatReference1 = isReceipient ? 'direct' : 'group';
+ // const chatReference2 = this.chatId.split('/')[1];
// const cachedData = await messagesCache.getItem(`${chatReference1}-${chatReference2}`);
const cachedData = null
let getInitialMessages = []
@@ -1199,17 +1214,17 @@ class ChatPage extends LitElement {
}
// Closed Event
- directSocket.onclose = () => {
+ this.webSocket.onclose = () => {
clearTimeout(directSocketTimeout)
}
// Error Event
- directSocket.onerror = (e) => {
+ this.webSocket.onerror = (e) => {
clearTimeout(directSocketTimeout)
}
const pingDirectSocket = () => {
- directSocket.send('ping')
+ this.webSocket.send('ping')
directSocketTimeout = setTimeout(pingDirectSocket, 295000)
}
@@ -1237,16 +1252,16 @@ class ChatPage extends LitElement {
groupSocketLink = `ws://${nodeUrl}/websockets/chat/messages?txGroupId=${groupId}`;
}
- const groupSocket = new WebSocket(groupSocketLink);
+ this.webSocket = new WebSocket(groupSocketLink);
// Open Connection
- groupSocket.onopen = () => {
+ this.webSocket.onopen = () => {
setTimeout(pingGroupSocket, 50)
}
// Message Event
- groupSocket.onmessage = async (e) => {
+ this.webSocket.onmessage = async (e) => {
if (initial === 0) {
const isGroup = this.chatId.includes('group')
@@ -1288,17 +1303,17 @@ class ChatPage extends LitElement {
}
// Closed Event
- groupSocket.onclose = () => {
+ this.webSocket.onclose = () => {
clearTimeout(groupSocketTimeout)
}
// Error Event
- groupSocket.onerror = (e) => {
+ this.webSocket.onerror = (e) => {
clearTimeout(groupSocketTimeout)
}
const pingGroupSocket = () => {
- groupSocket.send('ping')
+ this.webSocket.send('ping')
groupSocketTimeout = setTimeout(pingGroupSocket, 295000)
}
diff --git a/qortal-ui-plugins/plugins/core/components/ChatScroller.js b/qortal-ui-plugins/plugins/core/components/ChatScroller.js
index 05ad663b..2893b3a5 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatScroller.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatScroller.js
@@ -33,7 +33,8 @@ class ChatScroller extends LitElement {
showLastMessageRefScroller: { type: Function },
emojiPicker: { attribute: false },
isLoadingMessages: { type: Boolean},
- setIsLoadingMessages: {attribute: false}
+ setIsLoadingMessages: {attribute: false},
+ chatId: { type: String }
}
}
@@ -112,6 +113,9 @@ class ChatScroller extends LitElement {
if(changedProperties.has('isLoadingMessages')){
return true
}
+ if(changedProperties.has('chatId') && changedProperties.get('chatId')){
+ return true
+ }
// Only update element if prop1 changed.
return changedProperties.has('messages');
}
diff --git a/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js b/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
index 5de97d52..d05083d3 100644
--- a/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
+++ b/qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
@@ -34,7 +34,8 @@ class Chat extends LitElement {
balance: { type: Number },
theme: { type: String, reflect: true },
blockedUsers: { type: Array },
- blockedUserList: { type: Array }
+ blockedUserList: { type: Array },
+ activeChatHeadUrl: {type: String}
}
}
@@ -324,6 +325,15 @@ class Chat extends LitElement {
this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light'
this.blockedUsers = []
this.blockedUserList = []
+ this.activeChatHeadUrl = ''
+
+
+ }
+
+ async setActiveChatHeadUrl(url){
+ this.activeChatHeadUrl = ''
+ await this.updateComplete;
+ this.activeChatHeadUrl = url
}
render() {
@@ -349,7 +359,8 @@ class Chat extends LitElement {
${translate("chatpage.cchange5")} keyboard_arrow_down
- ${window.parent.location.pathname !== "/app/q-chat" ? html`${this.renderChatPage(this.chatId)}` : html`${this.renderChatWelcomePage()}`}
+
+ ${window.parent.location.pathname !== "/app/q-chat" || this.activeChatHeadUrl ? html`${this.renderChatPage(this.chatId)}` : html`${this.renderChatWelcomePage()}`}
@@ -416,21 +427,15 @@ class Chat extends LitElement {
}
firstUpdated() {
-
this.changeLanguage()
this.changeTheme()
this.getChatBlockedList()
this.getLocalBlockedList()
- setInterval(() => {
- this.blockedUserList = JSON.parse(localStorage.getItem("ChatBlockedAddresses") || "[]")
- }, 1000)
-
const getBlockedUsers = async () => {
let blockedUsers = await parentEpml.request('apiCall', {
url: `/lists/blockedAddresses?apiKey=${this.getApiKey()}`
})
-
this.blockedUsers = blockedUsers
setTimeout(getBlockedUsers, 60000)
}
@@ -455,7 +460,7 @@ class Chat extends LitElement {
const runFunctionsAfterPageLoad = () => {
// Functions to exec after render while waiting for page info...
- getDataFromURL()
+ // getDataFromURL()
try {
let key = `${window.parent.reduxStore.getState().app.selectedAddress.address.substr(0, 10)}_chat-heads`
@@ -572,6 +577,8 @@ class Chat extends LitElement {
hidelist.push(item)
})
localStorage.setItem("MessageBlockedAddresses", JSON.stringify(hidelist))
+
+ this.blockedUserList = hidelist
})
}
@@ -604,6 +611,7 @@ class Chat extends LitElement {
obj.push(noName)
}
localStorage.setItem("ChatBlockedAddresses", JSON.stringify(obj))
+ this.blockedUserList = JSON.parse(localStorage.getItem("ChatBlockedAddresses") || "[]")
})
})
})
@@ -681,20 +689,20 @@ class Chat extends LitElement {
let tempUrl = document.location.href
let splitedUrl = decodeURI(tempUrl).split('?')
- let activeChatHeadUrl = splitedUrl[1] === undefined ? '' : splitedUrl[1]
+ // let activeChatHeadUrl = splitedUrl[1] === undefined ? '' : splitedUrl[1]
return chatHeadArr.map(eachChatHead => {
- return html``
+ return html` this.setActiveChatHeadUrl(val)} chatInfo=${JSON.stringify(eachChatHead)}>`
})
}
renderChatPage(chatId) {
+
// Check for the chat ID from and render chat messages
// Else render Welcome to Q-CHat
// TODO: DONE: Do the above in the ChatPage
-
- return html``
+ return html``
}
setChatHeads(chatObj) {