From 0dc1f5ec79940cc4c6e76b49cabffd79e28e38a8 Mon Sep 17 00:00:00 2001 From: Justin Ferrari <‘justinwesleyferrari@gmail.com’> Date: Fri, 16 Dec 2022 11:41:51 -0500 Subject: [PATCH] Fixed private message bugs --- .../plugins/core/components/ChatPage.js | 8 +- .../plugins/core/components/ChatTextEditor.js | 18 +- .../plugins/core/components/WrapperModal.js | 5 +- .../core/messaging/q-chat/q-chat.src.js | 207 ++++++++++++------ 4 files changed, 153 insertions(+), 85 deletions(-) diff --git a/qortal-ui-plugins/plugins/core/components/ChatPage.js b/qortal-ui-plugins/plugins/core/components/ChatPage.js index 48edbb1f..8cdf5510 100644 --- a/qortal-ui-plugins/plugins/core/components/ChatPage.js +++ b/qortal-ui-plugins/plugins/core/components/ChatPage.js @@ -673,9 +673,9 @@ class ChatPage extends LitElement { `: ''} { - this.chatEditorNewChat.resetValue() - this.removeImage() + .onClickFunc=${() => { + this.chatEditorNewChat.resetValue(); + this.removeImage(); } } style=${(this.imageFile && !this.isUploadingImage) ? "display: block" : "display: none"}>
@@ -724,7 +724,7 @@ class ChatPage extends LitElement {
{ + .onClickFunc=${() => { this.openForwardOpen = false this.forwardActiveChatHeadUrl = "" } } diff --git a/qortal-ui-plugins/plugins/core/components/ChatTextEditor.js b/qortal-ui-plugins/plugins/core/components/ChatTextEditor.js index 76b9d39d..7db0986c 100644 --- a/qortal-ui-plugins/plugins/core/components/ChatTextEditor.js +++ b/qortal-ui-plugins/plugins/core/components/ChatTextEditor.js @@ -174,9 +174,12 @@ class ChatTextEditor extends LitElement {
-
{ - this.preventUserSendingImage(e) - }}> +
{ + this.preventUserSendingImage(e) + }}> this.emojiPicker.togglePicker(this.emojiPickerHandler)); + this.emojiPickerHandler.addEventListener('click', () => { + console.log("yo what's up?") + this.emojiPicker.togglePicker(this.emojiPickerHandler) + }); await this.updateComplete; this.initChatEditor(); @@ -366,6 +372,7 @@ class ChatTextEditor extends LitElement { return; }; this.chatMessageSize = 0; + this.chatEditor.updateMirror(); this._sendMessage(); } @@ -693,11 +700,10 @@ class ChatTextEditor extends LitElement { }, 0); res(); }) + // Handle Enter if (e.keyCode === 13 && !e.shiftKey) { - // Update Mirror - editor.updateMirror(); if (editor.state() === 'false') return false; if (editorConfig.iframeId === 'newChat') { diff --git a/qortal-ui-plugins/plugins/core/components/WrapperModal.js b/qortal-ui-plugins/plugins/core/components/WrapperModal.js index 23b6c040..96b22142 100644 --- a/qortal-ui-plugins/plugins/core/components/WrapperModal.js +++ b/qortal-ui-plugins/plugins/core/components/WrapperModal.js @@ -5,7 +5,8 @@ import { wrapperModalStyles } from './WrapperModal-css.js' export class WrapperModal extends LitElement { static get properties() { return { - removeImage: { type: Function }, + onClickFunc: { attribute: false }, + closePrivateMessage: { attribute: false }, } } @@ -15,7 +16,7 @@ export class WrapperModal extends LitElement { return html`
{ - this.removeImage() + this.onClickFunc(); }}>
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 8a5228b9..b980f2ff 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 @@ -1,23 +1,24 @@ -import { LitElement, html, css } from 'lit' -import { render } from 'lit/html.js' -import { Epml } from '../../../../epml.js' -import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate' -import WebWorker from 'web-worker:../../components/computePowWorker.js'; +import { LitElement, html, css } from 'lit'; +import { render } from 'lit/html.js'; +import { Epml } from '../../../../epml.js'; +import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'; +import WebWorker from 'web-worker:./computePowWorker.js'; registerTranslateConfig({ loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) }) -import '../../components/ChatWelcomePage.js' -import '../../components/ChatHead.js' -import '../../components/ChatPage.js' -import snackbar from '../../components/snackbar.js' -import '@polymer/paper-spinner/paper-spinner-lite.js' -import '@material/mwc-button' -import '@material/mwc-dialog' -import '@material/mwc-icon' -import '@material/mwc-snackbar' -import '@vaadin/grid' +import '../../components/ChatWelcomePage.js'; +import '../../components/ChatHead.js'; +import '../../components/ChatPage.js'; +import '../../components/WrapperModal.js'; +import snackbar from '../../components/snackbar.js'; +import '@polymer/paper-spinner/paper-spinner-lite.js'; +import '@material/mwc-button'; +import '@material/mwc-dialog'; +import '@material/mwc-icon'; +import '@material/mwc-snackbar'; +import '@vaadin/grid'; const parentEpml = new Epml({ type: 'WINDOW', source: window.parent }) @@ -39,7 +40,8 @@ class Chat extends LitElement { privateMessagePlaceholder: { type: String}, chatEditor: { type: Object }, imageFile: { type: Object }, - activeChatHeadUrl: {type: String} + activeChatHeadUrl: {type: String}, + openPrivateMessage: { type: Boolean } } } @@ -303,6 +305,54 @@ class Chat extends LitElement { resize: none; background: #eee; } + + .dialog-container { + position: relative; + display: flex; + align-items: center; + flex-direction: column; + padding: 0 10px; + gap: 10px; + height: 100%; + } + .modal-button-row { + display: flex; + align-items: center; + justify-content: space-between; + width: 100%; + } + + .modal-button { + font-family: Roboto, sans-serif; + font-size: 16px; + color: var(--mdc-theme-primary); + background-color: transparent; + padding: 8px 10px; + border-radius: 5px; + border: none; + transition: all 0.3s ease-in-out; + } + + .modal-button-red { + font-family: Roboto, sans-serif; + font-size: 16px; + color: #F44336; + background-color: transparent; + padding: 8px 10px; + border-radius: 5px; + border: none; + transition: all 0.3s ease-in-out; + } + + .modal-button-red:hover { + cursor: pointer; + background-color: #f4433663; + } + + .modal-button:hover { + cursor: pointer; + background-color: #03a8f475; + } ` } @@ -334,6 +384,7 @@ class Chat extends LitElement { this.privateMessagePlaceholder = "" this.imageFile = null this.activeChatHeadUrl = '' + this.openPrivateMessage = false } async setActiveChatHeadUrl(url) { @@ -347,7 +398,10 @@ class Chat extends LitElement {
-
this.shadowRoot.querySelector('#startChatDialog').show()}>${translate("chatpage.cchange1")}
+
{ + this.openPrivateMessage = true; + }}>${translate("chatpage.cchange1")} +
    ${this.isEmptyArray(this.chatHeads) ? this.renderLoadingText() : this.renderChatHead(this.chatHeads)} @@ -371,51 +425,65 @@ class Chat extends LitElement {
- -
-

${translate("chatpage.cchange1")}

-
-
- -

${translate("chatpage.cchange6")}

- - - - this.setChatEditor(editor)} - .chatEditor=${this.chatEditor} - .imageFile=${this.imageFile}. - ._sendMessage=${this._sendMessage} - .insertImage=${this.insertImage} - ?isLoading=${this.isLoading}> - - - - ${this.isLoading === false ? this.renderSendText() : html``} - - - ${translate("general.close")} - - + { + this.chatEditor.resetValue(); + this.openPrivateMessage = false; + } } + style=${this.openPrivateMessage ? "display: block" : "display: none"}> +
+
+
+

