Externalize strings

Also some cleanup. Work on issue #41.
This commit is contained in:
N-Pex 2021-05-20 12:33:59 +02:00
parent 3c60ad4f14
commit a78659b206
43 changed files with 402 additions and 288 deletions

View file

@ -115,71 +115,3 @@ export default {
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>
function playPauseAudio() {
if (player.src) {
if (player.paused || player.ended) {
// Change the button to a pause button
changeButtonType(btnPlayPause, 'pause');
player.play();
}
else {
// Change the button to a play button
changeButtonType(btnPlayPause, 'play');
player.pause();
}
}
}
// Stop the current media from playing, and return it to the start position
function stopAudio() {
if (player.src) {
player.pause();
if (player.currentTime) player.currentTime = 0;
}
}
// Toggles the media player's mute and unmute status
function muteVolume() {
if (player.src) {
if (player.muted) {
// Change the button to a mute button
changeButtonType(btnMute, 'mute');
player.muted = false;
}
else {
// Change the button to an unmute button
changeButtonType(btnMute, 'unmute');
player.muted = true;
}
}
}
// Replays the media currently loaded in the player
function replayAudio() {
if (player.src) {
resetPlayer();
player.play();
}
}
// Updates a button's title, innerHTML and CSS class
function changeButtonType(btn, value) {
btn.title = value;
btn.innerHTML = value;
btn.className = value;
}
function resetPlayer() {
progressBar.value = 0;
//clear the current song
player.src = '';
// Move the media back to the start
player.currentTime = 0;
// Set the play/pause button to 'play'
changeButtonType(btnPlayPause, 'play');
}

View file

@ -7,7 +7,7 @@
}"
>
<v-btn v-if="incoming" text @click.stop="startPrivateChat" class="ma-0 pa-0"
>Private chat with this user</v-btn
>{{ $t("menu.start_private_chat") }}</v-btn
>
</div>
</template>

View file

@ -2,10 +2,10 @@
<!-- Contact joined the chat -->
<div class="messageJoin">
<div v-if="displayNameChange">
{{ changer }} changed display name to {{ event.getContent().displayname }}
{{ $t('message.user_changed_display_name', { user: changer, displayName: event.getContent().displayname})}}
</div>
<div v-if="avatarChange">
{{ changer }} changed the avatar
{{ $t('message.user_changed_avatar', { user: changer})}}
</div>
</div>
</template>
@ -28,7 +28,7 @@ export default {
},
changer() {
if (this.event.getSender() == this.$matrix.currentUserId) {
return "You";
return this.$t("message.you");
}
if (this.displayNameChange) {
return this.event.getPrevContent().displayname;

View file

@ -1,7 +1,7 @@
<template>
<!-- Contact invited to the chat -->
<div class="messageJoin">
{{ event.getContent().displayname || stateEventDisplayName(event) }} was invited to the chat...
{{ $t('message.user_was_invited', {user: event.getContent().displayname || stateEventDisplayName(event)}) }}
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<!-- Contact joined the chat -->
<div class="messageJoin">
{{ stateEventDisplayName(event) }} joined the chat
{{ $t('message.user_joined',{user: stateEventDisplayName(event)}) }}
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<!-- Contact left the chat -->
<div class="messageJoin">
{{ stateEventDisplayName(event) }} left the chat
{{ $t('message.user_left',{user: stateEventDisplayName(event)}) }}
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<message-incoming v-bind="{...$props, ...$attrs}" v-on="$listeners">
<div class="bubble audio-bubble">
<audio-player :src="src">Audio file</audio-player>
<audio-player :src="src">{{ $t('fallbacks.audio_file')}}</audio-player>
</div>
</message-incoming>
</template>

View file

@ -3,7 +3,7 @@
<div class="bubble">
<div class="original-message" v-if="inReplyToText">
<div class="original-message-sender">
{{ inReplyToSender || "Someone" }} said:
{{ $t('message.user_said', {user: inReplyToSender || "Someone"}) }}
</div>
<div
class="original-message-text"
@ -11,14 +11,14 @@
/>
</div>
<div class="message">
<span>File: </span>
<span>{{ $t('file_prefix') }}</span>
<span
style="cursor: pointer"
@click.stop="$emit('download')"
v-html="linkify($sanitize(messageText))"
/>
<span class="edit-marker" v-if="event.replacingEventId()"
>(edited)</span
>{{ $t('edited') }}</span
>
</div>
</div>

View file

@ -3,7 +3,7 @@
<div class="bubble">
<div class="original-message" v-if="inReplyToText">
<div class="original-message-sender">
{{ inReplyToSender || "Someone" }} said:
{{ $t('message.user_said', {user: inReplyToSender || "Someone"}) }}
</div>
<div
class="original-message-text"
@ -13,7 +13,7 @@
<div class="message">
<span v-html="linkify($sanitize(messageText))" />
<span class="edit-marker" v-if="event.replacingEventId()"
>(edited)</span
>{{ $t('edited') }}</span
>
</div>
<!-- <div>{{ JSON.stringify(event) }}</div> -->

View file

@ -3,11 +3,11 @@
<div class="bubble image-bubble">
<v-responsive :aspect-ratio="16 / 9" :src="src">
<video :src="src" controls style="width: 100%; height: 100%">
Video file
{{$t('fallbacks.video_file')}}
</video>
<div v-if="downloadProgress" class="download-overlay">
<div class="text-center download-text">
{{ downloadProgress }}% downloaded
{{ $t('message.download_progress',{percentage: downloadProgress}) }}
</div>
</div>
</v-responsive>

View file

@ -12,25 +12,25 @@
<v-btn icon @click.stop="addReply" class="ma-0 pa-0">
<v-icon>reply</v-icon>
</v-btn>
<div>Reply</div>
<div>{{$t('menu.reply')}}</div>
</v-col>
<v-col v-if="isEditable">
<v-btn icon @click.stop="edit" class="ma-0 pa-0">
<v-icon>edit</v-icon>
</v-btn>
<div>Edit</div>
<div>{{$t('menu.edit')}}</div>
</v-col>
<v-col v-if="isRedactable">
<v-btn icon @click.stop="redact" class="ma-0 pa-0">
<v-icon>delete</v-icon>
</v-btn>
<div>Delete</div>
<div>{{$t('menu.delete')}}</div>
</v-col>
<v-col v-if="isDownloadable">
<v-btn icon @click.stop="download" class="ma-0 pa-0">
<v-icon>get_app</v-icon>
</v-btn>
<div>Download</div>
<div>{{$t('menu.download')}}</div>
</v-col>
</v-row>
</v-container>

View file

@ -18,7 +18,7 @@
<img v-if="userAvatar" :src="userAvatar" />
<span v-else class="white--text headline">{{ userAvatarLetter }}</span>
</v-avatar>
<!-- <div class="sender">{{ "You" }}</div> -->
<!-- <div class="sender">{{ $t('message.you') }}</div> -->
<div class="senderAndTime">
<div class="time">
{{ formatTime(event.event.origin_server_ts) }}

View file

@ -1,7 +1,7 @@
<template>
<message-outgoing v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<div class="audio-bubble">
<audio-player :src="src">Audio file</audio-player>
<audio-player :src="src">{{ $t('fallbacks.audio_file')}}</audio-player>
</div>
</message-outgoing>
</template>

View file

@ -3,7 +3,7 @@
<div class="bubble">
<div class="original-message" v-if="inReplyToText">
<div class="original-message-sender">
{{ inReplyToSender || "Someone" }} said:
{{ $t('message.user_said', {user: inReplyToSender || "Someone"}) }}
</div>
<div
class="original-message-text"
@ -19,7 +19,7 @@
v-html="linkify($sanitize(messageText))"
/>
<span class="edit-marker" v-if="event.replacingEventId()"
>(edited)</span
>{{ $t('edited') }}</span
>
</div>
</div>

View file

@ -3,7 +3,7 @@
<div class="bubble">
<div class="original-message" v-if="inReplyToText">
<div class="original-message-sender">
{{ inReplyToSender || "Someone" }} said:
{{ $t('message.user_said', {user: inReplyToSender || "Someone"}) }}
</div>
<div
class="original-message-text"
@ -14,7 +14,7 @@
<div class="message">
<span v-html="linkify($sanitize(messageText))" />
<span class="edit-marker" v-if="event.replacingEventId()"
>(edited)</span
>{{ $t('edited') }}</span
>
</div>
</div>

View file

@ -3,7 +3,7 @@
<div class="bubble image-bubble">
<v-responsive :aspect-ratio="16 / 9" class="ma-0 pa-0">
<video :src="src" controls style="width: 100%; height: 100%">
Video file
{{$t('fallbacks.video_file')}}
</video>
</v-responsive>
</div>

View file

@ -1,7 +1,7 @@
<template>
<!-- ROOM AVATAR CHANGED -->
<div class="statusEvent">
{{ stateEventDisplayName(event) }} changed the room avatar
{{ $t('message.user_changed_room_avatar',{user: stateEventDisplayName(event)}) }}
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<!-- ROOM AVATAR CHANGED -->
<div class="statusEvent">
{{ stateEventDisplayName(event) }} made room history {{ history(event) }}
{{ $t('message.user_changed_room_history',{user: stateEventDisplayName(event), type: history(event)}) }}
</div>
</template>
@ -15,13 +15,13 @@ export default {
const visibility = event.getContent().history_visibility;
switch (visibility) {
case "world_readable":
return "readable by anyone";
return this.$t('message.room_history_world_readable');
case "shared":
return "readable to all members in the room";
return this.$t('message.room_history_shared');
case "invited":
return "readable to members from when they were invited";
return this.$t('message.room_history_invited');
case "joined":
return "readable to members from when they joined";
return this.$t('message.room_history_joined');
}
return visibility;
}

View file

@ -1,7 +1,7 @@
<template>
<!-- ROOM JOIN RULES CHANGED -->
<div class="statusEvent">
{{ stateEventDisplayName(event) }} made the room {{ joinRule(event) }}
{{ $t('message.user_changed_join_rules', { user: stateEventDisplayName(event), type: joinRule(event)}) }}
</div>
</template>
@ -15,9 +15,9 @@ export default {
const joinRule = event.getContent().join_rule;
switch (joinRule) {
case "invite":
return "invite only";
return this.$t('message.room_joinrule_invite');
case "public":
return "public";
return this.$t('message.room_joinrule_public');
}
return joinRule;
}

View file

@ -1,8 +1,7 @@
<template>
<!-- ROOM NAME CHANGED -->
<div class="statusEvent">
{{ stateEventDisplayName(event) }} changed room name to
{{ event.getContent().name }}
{{ $t('message.user_changed_room_name', {user: stateEventDisplayName(event), name: event.getContent().name}) }}
</div>
</template>

View file

@ -1,8 +1,7 @@
<template>
<!-- ROOM TOPIC CHANGED -->
<div class="statusEvent">
{{ stateEventDisplayName(event) }} changed topic to
{{ event.getContent().topic }}
{{ $t('message.user_changed_room_topic', {user: stateEventDisplayName(event), topic: event.getContent().topic}) }}
</div>
</template>

View file

@ -102,7 +102,7 @@ export default {
}
// We don't have the original text (at the moment at least)
return "<original text>";
return this.$t('fallbacks.original_text');
}
return null;
},
@ -169,7 +169,7 @@ export default {
*/
stateEventDisplayName(event) {
if (event.getSender() == this.$matrix.currentUserId) {
return "You";
return this.$t('message.you');
}
if (this.room) {
const member = this.room.getMember(event.getSender());