diff --git a/img/chain.png b/img/chain.png
new file mode 100644
index 00000000..79eb8e15
Binary files /dev/null and b/img/chain.png differ
diff --git a/qortal-ui-plugins/plugins/core/components/ChatPage.js b/qortal-ui-plugins/plugins/core/components/ChatPage.js
index ffb5b43c..a8e88b97 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatPage.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatPage.js
@@ -1681,23 +1681,22 @@ class ChatPage extends LitElement {
editorConfig.getMessageSize(editorConfig.mirrorElement.value)
if (e.type === 'click') {
-
e.preventDefault();
e.stopPropagation();
}
if (e.type === 'paste') {
-
e.preventDefault();
const item_list = await navigator.clipboard.read();
+ console.log({item_list})
let image_type; // we will feed this later
const item = item_list.find( item => // choose the one item holding our image
- item.types.some( type => { // does this item have our type
- if( type.startsWith( 'image/' ) ) {
- image_type = type; // store which kind of image type it is
- return true;
- }
- } )
+ item.types.some( type => { // does this item have our type
+ if (type.startsWith( 'image/')) {
+ image_type = type; // store which kind of image type it is
+ return true;
+ }
+ })
);
const blob = item && await item.getType( image_type );
var file = new File([blob], "name", {
@@ -1705,14 +1704,10 @@ class ChatPage extends LitElement {
});
editorConfig.insertImage(file)
-
navigator.clipboard.readText().then(clipboardText => {
-
let escapedText = editorConfig.escape(clipboardText);
-
editor.insertText(escapedText);
}).catch(err => {
-
// Fallback if everything fails...
let textData = (e.originalEvent || e).clipboardData.getData('text/plain');
editor.insertText(textData);
diff --git a/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js b/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js
index aea9d27e..77c144cd 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatScroller-css.js
@@ -364,4 +364,10 @@ export const chatStyles = css`
.message-parent:hover .image-delete-icon {
visibility: visible;
}
+
+ .imageContainer {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
`
diff --git a/qortal-ui-plugins/plugins/core/components/ChatScroller.js b/qortal-ui-plugins/plugins/core/components/ChatScroller.js
index 8c719642..242d3416 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatScroller.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatScroller.js
@@ -163,7 +163,8 @@ class MessageTemplate extends LitElement {
setRepliedToMessageObj: { type: Function },
setEditedMessageObj: { type: Function },
focusChatEditor: { type: Function },
- sendMessage: { type: Function }
+ sendMessage: { type: Function },
+ openDialogImage: {type: Function}
}
}
@@ -174,6 +175,8 @@ class MessageTemplate extends LitElement {
this.openDialogBlockUser = false
this.showBlockAddressIcon = false
this.myAddress = window.parent.reduxStore.getState().app.selectedAddress.address
+ this.imageFetches = 0
+ this.openDialogImage = false
}
static styles = [chatStyles]
@@ -205,7 +208,9 @@ class MessageTemplate extends LitElement {
}
}
+
render() {
+
const hidemsg = this.hideMessages
let message = ""
let reactions = []
@@ -226,6 +231,7 @@ class MessageTemplate extends LitElement {
}
let avatarImg = ''
let imageHTML = ''
+ let imageUrl = ''
let nameMenu = ''
let levelFounder = ''
let hideit = hidemsg.includes(this.messageObj.sender)
@@ -242,11 +248,42 @@ class MessageTemplate extends LitElement {
avatarImg = html`
`
}
+ const myFunction=()=>{
+ console.log('hello error')
+ }
+
+
+
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
- const imageUrl = `${nodeUrl}/arbitrary/${image.service}/${image.name}/${image.identifier}?async=true&apiKey=${myNode.apiKey}`
- imageHTML = html`
`
+ imageUrl = `${nodeUrl}/arbitrary/${image.service}/${image.name}/${image.identifier}?async=true&apiKey=${myNode.apiKey}`
+ imageHTML = html`
`
+ imageHTML = new Image();
+ imageHTML.src = imageUrl;
+ imageHTML.style= "max-width:45vh; max-height:40vh; border-radius: 5px; cursor: pointer"
+ imageHTML.onclick= ()=> {
+ this.openDialogImage = true
+ }
+ let p = 0
+ imageHTML.onerror = ()=> {
+
+ console.log('inputRef', this.imageFetches)
+ if(this.imageFetches < 4){
+
+ setTimeout(()=> {
+ this.imageFetches = this.imageFetches + 1
+
+ imageHTML.src = imageUrl
+ }, 500)
+
+ } else {
+ imageHTML.src = '/img/chain.png'
+ imageHTML.style= "max-width:45vh; max-height:40vh; border-radius: 5px; filter: opacity(0.5)"
+ ;
+ }
+
+ }
}
@@ -342,6 +379,28 @@ class MessageTemplate extends LitElement {
toblockaddress=${this.messageObj.sender}
>
+ {
+ this.openDialogImage = false
+ }}>
+
+
+
![](${imageUrl})
+
+
+ {
+
+ this.openDialogImage = false
+ }}
+ >
+ ${translate("general.close")}
+
+
`
}
}