Don't set avatar and display name if they haven't changed.
Related to issue #40.
This commit is contained in:
parent
8555436bc7
commit
bdd6977728
7 changed files with 94 additions and 33 deletions
14
src/App.vue
14
src/App.vue
|
|
@ -81,6 +81,20 @@ export default {
|
|||
},
|
||||
},
|
||||
watch: {
|
||||
'$route' (to, ignoredFrom) {
|
||||
var title = "Keanu Weblite";
|
||||
if (to.meta.title) {
|
||||
title += " - " + to.meta.title;
|
||||
}
|
||||
if (to.meta.includeRoom) {
|
||||
if (this.$matrix.currentRoom) {
|
||||
title += " - " + (this.$matrix.currentRoom.summary.info.title || this.$matrix.currentRoom.roomId);
|
||||
} else if (this.$matrix.currentRoomId) {
|
||||
title += " - " + (this.$matrix.currentRoomId);
|
||||
}
|
||||
}
|
||||
document.title = title;
|
||||
},
|
||||
currentUser: {
|
||||
immediate: true,
|
||||
handler(ignorednewVal, ignoredoldVal) {
|
||||
|
|
|
|||
|
|
@ -383,7 +383,7 @@ export default {
|
|||
if (value && value == oldValue) {
|
||||
return; // No change.
|
||||
}
|
||||
console.log("Chat: Current room changed");
|
||||
console.log("Chat: Current room changed to " + (value ? value : "null"));
|
||||
|
||||
// Clear old events
|
||||
this.events = [];
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<v-row>
|
||||
<v-col class="flex-grow-0 flex-shrink-0">
|
||||
<v-avatar @click="showAvatarPicker = true">
|
||||
<v-img v-if="userAvatar" :src="userAvatar.image" />
|
||||
<v-img v-if="avatar" :src="avatar.image" />
|
||||
</v-avatar>
|
||||
</v-col>
|
||||
<v-col class="flex-shrink-1 flex-grow-1">
|
||||
|
|
@ -33,7 +33,7 @@
|
|||
v-if="!currentUser || currentUser"
|
||||
@update:search-input="updateDisplayName"
|
||||
:items="defaultDisplayNames"
|
||||
:value="displayName"
|
||||
:value="userDisplayName || displayName"
|
||||
label="User name"
|
||||
outlined
|
||||
dense
|
||||
|
|
@ -109,7 +109,7 @@
|
|||
size="48"
|
||||
@click="selectAvatar(avatar)"
|
||||
class="avatar-picker-avatar"
|
||||
:class="{ current: avatar === userAvatar }"
|
||||
:class="{ current: avatar === selectedAvatar }"
|
||||
>
|
||||
<img :src="avatar.image" />
|
||||
</v-avatar>
|
||||
|
|
@ -138,17 +138,18 @@ export default {
|
|||
loadingMessage: null,
|
||||
waitingForInfo: true,
|
||||
waitingForMembership: false,
|
||||
userAvatar: null,
|
||||
selectedAvatar: null,
|
||||
displayName: null,
|
||||
defaultDisplayNames: [],
|
||||
availableAvatars: [],
|
||||
showAvatarPicker: false,
|
||||
shouldSetAvatar: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.$matrix.on("Room.myMembership", this.onMyMembership);
|
||||
this.availableAvatars = util.getDefaultAvatars();
|
||||
this.userAvatar = this.availableAvatars[0];
|
||||
this.selectedAvatar = this.userAvatar || this.availableAvatars[0];
|
||||
if (!this.currentUser || this.currentUser.is_guest) {
|
||||
var values = require("!!raw-loader!../assets/usernames.txt")
|
||||
.default.split("\n")
|
||||
|
|
@ -181,15 +182,30 @@ export default {
|
|||
}
|
||||
return this.$matrix.currentRoomId;
|
||||
},
|
||||
userDisplayName() {
|
||||
return this.$matrix.userDisplayName;
|
||||
},
|
||||
userAvatar() {
|
||||
if (!this.$matrix.userAvatar) {
|
||||
return null;
|
||||
}
|
||||
return { id: 'user', image: this.$matrix.matrixClient.mxcUrlToHttp(this.$matrix.userAvatar, 80, 80, 'scale', true) };
|
||||
},
|
||||
avatar() {
|
||||
if (!this.shouldSetAvatar) {
|
||||
return this.userAvatar || this.selectedAvatar; // TODO - Use random
|
||||
}
|
||||
return this.selectedAvatar;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
roomId: {
|
||||
immediate: true,
|
||||
handler(val, oldVal) {
|
||||
if (val && val == oldVal) {
|
||||
handler(value, oldVal) {
|
||||
if (!value || (value && value == oldVal)) {
|
||||
return; // No change.
|
||||
}
|
||||
console.log("Join: Current room changed");
|
||||
console.log("Join: Current room changed to " + (value ? value : "null"));
|
||||
this.roomName = this.roomId;
|
||||
if (this.currentUser) {
|
||||
this.waitingForMembership = true;
|
||||
|
|
@ -283,7 +299,7 @@ export default {
|
|||
function (user) {
|
||||
if (
|
||||
(this.currentUser && !this.currentUser.is_guest) ||
|
||||
!this.displayName
|
||||
!this.displayName || this.displayName == this.userDisplayName /* No change */
|
||||
) {
|
||||
return Promise.resolve(user);
|
||||
} else {
|
||||
|
|
@ -298,13 +314,13 @@ export default {
|
|||
function () {
|
||||
if (
|
||||
(this.currentUser && !this.currentUser.is_guest) ||
|
||||
!this.userAvatar
|
||||
!this.shouldSetAvatar
|
||||
) {
|
||||
return Promise.resolve("no avatar");
|
||||
} else {
|
||||
return util.setAvatar(
|
||||
this.$matrix.matrixClient,
|
||||
this.userAvatar.image,
|
||||
this.selectedAvatar.image,
|
||||
function (progress) {
|
||||
console.log("Progress: " + JSON.stringify(progress));
|
||||
}
|
||||
|
|
@ -344,7 +360,10 @@ export default {
|
|||
},
|
||||
|
||||
selectAvatar(avatar) {
|
||||
this.userAvatar = avatar;
|
||||
if (avatar && (!this.userAvatar || this.userAvatar.image != avatar.image)) {
|
||||
this.selectedAvatar = avatar;
|
||||
this.shouldSetAvatar = true;
|
||||
}
|
||||
this.showAvatarPicker = false;
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -405,7 +405,7 @@ class Util {
|
|||
matrixClient.uploadContent(response.data, opts)
|
||||
.then((response) => {
|
||||
const uri = response.content_uri;
|
||||
return matrixClient.setProfileInfo('avatar_url', { avatar_url: uri });
|
||||
return matrixClient.setAvatarUrl(uri);
|
||||
})
|
||||
.then(result => {
|
||||
resolve(result);
|
||||
|
|
|
|||
|
|
@ -18,18 +18,28 @@ const routes = [
|
|||
{
|
||||
path: '/room/:roomId?',
|
||||
name: 'Chat',
|
||||
component: Chat
|
||||
component: Chat,
|
||||
meta: {
|
||||
includeRoom: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/info',
|
||||
name: 'RoomInfo',
|
||||
component: () => import('../components/RoomInfo.vue'),
|
||||
props: true,
|
||||
meta: {
|
||||
title: 'Info',
|
||||
includeRoom: true
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/profile',
|
||||
name: 'Profile',
|
||||
component: Profile
|
||||
component: Profile,
|
||||
meta: {
|
||||
title: 'Profile'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
|
|
|
|||
|
|
@ -25,6 +25,8 @@ export default {
|
|||
matrixClient: null,
|
||||
matrixClientReady: false,
|
||||
rooms: [],
|
||||
userDisplayName: null,
|
||||
userAvatar: null,
|
||||
currentRoom: null,
|
||||
}
|
||||
},
|
||||
|
|
@ -149,6 +151,15 @@ export default {
|
|||
this.reloadRooms();
|
||||
this.matrixClientReady = true;
|
||||
this.matrixClient.emit('Matrix.initialized', this.matrixClient);
|
||||
this.matrixClient.getProfileInfo(this.currentUserId)
|
||||
.then(info => {
|
||||
console.log("Got user profile: " + JSON.stringify(info));
|
||||
this.userDisplayName = info.displayname;
|
||||
this.userAvatar = info.avatar_url;
|
||||
})
|
||||
.catch(err => {
|
||||
console.log("Failed to get user profile: ", err);
|
||||
})
|
||||
},
|
||||
|
||||
async getMatrixClient(user) {
|
||||
|
|
@ -266,6 +277,7 @@ export default {
|
|||
},
|
||||
|
||||
onRoom(ignoredroom) {
|
||||
console.log("Got room: " + ignoredroom);
|
||||
this.reloadRooms();
|
||||
},
|
||||
|
||||
|
|
@ -300,8 +312,9 @@ export default {
|
|||
Vue.set(room, "avatar", room.getAvatarUrl(this.matrixClient.getHomeserverUrl(), 80, 80, "scale", true));
|
||||
}
|
||||
});
|
||||
console.log("Reload rooms", updatedRooms);
|
||||
Vue.set(this, "rooms", updatedRooms);
|
||||
const currentRoom = this.getRoom(this.currentRoomId);
|
||||
const currentRoom = this.getRoom(this.$store.state.currentRoomId);
|
||||
if (this.currentRoom != currentRoom) {
|
||||
this.currentRoom = currentRoom;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,13 +13,13 @@ export default {
|
|||
})
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
if (this.nextRoutes) {
|
||||
console.log("Nav: next routes set, going:", this.routes, this.nextRoutes);
|
||||
this.routes = this.nextRoutes;
|
||||
this.nextRoutes = null;
|
||||
if (this.routes.length > 0) {
|
||||
console.log("Redirecting to", this.routes.lastItem());
|
||||
next(this.routes.lastItem());
|
||||
if (nextRoutes) {
|
||||
console.log("Nav: next routes set, going:", routes, nextRoutes);
|
||||
routes = nextRoutes;
|
||||
nextRoutes = null;
|
||||
if (routes.length > 0) {
|
||||
console.log("Redirecting to", routes[routes.length - 1]);
|
||||
next(routes[routes.length - 1]);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
|
@ -35,22 +35,28 @@ export default {
|
|||
mode = 1;
|
||||
}
|
||||
if (mode == -1) {
|
||||
const i = routes.length - 1;
|
||||
nextRoutes = [route];
|
||||
if (i > 0) {
|
||||
router.go(-i);
|
||||
} else {
|
||||
router.replace(route).catch((ignoredErr) => {});
|
||||
}
|
||||
} else if (mode == 0) {
|
||||
// Replace
|
||||
nextRoutes = [...routes];
|
||||
nextRoutes.pop();
|
||||
nextRoutes.push(route);
|
||||
router.replace(route).catch((ignoredErr) => {});
|
||||
} else {
|
||||
nextRoutes = [...routes];
|
||||
nextRoutes.push(route);
|
||||
}
|
||||
|
||||
const index = nextRoutes.length - routes.length;
|
||||
const targetIndex = nextRoutes.length - 1;
|
||||
console.log("Nav - index " + index + " Target " + targetIndex);
|
||||
if (index < 0) {
|
||||
console.log("Nav - go " + index);
|
||||
router.go(index);
|
||||
} else if (index == 0) {
|
||||
console.log("Nav - replace");
|
||||
router.replace(route).catch((ignoredErr) => {});
|
||||
} else {
|
||||
console.log("Nav - push");
|
||||
router.push(route).catch((ignoredErr) => {});
|
||||
}
|
||||
},
|
||||
|
|
@ -63,8 +69,7 @@ export default {
|
|||
},
|
||||
|
||||
pop() {
|
||||
nextRoutes = [...routes];
|
||||
nextRoutes.pop();
|
||||
routes.pop();
|
||||
router.go(-1);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue