Merge branch 'dev'
This commit is contained in:
commit
d8a50e1ca6
20 changed files with 326 additions and 194 deletions
|
|
@ -154,7 +154,7 @@ export default {
|
|||
document.documentElement.setAttribute("dir", "rtl");
|
||||
} else {
|
||||
this.$vuetify.rtl = false;
|
||||
document.documentElement.removeAttribute("dir");
|
||||
document.documentElement.setAttribute("dir", "ltr");
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
|
|
|
|||
|
|
@ -152,7 +152,23 @@ $admin-fg: white;
|
|||
margin: 0;
|
||||
padding-left: 2 * $chat-standard-padding-s;
|
||||
padding-right: 2 * $chat-standard-padding-s;
|
||||
padding-top: 0px;
|
||||
padding-top: 0;
|
||||
|
||||
&.reply-to {
|
||||
padding: 0;
|
||||
}
|
||||
.iput-area-inner-box {
|
||||
box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 27px;
|
||||
margin: 0px 20px;
|
||||
padding: 20px;
|
||||
|
||||
@media #{map-get($display-breakpoints, 'sm-and-down')} {
|
||||
margin: 0px 5px;
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.typing {
|
||||
font-family: "Inter", sans-serif;
|
||||
font-weight: 300;
|
||||
|
|
@ -264,6 +280,7 @@ $admin-fg: white;
|
|||
display: inline-block;
|
||||
width: 70%;
|
||||
max-width: 70%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.bubble.sticker-bubble {
|
||||
padding: 0px;
|
||||
|
|
@ -358,8 +375,9 @@ $admin-fg: white;
|
|||
display: inline-block;
|
||||
width: 70%;
|
||||
max-width: 70%;
|
||||
.v-image,
|
||||
video {
|
||||
cursor: pointer;
|
||||
|
||||
.v-image, video {
|
||||
border-radius: 10px 10px 0 10px;
|
||||
[dir="rtl"] & {
|
||||
border-radius: 10px 10px 10px 0px;
|
||||
|
|
|
|||
|
|
@ -60,16 +60,25 @@
|
|||
color: $very-very-purple;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.inactive {
|
||||
color: unset;
|
||||
|
||||
@media #{map-get($display-breakpoints, 'sm-and-up')} {
|
||||
&:hover {
|
||||
color: $very-very-purple;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.language-more {
|
||||
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.08);
|
||||
border-radius: 18px;
|
||||
border: 1px solid black;
|
||||
padding: 0px 5px !important;
|
||||
box-shadow: 0px 4px 4px 0px #00000040;
|
||||
background-color: #FFFFFF !important;
|
||||
padding: 0px 5px;
|
||||
background-color: #FFFFFF;
|
||||
|
||||
&:hover {
|
||||
background-color: black !important;
|
||||
background-color: black;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
10
src/assets/icons/audio_message.svg
Normal file
10
src/assets/icons/audio_message.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.3 KiB |
5
src/assets/icons/video_message.svg
Normal file
5
src/assets/icons/video_message.svg
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="70" height="70" viewBox="0 0 70 70" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="70" height="70" rx="12" fill="#242424"/>
|
||||
<circle cx="35" cy="35" r="14" fill="white" fill-opacity="0.8"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M32.6875 30.1891C32.2879 29.9393 31.7695 30.2266 31.7695 30.6979V39.302C31.7695 39.7733 32.2879 40.0606 32.6875 39.8108L39.5708 35.5088C39.9468 35.2738 39.9468 34.7262 39.5708 34.4912L32.6875 30.1891Z" fill="#242424"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 490 B |
|
|
@ -138,7 +138,7 @@
|
|||
"user_is_typing": "{user}གཏགས་བཞིན་འདུག",
|
||||
"scale_image": "པར་རིས་རྐྱོང་སྐུམ།",
|
||||
"your_message": "ཁྱེད་ཀྱི་བརྡ་ལན...",
|
||||
"replying_to_event": "དོན་རྐྱེན་ལ་ལན་འདེབས།: {message}",
|
||||
"replying_to": "{user}",
|
||||
"unread_messages": "བཀླགས་མེད་པའི་འཕྲིན་ཐུང་ཁག",
|
||||
"user_changed_room_topic": "{user} ཁ་བརྡ་ཁང་གི་བརྗོད་གཞི་{topic} ལ་བརྗེ་སོང་།",
|
||||
"user_changed_room_name": "{user} ཁ་བརྡ་ཁང་གི་མིང་ {name} ལ་བརྗེས་སོང་།",
|
||||
|
|
@ -169,7 +169,10 @@
|
|||
"user_powerlevel_change_from_to": "{powerOld} ཡི{user} ནས {powerNew}་ལ།",
|
||||
"room_powerlevel_change": "{user} {changes} ཡི་སྟོབས་ཤུགས་གནས་རིམ་བརྗེས་སོང་།",
|
||||
"user_changed_guest_access_open": "{user} མགྲོན་པོ་ཁ་བརྡ་ཁང་དུ་འཛུལ་བཅུག་སོང་།",
|
||||
"user_changed_guest_access_closed": "{user} མགྲོན་པོ་ཁ་བརྡ་ཁང་དུ་འཛུལ་བཅུག་མ་སོང་།"
|
||||
"user_changed_guest_access_closed": "{user} མགྲོན་པོ་ཁ་བརྡ་ཁང་དུ་འཛུལ་བཅུག་མ་སོང་།",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"power_level": {
|
||||
"moderator": "མདོ་འཛིན་པ།",
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@
|
|||
"user_changed_room_name": "{user} changed room name to {name}",
|
||||
"user_changed_room_topic": "{user} changed room topic to {topic}",
|
||||
"unread_messages": "Unread messages",
|
||||
"replying_to_event": "REPLYING TO EVENT: {message}",
|
||||
"replying_to": "Replying to {user}",
|
||||
"your_message": "Your message...",
|
||||
"scale_image": "Scale image",
|
||||
"user_is_typing": "{user} is typing",
|
||||
|
|
@ -59,7 +59,10 @@
|
|||
"room_powerlevel_change": "{user} changed powerlevel of {changes}",
|
||||
"user_powerlevel_change_from_to": "{user} from {powerOld} to {powerNew}",
|
||||
"user_changed_guest_access_closed": "{user} disallowed guests to join the room",
|
||||
"user_changed_guest_access_open": "{user} allowed guests to join the room"
|
||||
"user_changed_guest_access_open": "{user} allowed guests to join the room",
|
||||
"reply_image": "Image",
|
||||
"reply_audio_message": "Audio message",
|
||||
"reply_video": "Video"
|
||||
},
|
||||
"room": {
|
||||
"members": "no members | 1 member | {count} members",
|
||||
|
|
|
|||
|
|
@ -123,7 +123,7 @@
|
|||
"user_is_typing": "{user} esta escribiendo",
|
||||
"scale_image": "Escala de imagen",
|
||||
"your_message": "Tu mensaje...",
|
||||
"replying_to_event": "RESPONDIENDO A UN EVENTO: {message}",
|
||||
"replying_to": "{user}",
|
||||
"unread_messages": "Mensajes no leídos",
|
||||
"user_changed_room_name": "{user} cambió el nombre de la sala {name}",
|
||||
"user_changed_room_topic": "{user} cambió el tema de la sala a {topic}",
|
||||
|
|
@ -150,7 +150,10 @@
|
|||
"user_created_room": "{user} creo la sala",
|
||||
"user_aliased_room": "{user} hizo el alias de la sala {alias}",
|
||||
"user_changed_display_name": "{user}cambio su nombre para mostrar a {displayName}",
|
||||
"you": "Tú"
|
||||
"you": "Tú",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"menu": {
|
||||
"login": "Iniciar sesión",
|
||||
|
|
|
|||
|
|
@ -28,7 +28,10 @@
|
|||
"file_prefix": "Fil: ",
|
||||
"user_said": "{user} sa:",
|
||||
"user_created_room": "{user} opprettet rommet",
|
||||
"you": "Deg"
|
||||
"you": "Deg",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"device_list": {
|
||||
"title": "Enheter",
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@
|
|||
"user_changed_room_name": "{user} alterou o nome da sala para {name}",
|
||||
"user_changed_room_topic": "{user} alterou o assunto da sala para {topic}",
|
||||
"unread_messages": "Mensagens não lidas",
|
||||
"replying_to_event": "RESPONDENDO AO EVENTO: {message}",
|
||||
"replying_to": "{user}",
|
||||
"your_message": "A sua mensagem...",
|
||||
"scale_image": "Escala da imagem",
|
||||
"user_is_typing": "{user} está digitando",
|
||||
|
|
@ -72,7 +72,10 @@
|
|||
"room_powerlevel_change": "{user} alterou o nível de {changes}",
|
||||
"user_powerlevel_change_from_to": "{user} de {powerOld} para {powerNew}",
|
||||
"user_changed_guest_access_closed": "{user} não permitiu que os convidados entrassem na sala",
|
||||
"user_changed_guest_access_open": "{user} permitiu que convidados entrassem na sala"
|
||||
"user_changed_guest_access_open": "{user} permitiu que convidados entrassem na sala",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"room": {
|
||||
"members": "sem membros | 1 membro | {count} membros",
|
||||
|
|
|
|||
|
|
@ -193,7 +193,7 @@
|
|||
"user_is_typing": "{user} tastează",
|
||||
"scale_image": "Imagine la scară",
|
||||
"your_message": "Mesajul dumneavoastră...",
|
||||
"replying_to_event": "RĂSPUNS LA EVENIMENT: {message}",
|
||||
"replying_to": "{user}",
|
||||
"unread_messages": "Mesaje necitite",
|
||||
"user_changed_room_topic": "{user} a schimbat subiectul camerei în {topic}",
|
||||
"user_changed_room_name": "{user} a schimbat numele camerei în {name}",
|
||||
|
|
@ -220,7 +220,10 @@
|
|||
"user_changed_display_name": "{user} a schimbat numele de afișare în {displayName}",
|
||||
"user_aliased_room": "{user} a creat aliasul camerei {alias}",
|
||||
"user_created_room": "{user} a creat camera",
|
||||
"you": "Tu"
|
||||
"you": "Tu",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"language_display_name": "Engleză",
|
||||
"fallbacks": {
|
||||
|
|
|
|||
|
|
@ -22,6 +22,9 @@
|
|||
"message": {
|
||||
"download_progress": "{percentage}% බාගත වී ඇත",
|
||||
"file_prefix": "ගොනුව: ",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": "",
|
||||
"you": "ඔබ"
|
||||
},
|
||||
"login": {
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@
|
|||
"users_are_typing": "ئەزالىرى يېزىۋاتىدۇ {نەپەر}",
|
||||
"user_is_typing": "قوللانغۇچى يېزىۋاتىدۇ",
|
||||
"your_message": "ئۇچۇرىڭىز ...",
|
||||
"replying_to_event": "پائالىيەتكە جاۋاب: {ئۇچۇر}",
|
||||
"replying_to": "{user}",
|
||||
"unread_messages": "ئوقۇلمىغان ئۇچۇرلار",
|
||||
"user_changed_room_topic": "قوللانغۇچى مۇنازىرەخانىنىڭ تېمىسىنى ئۆزگەرتتى",
|
||||
"user_changed_room_name": "قوللانغۇچى مۇنازىرەخانىنىڭ ئىسمىنى ئۆزگەرتتى",
|
||||
|
|
@ -59,7 +59,10 @@
|
|||
"room_history_invited": "ئەزالار تەكلىپ قىلىنغان ۋاقىتتىن باشلاپ ئوقۇغىلى بولىدۇ",
|
||||
"room_history_shared": "مۇنازىرەخانىدىكى ھەركىم ئوقۇيالايدۇ",
|
||||
"room_history_world_readable": "ھەركىم ئوقۇيالايدۇ",
|
||||
"user_changed_room_history": "قوللانغۇچى» مۇنازىرەخانىنىڭ تارىخىنى قۇردى»"
|
||||
"user_changed_room_history": "قوللانغۇچى» مۇنازىرەخانىنىڭ تارىخىنى قۇردى»",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"language_display_name": "ئىنگىلزچە",
|
||||
"new_room": {
|
||||
|
|
|
|||
|
|
@ -103,9 +103,12 @@
|
|||
"user_is_typing": "{user} 正在输入",
|
||||
"scale_image": "缩放图像",
|
||||
"your_message": "你的信息...",
|
||||
"replying_to_event": "回复事件:{message}",
|
||||
"replying_to": "{user}",
|
||||
"user_changed_guest_access_open": "{user} 允许客人加入聊天室",
|
||||
"user_changed_guest_access_closed": "{user} 不允许客人加入聊天室"
|
||||
"user_changed_guest_access_closed": "{user} 不允许客人加入聊天室",
|
||||
"reply_image": "",
|
||||
"reply_audio_message": "",
|
||||
"reply_video": ""
|
||||
},
|
||||
"menu": {
|
||||
"login": "登录",
|
||||
|
|
|
|||
|
|
@ -119,176 +119,199 @@
|
|||
</div>
|
||||
|
||||
<!-- Input area -->
|
||||
<v-container v-if="room" fluid class="input-area-outer">
|
||||
<!-- "Scroll to end"-button -->
|
||||
<v-btn
|
||||
id="btn-scroll-to-end"
|
||||
class="scroll-to-end"
|
||||
v-show="showScrollToEnd"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="scrollToEndOfTimeline"
|
||||
>
|
||||
<v-icon color="white">arrow_downward</v-icon>
|
||||
</v-btn>
|
||||
|
||||
<v-row class="ma-0 pa-0">
|
||||
<div v-if="replyToEvent">
|
||||
{{
|
||||
$t("message.replying_to_event", {
|
||||
message: replyToEvent.getContent().body,
|
||||
})
|
||||
}}
|
||||
</div>
|
||||
|
||||
<!-- CONTACT IS TYPING -->
|
||||
<div class="typing">
|
||||
{{ typingMembersString }}
|
||||
</div>
|
||||
</v-row>
|
||||
<v-row class="input-area-inner align-center">
|
||||
<v-col class="flex-grow-1 flex-shrink-1 ma-0 pa-0">
|
||||
<v-textarea
|
||||
id="message-input"
|
||||
height="undefined"
|
||||
ref="messageInput"
|
||||
full-width
|
||||
auto-grow
|
||||
rows="1"
|
||||
v-model="currentInput"
|
||||
no-resize
|
||||
class="input-area-text"
|
||||
:placeholder="$t('message.your_message')"
|
||||
hide-details
|
||||
background-color="white"
|
||||
v-on:keydown.enter.prevent="
|
||||
() => {
|
||||
sendCurrentTextMessage();
|
||||
}
|
||||
"
|
||||
/>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
v-if="editedEvent || replyToEvent"
|
||||
<v-container v-if="room" fluid :class="['input-area-outer', replyToEvent ? 'reply-to':'']">
|
||||
<div :class="[replyToEvent ? 'iput-area-inner-box':'']">
|
||||
<!-- "Scroll to end"-button -->
|
||||
<v-btn
|
||||
class="scroll-to-end"
|
||||
v-show="showScrollToEnd"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="scrollToEndOfTimeline"
|
||||
>
|
||||
<v-btn
|
||||
id="btn-cancel-reply"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="cancelEditReply"
|
||||
>
|
||||
<v-icon color="white">cancel</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-icon color="white">arrow_downward</v-icon>
|
||||
</v-btn>
|
||||
|
||||
<v-col
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
v-if="!currentInput || currentInput.length == 0 || showRecorder"
|
||||
>
|
||||
<v-btn
|
||||
id="btn-microphone"
|
||||
v-if="canRecordAudio"
|
||||
class="mic-button"
|
||||
ref="mic_button"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
v-blur
|
||||
style="z-index: 10"
|
||||
v-longTap:250="[showRecordingUI, startRecording]"
|
||||
<v-row class="ma-0 pa-0">
|
||||
<div v-if="replyToEvent" class="row">
|
||||
<div class="col col-auto">
|
||||
<v-btn
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="cancelEditReply"
|
||||
>
|
||||
<v-icon color="white">cancel</v-icon>
|
||||
</v-btn>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="font-weight-medium">{{ $t("message.replying_to", { user: replyToEvent.sender.name }) }}</div>
|
||||
<div v-if="replyToContentType === 'm.text'"> {{ replyToEvent.getContent().body }} </div>
|
||||
<div v-if="replyToContentType === 'm.image'"> {{ $t("message.reply_image") }} </div>
|
||||
<div v-if="replyToContentType === 'm.audio'"> {{ $t("message.reply_audio_message") }} </div>
|
||||
<div v-if="replyToContentType === 'm.video'"> {{ $t("message.reply_video") }} </div>
|
||||
</div>
|
||||
<div class="col col-auto" v-if="replyToContentType !== 'm.text'">
|
||||
<img
|
||||
v-if="replyToContentType === 'm.image'"
|
||||
width="150px"
|
||||
:src="replyToImg"
|
||||
class="rounded"
|
||||
/>
|
||||
<v-img
|
||||
v-if="replyToContentType === 'm.audio'"
|
||||
src="@/assets/icons/audio_message.svg"
|
||||
/>
|
||||
<v-img
|
||||
v-if="replyToContentType === 'm.video'"
|
||||
src="@/assets/icons/video_message.svg"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- CONTACT IS TYPING -->
|
||||
<div class="typing">
|
||||
{{ typingMembersString }}
|
||||
</div>
|
||||
</v-row>
|
||||
<v-row class="input-area-inner align-center">
|
||||
<v-col class="flex-grow-1 flex-shrink-1 ma-0 pa-0">
|
||||
<v-textarea
|
||||
height="undefined"
|
||||
ref="messageInput"
|
||||
full-width
|
||||
auto-grow
|
||||
rows="1"
|
||||
v-model="currentInput"
|
||||
no-resize
|
||||
class="input-area-text"
|
||||
:placeholder="$t('message.your_message')"
|
||||
hide-details
|
||||
background-color="white"
|
||||
v-on:keydown.enter.prevent="
|
||||
() => {
|
||||
sendCurrentTextMessage();
|
||||
}
|
||||
"
|
||||
/>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
v-if="editedEvent"
|
||||
>
|
||||
<v-icon :color="showRecorder ? 'white' : 'black'">mic</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
<v-btn
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="cancelEditReply"
|
||||
>
|
||||
<v-icon color="white">cancel</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
v-if="!currentInput || currentInput.length == 0 || showRecorder"
|
||||
>
|
||||
<v-btn
|
||||
v-if="canRecordAudio"
|
||||
class="mic-button"
|
||||
ref="mic_button"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
v-blur
|
||||
style="z-index: 10"
|
||||
v-longTap:250="[showRecordingUI, startRecording]"
|
||||
>
|
||||
<v-icon :color="showRecorder ? 'white' : 'black'">mic</v-icon>
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-else
|
||||
class="mic-button"
|
||||
ref="mic_button"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
v-blur
|
||||
style="z-index: 10"
|
||||
@click.stop="showNoRecordingAvailableDialog = true"
|
||||
>
|
||||
<v-icon :color="showRecorder ? 'white' : 'black'">mic</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
v-else
|
||||
id="btn-microphone"
|
||||
class="mic-button"
|
||||
ref="mic_button"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
v-blur
|
||||
style="z-index: 10"
|
||||
@click.stop="showNoRecordingAvailableDialog = true"
|
||||
>
|
||||
<v-icon :color="showRecorder ? 'white' : 'black'">mic</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-btn
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="sendCurrentTextMessage"
|
||||
:disabled="sendButtonDisabled"
|
||||
>
|
||||
<v-icon color="white">{{
|
||||
editedEvent ? "save" : "arrow_upward"
|
||||
}}</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
v-else
|
||||
>
|
||||
<v-btn
|
||||
id="btn-send"
|
||||
fab
|
||||
small
|
||||
elevation="0"
|
||||
color="black"
|
||||
@click.stop="sendCurrentTextMessage"
|
||||
:disabled="sendButtonDisabled"
|
||||
<v-col
|
||||
v-if="$config.shortCodeStickers"
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
>
|
||||
<v-icon color="white">{{
|
||||
editedEvent ? "save" : "arrow_upward"
|
||||
}}</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
|
||||
<v-col
|
||||
v-if="$config.shortCodeStickers"
|
||||
class="input-area-button text-center flex-grow-0 flex-shrink-1"
|
||||
>
|
||||
<v-btn
|
||||
id="btn-stickers"
|
||||
v-if="!showRecorder"
|
||||
icon
|
||||
large
|
||||
color="black"
|
||||
@click="showStickerPicker"
|
||||
:disabled="attachButtonDisabled"
|
||||
>
|
||||
<v-icon large>face</v-icon>
|
||||
</v-btn>
|
||||
</v-col>
|
||||
|
||||
<v-col class="input-area-button text-center flex-grow-0 flex-shrink-1">
|
||||
<label icon flat ref="attachmentLabel">
|
||||
<v-btn
|
||||
v-if="!showRecorder"
|
||||
id="btn-attach"
|
||||
icon
|
||||
large
|
||||
color="black"
|
||||
@click="showAttachmentPicker"
|
||||
@click="showStickerPicker"
|
||||
:disabled="attachButtonDisabled"
|
||||
>
|
||||
<v-icon x-large>add_circle_outline</v-icon>
|
||||
<v-icon large>face</v-icon>
|
||||
</v-btn>
|
||||
<input
|
||||
id="attachment-picker"
|
||||
ref="attachment"
|
||||
type="file"
|
||||
name="attachment"
|
||||
@change="handlePickedAttachment($event)"
|
||||
accept="image/*|audio/*|video/*|application/pdf"
|
||||
style="display: none"
|
||||
/>
|
||||
</label>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VoiceRecorder
|
||||
:micButtonRef="$refs.mic_button"
|
||||
:ptt="showRecorderPTT"
|
||||
:show="showRecorder"
|
||||
v-on:close="showRecorder = false"
|
||||
v-on:file="onVoiceRecording"
|
||||
/>
|
||||
</v-col>
|
||||
|
||||
<v-col class="input-area-button text-center flex-grow-0 flex-shrink-1">
|
||||
<label icon flat ref="attachmentLabel">
|
||||
<v-btn
|
||||
v-if="!showRecorder"
|
||||
icon
|
||||
large
|
||||
color="black"
|
||||
@click="showAttachmentPicker"
|
||||
:disabled="attachButtonDisabled"
|
||||
>
|
||||
<v-icon x-large>add_circle_outline</v-icon>
|
||||
</v-btn>
|
||||
<input
|
||||
ref="attachment"
|
||||
type="file"
|
||||
name="attachment"
|
||||
@change="handlePickedAttachment($event)"
|
||||
accept="image/*|audio/*|video/*|application/pdf"
|
||||
style="display: none"
|
||||
/>
|
||||
</label>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<VoiceRecorder
|
||||
:micButtonRef="$refs.mic_button"
|
||||
:ptt="showRecorderPTT"
|
||||
:show="showRecorder"
|
||||
v-on:close="showRecorder = false"
|
||||
v-on:file="onVoiceRecording"
|
||||
/>
|
||||
</div>
|
||||
</v-container>
|
||||
|
||||
<div v-if="currentImageInputPath">
|
||||
|
|
@ -521,7 +544,6 @@ ScrollPosition.prototype.prepareFor = function (direction) {
|
|||
|
||||
export default {
|
||||
name: "Chat",
|
||||
|
||||
components: {
|
||||
ChatHeader,
|
||||
MessageIncomingText,
|
||||
|
|
@ -585,6 +607,8 @@ export default {
|
|||
selectedEvent: null,
|
||||
editedEvent: null,
|
||||
replyToEvent: null,
|
||||
replyToImg: null,
|
||||
replyToContentType: null,
|
||||
showNoRecordingAvailableDialog: false,
|
||||
showContextMenu: false,
|
||||
showContextMenuAnchor: null,
|
||||
|
|
@ -1460,9 +1484,22 @@ export default {
|
|||
this.sendQuickReaction({ reaction: e.emoji, event: e.event });
|
||||
},
|
||||
|
||||
setReplyToImage(event) {
|
||||
util
|
||||
.getThumbnail(this.$matrix.matrixClient, event)
|
||||
.then((url) => {
|
||||
this.replyToImg = url;
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log("Failed to fetch thumbnail: ", err);
|
||||
});
|
||||
},
|
||||
|
||||
addReply(event) {
|
||||
this.replyToEvent = event;
|
||||
this.$refs.messageInput.focus();
|
||||
this.replyToContentType= event.getContent().msgtype;
|
||||
this.setReplyToImage(event);
|
||||
},
|
||||
|
||||
edit(event) {
|
||||
|
|
|
|||
|
|
@ -77,8 +77,11 @@
|
|||
<div class="join-lang">
|
||||
<h3 class="mb-2">{{ $t("profile.select_language") }}</h3>
|
||||
<v-row class="align-center">
|
||||
<v-col v-for="(lang,key) in getSortedLangByActive.slice(0, 4)" :key="key">
|
||||
<span :class="$i18n.locale==lang.value?'active':''" > {{lang.text}} </span>
|
||||
<v-col v-for="lang in activeLanguage" :key="lang.value">
|
||||
<span class="active">{{ lang.text }}</span>
|
||||
</v-col>
|
||||
<v-col v-for="(lang, key) in getDisplayLanguage.slice(0,3)" :key="key">
|
||||
<button class="inactive" @click="updateLanguage(lang.value)">{{ lang.text }}</button>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn
|
||||
|
|
@ -202,16 +205,13 @@ export default {
|
|||
this.$store.commit("setUseLocalStorage", rememberMe);
|
||||
},
|
||||
},
|
||||
|
||||
getSortedLangByActive() {
|
||||
const context = this;
|
||||
return this.getLanguages().sort(function(lang) {
|
||||
if(lang.value == context.$i18n.locale) {
|
||||
return -1;
|
||||
} else {
|
||||
return 1;
|
||||
}
|
||||
});
|
||||
getDisplayLanguage() {
|
||||
let displayLanguages = [...this.getLanguages()];
|
||||
return displayLanguages.filter(lang => lang.display && lang.value !== this.$i18n.locale);
|
||||
},
|
||||
activeLanguage() {
|
||||
let activeLanguages = [...this.getLanguages()]
|
||||
return activeLanguages.filter(lang => lang.value === this.$i18n.locale);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
|
|||
|
|
@ -3,18 +3,25 @@ export default {
|
|||
return {
|
||||
languages: [],
|
||||
activeLang:null,
|
||||
displayLanguage: ['en','bo','zh_Hans','ug']
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getLanguages() {
|
||||
return this.languages;
|
||||
},
|
||||
updateLanguage(lang) {
|
||||
this.$i18n.locale = lang;
|
||||
this.$store.commit('setLanguage', lang);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const context = this
|
||||
for (const locale of Object.keys(this.$i18n.messages)) {
|
||||
this.languages.push({
|
||||
text: this.$i18n.messages[locale].language_display_name || locale,
|
||||
value: locale,
|
||||
display: context.displayLanguage.includes(locale)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +1,22 @@
|
|||
<template>
|
||||
<message-incoming v-bind="{...$props, ...$attrs}" v-on="$listeners">
|
||||
<div class="bubble image-bubble">
|
||||
<message-incoming v-bind="{...$props, ...$attrs}" v-on="$listeners">
|
||||
<div class="bubble image-bubble">
|
||||
<v-img
|
||||
:aspect-ratio="16 / 9"
|
||||
ref="image"
|
||||
:src="src"
|
||||
:cover="cover"
|
||||
:contain="contain"
|
||||
@click.stop="dialog = true"
|
||||
/>
|
||||
</div>
|
||||
</message-incoming>
|
||||
<v-dialog
|
||||
v-model="dialog"
|
||||
:width="$vuetify.breakpoint.smAndUp ? '940px' : '90%'"
|
||||
>
|
||||
<v-img :src="src"/>
|
||||
</v-dialog>
|
||||
</message-incoming>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -24,6 +31,7 @@ export default {
|
|||
src: null,
|
||||
cover: true,
|
||||
contain: false,
|
||||
dialog: false
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -7,8 +7,15 @@
|
|||
:src="src"
|
||||
:cover="cover"
|
||||
:contain="contain"
|
||||
@click.stop="dialog = true"
|
||||
/>
|
||||
</div>
|
||||
<v-dialog
|
||||
v-model="dialog"
|
||||
:width="$vuetify.breakpoint.smAndUp ? '940px' : '90%'"
|
||||
>
|
||||
<v-img :src="src"/>
|
||||
</v-dialog>
|
||||
</message-outgoing>
|
||||
</template>
|
||||
|
||||
|
|
@ -24,6 +31,7 @@ export default {
|
|||
src: null,
|
||||
cover: true,
|
||||
contain: false,
|
||||
dialog: false
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -79,6 +79,9 @@ export default {
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
setRoomJoinRule(ignoredJoinRule) {
|
||||
// Do nothing in the general mixin, override in RoomInfo.vue
|
||||
},
|
||||
getRoomJoinRule() {
|
||||
return this.$matrix.getRoomJoinRule(this.room);
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue