Fix empty content message and correctly hide the video input until it is loaded

Signed-off-by: Joas Schilling <coding@schilljs.com>

css/style.scss

@@ -222,6 +222,11 @@
 	align-items: flex-end;
 }
 
+.videoContainer.hidden,
+#app-content.screensharing .videoContainer.hidden {
+	display: none;
+}
+
 #app-content.screensharing .videoContainer {
 	max-height: 200px;
 }

js/app.js

@@ -544,12 +544,6 @@
 				this.signaling.disconnect();
 			}.bind(this));
 
-			this.setEmptyContentMessage(
-				'icon-video',
-				t('spreed', 'Looking great today! :)'),
-				t('spreed', 'Time to call your friends')
-			);
-
 			if (OC.getCurrentUser().uid) {
 				this._showRoomList();
 				this.signaling.setRoomCollection(this._rooms)
@@ -584,6 +578,11 @@
 		startLocalMedia: function(configuration) {
 			this.connection.showCamera();
 			this.initAudioVideoSettings(configuration);
+
+			this.setEmptyContentMessage(
+				'icon-video',
+				t('spreed', 'Waiting for others to join the call …')
+			);
 		},
 		_onPopState: function(params) {
 			if (!_.isUndefined(params.token)) {

js/connection.js

@@ -137,8 +137,7 @@
 			if (deleter) {
 				this.app.setEmptyContentMessage(
 					'icon-video',
-					t('spreed', 'Looking great today! :)'),
-					t('spreed', 'Time to call your friends')
+					t('spreed', 'Join a conversation or start a new one')
 				);
 			} else {
 				this.app.setEmptyContentMessage(

templates/index-public.php

@@ -99,8 +99,8 @@ script(
 
 			<div id="emptycontent">
 				<div id="emptycontent-icon" class="icon-video"></div>
-				<h2><?php p($l->t('Looking great today! :)')) ?></h2>
-				<p class="uploadmessage"><?php p($l->t('Smile in 3… 2… 1!')) ?></p>
+				<h2><?php p($l->t('Join a conversation or start a new one')) ?></h2>
+				<p class="uploadmessage"></p>
 			</div>
 		</div>
 	</div>

templates/index.php

@@ -91,8 +91,8 @@ script(
 
 		<div id="emptycontent">
 			<div id="emptycontent-icon" class="icon-video"></div>
-			<h2><?php p($l->t('Looking great today! :)')) ?></h2>
-			<p class="uploadmessage"><?php p($l->t('Time to call your friends')) ?></p>
+			<h2><?php p($l->t('Join a conversation or start a new one')) ?></h2>
+			<p class="uploadmessage"></p>
 			<div id="shareRoomContainer" class="" style="display: inline-flex">
 				<input id="shareRoomInput" class="share-room-input hidden" readonly="readonly" type="text"/>
 				<div id="shareRoomClipboardButton" class="shareRoomClipboard icon-clippy hidden" data-clipboard-target="#shareRoomInput"></div>