+ ${(!this.isReceipient && +this._chatId !== 0) ?
+ html`
+
+ `: ''}
+
+
+ ` : null}
+
+
+
+ ${this.groupInfo && this.groupInfo.groupName}
+
+
+
+ ${this.isLoadingMessages ?
+ html`
+
+
+
+
+
+
+
+
+
+
+
+
+ ` :
+ this.renderChatScroller()}
+
+
+
+
+
+ ${(this.isUploadingImage || this.isDeletingImage) ? html`
+
+ ${this.repliedToMessageObj && html`
+
+
+
+ `}
+ ${this.editedMessageObj && html`
+
+
+
+ this.closeRepliedToContainer()}
+ >
+
+
+
+ `}
+
+
+
+
+ this.closeEditMessageContainer()}
+ >
+
+
+
+
+
+
+
+
+ + ${this.isDeletingImage ? + translate("chatpage.cchange31") : translate("chatpage.cchange30")} +
+
+
+
+ ${this.imageFile && html`
+ })
+ `}
+
+
+ this.updatePlaceholder(editor, value)}
+ >
+
+
+
+ ${translate("chatpage.cchange41")}
++
+
${translate("chatpage.cchange42")}
+ +
+
+
+
+
+
+
+ ${translate("blockpage.bcchange16")}
+
+ {
+ this.forwardActiveChatHeadUrl = {
+ ...this.forwardActiveChatHeadUrl,
+ url: val
+ };
+ this.userFound = [];
+ }}
+ chatInfo=${JSON.stringify(item)}>
+ `
+ })}
+ `
+ )}
+
+
+
+
+ {
+ if (this.forwardActiveChatHeadUrl.selected) {
+ this.forwardActiveChatHeadUrl = {};
+ this.requestUpdate();
+ }
+ }
+ }
+ />
+ ${this.forwardActiveChatHeadUrl.selected ? (
+ html`
+
+
+ `
+ )}
+
+ ${this.forwardActiveChatHeadUrl.selected ? (
+ html`
+
+
+ `
+ ) : (
+ html`
+ ${translate("chatpage.cchange38")}
+
+
+ `
+ ) : (
+ html`
+ ${this.chatHeads.map((item) => {
+ return html`
+ + ${this.forwardActiveChatHeadUrl.name} +
+
+ {
+ this.userFound = [];
+ this.forwardActiveChatHeadUrl = {};
+ this.requestUpdate();
+ this.shadowRoot.getElementById("sendTo").value = "";
+ }}>
+
+
+ + Forwarding... +
+
+ {
+ this.forwardActiveChatHeadUrl = {
+ ...this.forwardActiveChatHeadUrl,
+ url: `direct/${result.owner}`,
+ name: result.name,
+ selected: true
+ };
+ this.userFound = [];
+ this.userFoundModalOpen = false;
+ }}
+ .closeFunc=${() => {
+ this.userFoundModalOpen = false;
+ this.userFound = [];
+ }}
+ .searchResults=${this.userFound}
+ ?isOpen=${this.userFoundModalOpen}
+ ?loading=${this.isLoading}>
+
+
+ 
`
+ }
+
+ const createImage = (imageUrl) => {
+ const imageHTMLRes = new Image();
+ imageHTMLRes.src = imageUrl;
+ imageHTMLRes.style= "max-width:45vh; max-height:40vh; border-radius: 5px; cursor: pointer";
+ imageHTMLRes.onclick= () => {
+ this.openDialogImage = true;
+ }
+ imageHTMLRes.onload = () => {
+ this.isImageLoaded = true;
+ }
+ imageHTMLRes.onerror = () => {
+ if (this.imageFetches < 4) {
+ setTimeout(() => {
+ this.imageFetches = this.imageFetches + 1;
+ imageHTMLRes.src = imageUrl;
+ }, 500);
+ } else {
+ imageHTMLRes.src = '/img/chain.png';
+ imageHTMLRes.style= "max-width:45vh; max-height:20vh; border-radius: 5px; filter: opacity(0.5)";
+ imageHTMLRes.onclick= () => {
+
+ }
+
+ this.isImageLoaded = true
+ }
+ };
+ return imageHTMLRes;
+ }
+ if (image) {
+ const myNode = window.parent.reduxStore.getState().app.nodeConfig.knownNodes[window.parent.reduxStore.getState().app.nodeConfig.node];
+ const nodeUrl = myNode.protocol + '://' + myNode.domain + ':' + myNode.port;
+ imageUrl = `${nodeUrl}/arbitrary/${image.service}/${image.name}/${image.identifier}?async=true&apiKey=${myNode.apiKey}`;
+
+ if(this.viewImage || this.myAddress === this.messageObj.sender){
+ imageHTML = createImage(imageUrl);
+ imageHTMLDialog = createImage(imageUrl)
+ imageHTMLDialog.style= "height: auto; max-height: 80vh; width: auto; max-width: 80vw; object-fit: contain; border-radius: 5px";
+ }
+
}
- if (this.messageObj.sender === this.myAddress) {
- nameMenu = html`
{
+ this.sendMessageFunc();
+ }}
+ />
+ ` :
+ html`
+ 
+ 
+