1. Add copy Contact link to profile 2. move copyLink changes into component

This commit is contained in:
10G Meow 2023-06-18 13:11:44 +03:00
parent 37c254f8e1
commit 031e22b5f1
16 changed files with 144 additions and 98 deletions

View file

@ -956,30 +956,6 @@ body {
font-size: 16 * $chat-text-size !important;
}
.qr-container {
background-color: white;
border-radius: 8px;
margin-top: 20px !important;
.qr {
width: 60px;
height: 60px;
background-color: #e0e0e0;
}
.link {
font-family: "Inter", sans-serif;
font-size: 16px;
text-decoration: underline;
color: #3d6eff;
overflow-wrap: anywhere;
}
}
.link-copied-in-place .v-btn__content {
font-family: "Inter", sans-serif !important;
font-size: 12px !important;
text-transform: none !important;
color: #3d6eff;
}
.filled-button {
@media #{map-get($display-breakpoints, 'sm-and-up')} {
min-width: 180px !important;
@ -1080,7 +1056,7 @@ body {
}
.profile {
background-color: white;
background-color: #e8e8e8;
height: 100%;
.chat-header {
background-color: transparent;

View file

@ -29,7 +29,7 @@
"join_invite": "ཁ་སྣོན་བྱས་པའི་གྲོགས་ཁོ་ན།",
"permissions": "ནང་འཛུལ་གྱི་ཆོག་མཆན་ཁག",
"created_by": "{user} བཟོས།",
"copy_link": "གདན་ཞུ་འབྲེལ་ཐག་པར་བཤུས་རྒྱོབས།",
"copy_invite_link": "གདན་ཞུ་འབྲེལ་ཐག་པར་བཤུས་རྒྱོབས།",
"scan_code": "བཤེར་རིས་བཤེར་ཏེ་ཁ་བརྡ་ཁང་དུ་འཛུལ།",
"user_admin": "དོ་དམ་པ།",
"experimental_features": "ཚོད་ལྟའི་ཁྱད་ཆོས་ཁག",

View file

@ -187,7 +187,7 @@
"permissions": "Beitrittsberechtigungen",
"join_invite": "Nur hinzugefügte Personen",
"join_public": "Jeder mit einem Link",
"copy_link": "Link zur Einladung kopieren",
"copy_invite_link": "Link zur Einladung kopieren",
"link_copied": "Link kopiert!",
"purge": "Raum löschen",
"members": "Mitglieder",

View file

@ -263,7 +263,8 @@
"permissions": "Join Permissions",
"join_invite": "Only People Added",
"join_public": "Anyone with a link",
"copy_link": "Copy invite link",
"copy_invite_link": "Copy invite link",
"copy_link": "Copy link",
"link_copied": "Link copied!",
"purge": "Delete room",
"members": "Members",
@ -284,7 +285,9 @@
"read_only_room": "Read only room",
"read_only_room_info": "Only admins and moderators are allowed to send to the room",
"make_public": "Make Public",
"make_public_warning": "warning: Full message history will be visible to new participants"
"make_public_warning": "warning: Full message history will be visible to new participants",
"contact_link": "My Contact Link",
"contact_link_desc": "Share your contact link. When opened, a direct message will be started with you."
},
"room_info_sheet": {
"this_room": "This room",

View file

@ -26,7 +26,7 @@
"leave_room": "Salir",
"view_profile": "Vista",
"identity_temporary": "Tu identidad {displayName} es temporal. Puedes cambiar tu nombre o establecer una contraseña para conservarla.",
"copy_link": "Copiar el enlace de invitación",
"copy_invite_link": "Copiar el enlace de invitación",
"scan_code": "Escanear para unirse a la sala"
},
"purge_room": {

View file

@ -184,7 +184,7 @@
"permissions": "Autorisations dadhésion",
"join_invite": "Seules les personnes ajoutées",
"join_public": "Quiconque avec un lien",
"copy_link": "Copier le lien dinvitation",
"copy_invite_link": "Copier le lien dinvitation",
"link_copied": "Lien copié !",
"purge": "Supprimer le salon",
"user_you": "{user} (vous)",

View file

@ -194,7 +194,7 @@
"leave_room": "Lascia",
"scan_code": "Scansiona per entrare nella stanza",
"version_info": "Realizzato da Guardian Project. Versione: {version}",
"copy_link": "Copia il collegamento di invito"
"copy_invite_link": "Copia il collegamento di invito"
},
"voice_recorder": {
"failed_to_record": "Impossibile registrare laudio",

View file

@ -60,7 +60,7 @@
"members": "Medlemmer",
"purge": "Slett rom",
"link_copied": "Lenke kopiert.",
"copy_link": "Kopier invitasjonslenke",
"copy_invite_link": "Kopier invitasjonslenke",
"created_by": "Opprettet av {user}",
"title": "Romdetaljer"
},

View file

@ -252,7 +252,7 @@
"permissions": "Permissões de ingresso",
"join_invite": "Somente pessoas adicionadas",
"join_public": "Qualquer pessoa com um link",
"copy_link": "Copie o link do convite",
"copy_invite_link": "Copie o link do convite",
"link_copied": "Link copiado!",
"purge": "Excluir a sala",
"members": "Membros",

View file

@ -53,7 +53,7 @@
"members": "Membri",
"purge": "Ștergeți camera",
"link_copied": "Link copiat!",
"copy_link": "Copiați link-ul de invitație",
"copy_invite_link": "Copiați link-ul de invitație",
"join_public": "Oricine are un link",
"join_invite": "Numai persoane adăugate",
"permissions": "Permisiuni de aderare",

View file

@ -144,7 +144,7 @@
"members": "ئەزالار",
"purge": "ئۆينى ئۆچۈرۈڭ",
"link_copied": "ئۇلىنىش كۆچۈرۈلدى!",
"copy_link": "تەكلىپ ئۇلانمىسىنى كۆچۈرۈڭ",
"copy_invite_link": "تەكلىپ ئۇلانمىسىنى كۆچۈرۈڭ",
"join_public": "ئۇلىنىشى بارلار",
"join_invite": "پەقەت كىشىلەر قوشۇلدى",
"permissions": "ئىجازەتكە قوشۇلۇڭ",

View file

@ -29,7 +29,7 @@
"join_invite": "仅添加人员",
"permissions": "加入权限",
"created_by": "由 {user} 创建",
"copy_link": "复制邀请链接",
"copy_invite_link": "复制邀请链接",
"scan_code": "扫一扫加入聊天室",
"user_admin": "管理员",
"voice_mode": "语音模块",

View file

@ -160,7 +160,7 @@ export default {
const roomLink = this.publicRoomLink;
if (roomLink) {
items.push({
icon: '$vuetify.icons.ic_link', text: this.$t('room_info.copy_link'), handler: () => {
icon: '$vuetify.icons.ic_link', text: this.$t('room_info.copy_invite_link'), handler: () => {
this.$copyText(this.publicRoomLink);
}
});

View file

@ -0,0 +1,99 @@
<template>
<v-expand-transition>
<v-card class="ma-3" v-show="locationLink" flat>
<v-container>
<slot/>
<v-row cols="12" class="qr-container ma-3">
<v-col cols="auto" v-if="$slots.qrCode">
<slot name="qrCode"/>
</v-col>
<v-col align-self="center" class="public-link">
<div class="link">{{ locationLink }}</div>
</v-col>
</v-row>
<v-row align="center" class="mt-0 pt-0">
<v-col align="center" class="mt-0 pt-0">
<v-btn
id="btn-copy-room-link"
:color="publicRoomLinkCopied ? '#DEE6FF' : 'black'"
depressed
@click.stop="copyRoomLink"
:class="{'filled-button' : true, 'link-copied-in-place' : publicRoomLinkCopied}"
>{{ $t(`room_info.${publicRoomLinkCopied ? 'link_copied' : i18nCopyLinkKey}`) }}</v-btn
>
</v-col>
</v-row>
</v-container>
</v-card>
</v-expand-transition>
</template>
<script>
export default {
props: {
locationLink: {
type: String
},
i18nCopyLinkKey: {
type: String,
default: 'copy_link'
}
},
data() {
return {
publicRoomLinkCopied: false,
}
},
methods: {
copyRoomLink() {
if(this.publicRoomLinkCopied) return
const self = this;
this.$copyText(this.locationLink).then(
function (ignored) {
// Success!
self.publicRoomLinkCopied = true;
setInterval(() => {
// Hide again
self.publicRoomLinkCopied = false;
}, 3000);
},
function (e) {
console.log(e);
}
);
}
}
}
</script>
<style lang="scss">
.qr-container {
background-color: white;
border-radius: 8px;
margin-top: 20px !important;
.qr {
width: 60px;
height: 60px;
background-color: #e0e0e0;
}
.public-link {
background-color: #D6D5FC33;
border-radius: 11px;
.link {
font-family: "Inter", sans-serif;
font-size: 16px;
text-decoration: underline;
color: #3d6eff;
overflow-wrap: anywhere;
}
}
}
.link-copied-in-place .v-btn__content {
font-family: "Inter", sans-serif !important;
font-size: 12px !important;
text-transform: none !important;
color: #3d6eff;
}
</style>

View file

@ -49,7 +49,7 @@
</v-col>
<v-col class="flex-shrink-1 flex-grow-1">
<div class="h1">{{ displayName }}</div>
<div class="text-center">{{ $matrix.currentUser.user_id }}</div>
<div class="text-center">{{ currentUserId }}</div>
<!-- <div v-if="$matrix.currentUser.is_guest">
{{ $t("profile.temporary_identity") }}
</div> -->
@ -65,6 +65,11 @@
</v-row>
</v-container>
<copy-link :locationLink="directMessageLink" >
<v-card-title class="h2">{{ $t("room_info.contact_link") }}</v-card-title>
<v-card-text>{{ $t("room_info.contact_link_desc") }}</v-card-text>
</copy-link>
<v-container class="mt-2 pa-5">
<ActionRow
@click="showEditPasswordDialog = true"
@ -201,6 +206,7 @@ import ActionRow from "./ActionRow.vue";
import util from "../plugins/utils";
import profileInfoMixin from "./profileInfoMixin";
import LogoutRoomDialog from './LogoutRoomDialog.vue';
import CopyLink from "./CopyLink.vue"
export default {
name: "Profile",
@ -209,6 +215,7 @@ export default {
ActionRow,
SelectLanguageDialog,
LogoutRoomDialog,
CopyLink
},
data() {
return {
@ -232,6 +239,12 @@ export default {
},
computed: {
currentUserId() {
return this.$matrix.currentUser.user_id
},
directMessageLink() {
return `${window.location.origin}/#/user/${this.currentUserId}`
},
passwordsMatch() {
return (
!this.newPasswordHasError &&
@ -239,7 +252,7 @@ export default {
this.newPassword2 &&
this.newPassword1 == this.newPassword2
);
},
}
},
methods: {

View file

@ -78,45 +78,16 @@
{{ $t("room_info.created_by", { user: creator }) }}
</div>
</div>
<v-expand-transition>
<v-container fluid class="pa-0" v-show="publicRoomLink">
<v-row cols="12" class="qr-container ma-3">
<v-col cols="auto">
<canvas
@click.stop="showFullScreenQR = true"
ref="roomQr"
class="qr"
id="room-qr"
></canvas>
</v-col>
<v-col align-self="center">
<div class="link">{{ publicRoomLink }}</div>
</v-col>
</v-row>
<v-row align="center" class="mt-0 pt-0">
<v-col align="center" class="mt-0 pt-0">
<v-btn
v-if="publicRoomLinkCopied"
id="btn-copy-room-link"
color="#DEE6FF"
depressed
class="filled-button link-copied-in-place"
>{{ $t("room_info.link_copied") }}</v-btn
>
<v-btn
v-else
id="btn-copy-room-link"
color="black"
depressed
class="filled-button"
@click.stop="copyRoomLink"
>{{ $t("room_info.copy_link") }}</v-btn
>
</v-col>
</v-row>
</v-container>
</v-expand-transition>
<copy-link :locationLink="publicRoomLink" i18nCopyLinkKey="copy_invite_link">
<template slot="qrCode">
<canvas
@click.stop="showFullScreenQR = true"
ref="roomQr"
class="qr"
id="room-qr"
></canvas>
</template>
</copy-link>
<v-card class="account ma-3" flat>
<v-card-title class="h2">{{ $t("room_info.permissions") }}</v-card-title>
@ -299,6 +270,7 @@ import PurgeRoomDialog from "../components/PurgeRoomDialog";
import DeviceList from "../components/DeviceList";
import RoomExport from "../components/RoomExport";
import RoomAvatarPicker from "../components/RoomAvatarPicker";
import CopyLink from "../components/CopyLink.vue"
import QRCode from "qrcode";
import roomInfoMixin from "./roomInfoMixin";
import QRCodePopup from './QRCodePopup.vue';
@ -313,7 +285,8 @@ export default {
DeviceList,
RoomExport,
QRCodePopup,
RoomAvatarPicker
RoomAvatarPicker,
CopyLink
},
data() {
return {
@ -327,7 +300,6 @@ export default {
expandedMembers: [],
buildVersion: "",
updatingJoinRule: false, // Flag if we are processing update curerntly
publicRoomLinkCopied: false,
joinRules: [
{
id: "public",
@ -497,23 +469,6 @@ export default {
this.$navigation.push({ name: "Profile" }, 1);
},
copyRoomLink() {
const self = this;
this.$copyText(this.publicRoomLink).then(
function (ignored) {
// Success!
self.publicRoomLinkCopied = true;
setInterval(() => {
// Hide again
self.publicRoomLinkCopied = false;
}, 3000);
},
function (e) {
console.log(e);
}
);
},
toggleMemberExpanded(member) {
const index = this.expandedMembers.indexOf(member);
if (index > -1) {