2021-02-17 15:59:44 +01:00
|
|
|
import 'shared/chat/unfurl';
|
2021-02-22 20:20:19 +01:00
|
|
|
import { __ } from 'i18n';
|
2021-02-17 15:59:44 +01:00
|
|
|
import { html } from "lit-html";
|
2021-02-22 20:20:19 +01:00
|
|
|
import { renderAvatar } from 'templates/directives/avatar';
|
2020-06-11 15:27:45 +02:00
|
|
|
|
2020-06-11 17:03:59 +02:00
|
|
|
|
2020-06-11 15:27:45 +02:00
|
|
|
export default (o) => {
|
2020-08-16 23:33:17 +02:00
|
|
|
const i18n_new_messages = __('New messages');
|
2020-06-11 15:27:45 +02:00
|
|
|
return html`
|
2020-09-03 12:48:23 +02:00
|
|
|
${ o.is_first_unread ? html`<div class="message separator"><hr class="separator"><span class="separator-text">${ i18n_new_messages }</span></div>` : '' }
|
2020-06-11 15:27:45 +02:00
|
|
|
<div class="message chat-msg ${ o.getExtraMessageClasses() }"
|
|
|
|
data-isodate="${o.time}"
|
|
|
|
data-msgid="${o.msgid}"
|
|
|
|
data-from="${o.from}"
|
|
|
|
data-encrypted="${o.is_encrypted}">
|
|
|
|
|
2020-10-13 05:57:27 +02:00
|
|
|
<!-- Anchor to allow us to scroll the message into view -->
|
|
|
|
<a id="${o.msgid}"></a>
|
|
|
|
|
2020-12-01 16:31:57 +01:00
|
|
|
<a class="show-msg-author-modal" @click=${o.showUserModal}>${ o.shouldShowAvatar() ? renderAvatar(o.getAvatarData()) : '' }</a>
|
2020-06-11 15:27:45 +02:00
|
|
|
<div class="chat-msg__content chat-msg__content--${o.sender} ${o.is_me_message ? 'chat-msg__content--action' : ''}">
|
2020-06-18 16:54:12 +02:00
|
|
|
|
|
|
|
${ !o.is_me_message ? html`
|
|
|
|
<span class="chat-msg__heading">
|
2020-12-01 16:31:57 +01:00
|
|
|
<span class="chat-msg__author"><a class="show-msg-author-modal" @click=${o.showUserModal}>${o.username}</a></span>
|
2020-06-18 16:54:12 +02:00
|
|
|
${ o.renderAvatarByline() }
|
|
|
|
${ o.is_encrypted ? html`<span class="fa fa-lock"></span>` : '' }
|
|
|
|
</span>` : '' }
|
2020-06-11 15:27:45 +02:00
|
|
|
<div class="chat-msg__body chat-msg__body--${o.message_type} ${o.received ? 'chat-msg__body--received' : '' } ${o.is_delayed ? 'chat-msg__body--delayed' : '' }">
|
|
|
|
<div class="chat-msg__message">
|
2020-06-18 16:54:12 +02:00
|
|
|
${ (o.is_me_message) ? html`
|
2020-10-23 15:07:56 +02:00
|
|
|
<time timestamp="${o.edited || o.time}" class="chat-msg__time">${o.pretty_time}</time>
|
2020-06-18 16:54:12 +02:00
|
|
|
<span class="chat-msg__author">${ o.is_me_message ? '**' : ''}${o.username}</span> ` : '' }
|
2020-06-11 15:27:45 +02:00
|
|
|
${ o.is_retracted ? o.renderRetraction() : o.renderMessageText() }
|
|
|
|
</div>
|
|
|
|
<converse-message-actions
|
|
|
|
.model=${o.model}
|
|
|
|
?correcting="${o.correcting}"
|
|
|
|
?editable="${o.editable}"
|
|
|
|
?is_retracted="${o.is_retracted}"
|
|
|
|
message_type="${o.message_type}"></converse-message-actions>
|
|
|
|
</div>
|
2021-02-17 15:59:44 +01:00
|
|
|
|
|
|
|
${ o.model.get('ogp_metadata')?.map(m =>
|
|
|
|
html`<converse-message-unfurl
|
2021-03-01 22:21:45 +01:00
|
|
|
jid="${o.model.collection.chatbox?.get('jid')}"
|
2021-03-01 23:39:14 +01:00
|
|
|
description="${m['og:description'] || ''}"
|
|
|
|
title="${m['og:title'] || ''}"
|
|
|
|
image="${m['og:image'] || ''}"
|
|
|
|
url="${m['og:url'] || ''}"></converse-message-unfurl>`) }
|
2020-06-11 15:27:45 +02:00
|
|
|
</div>
|
|
|
|
</div>`;
|
|
|
|
}
|