butter/keanu-weblite
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Fix join UI when logged in

Browse source
This commit is contained in:
N-Pex 2020-12-16 16:36:23 +01:00
parent 3067fcbfc7
commit 6de1e40765
1 changed files with 47 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

56
src/components/Join.vue
View file

@ -1,7 +1,14 @@
<template> <template>
<div class="join-root"> <div class="join-root">
<div v-if="!waiting" class="text-center"> <div v-if="!waiting" class="text-center">
<v-btn class="btn-login" text small @click.stop="handleLogin" :loading="loading">Login</v-btn> <v-btn
class="btn-login"
text
small
@click.stop="handleLogin"
:loading="loading"
>Login</v-btn
>
<v-avatar class="join-avatar"> <v-avatar class="join-avatar">
<v-img v-if="roomAvatar" :src="roomAvatar" /> <v-img v-if="roomAvatar" :src="roomAvatar" />
@ -10,18 +17,32 @@
}}</span> }}</span>
</v-avatar> </v-avatar>
<div class="join-title">Welcome to {{ roomName }}</div> <div class="join-title">Welcome to {{ roomName }}</div>
<div class="join-message">Join the group chat in a web browser or with the Keanu app.</div> <div class="join-message">
<v-btn class="btn-light" large block @click.stop="handleOpenApp" :loading="loading" Join the group chat in a web browser or with the Keanu app.
</div>
<v-btn
class="btn-light"
large
block
@click.stop="handleOpenApp"
:loading="loading"
>Open Keanu app</v-btn >Open Keanu app</v-btn
> >
<div class="join-or-divider">OR</div> <div class="join-or-divider">OR</div>
<v-btn class="btn-dark" large block @click.stop="handleJoin" :loading="loading" <v-btn
class="btn-dark"
large
block
@click.stop="handleJoin"
:loading="loading"
>Join as guest</v-btn >Join as guest</v-btn
> >
<div class="join-privacy">Enhance your physical privacy. <a href="#">Learn how</a></div> <div class="join-privacy">
Enhance your physical privacy. <a href="#">Learn how</a>
</div>
<div v-if="loadingMessage">{{ loadingMessage }}</div> <div v-if="loadingMessage">{{ loadingMessage }}</div>
</div> </div>
@ -41,7 +62,7 @@ export default {
guestUser: new User("https://neo.keanu.im", "", "", true), guestUser: new User("https://neo.keanu.im", "", "", true),
loading: false, loading: false,
loadingMessage: null, loadingMessage: null,
waiting: true waiting: true,
}; };
}, },
mounted() { mounted() {
@ -50,11 +71,15 @@ export default {
if (this.currentUser) { if (this.currentUser) {
this.waiting = true; this.waiting = true;
const self = this; const self = this;
this.$matrix.getMatrixClient(this.currentUser) this.$matrix
.getMatrixClient(this.currentUser)
.then(() => { .then(() => {
// Already joined? // Already joined?
const room = self.$matrix.getRoom(self.roomId); const room = self.$matrix.getRoom(self.roomId);
if (room && room.hasMembershipState(self.currentUser.user_id, "join")) { if (
room &&
room.hasMembershipState(self.currentUser.user_id, "join")
) {
// Yes, go to room // Yes, go to room
self.$matrix.setCurrentRoom(room); self.$matrix.setCurrentRoom(room);
self.$router.replace({ name: "Chat" }); self.$router.replace({ name: "Chat" });
@ -63,22 +88,23 @@ export default {
this.waiting = false; this.waiting = false;
}) })
.catch(ignoredErr => { .catch((ignoredErr) => {
this.waiting = false; this.waiting = false;
}); });
} else { }
this.$matrix.getPublicRoomInfo(this.roomId)
.then(room => { this.$matrix
.getPublicRoomInfo(this.roomId)
.then((room) => {
console.log("Found room:", room); console.log("Found room:", room);
this.roomName = room.name; this.roomName = room.name;
this.roomAvatar = room.avatar; this.roomAvatar = room.avatar;
this.waiting = false; this.waiting = false;
}) })
.catch(err => { .catch((err) => {
console.log("Could not find room info", err); console.log("Could not find room info", err);
this.waiting = false; this.waiting = false;
}) });
}
}, },
computed: { computed: {
currentUser() { currentUser() {