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

Started bug fixing

Browse Source
This commit is contained in:
Justin Ferrari 2022-11-17 20:09:09 -05:00
parent 62302f5efb
commit 0328aa2d11
2 changed files with 37 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -59,11 +59,11 @@ class ChatPage extends LitElement {
editedMessageObj: { type: Object }, editedMessageObj: { type: Object },
iframeHeight: { type: Number }, iframeHeight: { type: Number },
chatMessageSize: { type: Number}, chatMessageSize: { type: Number},
imageFile: {type: Object}, imageFile: { type: Object },
isUploadingImage: {type: Boolean}, isUploadingImage: { type: Boolean },
caption: { type: String }, caption: { type: String },
chatEditor: {type: Object}, chatEditor: { type: Object },
chatEditorNewChat: {type: Object} chatEditorNewChat: { type: Object }
} }
} }
@ -144,7 +144,6 @@ class ChatPage extends LitElement {
width: 92%; width: 92%;
} }
.senderName { .senderName {
margin: 0; margin: 0;
color: var(--mdc-theme-primary); color: var(--mdc-theme-primary);
@ -234,8 +233,8 @@ class ChatPage extends LitElement {
overflow: hidden; overflow: hidden;
justify-content: center; justify-content: center;
background: white; background: white;
padding: 5px; padding: 5px;
border-radius: 1px; border-radius: 1px;
} }
.chatbar-caption { .chatbar-caption {
@ -435,7 +434,6 @@ class ChatPage extends LitElement {
.dialog-container { .dialog-container {
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
padding: 0 10px; padding: 0 10px;
gap: 10px; gap: 10px;
@ -523,29 +521,21 @@ class ChatPage extends LitElement {
${this.imageFile && html` ${this.imageFile && html`
<img src=${URL.createObjectURL(this.imageFile)} alt="dialog-img" class="dialog-image" /> <img src=${URL.createObjectURL(this.imageFile)} alt="dialog-img" class="dialog-image" />
`} `}
<!-- Replace by reusable chatbar component --> <div class="caption-container">
<div class="caption-container">
<chat-text-editor <chat-text-editor
iframeId="newChat" iframeId="newChat"
?hasGlobalEvents=${false} ?hasGlobalEvents=${false}
placeholder=${this.chatEditorPlaceholder} placeholder=${this.chatEditorPlaceholder}
._sendMessage=${this._sendMessage} ._sendMessage=${this._sendMessage}
.setChatEditor=${(editor)=> this.setChatEditorNewChat(editor)} .setChatEditor=${(editor)=> this.setChatEditorNewChat(editor)}
.chatEditor=${this.chatEditorNewChat} .chatEditor=${this.chatEditorNewChat}
.imageFile=${this.imageFile} .imageFile=${this.imageFile}
.insertImage=${this.insertImage} .insertImage=${this.insertImage}
.editedMessageObj=${this.editedMessageObj}
.editedMessageObj=${this.editedMessageObj} ?isLoading=${this.isLoading}
?isLoadingMessages=${this.isLoadingMessages}>
?isLoading=${this.isLoading} </chat-text-editor>
?isLoadingMessages=${this.isLoadingMessages} </div>
></chat-text-editor>
<!-- <iframe
}}" id="newChat" class="chat-editor" tabindex="-1" height=${this.iframeHeight}>
</iframe> -->
</div>
${this.chatMessageSize >= 750 ? ${this.chatMessageSize >= 750 ?
html` html`
<div class="message-size-container"> <div class="message-size-container">
@ -617,22 +607,21 @@ class ChatPage extends LitElement {
</div> </div>
`} `}
<div class="chatbar" style="${this.chatMessageSize >= 750 && 'padding-bottom: 7px'}"> <div class="chatbar" style="${this.chatMessageSize >= 750 && 'padding-bottom: 7px'}">
<chat-text-editor <chat-text-editor
?hasGlobalEvents=${true} ?hasGlobalEvents=${true}
iframeId="_chatEditorDOM" iframeId="_chatEditorDOM"
placeholder=${this.chatEditorPlaceholder} placeholder=${this.chatEditorPlaceholder}
._sendMessage=${this._sendMessage} ._sendMessage=${this._sendMessage}
.setChatEditor=${(editor)=> this.setChatEditor(editor)} .setChatEditor=${(editor)=> this.setChatEditor(editor)}
.chatEditor=${this.chatEditor} .chatEditor=${this.chatEditor}
.imageFile=${this.imageFile} .imageFile=${this.imageFile}
.insertImage=${this.insertImage} .insertImage=${this.insertImage}
.chatMessageInput=${this.chatMessageInput} .chatMessageInput=${this.chatMessageInput}
.editedMessageObj=${this.editedMessageObj} .editedMessageObj=${this.editedMessageObj}
.mirrorChatInput=${this.mirrorChatInput} .mirrorChatInput=${this.mirrorChatInput}
?isLoading=${this.isLoading} ?isLoading=${this.isLoading}
?isLoadingMessages=${this.isLoadingMessages} ?isLoadingMessages=${this.isLoadingMessages}>
></chat-text-editor> </chat-text-editor>
</div> </div>
</div> </div>
</div> </div>

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

@ -125,12 +125,10 @@ class ChatScroller extends LitElement {
this.upObserverElement = this.shadowRoot.getElementById('upObserver'); this.upObserverElement = this.shadowRoot.getElementById('upObserver');
this.downObserverElement = this.shadowRoot.getElementById('downObserver'); this.downObserverElement = this.shadowRoot.getElementById('downObserver');
// Intialize Observers // Intialize Observers
this.upElementObserver() this.upElementObserver();
this.downElementObserver() this.downElementObserver();
await this.updateComplete await this.updateComplete;
this.viewElement.scrollTop = this.viewElement.scrollHeight + 50 this.viewElement.scrollTop = this.viewElement.scrollHeight + 50;
} }
_getOldMessage(_scrollElement) { _getOldMessage(_scrollElement) {