DTP Base provides a scalable and secure Node.js application development harness ready for production service.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

51 lines
2.6 KiB

include ../../link/components/preview
include ../../user/components/profile-picture
mixin renderChatMessage (message)
.chat-message
.uk-flex
.uk-width-auto.no-select
+renderProfilePicture(message.author, { iconClass: 'member-profile-icon' })
.uk-width-expand
.message-attribution.uk-margin-small.no-select
div(uk-grid).uk-grid-small.uk-flex-middle
.uk-width-auto
.author-display-name= message.author.displayName || message.author.username
.uk-width-auto
.message-timestamp(
data-dtp-timestamp= message.created,
data-dtp-timestamp-format= "time",
uk-tooltip={ title: dayjs(message.created).format('MMM D, YYYY') }
)= dayjs(message.created).format('h:mm a')
if message.content && (message.content.length > 0)
.message-content
div!= marked.parse(message.content, { renderer: fullMarkedRenderer })
if message.attachments
.message-attachments
if Array.isArray(message.attachments.images) && (message.attachments.images.length > 0)
div(class="uk-child-width-1-1 uk-child-width-1-2@s uk-child-width-1-3@m uk-child-width-1-4@l uk-child-width-1-5@xl", uk-grid, uk-lightbox="animation: slide").uk-grid-small
each image of message.attachments.images
a(href=`/image/${image._id}`, data-type="image", data-caption= `${image.metadata.width}x${image.metadata.height} | ${image.metadata.space.toUpperCase()} | ${image.metadata.format.toUpperCase()} | ${numeral(image.size).format('0,0.0b')}`)
img(src=`/image/${image._id}`, width= image.metadata.width, height= image.metadata.height, alt="Image attachment").image-attachment
if Array.isArray(message.attachments.videos) && (message.attachments.videos.length > 0)
each video of message.attachments.videos
video(
data-video-id= video._id,
poster= video.thumbnail ? `/image/${video.thumbnail._id}` : false,
controls, disablepictureinpicture, disableremoteplayback, playsinline,
).video-attachment
source(src=`/video/${video._id}/media`)
if Array.isArray(message.links) && (message.links.length > 0)
each link in message.links
div(class="uk-width-large").uk-margin-small
+renderLinkPreview(link, { layout: 'responsive' })
.uk-width-auto
.uk-text-bold !
.message-menu
div(uk-grid).uk-grid-small
.uk-width-auto
div Emoji reacts & shit