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

Fixed chat modal bug & edit mesage bug

Browse Source
This commit is contained in:
Justin Ferrari 2022-12-03 19:31:30 -05:00
parent 17a18acc10
commit 8988bdb6fa
3 changed files with 30 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -655,7 +655,7 @@ class ChatPage extends LitElement {
`: ''} `: ''}
<wrapper-modal <wrapper-modal
.removeImage=${() => this.removeImage()} .removeImage=${() => this.removeImage()}
style=${this.imageFile ? "display: block" : "display: none"}> style=${(this.imageFile && !this.isUploadingImage) ? "display: block" : "display: none"}>
<div> <div>
<div class="dialog-container"> <div class="dialog-container">
${this.imageFile && html` ${this.imageFile && html`
@ -673,7 +673,7 @@ class ChatPage extends LitElement {
.insertImage=${this.insertImage} .insertImage=${this.insertImage}
.editedMessageObj=${this.editedMessageObj} .editedMessageObj=${this.editedMessageObj}
?isLoading=${this.isLoading} ?isLoading=${this.isLoading}
?isLoadingMessages=${this.isLoadingMessages}></chat-text-editor> ?isLoadingMessages=${this.isLoadingMessages}>
</chat-text-editor> </chat-text-editor>
</div> </div>
<div class="modal-button-row"> <div class="modal-button-row">
@ -813,8 +813,11 @@ class ChatPage extends LitElement {
await new Promise(r => setTimeout(r, 100)); await new Promise(r => setTimeout(r, 100));
this.chatEditorPlaceholder = this.isReceipient === true ? `Message ${this._chatId}` : `${get("chatpage.cchange8")}`; this.chatEditorPlaceholder = this.isReceipient === true ? `Message ${this._chatId}` : `${get("chatpage.cchange8")}`;
} }
if (changedProperties && changedProperties.has('isEditMessageOpen')) { // if (changedProperties && changedProperties.has('isEditMessageOpen')) {
console.log(this.isEditMessageOpen, "1111"); // console.log(this.isEditMessageOpen, "1111");
// }
if (changedProperties && changedProperties.has('imageFile')) {
console.log(this.imageFile, "1111");
} }
} }
@ -1466,11 +1469,11 @@ class ChatPage extends LitElement {
if (fileSize > 500000) { if (fileSize > 500000) {
parentEpml.request('showSnackBar', get("chatpage.cchange26")); parentEpml.request('showSnackBar', get("chatpage.cchange26"));
this.isLoading = false; this.isLoading = false;
this.isUploadingImage = false;
this.chatEditor.enable(); this.chatEditor.enable();
this.chatEditorNewChat.enable() this.chatEditorNewChat.enable();
return; return;
} }
try { try {
await publishData({ await publishData({
registeredName: userName, registeredName: userName,
@ -1482,15 +1485,16 @@ class ChatPage extends LitElement {
uploadType: 'file', uploadType: 'file',
selectedAddress: this.selectedAddress, selectedAddress: this.selectedAddress,
worker: new WebWorkerImage() worker: new WebWorkerImage()
}) });
this.isUploadingImage = false;
this.isUploadingImage = false this.imageFile = null;
} catch (error) { } catch (error) {
console.error(error) console.error(error)
this.isLoading = false; this.isLoading = false;
this.isUploadingImage = false;
this.chatEditor.enable(); this.chatEditor.enable();
this.chatEditorNewChat.enable() this.chatEditorNewChat.enable();
return return;
} }
const messageTextWithImage = this.chatEditorNewChat.mirror.value; const messageTextWithImage = this.chatEditorNewChat.mirror.value;
// Format and Sanitize Message // Format and Sanitize Message
@ -1506,7 +1510,7 @@ class ChatPage extends LitElement {
isImageDeleted: false, isImageDeleted: false,
repliedTo: '', repliedTo: '',
version: 1 version: 1
} };
const stringifyMessageObject = JSON.stringify(messageObject); const stringifyMessageObject = JSON.stringify(messageObject);
this.sendMessage(stringifyMessageObject, typeMessage); this.sendMessage(stringifyMessageObject, typeMessage);
} else if (outSideMsg && outSideMsg.type === 'reaction') { } else if (outSideMsg && outSideMsg.type === 'reaction') {

26
qortal-ui-plugins/plugins/core/components/ChatTextEditor.js
View File

@ -161,12 +161,9 @@ class ChatTextEditor extends LitElement {
} }
render() { render() {
console.log(this.isEditMessageOpen, "here5000");
let scrollHeightBool = false; let scrollHeightBool = false;
try { try {
if (this.chatMessageInput && this.chatMessageInput.contentDocument.body.scrollHeight > 60 if (this.chatMessageInput && this.chatMessageInput.contentDocument.body.scrollHeight > 60 && this.shadowRoot.querySelector(".chat-editor").contentDocument.body.querySelector("#chatbarId").innerHTML.trim() !== "") {
// && this.shadowRoot.querySelector(".chat-editor").contentDocument.body.querySelector("#chatbarId").innerHTML.trim() !== ""
) {
scrollHeightBool = true; scrollHeightBool = true;
} }
} catch (error) { } catch (error) {
@ -330,19 +327,18 @@ class ChatTextEditor extends LitElement {
async updated(changedProperties) { async updated(changedProperties) {
console.log({changedProperties}); console.log({changedProperties});
if (changedProperties && changedProperties.has('editedMessageObj')) { if (changedProperties && changedProperties.has('editedMessageObj')) {
if (this.editedMessageObj) {
this.chatEditor.insertText(this.editedMessageObj.message); this.chatEditor.insertText(this.editedMessageObj.message);
this.getMessageSize(this.editedMessageObj.message); this.getMessageSize(this.editedMessageObj.message);
} else {
this.chatEditor.insertText("");
this.chatMessageSize = 0;
}
} }
if (changedProperties && changedProperties.has('placeholder')) { if (changedProperties && changedProperties.has('placeholder')) {
const captionEditor = this.shadowRoot.getElementById(this.iframeId).contentWindow.document.getElementById('chatbarId'); const captionEditor = this.shadowRoot.getElementById(this.iframeId).contentWindow.document.getElementById('chatbarId');
captionEditor.setAttribute('data-placeholder', this.placeholder); captionEditor.setAttribute('data-placeholder', this.placeholder);
} }
if (changedProperties && changedProperties.has("isEditMessageOpen")) {
if (this.iframeId === "newChat") {
console.log(this.isEditMessageOpen, 'isEditMessageOpen');
this.getMessageSize("");
}
}
if (changedProperties && changedProperties.has("chatMessageSize")) { if (changedProperties && changedProperties.has("chatMessageSize")) {
console.log(this.chatMessageSize, "chat message size"); console.log(this.chatMessageSize, "chat message size");
} }
@ -355,11 +351,11 @@ class ChatTextEditor extends LitElement {
} }
} }
// shouldUpdate(changedProperties) { shouldUpdate(changedProperties) {
// // Only update element if prop1 changed. // Only update element if prop1 changed.
// if(changedProperties.has('setChatEditor') && changedProperties.size === 1) return false if(changedProperties.has('setChatEditor') && changedProperties.size === 1) return false
// return true return true
// } }
sendMessageFunc(props) { sendMessageFunc(props) {
if (this.chatMessageSize > 1000 ) { if (this.chatMessageSize > 1000 ) {

2
qortal-ui-plugins/plugins/core/components/WrapperModal-css.js
View File

@ -24,7 +24,7 @@ export const wrapperModalStyles = css`
background-color: var(--white); background-color: var(--white);
left: 50%; left: 50%;
top: 0px; top: 0px;
transform: translate(-50%, 40%); transform: translate(-50%, 10%);
border-radius: 12px; border-radius: 12px;
overflow-y: auto; overflow-y: auto;
animation: 1s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal forwards running modal_transition; animation: 1s cubic-bezier(0.22, 1, 0.36, 1) 0s 1 normal forwards running modal_transition;