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.
151 lines
5.7 KiB
151 lines
5.7 KiB
include reaction-button
|
|
mixin renderChatInputForm (room, options = { })
|
|
form(
|
|
id="chat-input-form",
|
|
data-room-id= room._id,
|
|
onsubmit="return window.dtp.app.chat.sendUserChat(event);",
|
|
).uk-form
|
|
|
|
input(type="hidden", name="roomType", value= "ChatRoom")
|
|
input(type="hidden", name="room", value= room._id)
|
|
|
|
#site-emoji-picker
|
|
div THIS IS THE EMOJI PICKER
|
|
|
|
.uk-padding-small.uk-padding-remove-bottom
|
|
textarea(
|
|
id="chat-input-text",
|
|
name="content",
|
|
rows="2",
|
|
hidden= options.inputHidden,
|
|
).uk-textarea.uk-margin-small
|
|
|
|
div(uk-grid).uk-grid-small.uk-flex-middle
|
|
.uk-width-auto
|
|
button(
|
|
type= "button",
|
|
title= "Insert emoji",
|
|
data-target-element= "chat-input-text",
|
|
onclick= "return dtp.app.chat.toggleEmojiPicker(event);",
|
|
).uk-button.uk-button-default.uk-button-small
|
|
span
|
|
i.far.fa-laugh-beam
|
|
|
|
.uk-width-auto
|
|
button(
|
|
type= "button",
|
|
title= "Sticker Picker",
|
|
uk-toggle={ target: '#sticker-picker'},
|
|
onclick="return dtp.app.chat.openChatInput();",
|
|
).uk-button.uk-button-default.uk-button-small
|
|
span
|
|
i.far.fa-image
|
|
#sticker-picker(uk-modal)
|
|
.uk-modal-dialog.uk-modal-body
|
|
button(type="button", uk-close).uk-modal-close-default
|
|
h4.uk-text-center Sticker Picker 9000™
|
|
ul(uk-tab).uk-flex-center
|
|
li.uk-active
|
|
a(href="")= user.displayName || user.username
|
|
li
|
|
a(href="")= room.name
|
|
li
|
|
a(href="") Favorites
|
|
ul.uk-switcher.chat-sticker-picker
|
|
//- Personal stickers
|
|
li
|
|
if Array.isArray(userStickers) && (userStickers.length > 0)
|
|
div(uk-grid).uk-grid-small.uk-flex-center
|
|
each sticker in userStickers
|
|
.uk-width-auto
|
|
button(
|
|
type="button",
|
|
data-sticker-id= sticker._id,
|
|
data-sticker-slug= sticker.slug,
|
|
onclick="return dtp.app.chat.insertChatSticker(event);",
|
|
).uk-button.uk-button-text
|
|
+renderSticker(sticker)
|
|
else
|
|
.uk-text-center You haven't uploaded any #[a(href="/sticker") Stickers] yet
|
|
|
|
//- Channel stickers
|
|
li
|
|
if Array.isArray(roomStickers) && (roomStickers.length > 0)
|
|
div(uk-grid).uk-grid-small.uk-flex-center
|
|
each sticker in roomStickers
|
|
.uk-width-auto
|
|
button(
|
|
type="button",
|
|
data-sticker-id= sticker._id,
|
|
data-sticker-slug= sticker.slug,
|
|
onclick="return dtp.app.chat.insertChatSticker(event);",
|
|
).uk-button.uk-button-text
|
|
+renderSticker(sticker)
|
|
else
|
|
.uk-text-center This room hasn't uploaded any #[a(href="/sticker") Stickers] yet
|
|
|
|
//- Favorite/Saved stickers
|
|
li
|
|
if Array.isArray(favoriteStickers) && (favoriteStickers.length > 0)
|
|
div(uk-grid).uk-grid-small.uk-flex-center
|
|
each sticker in favoriteStickers
|
|
.uk-width-auto
|
|
button(
|
|
type="button",
|
|
data-sticker-id= sticker._id,
|
|
data-sticker-slug= sticker.slug,
|
|
onclick="return dtp.app.chat.insertChatSticker(event);",
|
|
).uk-button.uk-button-text
|
|
+renderSticker(sticker)
|
|
else
|
|
.uk-text-center You haven't saved any Favorite stickers
|
|
|
|
.uk-width-auto
|
|
button(
|
|
type= "button",
|
|
title= "Attach image",
|
|
onclick="return dtp.app.chat.createAttachment(event);",
|
|
).uk-button.uk-button-default.uk-button-small
|
|
span
|
|
i.fas.fa-file-image
|
|
|
|
.uk-width-expand
|
|
if !options.hideHomeNav
|
|
.uk-text-small.uk-text-center.uk-text-truncate
|
|
a(href="/chat", title= "Chat Home").uk-button.uk-button-default.uk-button-small
|
|
span
|
|
i.fas.fa-home
|
|
|
|
.uk-width-auto
|
|
button(
|
|
id="chat-input-btn",
|
|
type="button",
|
|
onclick="return dtp.app.chat.toggleChatInput(event);",
|
|
title= "Toggle Chat Input",
|
|
).uk-button.uk-button-default.uk-button-small
|
|
span
|
|
i.fas.fa-edit
|
|
|
|
.uk-width-auto
|
|
button(
|
|
id="chat-send-btn",
|
|
type="submit",
|
|
title= "Send Message",
|
|
).uk-button.uk-button-primary.uk-button-small
|
|
span
|
|
i.far.fa-paper-plane
|
|
|
|
div(style="margin-top: 4px;")
|
|
.uk-flex.uk-flex-between
|
|
.uk-width-auto
|
|
+renderReactionButton('Applaud/clap', '👏', 'clap')
|
|
.uk-width-auto
|
|
+renderReactionButton("On Fire!", '🔥', 'fire')
|
|
.uk-width-auto
|
|
+renderReactionButton("Happy", "🤗", "happy")
|
|
.uk-width-auto
|
|
+renderReactionButton("Laugh", "🤣", "laugh")
|
|
.uk-width-auto
|
|
+renderReactionButton("Angry", "🤬", "angry")
|
|
.uk-width-auto
|
|
+renderReactionButton("Honk", "🤡", "honk")
|