From 878c60f4a105f60d315fa44dbda3e08bc87bdab4 Mon Sep 17 00:00:00 2001 From: N-Pex Date: Fri, 21 May 2021 16:27:39 +0200 Subject: [PATCH] Allow "createroom" to be accessed without account A new one will be generated. Issue #67. --- src/assets/translations/en.js | 3 + src/components/CreateRoom.vue | 209 ++++++++++++++++++++---- src/components/Join.vue | 20 +-- src/components/messages/RoomAliased.vue | 17 ++ src/router/index.js | 2 +- src/services/matrix.service.js | 13 ++ 6 files changed, 213 insertions(+), 51 deletions(-) create mode 100644 src/components/messages/RoomAliased.vue diff --git a/src/assets/translations/en.js b/src/assets/translations/en.js index ff86c44..55bb54c 100644 --- a/src/assets/translations/en.js +++ b/src/assets/translations/en.js @@ -15,9 +15,12 @@ export default { }, message: { you: "You", + user_created_room: "{user} created the room", + user_aliased_room: "{user} made the room alias {alias}", user_changed_display_name: "{user} changed display name to {displayName}", user_changed_avatar: "{user} changed the avatar", user_changed_room_avatar: "{user} changed the room avatar", + user_encrypted_room: "{user} made the room encrypted", user_was_invited: "{user} was invited to the chat...", user_joined: "{user} joined the chat", user_left: "{user} left the chat", diff --git a/src/components/CreateRoom.vue b/src/components/CreateRoom.vue index c58370b..4093743 100644 --- a/src/components/CreateRoom.vue +++ b/src/components/CreateRoom.vue @@ -2,7 +2,7 @@
-
{{$t('new_room.new_room')}}
+
{{ $t("new_room.new_room") }}
arrow_back - {{$t('menu.back')}} + {{ $t("menu.back") }} - {{ step == steps.CREATED ? $t('new_room.done') : $t('new_room.next') }} + {{ + step == steps.CREATED ? $t("new_room.done") : $t("new_room.next") + }}
+ @@ -49,9 +97,11 @@
-
{{$t('new_room.join_permissions')}}
-
{{$t('new_room.set_join_permissions')}}
-
{{$t('new_room.join_permissions_info')}}
+
{{ $t("new_room.join_permissions") }}
+
+ {{ $t("new_room.set_join_permissions") }} +
+
{{ $t("new_room.join_permissions_info") }}
link{{$t('new_room.get_link')}}link{{ $t("new_room.get_link") }} person_add{{$t('new_room.add_people')}}person_add{{ $t("new_room.add_people") }} - +
{{ status }}
@@ -155,24 +209,32 @@ export default { joinRules: [ { id: "public", - text: this.$t('new_room.public_info'), + text: this.$t("new_room.public_info"), icon: "link", - descr: this.$t('new_room.public_description'), + descr: this.$t("new_room.public_description"), }, { id: "invite", - text: this.$t('new_room.invite_info'), + text: this.$t("new_room.invite_info"), icon: "person_add", - descr: this.$t('new_room.invite_description'), + descr: this.$t("new_room.invite_description"), }, ], publicRoomLink: null, publicRoomLinkCopied: false, + availableAvatars: [], + selectedProfile: null, }; }, mounted() { this.joinRule = this.joinRules[0].id; // Set default + this.availableAvatars = util.getDefaultAvatars(); + this.selectAvatar( + this.availableAvatars[ + Math.floor(Math.random() * this.availableAvatars.length) + ] + ); }, watch: { @@ -187,6 +249,16 @@ export default { } return this.roomName.substring(0, 1).toUpperCase(); }, + currentUser() { + return this.$store.state.auth.user; + }, + canEditProfile() { + // If we have an account already, we can't edit profile here (need to go into profile view) + if (this.currentUser) { + return false; + } + return true; + }, }, methods: { @@ -261,8 +333,12 @@ export default { }, createRoom() { this.step = steps.CREATING; + + const hasUser = this.currentUser ? true : false; + var setProfileData = false; + var roomId; - this.status = this.$t('new_room.status_creating'); + this.status = this.$t("new_room.status_creating"); var createRoomOptions = {}; if (this.joinRule == "public") { createRoomOptions = { @@ -308,26 +384,87 @@ export default { // Add topic createRoomOptions.topic = this.roomTopic; } - return this.$matrix.matrixClient - .createRoom(createRoomOptions) - .then(({ room_id, room_alias }) => { - roomId = room_alias || room_id; - if (!this.roomAvatarFile) { - return true; - } - const self = this; - return util.setRoomAvatar( - this.$matrix.matrixClient, - room_id, - this.roomAvatarFile, - function (p) { - if (p.total) { - self.status = this.$t('new_room.status_avatar_total', {count: (p.loaded || 0), total: p.total}); - } else { - self.status = this.$t('new_room.status_avatar', {count: (p.loaded || 0)}); + + return this.$matrix + .getLoginPromise() + .then( + function (user) { + if (user.is_guest && !hasUser) { + // Newly created account, joining first room. + // Set avatar and display name to either the randomly chosen ones, or the + // ones the users has changed to. + setProfileData = true; + + // Set display name and avatar directly on the matrix object. + if ( + this.selectedProfile.name && + this.selectedProfile.name.length > 0 + ) { + this.$matrix.userDisplayName = this.selectedProfile.name; } } - ); + + if ( + !setProfileData || + !this.selectedProfile.name || + this.selectedProfile.name.length == 0 + ) { + return Promise.resolve(user); + } else { + console.log( + "CreateRoom: Set display name to: " + this.selectedProfile.name + ); + return this.$matrix.matrixClient.setDisplayName( + this.selectedProfile.name, + undefined + ); + } + }.bind(this) + ) + .then( + function () { + if (!setProfileData || !this.selectedProfile.image) { + console.log("CreateRoom: No avatar change"); + return Promise.resolve("no avatar"); + } else { + console.log("CreateRoom: Updating avatar"); + return util.setAvatar( + this.$matrix, + this.selectedProfile.image, + function (progress) { + console.log("Progress: " + JSON.stringify(progress)); + } + ); + } + }.bind(this) + ) + .then(() => { + return this.$matrix.matrixClient + .createRoom(createRoomOptions) + .then(({ room_id, room_alias }) => { + roomId = room_alias || room_id; + if (!this.roomAvatarFile) { + return true; + } + const self = this; + return util.setRoomAvatar( + this.$matrix.matrixClient, + room_id, + this.roomAvatarFile, + function (p) { + if (p.total) { + self.status = this.$t("new_room.status_avatar_total", { + count: p.loaded || 0, + total: p.total, + }); + } else { + self.status = this.$t("new_room.status_avatar", { + count: p.loaded || 0, + }); + } + } + ); + }); }) .then(() => { this.status = ""; @@ -384,6 +521,14 @@ export default { } ); }, + + selectAvatar(value) { + this.selectedProfile = Object.assign({}, value); // Make a copy, so editing does not destroy data + }, + + showAvatarPickerList() { + this.$refs.avatar.$refs.input.click(); + }, }, }; diff --git a/src/components/Join.vue b/src/components/Join.vue index 2e5b024..5c1696f 100644 --- a/src/components/Join.vue +++ b/src/components/Join.vue @@ -119,9 +119,7 @@ + + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index 8a088b0..a69fbc1 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -82,7 +82,7 @@ const router = new VueRouter({ }); router.beforeEach((to, from, next) => { - const publicPages = ['/login']; + const publicPages = ['/login','/createroom']; var authRequired = !publicPages.includes(to.path); const loggedIn = router.app.$store.state.auth.user; diff --git a/src/services/matrix.service.js b/src/services/matrix.service.js index c68025f..00d4013 100644 --- a/src/services/matrix.service.js +++ b/src/services/matrix.service.js @@ -269,6 +269,19 @@ export default { }) }, + /** + * Returns a promise that will log us into the Matrix. + * + * Will use a real account, if we have one, otherwise will create + * a random account. + */ + getLoginPromise() { + if (this.ready) { + return Promise.resolve(this.currentUser); + } + return this.$store.dispatch("login", this.currentUser || new User(config.defaultServer, "", "", true)); + }, + addMatrixClientListeners(client) { if (client) { client.on("event", this.onEvent);