Show lobby screen for non moderators when it is enabled

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>

3 files changed, 90 insertions, 6 deletions

diff --git a/src/components/LobbyScreen.vue b/src/components/LobbyScreen.vue
new file mode 100644
index 000000000..b3dd35791
--- /dev/null
+++ b/src/components/LobbyScreen.vue
@@ -0,0 +1,66 @@
+<!--
+  - @copyright Copyright (c) 2020, Daniel Calviño Sánchez <danxuliu@gmail.com>
+  -
+  - @license GNU AGPL version 3 or any later version
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program. If not, see <http://www.gnu.org/licenses/>.
+  -
+  -->
+
+<template>
+	<div class="lobby emptycontent">
+		<div class="icon icon-lobby" />
+		<h2>{{ currentConversationName }}</h2>
+		<p>{{ message }}</p>
+	</div>
+</template>
+
+<script>
+import moment from '@nextcloud/moment'
+
+export default {
+
+	name: 'LobbyScreen',
+
+	computed: {
+
+		token() {
+			return this.$store.getters.getToken()
+		},
+
+		currentConversation() {
+			return this.$store.getters.conversations[this.token]
+		},
+
+		currentConversationName() {
+			return this.currentConversation ? this.currentConversation.displayName : ''
+		},
+
+		message() {
+			let message = t('spreed', 'You are currently waiting in the lobby')
+
+			if (this.currentConversation.lobbyTimer) {
+				// PHP timestamp is second-based; JavaScript timestamp is
+				// millisecond based.
+				const startTime = moment.unix(this.currentConversation.lobbyTimer).format('LLL')
+				message = t('spreed', 'You are currently waiting in the lobby. This meeting is scheduled for {startTime}', { startTime: startTime })
+			}
+
+			return message
+		},
+
+	},
+
+}
+</script>
diff --git a/src/components/RightSidebar/RightSidebar.vue b/src/components/RightSidebar/RightSidebar.vue
index 9e7471161..6f54c1d39 100644
--- a/src/components/RightSidebar/RightSidebar.vue
+++ b/src/components/RightSidebar/RightSidebar.vue
@@ -102,6 +102,7 @@ import {
 	addToFavorites,
 	removeFromFavorites,
 } from '../../services/conversationsService'
+import isInLobby from '../../mixins/isInLobby'
 
 export default {
 	name: 'RightSidebar',
@@ -116,6 +117,10 @@ export default {
 		ParticipantsTab,
 	},
 
+	mixins: [
+		isInLobby,
+	],
+
 	props: {
 		showChatInSidebar: {
 			type: Boolean,
@@ -135,7 +140,7 @@ export default {
 			return this.$store.getters.getSidebarStatus()
 		},
 		opened() {
-			return !!this.token && this.show
+			return !!this.token && !this.isInLobby && this.show
 		},
 		token() {
 			return this.$store.getters.getToken()
diff --git a/src/views/MainView.vue b/src/views/MainView.vue
index 780157c3f..4e3867f16 100644
--- a/src/views/MainView.vue
+++ b/src/views/MainView.vue
@@ -1,11 +1,14 @@
 <template>
 	<div class="mainView">
-		<TopBar :force-white-icons="showChatInSidebar" />
-
-		<ChatView v-if="!showChatInSidebar" :token="token" />
+		<LobbyScreen v-if="isInLobby" />
 		<template v-else>
-			<CallView
-				:token="token" />
+			<TopBar :force-white-icons="showChatInSidebar" />
+
+			<ChatView v-if="!showChatInSidebar" :token="token" />
+			<template v-else>
+				<CallView
+					:token="token" />
+			</template>
 		</template>
 	</div>
 </template>
@@ -13,16 +16,22 @@
 <script>
 import CallView from '../components/CallView/CallView'
 import ChatView from '../components/ChatView'
+import LobbyScreen from '../components/LobbyScreen'
 import TopBar from '../components/TopBar/TopBar'
 import { PARTICIPANT } from '../constants'
+import isInLobby from '../mixins/isInLobby'
 
 export default {
 	name: 'MainView',
 	components: {
 		CallView,
 		ChatView,
+		LobbyScreen,
 		TopBar,
 	},
+	mixins: [
+		isInLobby,
+	],
 	props: {
 		token: {
 			type: String,
@@ -40,6 +49,10 @@ export default {
 	*/
 
 	computed: {
+		conversation() {
+			return this.$store.getters.conversations[this.token]
+		},
+
 		participant() {
 			if (typeof this.token === 'undefined') {
 				return {