From afa38275f05d733af6a76772ce3525e149fa3e6b Mon Sep 17 00:00:00 2001 From: N-Pex Date: Fri, 17 Feb 2023 22:00:47 +0100 Subject: [PATCH] Allow "voice mode" to be set as default on room creation Also, hide it behind a flag in config (experimental_voice_mode) --- src/assets/config.json | 3 +- src/assets/css/chat.scss | 51 +++-- src/assets/translations/en.json | 3 +- src/components/Chat.vue | 37 ++-- src/components/CreateRoom.vue | 350 ++++++++++++++------------------ src/components/RoomInfo.vue | 14 +- src/plugins/utils.js | 32 +++ 7 files changed, 246 insertions(+), 244 deletions(-) diff --git a/src/assets/config.json b/src/assets/config.json index 389e901..a816ef7 100644 --- a/src/assets/config.json +++ b/src/assets/config.json @@ -39,5 +39,6 @@ "siteId": "25" } } - ] + ], + "experimental_voice_mode": true } \ No newline at end of file diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss index 84a260f..b9662df 100644 --- a/src/assets/css/chat.scss +++ b/src/assets/css/chat.scss @@ -894,25 +894,25 @@ body { text-decoration: underline; } +} - .with-right-label { - display: flex; - flex-wrap: nowrap; - flex-direction: row; - text-align: start; - & > * { - flex: 1 1 auto; - } - & > *:last-child { - flex: 0 0 auto; - } - .option-title { - color: #000; - font-size: 16 * $chat-text-size; - } - .option-text { - font-size: 13 * $chat-text-size; - } +.with-right-label { + display: flex; + flex-wrap: nowrap; + flex-direction: row; + text-align: start; + & > * { + flex: 1 1 auto; + } + & > *:last-child { + flex: 0 0 auto; + } + .option-title { + color: #000; + font-size: 16 * $chat-text-size; + } + .option-text { + font-size: 13 * $chat-text-size; } } @@ -1131,6 +1131,21 @@ body { border: 1px solid #808080 !important; position: relative; } + + .options { + display: flex; + width: 100%; + justify-content: flex-end; + color: black; + font-size: 14 * $chat-text-size; + font-weight: bold; + margin-left: 10px; + [dir="rtl"] & { + margin-left: initial; + margin-right: 10px; + } + text-transform: none !important; + } } .room-link .v-input__slot::before { diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json index 922693d..e97d73c 100644 --- a/src/assets/translations/en.json +++ b/src/assets/translations/en.json @@ -127,7 +127,8 @@ "status_avatar_total": "Uploading avatar: {count} of {total}", "status_avatar": "Uploading avatar: {count}", "room_name_limit_error_msg": "Maximum 50 characters allowed", - "colon_not_allowed": "Colon is not allowed" + "colon_not_allowed": "Colon is not allowed", + "options": "Options" }, "device_list": { "title": "DEVICES", diff --git a/src/components/Chat.vue b/src/components/Chat.vue index 36378d7..645d316 100644 --- a/src/components/Chat.vue +++ b/src/components/Chat.vue @@ -4,7 +4,7 @@ {{ $tc("room.invitations", invitationCount) }} - - + -
+
- arrow_downward @@ -421,7 +421,7 @@ export default { chatContainer() { const container = this.$refs.chatContainer; console.log("GOT CONTAINER", container); - if (this.useAudioLayout) { + if (this.useVoiceMode) { return container.$el; } return container; @@ -522,15 +522,10 @@ export default { me && this.room.currentState && this.room.currentState.hasSufficientPowerLevelFor("redact", me.powerLevel); return isAdmin; }, - useAudioLayout: { + useVoiceMode: { get: function () { - if (this.room) { - const tags = this.room.tags; - if (tags && tags["ui_options"]) { - return tags["ui_options"]["voice_mode"] === 1; - } - } - return false; + if (!this.$config.experimental_voice_mode) return false; + return util.useVoiceMode(this.room); }, } }, @@ -611,6 +606,12 @@ export default { }); } }, + showRecorder(show) { + if (this.useVoiceMode) { + // Send typing indicators when recorder UI is opened/closed + this.$matrix.matrixClient.sendTyping(this.roomId, show, 10 * 60 * 1000); + } + } }, methods: { @@ -826,7 +827,7 @@ export default { const loadingDone = this.initialLoadDone; this.$matrix.matrixClient.decryptEventIfNeeded(event, {}); - if (this.initialLoadDone && !this.useAudioLayout) { + if (this.initialLoadDone && !this.useVoiceMode) { this.paginateBackIfNeeded(); } @@ -1055,7 +1056,7 @@ export default { .then((success) => { if (success) { this.events = this.timelineWindow.getEvents(); - if (!this.useAudioLayout) { + if (!this.useVoiceMode) { this.scrollPosition.prepareFor("down"); this.$nextTick(() => { // restore scroll position! @@ -1312,7 +1313,7 @@ export default { let eventIdFirst = null; let eventIdLast = null; - if (!this.useAudioLayout) { + if (!this.useVoiceMode) { const container = this.chatContainer; const elFirst = util.getFirstVisibleElement(container); const elLast = util.getLastVisibleElement(container); diff --git a/src/components/CreateRoom.vue b/src/components/CreateRoom.vue index 3332e2a..85d08ea 100644 --- a/src/components/CreateRoom.vue +++ b/src/components/CreateRoom.vue @@ -3,29 +3,23 @@
{{ $t("new_room.new_room") }}
- + arrow_back {{ $t("menu.back") }} + text + :disabled=" + !roomName || (step != steps.INITIAL && step != steps.CREATED) + " + class="header-button-right" + @click.stop="onCreate" + > + {{ + step == steps.CREATED ? $t("new_room.done") : $t("new_room.next") + }} + -->
@@ -39,51 +33,43 @@ - +
{{ $t("new_room.name_room") }}
- -
{{ $t("new_room.room_topic") }}
- -
{{roomCreationErrorMsg}}
- -
- {{ status }} - -
- {{ $t("new_room.create") }} -
+ +
{{ $t("new_room.room_topic") }}
+ + + + + +
{{ roomCreationErrorMsg }}
+ +
+ {{ status }} + +
+ {{ $t("new_room.create") }} +
@@ -91,126 +77,101 @@ + + --> + + {{ status }} +
--> - - + +
{{ $t("join.choose_name") }}
- + -
- - + + +
- + - - {{ $t("join.enter_room") }} - + + {{ $t("join.enter_room") }} +
@@ -253,7 +204,7 @@