forked from Qortal/qortal-ui
Started UI Fixes
This commit is contained in:
parent
e708ffef82
commit
d6bffbeaa9
@ -92,11 +92,11 @@ class ChatModals extends LitElement {
|
||||
// Send Private Message
|
||||
|
||||
_sendMessage() {
|
||||
this.isLoading = true
|
||||
this.isLoading = true;
|
||||
|
||||
const recipient = this.shadowRoot.getElementById('sendTo').value
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox')
|
||||
const messageText = messageBox.value
|
||||
const recipient = this.shadowRoot.getElementById('sendTo').value;
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox');
|
||||
const messageText = messageBox.value;
|
||||
|
||||
if (recipient.length === 0) {
|
||||
this.isLoading = false
|
||||
@ -105,22 +105,21 @@ class ChatModals extends LitElement {
|
||||
} else {
|
||||
this.sendMessage()
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
async sendMessage() {
|
||||
this.isLoading = true
|
||||
|
||||
const _recipient = this.shadowRoot.getElementById('sendTo').value
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox')
|
||||
const messageText = messageBox.value
|
||||
let recipient
|
||||
this.isLoading = true;
|
||||
const _recipient = this.shadowRoot.getElementById('sendTo').value;
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox');
|
||||
const messageText = messageBox.value;
|
||||
let recipient;
|
||||
|
||||
const validateName = async (receiverName) => {
|
||||
let myRes
|
||||
let myRes;
|
||||
let myNameRes = await parentEpml.request('apiCall', {
|
||||
type: 'api',
|
||||
url: `/names/${receiverName}`
|
||||
})
|
||||
});
|
||||
|
||||
if (myNameRes.error === 401) {
|
||||
myRes = false
|
||||
@ -128,7 +127,7 @@ class ChatModals extends LitElement {
|
||||
myRes = myNameRes
|
||||
}
|
||||
|
||||
return myRes
|
||||
return myRes;
|
||||
}
|
||||
|
||||
const myNameRes = await validateName(_recipient)
|
||||
@ -139,7 +138,6 @@ class ChatModals extends LitElement {
|
||||
|
||||
recipient = myNameRes.owner
|
||||
}
|
||||
|
||||
let _reference = new Uint8Array(64);
|
||||
window.crypto.getRandomValues(_reference);
|
||||
|
||||
@ -367,7 +365,11 @@ class ChatModals extends LitElement {
|
||||
<p style='margin-bottom:0;'>
|
||||
<textarea class='textarea' @keydown=${(e) => this._textArea(e)} ?disabled=${this.isLoading} id='messageBox' placeholder='${translate('welcomepage.wcchange5')}' rows='1'></textarea>
|
||||
</p>
|
||||
<mwc-button ?disabled='${this.isLoading}' slot='primaryAction' @click=${this._sendMessage}>${translate('welcomepage.wcchange6')}
|
||||
<mwc-button ?disabled='${this.isLoading}' slot='primaryAction' @click=${() => {
|
||||
console.log("here500");
|
||||
this._sendMessage();
|
||||
}
|
||||
}>${translate('welcomepage.wcchange6')}
|
||||
</mwc-button>
|
||||
<mwc-button
|
||||
?disabled='${this.isLoading}'
|
||||
|
@ -213,60 +213,64 @@ class ChatPage extends LitElement {
|
||||
|
||||
render() {
|
||||
return html`
|
||||
${this.isLoadingMessages ? html`<h1>${translate("chatpage.cchange22")}</h1>` : this.renderChatScroller(this._initialMessages)}
|
||||
<div class="chat-text-area">
|
||||
<div class="typing-area">
|
||||
${this.repliedToMessageObj && html`
|
||||
<div class="repliedTo-container">
|
||||
<div class="repliedTo-subcontainer">
|
||||
<vaadin-icon class="reply-icon" icon="vaadin:reply" slot="icon"></vaadin-icon>
|
||||
<div class="repliedTo-message">
|
||||
<p class="senderName">${this.repliedToMessageObj.senderName ? this.repliedToMessageObj.senderName : this.repliedToMessageObj.sender}</p>
|
||||
<p class="original-message">${this.repliedToMessageObj.message}</p>
|
||||
<div>
|
||||
<div>
|
||||
${this.isLoadingMessages ? html`<h1>${translate("chatpage.cchange22")}</h1>` : this.renderChatScroller(this._initialMessages)}
|
||||
</div>
|
||||
<div class="chat-text-area">
|
||||
<div class="typing-area">
|
||||
${this.repliedToMessageObj && html`
|
||||
<div class="repliedTo-container">
|
||||
<div class="repliedTo-subcontainer">
|
||||
<vaadin-icon class="reply-icon" icon="vaadin:reply" slot="icon"></vaadin-icon>
|
||||
<div class="repliedTo-message">
|
||||
<p class="senderName">${this.repliedToMessageObj.senderName ? this.repliedToMessageObj.senderName : this.repliedToMessageObj.sender}</p>
|
||||
<p class="original-message">${this.repliedToMessageObj.message}</p>
|
||||
</div>
|
||||
</div>
|
||||
<vaadin-icon
|
||||
class="close-icon"
|
||||
icon="vaadin:close-big"
|
||||
slot="icon"
|
||||
@click=${() => this.closeRepliedToContainer()}
|
||||
></vaadin-icon>
|
||||
</div>
|
||||
<vaadin-icon
|
||||
class="close-icon"
|
||||
icon="vaadin:close-big"
|
||||
slot="icon"
|
||||
@click=${() => this.closeRepliedToContainer()}
|
||||
></vaadin-icon>
|
||||
</div>
|
||||
`}
|
||||
${this.editedMessageObj && html`
|
||||
<div class="repliedTo-container">
|
||||
<div class="repliedTo-subcontainer">
|
||||
<vaadin-icon class="reply-icon" icon="vaadin:pencil" slot="icon"></vaadin-icon>
|
||||
<div class="repliedTo-message">
|
||||
<p class="senderName">${translate("chatpage.cchange25")}</p>
|
||||
<p class="original-message">${this.editedMessageObj.message}</p>
|
||||
`}
|
||||
${this.editedMessageObj && html`
|
||||
<div class="repliedTo-container">
|
||||
<div class="repliedTo-subcontainer">
|
||||
<vaadin-icon class="reply-icon" icon="vaadin:pencil" slot="icon"></vaadin-icon>
|
||||
<div class="repliedTo-message">
|
||||
<p class="senderName">${translate("chatpage.cchange25")}</p>
|
||||
<p class="original-message">${this.editedMessageObj.message}</p>
|
||||
</div>
|
||||
</div>
|
||||
<vaadin-icon
|
||||
class="close-icon"
|
||||
icon="vaadin:close-big"
|
||||
slot="icon"
|
||||
@click=${() => this.closeEditMessageContainer()}
|
||||
></vaadin-icon>
|
||||
</div>
|
||||
<vaadin-icon
|
||||
class="close-icon"
|
||||
icon="vaadin:close-big"
|
||||
slot="icon"
|
||||
@click=${() => this.closeEditMessageContainer()}
|
||||
></vaadin-icon>
|
||||
</div>
|
||||
`}
|
||||
<div class="chatbar">
|
||||
<textarea style="color: var(--black);" tabindex='1' ?autofocus=${true} ?disabled=${this.isLoading || this.isLoadingMessages} id="messageBox" rows="1"></textarea>
|
||||
<iframe class="chat-editor" id="_chatEditorDOM" tabindex="-1"></iframe>
|
||||
<button class="emoji-button" ?disabled=${this.isLoading || this.isLoadingMessages}>
|
||||
${this.isLoading === false ? html`<img class="emoji" draggable="false" alt="😀" src="/emoji/svg/1f600.svg">` : html`<paper-spinner-lite active></paper-spinner-lite>`}
|
||||
</button>
|
||||
${this.editedMessageObj ? (
|
||||
html`
|
||||
<vaadin-icon
|
||||
class="checkmark-icon"
|
||||
icon="vaadin:check"
|
||||
slot="icon"
|
||||
@click=${() => this._sendMessage()}
|
||||
></vaadin-icon>
|
||||
`
|
||||
) : html`<div></div>`
|
||||
}
|
||||
`}
|
||||
<div class="chatbar">
|
||||
<textarea style="color: var(--black);" tabindex='1' ?autofocus=${true} ?disabled=${this.isLoading || this.isLoadingMessages} id="messageBox" rows="1"></textarea>
|
||||
<iframe class="chat-editor" id="_chatEditorDOM" tabindex="-1"></iframe>
|
||||
<button class="emoji-button" ?disabled=${this.isLoading || this.isLoadingMessages}>
|
||||
${this.isLoading === false ? html`<img class="emoji" draggable="false" alt="😀" src="/emoji/svg/1f600.svg">` : html`<paper-spinner-lite active></paper-spinner-lite>`}
|
||||
</button>
|
||||
${this.editedMessageObj ? (
|
||||
html`
|
||||
<vaadin-icon
|
||||
class="checkmark-icon"
|
||||
icon="vaadin:check"
|
||||
slot="icon"
|
||||
@click=${() => this._sendMessage()}
|
||||
></vaadin-icon>
|
||||
`
|
||||
) : html`<div></div>`
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -274,7 +278,6 @@ class ChatPage extends LitElement {
|
||||
}
|
||||
|
||||
async firstUpdated() {
|
||||
|
||||
// TODO: Load and fetch messages from localstorage (maybe save messages to localstorage...)
|
||||
|
||||
|
||||
@ -385,6 +388,7 @@ class ChatPage extends LitElement {
|
||||
parentEpml.imReady();
|
||||
}
|
||||
|
||||
|
||||
async updated(changedProperties) {
|
||||
if (changedProperties.has('messagesRendered')) {
|
||||
const chatReference1 = this.isReceipient ? 'direct' : 'group';
|
||||
|
@ -230,7 +230,11 @@ class ChatWelcomePage extends LitElement {
|
||||
<textarea class="textarea" @keydown=${(e) => this._textArea(e)} ?disabled=${this.isLoading} id="messageBox" placeholder="${translate("welcomepage.wcchange5")}" rows="1"></textarea>
|
||||
</p>
|
||||
|
||||
<mwc-button ?disabled="${this.isLoading}" slot="primaryAction" @click=${this._sendMessage}>${translate("welcomepage.wcchange6")}</mwc-button>
|
||||
<mwc-button ?disabled="${this.isLoading}" slot="primaryAction" @click=${() => {
|
||||
this._sendMessage();
|
||||
}
|
||||
}>
|
||||
${translate("welcomepage.wcchange6")}</mwc-button>
|
||||
<mwc-button
|
||||
?disabled="${this.isLoading}"
|
||||
slot="secondaryAction"
|
||||
@ -319,86 +323,80 @@ class ChatWelcomePage extends LitElement {
|
||||
}
|
||||
|
||||
_sendMessage() {
|
||||
this.isLoading = true
|
||||
|
||||
const recipient = this.shadowRoot.getElementById('sendTo').value
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox')
|
||||
const messageText = messageBox.value
|
||||
this.isLoading = true;
|
||||
const recipient = this.shadowRoot.getElementById('sendTo').value;
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox');
|
||||
const messageText = messageBox.value;
|
||||
|
||||
if (recipient.length === 0) {
|
||||
this.isLoading = false
|
||||
this.isLoading = false;
|
||||
} else if (messageText.length === 0) {
|
||||
this.isLoading = false
|
||||
this.isLoading = false;
|
||||
} else {
|
||||
this.sendMessage()
|
||||
this.sendMessage();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
async sendMessage(e) {
|
||||
this.isLoading = true
|
||||
|
||||
const _recipient = this.shadowRoot.getElementById('sendTo').value
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox')
|
||||
const messageText = messageBox.value
|
||||
let recipient
|
||||
async sendMessage() {
|
||||
this.isLoading = true;
|
||||
const _recipient = this.shadowRoot.getElementById('sendTo').value;
|
||||
const messageBox = this.shadowRoot.getElementById('messageBox');
|
||||
const messageText = messageBox.value;
|
||||
let recipient;
|
||||
|
||||
const validateName = async (receiverName) => {
|
||||
let myRes
|
||||
let myRes;
|
||||
let myNameRes = await parentEpml.request('apiCall', {
|
||||
type: 'api',
|
||||
url: `/names/${receiverName}`
|
||||
})
|
||||
|
||||
});
|
||||
if (myNameRes.error === 401) {
|
||||
myRes = false
|
||||
myRes = false;
|
||||
} else {
|
||||
myRes = myNameRes
|
||||
}
|
||||
myRes = myNameRes;
|
||||
};
|
||||
return myRes;
|
||||
};
|
||||
|
||||
return myRes
|
||||
}
|
||||
const myNameRes = await validateName(_recipient);
|
||||
|
||||
const myNameRes = await validateName(_recipient)
|
||||
if (!myNameRes) {
|
||||
|
||||
recipient = _recipient
|
||||
recipient = _recipient;
|
||||
} else {
|
||||
|
||||
recipient = myNameRes.owner
|
||||
}
|
||||
recipient = myNameRes.owner;
|
||||
};
|
||||
|
||||
let _reference = new Uint8Array(64);
|
||||
window.crypto.getRandomValues(_reference);
|
||||
|
||||
let sendTimestamp = Date.now()
|
||||
let sendTimestamp = Date.now();
|
||||
|
||||
let reference = window.parent.Base58.encode(_reference)
|
||||
let reference = window.parent.Base58.encode(_reference);
|
||||
|
||||
const getAddressPublicKey = async () => {
|
||||
let isEncrypted
|
||||
let _publicKey
|
||||
let isEncrypted;
|
||||
let _publicKey;
|
||||
|
||||
let addressPublicKey = await parentEpml.request('apiCall', {
|
||||
type: 'api',
|
||||
url: `/addresses/publickey/${recipient}`
|
||||
})
|
||||
|
||||
|
||||
if (addressPublicKey.error === 102) {
|
||||
_publicKey = false
|
||||
_publicKey = false;
|
||||
// Do something here...
|
||||
let err1string = get("welcomepage.wcchange7")
|
||||
parentEpml.request('showSnackBar', `${err1string}`)
|
||||
this.isLoading = false
|
||||
let err1string = get("welcomepage.wcchange7");
|
||||
parentEpml.request('showSnackBar', `${err1string}`);
|
||||
this.isLoading = false;
|
||||
} else if (addressPublicKey !== false) {
|
||||
isEncrypted = 1
|
||||
_publicKey = addressPublicKey
|
||||
sendMessageRequest(isEncrypted, _publicKey)
|
||||
isEncrypted = 1;
|
||||
_publicKey = addressPublicKey;
|
||||
sendMessageRequest(isEncrypted, _publicKey);
|
||||
} else {
|
||||
isEncrypted = 0
|
||||
_publicKey = this.selectedAddress.address
|
||||
sendMessageRequest(isEncrypted, _publicKey)
|
||||
}
|
||||
isEncrypted = 0;
|
||||
_publicKey = this.selectedAddress.address;
|
||||
sendMessageRequest(isEncrypted, _publicKey);
|
||||
};
|
||||
};
|
||||
|
||||
const sendMessageRequest = async (isEncrypted, _publicKey) => {
|
||||
@ -407,8 +405,8 @@ class ChatWelcomePage extends LitElement {
|
||||
images: [''],
|
||||
repliedTo: '',
|
||||
version: 1
|
||||
}
|
||||
const stringifyMessageObject = JSON.stringify(messageObject)
|
||||
};
|
||||
const stringifyMessageObject = JSON.stringify(messageObject);
|
||||
let chatResponse = await parentEpml.request('chat', {
|
||||
type: 18,
|
||||
nonce: this.selectedAddress.nonce,
|
||||
@ -424,7 +422,6 @@ class ChatWelcomePage extends LitElement {
|
||||
isText: 1
|
||||
}
|
||||
})
|
||||
|
||||
_computePow(chatResponse)
|
||||
}
|
||||
|
||||
|
@ -232,7 +232,11 @@ class NameMenu extends LitElement {
|
||||
<p style="margin-bottom:0;">
|
||||
<textarea class="textarea" @keydown=${(e) => this._textArea(e)} ?disabled=${this.isLoading} id="messageBox" placeholder="${translate("welcomepage.wcchange5")}" rows="1"></textarea>
|
||||
</p>
|
||||
<mwc-button ?disabled="${this.isLoading}" slot="primaryAction" @click=${this._sendMessage}>${translate("welcomepage.wcchange6")}</mwc-button>
|
||||
<mwc-button ?disabled="${this.isLoading}" slot="primaryAction" @click=${() => {
|
||||
this._sendMessage();
|
||||
}
|
||||
}>
|
||||
${translate("welcomepage.wcchange6")}</mwc-button>
|
||||
<mwc-button
|
||||
?disabled="${this.isLoading}"
|
||||
slot="secondaryAction"
|
||||
|
Loading…
x
Reference in New Issue
Block a user