Implement screenshare data saving setting. Fix #5029

bigbluebutton-html5/imports/ui/components/media/container.jsx

@@ -51,8 +51,8 @@ class MediaContainer extends Component {
 MediaContainer.defaultProps = defaultProps;
 
 export default withTracker(() => {
-  const videoSettings = Settings.video;
+  const { dataSaving } = Settings;
-  const viewVideoDock = videoSettings.viewParticipantsWebcams;
+  const { viewParticipantsWebcams, viewScreenshare } = dataSaving;
 
   const data = {};
   data.currentPresentation = MediaService.getPresentationInfo();
@@ -63,11 +63,11 @@ export default withTracker(() => {
     data.content = <PresentationAreaContainer />;
   }
 
-  if (MediaService.shouldShowScreenshare()) {
+  if (MediaService.shouldShowScreenshare() && (viewScreenshare || MediaService.isUserPresenter())) {
     data.content = <ScreenshareContainer />;
   }
 
-  if (MediaService.shouldShowOverlay() && viewVideoDock) {
+  if (MediaService.shouldShowOverlay() && viewParticipantsWebcams) {
     data.overlay = <VideoDockContainer />;
   }
 

bigbluebutton-html5/imports/ui/components/media/service.js

@@ -1,5 +1,7 @@
 import Presentations from '/imports/api/presentations';
 import { isVideoBroadcasting } from '/imports/ui/components/screenshare/service';
+import Auth from '/imports/ui/services/auth';
+import Users from '/imports/api/users';
 
 const getPresentationInfo = () => {
   const currentPresentation = Presentations.findOne({
@@ -12,6 +14,8 @@ const getPresentationInfo = () => {
   };
 };
 
+const isUserPresenter = () => Users.findOne({ userId: Auth.userID }).presenter;
+
 function shouldShowWhiteboard() {
   return true;
 }
@@ -29,4 +33,5 @@ export default {
   shouldShowWhiteboard,
   shouldShowScreenshare,
   shouldShowOverlay,
+  isUserPresenter,
 };

bigbluebutton-html5/imports/ui/components/settings/component.jsx

@@ -3,7 +3,7 @@ import Modal from '/imports/ui/components/modal/fullscreen/component';
 import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
 import { defineMessages, injectIntl, intlShape } from 'react-intl';
 import ClosedCaptions from '/imports/ui/components/settings/submenus/closed-captions/component';
-import DataSaving from '/imports/ui/components/settings/submenus/dataSaving/component';
+import DataSaving from '/imports/ui/components/settings/submenus/data-saving/component';
 import Application from '/imports/ui/components/settings/submenus/application/container';
 import _ from 'lodash';
 import PropTypes from 'prop-types';
@@ -54,14 +54,14 @@ const intlMessages = defineMessages({
     description: 'Settings modal save button label',
   },
   dataSavingLabel: {
-    id: 'app.settings.dataSaving.label',
+    id: 'app.settings.dataSavingTab.label',
     description: 'label for data savings tab',
   },
 });
 
 const propTypes = {
   intl: intlShape.isRequired,
-  video: PropTypes.object.isRequired,
+  dataSaving: PropTypes.object.isRequired,
   application: PropTypes.object.isRequired,
   cc: PropTypes.object.isRequired,
   participants: PropTypes.object.isRequired,
@@ -79,18 +79,18 @@ class Settings extends Component {
     super(props);
 
     const {
-      video, participants, cc, application,
+      dataSaving, participants, cc, application,
     } = props;
 
     this.state = {
       current: {
-        video: _.clone(video),
+        dataSaving: _.clone(dataSaving),
         application: _.clone(application),
         cc: _.clone(cc),
         participants: _.clone(participants),
       },
       saved: {
-        video: _.clone(video),
+        dataSaving: _.clone(dataSaving),
         application: _.clone(application),
         cc: _.clone(cc),
         participants: _.clone(participants),
@@ -158,7 +158,7 @@ class Settings extends Component {
             aria-labelledby="dataSavingTab"
             selectedClassName={styles.selected}
           >
-            <Icon iconName="more" className={styles.icon} />
+            <Icon iconName="network" className={styles.icon} />
             <span id="dataSaving">{intl.formatMessage(intlMessages.dataSavingLabel)}</span>
           </Tab>
           {/* { isModerator ? */}
@@ -190,7 +190,7 @@ class Settings extends Component {
         </TabPanel>
         <TabPanel className={styles.tabPanel}>
           <DataSaving
-            settings={this.state.current.video}
+            settings={this.state.current.dataSaving}
             handleUpdateSettings={this.handleUpdateSettings}
           />
         </TabPanel>

bigbluebutton-html5/imports/ui/components/settings/container.jsx

@@ -16,7 +16,7 @@ const SettingsContainer = props => (
 
 export default withTracker(() => ({
   audio: SettingsService.audio,
-  video: SettingsService.video,
+  dataSaving: SettingsService.dataSaving,
   application: SettingsService.application,
   cc: SettingsService.cc,
   participants: SettingsService.participants,

bigbluebutton-html5/imports/ui/components/settings/submenus/data-saving/component.jsx

@@ -7,19 +7,19 @@ import { styles } from '../styles';
 
 const intlMessages = defineMessages({
   dataSavingLabel: {
-    id: 'app.settings.dataSaving.label',
+    id: 'app.settings.dataSavingTab.label',
     description: 'label for data savings tab',
   },
   webcamLabel: {
-    id: 'app.settings.dataSaving.webcam',
+    id: 'app.settings.dataSavingTab.webcam',
     description: 'webcam toggle',
   },
   screenShareLabel: {
-    id: 'app.settings.dataSaving.screenShare',
+    id: 'app.settings.dataSavingTab.screenShare',
     description: 'screenshare toggle',
   },
   dataSavingDesc: {
-    id: 'app.settings.dataSaving.description',
+    id: 'app.settings.dataSavingTab.description',
     description: 'description of data savings tab',
   },
 });
@@ -29,13 +29,15 @@ class DataSaving extends BaseMenu {
     super(props);
 
     this.state = {
-      settingsName: 'video',
+      settingsName: 'dataSaving',
       settings: props.settings,
     };
   }
   render() {
     const { intl } = this.props;
 
+    const { viewParticipantsWebcams, viewScreenshare } = this.state.settings;
+
     return (
       <div className={styles.tabContent}>
         <div className={styles.header}>
@@ -55,7 +57,7 @@ class DataSaving extends BaseMenu {
               <div className={cx(styles.formElement, styles.pullContentRight)}>
                 <Toggle
                   icons={false}
-                  defaultChecked={!this.state.settings.viewParticipantsWebcams}
+                  defaultChecked={!viewParticipantsWebcams}
                   onChange={() => this.handleToggle('viewParticipantsWebcams')}
                   ariaLabelledBy="webcamToggle"
                   ariaLabel={intl.formatMessage(intlMessages.webcamLabel)}
@@ -75,8 +77,8 @@ class DataSaving extends BaseMenu {
               <div className={cx(styles.formElement, styles.pullContentRight)}>
                 <Toggle
                   icons={false}
-                  defaultChecked={false}
+                  defaultChecked={!viewScreenshare}
-                  onChange={() => this.handleToggle('')}
+                  onChange={() => this.handleToggle('viewScreenshare')}
                   ariaLabelledBy="screenShare"
                   ariaLabel="screenShare"
                 />

bigbluebutton-html5/imports/ui/components/video-dock/video-menu/container.jsx

@@ -12,7 +12,7 @@ export default withTracker((params) => {
   const isWaitingResponse = VideoService.isWaitingResponse();
   const isConnected = VideoService.isConnected();
 
-  const videoSettings = Settings.video;
+  const videoSettings = Settings.dataSaving;
   const enableShare = !videoSettings.viewParticipantsWebcams;
   return {
     isSharingVideo,

bigbluebutton-html5/imports/ui/services/settings/index.js

@@ -7,6 +7,7 @@ const SETTINGS = [
   'video',
   'cc',
   'participants',
+  'dataSaving',
 ];
 
 class Settings {

bigbluebutton-html5/private/config/settings-development.json

@@ -25,8 +25,9 @@
           "inputDeviceId": "undefined",
           "outputDeviceId": "undefined"
         },
-        "video": {
+        "dataSaving": {
-          "viewParticipantsWebcams": true
+          "viewParticipantsWebcams": true,
+          "viewScreenshare": true
         },
         "cc": {
           "backgroundColor": "#FFFFFF",
@@ -52,11 +53,11 @@
     },
 
     "kurento": {
-      "wsUrl": "HOST",
+      "wsUrl": "wss://bbb-joao.dev.imdt.com.br/bbb-webrtc-sfu",
-      "chromeExtensionKey": "KEY",
+      "chromeExtensionKey": "mbfngdphjegmlbfobcblikeefpidfncb",
-      "chromeExtensionLink": "LINK",
+      "chromeExtensionLink": "https://chrome.google.com/webstore/detail/kurento-screenshare-test/mbfngdphjegmlbfobcblikeefpidfncb",
-      "enableScreensharing": false,
+      "enableScreensharing": true,
-      "enableVideo": false
+      "enableVideo": true
     },
 
     "acl": {

bigbluebutton-html5/private/config/settings-production.json

@@ -25,8 +25,9 @@
           "inputDeviceId": "undefined",
           "outputDeviceId": "undefined"
         },
-        "video": {
+        "dataSaving": {
-          "viewParticipantsWebcams": true
+          "viewParticipantsWebcams": true,
+          "viewScreenshare": true
         },
         "cc": {
           "backgroundColor": "#FFFFFF",

bigbluebutton-html5/private/locales/en.json

@@ -43,13 +43,11 @@
   "app.meeting.ended": "This session has ended",
   "app.meeting.endedMessage": "You will be forwarded back to the home screen",
   "app.presentation.presentationToolbar.prevSlideLabel": "Previous slide",
-  "app.presentation.presentationToolbar.prevSlideDesc":
+  "app.presentation.presentationToolbar.prevSlideDesc": "Change the presentation to the previous slide",
-    "Change the presentation to the previous slide",
   "app.presentation.presentationToolbar.nextSlideLabel": "Next slide",
   "app.presentation.presentationToolbar.nextSlideDesc": "Change the presentation to the next slide",
   "app.presentation.presentationToolbar.skipSlideLabel": "Skip slide",
-  "app.presentation.presentationToolbar.skipSlideDesc":
+  "app.presentation.presentationToolbar.skipSlideDesc": "Change the presentation to a specific slide",
-    "Change the presentation to a specific slide",
   "app.presentation.presentationToolbar.fitWidthLabel": "Fit to width",
   "app.presentation.presentationToolbar.fitWidthDesc": "Display the whole width of the slide",
   "app.presentation.presentationToolbar.fitScreenLabel": "Fit to screen",
@@ -58,8 +56,7 @@
   "app.presentation.presentationToolbar.zoomDesc": "Change the zoom level of the presentation",
   "app.presentation.presentationToolbar.goToSlide": "Slide {0}",
   "app.presentationUploder.title": "Presentation",
-  "app.presentationUploder.message":
+  "app.presentationUploder.message": "As a presenter in BigBlueButton, you have the ability of uploading any office document or PDF file. We recommend for the best results, to please upload a PDF file.",
-    "As a presenter in BigBlueButton, you have the ability of uploading any office document or PDF file. We recommend for the best results, to please upload a PDF file.",
   "app.presentationUploder.confirmLabel": "Start",
   "app.presentationUploder.confirmDesc": "Save your changes and start the presentation",
   "app.presentationUploder.dismissLabel": "Cancel",
@@ -71,8 +68,7 @@
   "app.presentationUploder.genericError": "Ops, something went wrong",
   "app.presentationUploder.upload.progress": "Uploading ({progress}%)",
   "app.presentationUploder.upload.413": "File is too large",
-  "app.presentationUploder.conversion.conversionProcessingSlides":
+  "app.presentationUploder.conversion.conversionProcessingSlides": "Processing page {current} of {total}",
-    "Processing page {current} of {total}",
   "app.presentationUploder.conversion.genericConversionStatus": "Converting file...",
   "app.presentationUploder.conversion.generatingThumbnail": "Generating thumbnails...",
   "app.presentationUploder.conversion.generatedSlides": "Slides generated...",
@@ -153,8 +149,7 @@
   "app.submenu.participants.lockMicDesc": "Disables the microphone for all locked participants",
   "app.submenu.participants.lockCamDesc": "Disables the webcam for all locked participants",
   "app.submenu.participants.lockPublicChatDesc": "Disables public chat for all locked participants",
-  "app.submenu.participants.lockPrivateChatDesc":
+  "app.submenu.participants.lockPrivateChatDesc": "Disables private chat for all locked participants",
-    "Disables private chat for all locked participants",
   "app.submenu.participants.lockLayoutDesc": "Locks layout for all locked participants",
   "app.submenu.participants.lockMicAriaLabel": "Microphone lock",
   "app.submenu.participants.lockCamAriaLabel": "Webcam lock",
@@ -176,11 +171,10 @@
   "app.settings.main.cancel.label.description": "Discards the changes and closes the settings menu",
   "app.settings.main.save.label": "Save",
   "app.settings.main.save.label.description": "Saves the changes and closes the settings menu",
-  "app.settings.dataSaving.label": "Data Savings",
+  "app.settings.dataSavingTab.label": "Data Savings",
-  "app.settings.dataSaving.webcam": "Disable Webcams",
+  "app.settings.dataSavingTab.webcam": "Disable Webcams",
-  "app.settings.dataSaving.screenShare": "Disable Desktop Sharing",
+  "app.settings.dataSavingTab.screenShare": "Disable Desktop Sharing",
-  "app.settings.dataSaving.description":
+  "app.settings.dataSavingTab.description": "To save your bandwidth adjust what's currently being displayed.",
-    "To save your bandwidth adjust what's currently being displayed.",
   "app.actionsBar.actionsDropdown.actionsLabel": "Actions",
   "app.actionsBar.actionsDropdown.presentationLabel": "Upload a presentation",
   "app.actionsBar.actionsDropdown.initPollLabel": "Initiate a poll",
@@ -220,13 +214,11 @@
   "app.audioNotification.audioFailedError1006": "Error 1006: Call timed out",
   "app.audioNotification.audioFailedError1007": "Error 1007: ICE negotiation failed",
   "app.audioNotification.audioFailedError1008": "Error 1008: Transfer failed",
-  "app.audioNotification.audioFailedError1009":
+  "app.audioNotification.audioFailedError1009": "Error 1009: Could not fetch STUN/TURN server information",
-    "Error 1009: Could not fetch STUN/TURN server information",
   "app.audioNotification.audioFailedError1010": "Error 1010: ICE negotiation timeout",
   "app.audioNotification.audioFailedError1011": "Error 1011: ICE gathering timeout",
   "app.audioNotification.audioFailedMessage": "Your audio connection failed to connect",
-  "app.audioNotification.mediaFailedMessage":
+  "app.audioNotification.mediaFailedMessage": "getUserMicMedia failed, Only secure origins are allowed",
-    "getUserMicMedia failed, Only secure origins are allowed",
   "app.audioNotification.closeLabel": "Close",
   "app.breakoutJoinConfirmation.title": "Join Breakout Room",
   "app.breakoutJoinConfirmation.message": "Do you want to join",
@@ -244,12 +236,10 @@
   "app.audioModal.closeLabel": "Close",
   "app.audioModal.yes": "Yes",
   "app.audioModal.no": "No",
-  "app.audioModal.echoTestTitle":
+  "app.audioModal.echoTestTitle": "This is a private echo test. Speak a few words. Did you hear audio?",
-    "This is a private echo test. Speak a few words. Did you hear audio?",
   "app.audioModal.settingsTitle": "Change your audio settings",
   "app.audioModal.helpTitle": "There was an issue with your media devices",
-  "app.audioModal.helpText":
+  "app.audioModal.helpText": "Did you give BigBlueButton permission to access your microphone? Note that a dialog should appear when you try to join audio, asking for your media device permissions, please accept that in order to join the audio conference. If that is not the case, try changing your microphone permissions in your browser's settings.",
-    "Did you give BigBlueButton permission to access your microphone? Note that a dialog should appear when you try to join audio, asking for your media device permissions, please accept that in order to join the audio conference. If that is not the case, try changing your microphone permissions in your browser's settings.",
   "app.audioModal.connecting": "Connecting",
   "app.audioModal.connectingEchoTest": "Connecting to echo test",
   "app.audioManager.joinedAudio": "You have joined the audio conference",
@@ -266,8 +256,7 @@
   "app.audio.playSoundLabel": "Play Sound",
   "app.audio.backLabel": "Back",
   "app.audio.audioSettings.titleLabel": "Choose your audio settings",
-  "app.audio.audioSettings.descriptionLabel":
+  "app.audio.audioSettings.descriptionLabel": "Please note, a dialog will appear in your browser, requiring you to accept sharing your microphone.",
-    "Please note, a dialog will appear in your browser, requiring you to accept sharing your microphone.",
   "app.audio.audioSettings.microphoneSourceLabel": "Microphone source",
   "app.audio.audioSettings.speakerSourceLabel": "Speaker source",
   "app.audio.audioSettings.microphoneStreamLabel": "Your audio stream volume",
@@ -275,8 +264,7 @@
   "app.audio.listenOnly.backLabel": "Back",
   "app.audio.listenOnly.closeLabel": "Close",
   "app.audio.permissionsOverlay.title": "Allow BigBlueButton to use your Media Devices",
-  "app.audio.permissionsOverlay.hint":
+  "app.audio.permissionsOverlay.hint": "We need you to allow us to use your Media Devices in order to join you to the voice conference :)",
-    "We need you to allow us to use your Media Devices in order to join you to the voice conference :)",
   "app.error.removed": "You have been removed from the conference",
   "app.error.meeting.ended": "You have logged out of the conference",
   "app.dropdown.close": "Close",