Add setting to open video conference in new window

packages/rocketchat-action-links/client/stylesheets/actionLinks.less

@@ -14,10 +14,8 @@
 			display: inline;
 
 			.action-link {
-				background-color: @primary-action-color;
 				padding: 5px;
 				border-radius: 7px;
-				color: @tertiary-font-color;
 				margin: 0 2px;
 			}
 		}

packages/rocketchat-i18n/i18n/en.i18n.json

@@ -144,6 +144,7 @@
   "All_messages": "All messages",
   "Allow_Invalid_SelfSigned_Certs": "Allow Invalid Self-Signed Certs",
   "Allow_Invalid_SelfSigned_Certs_Description": "Allow invalid and self-signed SSL certificate's for link validation and previews.",
+  "Always_open_in_new_window": "Always open in new window",
   "Analytics_features_enabled": "Features Enabled",
   "Analytics_features_messages_Description": "Tracks custom events related to actions a user does on messages.",
   "Analytics_features_rooms_Description": "Tracks custom events related to actions on a channel or group (create, leave, delete).",
@@ -962,6 +963,7 @@
   "Open_days_of_the_week": "Open Days of the Week",
   "Open_Livechats": "Open Livechats",
   "Opened": "Opened",
+  "Opened_in_a_new_window": "Opened in a new window.",
   "Opens_a_channel_group_or_direct_message": "Opens a channel, group or direct message",
   "optional": "optional",
   "Use_minor_colors": "Use minor color palette (defaults inherit major colors)",
@@ -1429,6 +1431,7 @@
   "Verified": "Verified",
   "Version": "Version",
   "Video_Chat_Window": "Video Chat",
+  "Video_Conference": "Video Conference",
   "Videocall_declined": "Videocall declined.",
   "Videocall_enabled": "Videocall enabled",
   "View_All": "View All",
@@ -1503,4 +1506,4 @@
   "your_message_optional": "your message (optional)",
   "Your_password_is_wrong": "Your password is wrong!",
   "Your_push_was_sent_to_s_devices": "Your push was sent to %s devices"
-}
\ No newline at end of file
+}

packages/rocketchat-i18n/i18n/pt.i18n.json

@@ -836,6 +836,7 @@
   "Oops!": "Ops",
   "Open": "Aberto",
   "Opened": "Aberto",
+  "Opened_in_a_new_window": "Aberto em nova janela.",
   "Opens_a_channel_group_or_direct_message": "Abre um canal, grupo ou mensagem direta",
   "optional": "opcional",
   "or": "ou",
@@ -1236,6 +1237,7 @@
   "Verified": "Verificado",
   "Version": "Versão",
   "Video_Chat_Window": "Vídeo Chat",
+  "Video_Conference": "Vídeo Conferência",
   "Videocall_declined": "Chamada de vídeo negada.",
   "Videocall_enabled": "Vídeoconferência habilitada",
   "View_All": "Ver Todos",
@@ -1304,4 +1306,4 @@
   "your_message_optional": "sua mensagem (opcional)",
   "Your_password_is_wrong": "Sua senha está errada!",
   "Your_push_was_sent_to_s_devices": "Sua natificação foi enviada para %s dispositivos"
-}
\ No newline at end of file
+}

packages/rocketchat-theme/assets/stylesheets/utils/_colors.import.less