${translate("chatpage.cchange1")}

+
+
+

${translate("chatpage.cchange6")}

+ + this.setChatEditor(editor)} + .chatEditor=${this.chatEditor} + .imageFile=${this.imageFile} + ._sendMessage=${this._sendMessage} + .insertImage=${this.insertImage} + ?isLoading=${this.isLoading} + .isLoadingMessages=${false} + id="messageBox" + > + +
+ + +
+
+
+ @@ -574,14 +642,12 @@ class Chat extends LitElement { } async _sendMessage() { - console.log("here1"); this.isLoading = true; this.chatEditor.disable(); const messageText = this.chatEditor.mirror.value; // Format and Sanitize Message const sanitizedMessage = messageText.replace(/ /gi, ' ').replace(//gi, '\n'); const trimmedMessage = sanitizedMessage.trim(); - if (/^\s*$/.test(trimmedMessage)) { this.isLoading = false; this.chatEditor.enable(); @@ -595,11 +661,9 @@ class Chat extends LitElement { const stringifyMessageObject = JSON.stringify(messageObject) this.sendMessage(stringifyMessageObject); } - console.log("here2"); } async sendMessage(messageText) { - console.log("here3"); this.isLoading = true; const _recipient = this.shadowRoot.getElementById('sendTo').value; @@ -644,6 +708,7 @@ class Chat extends LitElement { _publicKey = false; let err4string = get("chatpage.cchange19"); parentEpml.request('showSnackBar', `${err4string}`); + this.chatEditor.enable(); this.isLoading = false; } else if (addressPublicKey !== false) { isEncrypted = 1; @@ -674,7 +739,6 @@ class Chat extends LitElement { isText: 1 } }); - console.log({chatResponse}); _computePow(chatResponse); }; @@ -682,17 +746,11 @@ class Chat extends LitElement { const _computePow = async (chatBytes) => { const difficulty = this.balance === 0 ? 12 : 8; const path = window.parent.location.origin + '/memory-pow/memory-pow.wasm.full'; - console.log("here4"); const worker = new WebWorker(); - console.log("here5"); let nonce = null; let chatBytesArray = null; await new Promise((res, rej) => { - console.log(chatBytes, "chatBytes"); - console.log(path, "path"); - console.log(difficulty, "difficulty"); worker.postMessage({chatBytes, path, difficulty}); - worker.onmessage = e => { worker.terminate(); chatBytesArray = e.data.chatBytesArray; @@ -712,6 +770,9 @@ class Chat extends LitElement { const getSendChatResponse = (response) => { if (response === true) { + this.setActiveChatHeadUrl(`direct/${recipient}`); + this.shadowRoot.getElementById('sendTo').value = ""; + this.openPrivateMessage = false; this.chatEditor.resetValue(); } else if (response.error) { parentEpml.request('showSnackBar', response.message);