forked from Qortal/qortal-ui
Made Tip User Reusable
This commit is contained in:
parent
09950cde54
commit
238ee3f3f1
@ -587,7 +587,8 @@
|
||||
"bcchange14": "Forward",
|
||||
"bcchange15": "Message Forwarded",
|
||||
"bcchange16": "Choose Recipient or Search for One Below",
|
||||
"bcchange17": "FORWARDED"
|
||||
"bcchange17": "FORWARDED",
|
||||
"bcchange18": "Tip User"
|
||||
},
|
||||
"grouppage": {
|
||||
"gchange1": "Qortal Groups",
|
||||
|
@ -1462,12 +1462,10 @@ class ChatPage extends LitElement {
|
||||
async updated(changedProperties) {
|
||||
if (changedProperties && changedProperties.has('userLanguage')) {
|
||||
const userLang = changedProperties.get('userLanguage')
|
||||
|
||||
if(userLang){
|
||||
if (userLang) {
|
||||
await new Promise(r => setTimeout(r, 100));
|
||||
this.chatEditorPlaceholder = this.isReceipient === true ? `Message ${this._chatId}` : `${get("chatpage.cchange8")}`;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
if (changedProperties && changedProperties.has('chatId') && changedProperties.get('chatId')) {
|
||||
@ -1479,7 +1477,6 @@ class ChatPage extends LitElement {
|
||||
this.chatEditor.disable();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
async getName (recipient) {
|
||||
@ -1533,6 +1530,7 @@ async getName (recipient) {
|
||||
chatId=${this.chatId}
|
||||
.messages=${this.messagesRendered}
|
||||
.escapeHTML=${escape}
|
||||
.chatEditor=${this.chatEditor}
|
||||
.getOldMessage=${this.getOldMessage}
|
||||
.setRepliedToMessageObj=${(val) => this.setRepliedToMessageObj(val)}
|
||||
.setEditedMessageObj=${(val) => this.setEditedMessageObj(val)}
|
||||
|
@ -410,7 +410,7 @@ class ChatRightPanel extends LitElement {
|
||||
}}
|
||||
style=${this.openTipUser ? "display: block" : "display: none"}>
|
||||
<tip-user
|
||||
.openUserInfo=${this.openUserInfo}
|
||||
.closeTipUser=${this.openUserInfo}
|
||||
.chatEditor=${this.chatEditor}
|
||||
.userName=${this.userName}
|
||||
.setOpenTipUser=${(val) => this.setOpenTipUser(val)}
|
||||
|
@ -8,6 +8,8 @@ import { Epml } from "../../../epml";
|
||||
import './LevelFounder.js';
|
||||
import './NameMenu.js';
|
||||
import './ChatModals.js';
|
||||
import './WrapperModal';
|
||||
import './TipUser'
|
||||
import '@vaadin/icons';
|
||||
import '@vaadin/icon';
|
||||
import '@material/mwc-button';
|
||||
@ -36,8 +38,11 @@ class ChatScroller extends LitElement {
|
||||
isLoadingMessages: { type: Boolean},
|
||||
setIsLoadingMessages: {attribute: false},
|
||||
chatId: { type: String },
|
||||
chatEditor: { type: Object },
|
||||
setForwardProperties: { attribute: false },
|
||||
setOpenPrivateMessage: { attribute: false },
|
||||
openTipUser: { type: Boolean },
|
||||
userName: { type: String }
|
||||
}
|
||||
}
|
||||
|
||||
@ -48,12 +53,17 @@ class ChatScroller extends LitElement {
|
||||
this.messages = []
|
||||
this._upObserverhandler = this._upObserverhandler.bind(this)
|
||||
this._downObserverHandler = this._downObserverHandler.bind(this)
|
||||
this.setOpenTipUser = this.setOpenTipUser.bind(this)
|
||||
this.setUserName = this.setUserName.bind(this)
|
||||
this.myAddress = window.parent.reduxStore.getState().app.selectedAddress.address
|
||||
this.hideMessages = JSON.parse(localStorage.getItem("MessageBlockedAddresses") || "[]")
|
||||
this.openTipUser = false;
|
||||
this.userName = "";
|
||||
}
|
||||
|
||||
|
||||
render() {
|
||||
console.log(6, "chat scroller here");
|
||||
console.log(this.openTipUser, "openTipUser here");
|
||||
let formattedMessages = this.messages.reduce((messageArray, message, index) => {
|
||||
const lastGroupedMessage = messageArray[messageArray.length - 1];
|
||||
let timestamp;
|
||||
@ -117,12 +127,27 @@ class ChatScroller extends LitElement {
|
||||
.setToggledMessage=${this.setToggledMessage}
|
||||
.setForwardProperties=${this.setForwardProperties}
|
||||
.setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}
|
||||
>
|
||||
.setOpenTipUser=${(val) => this.setOpenTipUser(val)}
|
||||
.setUserName=${(val) => this.setUserName(val)}>
|
||||
</message-template>`
|
||||
)
|
||||
})}
|
||||
<div id='downObserver'></div>
|
||||
</ul>
|
||||
<wrapper-modal
|
||||
.onClickFunc=${() => {
|
||||
this.openTipUser = false;
|
||||
this.chatEditor.enable();
|
||||
}}
|
||||
style=${this.openTipUser ? "display: block;" : "display: none;"}>
|
||||
<tip-user
|
||||
.closeTipUser=${!this.openTipUser}
|
||||
.chatEditor=${this.chatEditor}
|
||||
.focusChatEditor=${this.focusChatEditor}
|
||||
.userName=${this.userName}
|
||||
.setOpenTipUser=${(val) => this.setOpenTipUser(val)}>
|
||||
</tip-user>
|
||||
</wrapper-modal>
|
||||
`
|
||||
}
|
||||
|
||||
@ -133,6 +158,9 @@ class ChatScroller extends LitElement {
|
||||
if(changedProperties.has('chatId') && changedProperties.get('chatId')){
|
||||
return true
|
||||
}
|
||||
if(changedProperties.has('openTipUser')){
|
||||
return true
|
||||
}
|
||||
// Only update element if prop1 changed.
|
||||
return changedProperties.has('messages');
|
||||
}
|
||||
@ -148,6 +176,15 @@ class ChatScroller extends LitElement {
|
||||
toggledMessage = message;
|
||||
}
|
||||
|
||||
setOpenTipUser(props) {
|
||||
this.openTipUser = props;
|
||||
this.chatEditor.disable();
|
||||
}
|
||||
|
||||
setUserName(props) {
|
||||
this.userName = props;
|
||||
}
|
||||
|
||||
async firstUpdated() {
|
||||
this.emojiPicker.on('emoji', selection => {
|
||||
|
||||
@ -240,10 +277,12 @@ class MessageTemplate extends LitElement {
|
||||
isFirstMessage: { type: Boolean },
|
||||
isSingleMessageInGroup: { type: Boolean },
|
||||
isLastMessageInGroup: { type: Boolean },
|
||||
setToggledMessage: {attribute: false},
|
||||
setForwardProperties: {attribute: false},
|
||||
viewImage: {type: Boolean},
|
||||
setOpenPrivateMessage : { attribute: false }
|
||||
setToggledMessage: { attribute: false },
|
||||
setForwardProperties: { attribute: false },
|
||||
viewImage: { type: Boolean },
|
||||
setOpenPrivateMessage : { attribute: false },
|
||||
setOpenTipUser: { attribute: false },
|
||||
setUserName: { attribute: false }
|
||||
}
|
||||
}
|
||||
|
||||
@ -538,6 +577,8 @@ class MessageTemplate extends LitElement {
|
||||
.setForwardProperties=${this.setForwardProperties}
|
||||
?firstMessageInChat=${this.messageObj.firstMessageInChat}
|
||||
.setOpenPrivateMessage=${(val) => this.setOpenPrivateMessage(val)}
|
||||
.setOpenTipUser=${(val) => this.setOpenTipUser(val)}
|
||||
.setUserName=${(val) => this.setUserName(val)}
|
||||
>
|
||||
</chat-menu>
|
||||
</div>
|
||||
@ -643,7 +684,9 @@ class ChatMenu extends LitElement {
|
||||
sendMessageForward: { attribute: false },
|
||||
setForwardProperties: { attribute: false },
|
||||
firstMessageInChat: { type: Boolean },
|
||||
setOpenPrivateMessage: { attribute: false }
|
||||
setOpenPrivateMessage: { attribute: false },
|
||||
setOpenTipUser: { attribute: false },
|
||||
setUserName: { attribute: false },
|
||||
}
|
||||
}
|
||||
|
||||
@ -789,6 +832,19 @@ class ChatMenu extends LitElement {
|
||||
</div>
|
||||
`
|
||||
) : html`<div></div>`}
|
||||
${this.myAddress !== this.originalMessage.sender ? (
|
||||
html`
|
||||
<div
|
||||
class=${`menu-icon ${!this.firstMessageInChat ? "tooltip" : ""}`}
|
||||
data-text="${translate("blockpage.bcchange18")}"
|
||||
@click=${() => {
|
||||
this.setOpenTipUser(true);
|
||||
this.setUserName(this.originalMessage.sender);
|
||||
}}>
|
||||
<vaadin-icon icon="vaadin:dollar" slot="icon"></vaadin-icon>
|
||||
</div>
|
||||
`
|
||||
) : html`<div></div>`}
|
||||
<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>
|
||||
</div>
|
||||
|
@ -15,11 +15,12 @@ export class TipUser extends LitElement {
|
||||
chatEditor: { type: Object },
|
||||
walletBalance: { type: Number },
|
||||
sendMoneyLoading: { type: Boolean },
|
||||
openUserInfo: { type: Boolean },
|
||||
closeTipUser: { type: Boolean },
|
||||
btnDisable: { type: Boolean },
|
||||
errorMessage: { type: String },
|
||||
successMessage: { type: String },
|
||||
setOpenTipUser: { attribute: false }
|
||||
setOpenTipUser: { attribute: false },
|
||||
focusChatEditor: { attribute: false }
|
||||
}
|
||||
}
|
||||
|
||||
@ -39,8 +40,8 @@ export class TipUser extends LitElement {
|
||||
}
|
||||
|
||||
updated(changedProperties) {
|
||||
if (changedProperties && changedProperties.has("openUserInfo")) {
|
||||
if (this.openUserInfo) {
|
||||
if (changedProperties && changedProperties.has("closeTipUser")) {
|
||||
if (this.closeTipUser) {
|
||||
this.shadowRoot.getElementById("amountInput").value = "";
|
||||
this.errorMessage = "";
|
||||
this.successMessage = "";
|
||||
@ -221,6 +222,7 @@ export class TipUser extends LitElement {
|
||||
setTimeout(() => {
|
||||
this.setOpenTipUser(false);
|
||||
this.chatEditor.enable();
|
||||
this.focusChatEditor();
|
||||
this.successMessage = "";
|
||||
}, 3000);
|
||||
} else {
|
||||
@ -234,8 +236,7 @@ export class TipUser extends LitElement {
|
||||
}
|
||||
|
||||
render() {
|
||||
console.log(5, "Tip User Here");
|
||||
console.log(this.openUserInfo, "openUserInfo here");
|
||||
console.log(7, "Tip User Here");
|
||||
return html`
|
||||
<div class="tip-user-header">
|
||||
<img src="/img/qort.png" width="32" height="32">
|
||||
|
Loading…
x
Reference in New Issue
Block a user