@@ -787,8 +787,8 @@ i.status-offline {
  * Buttons!
  */
 
-.actionLinks li {
-	.buttonColors(@secondary-action-contrast, @secondary-action-color);
+.actionLinks li .action-link {
+	.buttonColors(@primary-action-contrast, @primary-action-color);
 }
 
 // new layout buttons

packages/rocketchat-videobridge/client/views/videoFlexTab.html

 <template name="videoFlexTab">
-
-    <div class="content">
-        <div class="video-chat">
-            <div class="main-video">
-				<div id="videoContainer"></div>
-            </div>
-        </div>
-    </div>
+	<div class="content">
+		{{#if openInNewWindow}}
+			<div class="list-view">
+				<div class="title">
+					<h2>{{_ "Video_Conference"}}</h2>
+				</div>
+				<p>{{_ "Opened_in_a_new_window"}}</p>
+			</div>
+		{{else}}
+			<div class="video-chat">
+				<div class="main-video">
+					<div id="videoContainer"></div>
+				</div>
+			</div>
+		{{/if}}
+	</div>
 </template>

packages/rocketchat-videobridge/client/views/videoFlexTab.js

@@ -2,7 +2,9 @@
 /* eslint new-cap: [2, {"capIsNewExceptions": ["MD5"]}] */
 
 Template.videoFlexTab.helpers({
-
+	openInNewWindow() {
+		return RocketChat.settings.get('Jitsi_Open_New_Window');
+	}
 });
 
 Template.videoFlexTab.onCreated(function() {
@@ -20,83 +22,91 @@ Template.videoFlexTab.onCreated(function() {
 
 	let jitsiRoomActive = null;
 
+	const closePanel = () => {
+		// Reset things.  Should probably be handled better in closeFlex()
+		$('.flex-tab').css('max-width', '');
+		$('.main-content').css('right', '');
+
+		RocketChat.TabBar.closeFlex();
+
+		RocketChat.TabBar.updateButton('video', { class: '' });
+	};
+
 	this.timeout = null;
 	this.autorun(() => {
 		if (RocketChat.settings.get('Jitsi_Enabled')) {
-			if (RocketChat.TabBar.getTemplate() === 'videoFlexTab') {
-				if (RocketChat.TabBar.isFlexOpen()) {
-					let roomId = Session.get('openedRoom');
-
-					let domain = RocketChat.settings.get('Jitsi_Domain');
-					let jitsiRoom = 'RocketChat' + CryptoJS.MD5(RocketChat.settings.get('uniqueID') + roomId).toString();
-					let noSsl = RocketChat.settings.get('Jitsi_SSL') ? false : true;
-					console.debug('Jitsi Room ID:', jitsiRoom, 'If from direct message or private group don\'t share.  Or you will be letting the invitee join any future conversation.');
+			if (RocketChat.TabBar.isFlexOpen() && RocketChat.TabBar.getTemplate() === 'videoFlexTab') {
+				let roomId = Session.get('openedRoom');
 
-					if (jitsiRoomActive !== null && jitsiRoomActive !== jitsiRoom) {
-						jitsiRoomActive = null;
+				let domain = RocketChat.settings.get('Jitsi_Domain');
+				let jitsiRoom = 'RocketChat' + CryptoJS.MD5(RocketChat.settings.get('uniqueID') + roomId).toString();
+				let noSsl = RocketChat.settings.get('Jitsi_SSL') ? false : true;
 
-						console.log('Room Changed... Close panel!');
-						// Reset things.  Should probably be handled better in closeFlex()
-						$('.flex-tab').css('max-width', '');
-						$('.main-content').css('right', '');
+				if (jitsiRoomActive !== null && jitsiRoomActive !== jitsiRoom) {
+					jitsiRoomActive = null;
 
-						RocketChat.TabBar.closeFlex();
+					closePanel();
 
-						RocketChat.TabBar.updateButton('video', { class: '' });
+					// Clean up and stop updating timeout.
+					Meteor.defer(() => this.api && this.api.dispose());
+					if (timeOut) {
+						clearInterval(timeOut);
+					}
+				} else {
+					jitsiRoomActive = jitsiRoom;
 
-						// Clean up and stop updating timeout.
-						if (timeOut) {
-							Meteor.defer(() => {
-								this.api.dispose();
-							});
-							clearInterval(timeOut);
-						}
-					} else {
-						jitsiRoomActive = jitsiRoom;
+					RocketChat.TabBar.updateButton('video', { class: 'red' });
 
-						RocketChat.TabBar.updateButton('video', { class: 'red' });
+					if (RocketChat.settings.get('Jitsi_Open_New_Window')) {
+						Meteor.call('jitsi:updateTimeout', roomId);
 
-						// Lets make sure its loaded before we try to show it.
-						if (typeof JitsiMeetExternalAPI !== 'undefined') {
+						timeOut = Meteor.setInterval(() => Meteor.call('jitsi:updateTimeout', roomId), 10*1000);
 
-							// Keep it from showing duplicates when re-evaluated on variable change.
-							if (!$('[id^=jitsiConference]').length) {
-								this.api = new JitsiMeetExternalAPI(domain, jitsiRoom, width, height, document.getElementById('videoContainer'), configOverwrite, interfaceConfigOverwrite, noSsl);
+						const newWindow = window.open((noSsl ? 'http://' : 'https://') + domain + '/' + jitsiRoom, jitsiRoom);
+						newWindow.focus();
 
-								/*
-								* Hack to send after frame is loaded.
-								* postMessage converts to events in the jitsi meet iframe.
-								* For some reason those aren't working right.
-								*/
-								Meteor.setTimeout(() => {
-									this.api.executeCommand('displayName', [Meteor.user().name]);
-								}, 5000);
+						let closeInterval = setInterval(() => {
+							if (newWindow.closed !== false) {
+								closePanel();
+								clearInterval(closeInterval);
+								clearInterval(timeOut);
+							}
+						}, 300);
 
-								Meteor.call('jitsi:updateTimeout', roomId);
+					// Lets make sure its loaded before we try to show it.
+					} else if (typeof JitsiMeetExternalAPI !== 'undefined') {
 
-								timeOut = Meteor.setInterval(() => Meteor.call('jitsi:updateTimeout', roomId), 10*1000);
-							}
+						// Keep it from showing duplicates when re-evaluated on variable change.
+						if (!$('[id^=jitsiConference]').length) {
+							this.api = new JitsiMeetExternalAPI(domain, jitsiRoom, width, height, document.getElementById('videoContainer'), configOverwrite, interfaceConfigOverwrite, noSsl);
 
-							// Execute any commands that might be reactive.  Like name changing.
-							if (this.api) {
+							/*
+							* Hack to send after frame is loaded.
+							* postMessage converts to events in the jitsi meet iframe.
+							* For some reason those aren't working right.
+							*/
+							Meteor.setTimeout(() => {
 								this.api.executeCommand('displayName', [Meteor.user().name]);
-							}
-						}
-					}
+							}, 5000);
 
-				} else {
-					RocketChat.TabBar.updateButton('video', { class: '' });
+							Meteor.call('jitsi:updateTimeout', roomId);
 
-					// Clean up and stop updating timeout.
-					if (timeOut) {
-						Meteor.defer(() => {
-							this.api.dispose();
-						});
-						clearInterval(timeOut);
+							timeOut = Meteor.setInterval(() => Meteor.call('jitsi:updateTimeout', roomId), 10*1000);
+						}
+
+						// Execute any commands that might be reactive.  Like name changing.
+						this.api && this.api.executeCommand('displayName', [Meteor.user().name]);
 					}
 				}
+			} else {
+				RocketChat.TabBar.updateButton('video', { class: '' });
+
+				// Clean up and stop updating timeout.
+				if (timeOut) {
+					Meteor.defer(() => this.api && this.api.dispose());
+					clearInterval(timeOut);
+				}
 			}
 		}
 	});
-
 });

packages/rocketchat-videobridge/server/settings.js

@@ -27,6 +27,16 @@ Meteor.startup(function() {
 			public: true
 		});
 
+		this.add('Jitsi_Open_New_Window', false, {
+			type: 'boolean',
+			enableQuery: {
+				_id: 'Jitsi_Enabled',
+				value: true
+			},
+			i18nLabel: 'Always_open_in_new_window',
+			public: true
+		});
+
 		this.add('Jitsi_Enable_Channels', false, {
 			type: 'boolean',
 			enableQuery: {