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

Merge remote-tracking branch 'justin/feature/edit-message-title' into feature/replies-lookup

Browse Source
This commit is contained in:
Phillip 2023-01-21 17:55:10 +02:00
commit cc5c7a364f
8 changed files with 67 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
qortal-ui-core/font/switch-theme.css
View File

@ -9,7 +9,7 @@ html {
--copybutton: #707584; --copybutton: #707584;
--chat-group: #080808; --chat-group: #080808;
--chat-bubble: #9f9f9f0a; --chat-bubble: #9f9f9f0a;
--chat-bubble-bg: #f3f3f3; --chat-bubble-bg: #e6e6e6;
--chat-bubble-msg-color: #080808; --chat-bubble-msg-color: #080808;
--reaction-bubble-outline: #6b6969; --reaction-bubble-outline: #6b6969;
--chat-menu-bg: #ffffff; --chat-menu-bg: #ffffff;

4
qortal-ui-core/language/us.json
View File

@ -572,8 +572,8 @@
"cchange63": "Enter Enabled", "cchange63": "Enter Enabled",
"cchange64": "Enter Disabled", "cchange64": "Enter Disabled",
"cchange65": "Please enter a recipient", "cchange65": "Please enter a recipient",
"cchange66": "Cannot fetch replied-to message. Message is too old." "cchange66": "Cannot fetch replied-to message. Message is too old.",
"cchange68": "edited"
}, },
"welcomepage": { "welcomepage": {
"wcchange1": "Welcome to Q-Chat", "wcchange1": "Welcome to Q-Chat",

2
qortal-ui-core/src/styles/switch-theme.css
View File

@ -9,7 +9,7 @@ html {
--copybutton: #707584; --copybutton: #707584;
--chat-group: #080808; --chat-group: #080808;
--chat-bubble: #9f9f9f0a; --chat-bubble: #9f9f9f0a;
--chat-bubble-bg: #f3f3f3; --chat-bubble-bg: #e6e6e6;
--chat-bubble-msg-color: #080808; --chat-bubble-msg-color: #080808;
--reaction-bubble-outline: #6b6969; --reaction-bubble-outline: #6b6969;
--chat-menu-bg: #ffffff; --chat-menu-bg: #ffffff;

2
qortal-ui-crypto/api/constants.js
View File

@ -159,7 +159,7 @@ const ADDRESS_VERSION = 58
const PROXY_URL = "/proxy/" const PROXY_URL = "/proxy/"
// Chat reference timestamp // Chat reference timestamp
const CHAT_REFERENCE_FEATURE_TRIGGER_TIMESTAMP = 0 const CHAT_REFERENCE_FEATURE_TRIGGER_TIMESTAMP = 1674316800000
// Used as a salt for all qora addresses. Salts used for storing your private keys in local storage will be randomly generated // Used as a salt for all qora addresses. Salts used for storing your private keys in local storage will be randomly generated
const STATIC_SALT = new Uint8Array([54, 190, 201, 206, 65, 29, 123, 129, 147, 231, 180, 166, 171, 45, 95, 165, 78, 200, 208, 194, 44, 207, 221, 146, 45, 238, 68, 68, 69, 102, 62, 6]) const STATIC_SALT = new Uint8Array([54, 190, 201, 206, 65, 29, 123, 129, 147, 231, 180, 166, 171, 45, 95, 165, 78, 200, 208, 194, 44, 207, 221, 146, 45, 238, 68, 68, 69, 102, 62, 6])

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

@ -147,7 +147,6 @@ class ChatPage extends LitElement {
width: 800px; width: 800px;
} }
.close-icon { .close-icon {
color: #676b71; color: #676b71;
width: 18px; width: 18px;
@ -375,9 +374,9 @@ class ChatPage extends LitElement {
.repliedTo-message p mark { .repliedTo-message p mark {
background-color: #ffe066; background-color: #ffe066;
border-radius: 0.25em; border-radius: 0.25em;
box-decoration-break: clone; box-decoration-break: clone;
padding: 0.125em 0; padding: 0.125em 0;
} }
.reply-icon { .reply-icon {
@ -979,17 +978,20 @@ class ChatPage extends LitElement {
<vaadin-icon class="reply-icon" icon="vaadin:reply" slot="icon"></vaadin-icon> <vaadin-icon class="reply-icon" icon="vaadin:reply" slot="icon"></vaadin-icon>
<div class="repliedTo-message"> <div class="repliedTo-message">
<p class="senderName">${this.repliedToMessageObj.senderName ? this.repliedToMessageObj.senderName : this.repliedToMessageObj.sender}</p> <p class="senderName">${this.repliedToMessageObj.senderName ? this.repliedToMessageObj.senderName : this.repliedToMessageObj.sender}</p>
${this.repliedToMessageObj.toString() === '1' ? html` ${this.repliedToMessageObj.version.toString() === '1' ? html`
${this.repliedToMessageObj.message} ${this.repliedToMessageObj.message}
` : ''} ` : ''}
${this.repliedToMessageObj.toString() === '2' ? html` ${this.repliedToMessageObj.version.toString() === '2'
${unsafeHTML(generateHTML(this.repliedToMessageObj.message, [ ? html`
StarterKit, ${unsafeHTML(generateHTML(this.repliedToMessageObj.message,
Underline, [
Highlight StarterKit,
// other extensions … Underline,
]))} ` : ''} Highlight
// other extensions …
]))}
`
: ''}
</div> </div>
<vaadin-icon <vaadin-icon
class="close-icon" class="close-icon"
@ -1006,12 +1008,13 @@ class ChatPage extends LitElement {
<vaadin-icon class="reply-icon" icon="vaadin:pencil" slot="icon"></vaadin-icon> <vaadin-icon class="reply-icon" icon="vaadin:pencil" slot="icon"></vaadin-icon>
<div class="repliedTo-message"> <div class="repliedTo-message">
<p class="senderName">${translate("chatpage.cchange25")}</p> <p class="senderName">${translate("chatpage.cchange25")}</p>
${unsafeHTML(generateHTML(this.editedMessageObj.message, [ ${unsafeHTML(generateHTML(this.editedMessageObj.message,
StarterKit, [
Underline, StarterKit,
Highlight Underline,
// other extensions … Highlight
]))} // other extensions …
]))}
</div> </div>
<vaadin-icon <vaadin-icon
class="close-icon" class="close-icon"

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

@ -85,9 +85,9 @@ export const chatStyles = css`
color: #888888; color: #888888;
font-size: 13px; font-size: 13px;
user-select: none; user-select: none;
float: right; display: flex;
padding-left: 15px; width: 100%;
text-align: right; padding-top: 2px;
} }
.message-data-time-hidden { .message-data-time-hidden {
@ -96,10 +96,9 @@ export const chatStyles = css`
color: #888888; color: #888888;
font-size: 13px; font-size: 13px;
user-select: none; user-select: none;
float: right; display: flex;
padding-left: 15px; width: 100%;
padding-bottom: 3px; padding-top: 2px;
text-align: right;
} }
.message-user-info { .message-user-info {
@ -643,6 +642,13 @@ export const chatStyles = css`
margin: 2rem 0; margin: 2rem 0;
} }
.edited-message-style {
font-family: "Work Sans", sans-serif;
font-style: italic;
font-size: 13px;
visibility: visible;
}
.blink-bg{ .blink-bg{
border-radius: 8px; border-radius: 8px;
animation: blinkingBackground 3s; animation: blinkingBackground 3s;
@ -652,4 +658,6 @@ export const chatStyles = css`
100% { background-color:rgba(var(--menuactivergb), 0)} 100% { background-color:rgba(var(--menuactivergb), 0)}
} }
` `

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

@ -341,6 +341,7 @@ class MessageTemplate extends LitElement {
let isImageDeleted = false; let isImageDeleted = false;
let version = 0; let version = 0;
let isForwarded = false let isForwarded = false
let isEdited = false
try { try {
const parsedMessageObj = JSON.parse(this.messageObj.decodedMessage); const parsedMessageObj = JSON.parse(this.messageObj.decodedMessage);
if(parsedMessageObj.version.toString() === '2'){ if(parsedMessageObj.version.toString() === '2'){
@ -358,6 +359,7 @@ class MessageTemplate extends LitElement {
reactions = parsedMessageObj.reactions || []; reactions = parsedMessageObj.reactions || [];
version = parsedMessageObj.version version = parsedMessageObj.version
isForwarded = parsedMessageObj.type === 'forward' isForwarded = parsedMessageObj.type === 'forward'
isEdited = this.messageObj.editedTimestamp && true
if (parsedMessageObj.images && Array.isArray(parsedMessageObj.images) && parsedMessageObj.images.length > 0) { if (parsedMessageObj.images && Array.isArray(parsedMessageObj.images) && parsedMessageObj.images.length > 0) {
image = parsedMessageObj.images[0]; image = parsedMessageObj.images[0];
} }
@ -372,6 +374,7 @@ class MessageTemplate extends LitElement {
let levelFounder = ''; let levelFounder = '';
let hideit = hidemsg.includes(this.messageObj.sender); let hideit = hidemsg.includes(this.messageObj.sender);
let forwarded = '' let forwarded = ''
let edited = ''
levelFounder = html`<level-founder checkleveladdress="${this.messageObj.sender}"></level-founder>`; levelFounder = html`<level-founder checkleveladdress="${this.messageObj.sender}"></level-founder>`;
if (this.messageObj.senderName) { if (this.messageObj.senderName) {
@ -435,6 +438,12 @@ class MessageTemplate extends LitElement {
</span> </span>
`; `;
edited = html`
<span class="edited-message-style">
${translate("chatpage.cchange68")}
</span>
`;
if (repliedToData) { if (repliedToData) {
try { try {
const parsedMsg = JSON.parse(repliedToData.decodedMessage); const parsedMsg = JSON.parse(repliedToData.decodedMessage);
@ -590,7 +599,11 @@ class MessageTemplate extends LitElement {
${version.toString() === '1' ? html` ${version.toString() === '1' ? html`
${unsafeHTML(this.emojiPicker.parse(replacedMessage))} ${unsafeHTML(this.emojiPicker.parse(replacedMessage))}
` : ''} ` : ''}
<div class="${((this.isFirstMessage === false && <div
style=${isEdited
? "justify-content: space-between;"
: "justify-content: flex-end;"}
class="${((this.isFirstMessage === false &&
this.isSingleMessageInGroup === true && this.isSingleMessageInGroup === true &&
this.isLastMessageInGroup === true) || this.isLastMessageInGroup === true) ||
(this.isFirstMessage === true && (this.isFirstMessage === true &&
@ -599,6 +612,14 @@ class MessageTemplate extends LitElement {
? 'message-data-time' ? 'message-data-time'
: 'message-data-time-hidden' : 'message-data-time-hidden'
}"> }">
${isEdited ?
html`
<span>
${edited}
</span>
`
: null
}
<message-time timestamp=${this.messageObj.timestamp}></message-time> <message-time timestamp=${this.messageObj.timestamp}></message-time>
</div> </div>
</div> </div>
@ -858,7 +879,7 @@ class ChatMenu extends LitElement {
this.versionErrorSnack() this.versionErrorSnack()
return return
} }
this.setRepliedToMessageObj(this.originalMessage); this.setRepliedToMessageObj({...this.originalMessage, version: this.version});
}}"> }}">
<vaadin-icon icon="vaadin:reply" slot="icon"></vaadin-icon> <vaadin-icon icon="vaadin:reply" slot="icon"></vaadin-icon>
</div> </div>

2
qortal-ui-plugins/plugins/core/messaging/q-chat/q-chat.src.js
View File

@ -163,8 +163,6 @@ class Chat extends LitElement {
} }
render() { render() {
console.log(12, "q-chat here");
console.log(window.location.href);
return html` return html`
<div class="container clearfix"> <div class="container clearfix">
<div class="people-list" id="people-list"> <div class="people-list" id="people-list">