Merge pull request #7530 from diegobenetti/issue7390-datasaving-screenshare

Lock screenshare option when datasaving screenshare setting is disabled

bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx

@@ -32,6 +32,7 @@ class ActionsBar extends React.PureComponent {
       isSharingVideo,
       screenShareEndAlert,
       stopExternalVideoShare,
+      screenshareDataSavingSetting,
       isCaptionsAvailable,
     } = this.props;
 
@@ -94,6 +95,7 @@ class ActionsBar extends React.PureComponent {
             isUserPresenter,
             screenSharingCheck,
             screenShareEndAlert,
+            screenshareDataSavingSetting,
           }}
           />
           {isCaptionsAvailable

bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx

@@ -11,7 +11,7 @@ import VideoService from '../video-provider/service';
 import ExternalVideoService from '/imports/ui/components/external-video-player/service';
 import CaptionsService from '/imports/ui/components/captions/service';
 import {
-  shareScreen, unshareScreen, isVideoBroadcasting, screenShareEndAlert,
+  shareScreen, unshareScreen, isVideoBroadcasting, screenShareEndAlert, dataSavingSetting,
 } from '../screenshare/service';
 
 import MediaService, { getSwapLayout } from '../media/service';
@@ -51,6 +51,7 @@ export default withTracker(() => {
     parseCurrentSlideContent: PresentationService.parseCurrentSlideContent,
     isSharingVideo: Service.isSharingVideo(),
     screenShareEndAlert,
+    screenshareDataSavingSetting: dataSavingSetting(),
     isCaptionsAvailable: CaptionsService.isCaptionsAvailable(),
   };
 })(injectIntl(ActionsBarContainer));

bigbluebutton-html5/imports/ui/components/actions-bar/desktop-share/component.jsx

@@ -15,6 +15,8 @@ const propTypes = {
   handleUnshareScreen: PropTypes.func.isRequired,
   isVideoBroadcasting: PropTypes.bool.isRequired,
   screenSharingCheck: PropTypes.bool.isRequired,
+  screenShareEndAlert: PropTypes.func.isRequired,
+  screenshareDataSavingSetting: PropTypes.bool.isRequired,
 };
 
 const intlMessages = defineMessages({
@@ -22,6 +24,10 @@ const intlMessages = defineMessages({
     id: 'app.actionsBar.actionsDropdown.desktopShareLabel',
     description: 'Desktop Share option label',
   },
+  lockedDesktopShareLabel: {
+    id: 'app.actionsBar.actionsDropdown.lockedDesktopShareLabel',
+    description: 'Desktop locked Share option label',
+  },
   stopDesktopShareLabel: {
     id: 'app.actionsBar.actionsDropdown.stopDesktopShareLabel',
     description: 'Stop Desktop Share option label',
@@ -56,6 +62,7 @@ const DesktopShare = ({
   isUserPresenter,
   screenSharingCheck,
   screenShareEndAlert,
+  screenshareDataSavingSetting,
 }) => {
   const onFail = (error) => {
     switch (error) {
@@ -69,15 +76,23 @@ const DesktopShare = ({
     }
     screenShareEndAlert();
   };
+
+  const screenshareLocked = screenshareDataSavingSetting
+    ? intlMessages.desktopShareLabel : intlMessages.lockedDesktopShareLabel;
+
+  const vLabel = isVideoBroadcasting
+    ? intlMessages.stopDesktopShareLabel : screenshareLocked;
+
+  const vDescr = isVideoBroadcasting
+    ? intlMessages.stopDesktopShareDesc : intlMessages.desktopShareDesc;
+
   return (screenSharingCheck && !isMobileBrowser && isUserPresenter
     ? (
       <Button
         className={cx(styles.button, isVideoBroadcasting || styles.btn)}
         icon={isVideoBroadcasting ? 'desktop' : 'desktop_off'}
-        label={intl.formatMessage(isVideoBroadcasting
-          ? intlMessages.stopDesktopShareLabel : intlMessages.desktopShareLabel)}
-        description={intl.formatMessage(isVideoBroadcasting
-          ? intlMessages.stopDesktopShareDesc : intlMessages.desktopShareDesc)}
+        label={intl.formatMessage(vLabel)}
+        description={intl.formatMessage(vDescr)}
         color={isVideoBroadcasting ? 'primary' : 'default'}
         ghost={!isVideoBroadcasting}
         hideLabel
@@ -85,6 +100,7 @@ const DesktopShare = ({
         size="lg"
         onClick={isVideoBroadcasting ? handleUnshareScreen : () => handleShareScreen(onFail)}
         id={isVideoBroadcasting ? 'unshare-screen-button' : 'share-screen-button'}
+        disabled={!screenshareDataSavingSetting}
       />
     )
     : null);

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

@@ -1,5 +1,6 @@
 import Screenshare from '/imports/api/screenshare';
 import KurentoBridge from '/imports/api/screenshare/client/bridge';
+import Settings from '/imports/ui/services/settings';
 
 // when the meeting information has been updated check to see if it was
 // screensharing. If it has changed either trigger a call to receive video
@@ -32,12 +33,14 @@ const shareScreen = (onFail) => {
   KurentoBridge.kurentoShareScreen(onFail);
 };
 
+const screenShareEndAlert = () => new Audio(`${Meteor.settings.public.app.cdn + Meteor.settings.public.app.basename}/resources/sounds/ScreenshareOff.mp3`).play();
+
 const unshareScreen = () => {
   KurentoBridge.kurentoExitScreenShare();
   screenShareEndAlert();
 };
 
-const screenShareEndAlert = () => new Audio(`${Meteor.settings.public.app.cdn + Meteor.settings.public.app.basename}/resources/sounds/ScreenshareOff.mp3`).play();
+const dataSavingSetting = () => Settings.dataSaving.viewScreenshare;
 
 export {
   isVideoBroadcasting,
@@ -46,4 +49,5 @@ export {
   shareScreen,
   unshareScreen,
   screenShareEndAlert,
+  dataSavingSetting,
 };

bigbluebutton-html5/imports/ui/components/video-provider/video-button/component.jsx

@@ -56,15 +56,15 @@ const JoinVideoButton = ({
     handleJoinVideo();
   };
 
+  const sharingVideoLabel = isSharingVideo
+    ? intl.formatMessage(intlMessages.leaveVideo) : intl.formatMessage(intlMessages.joinVideo);
+
+  const disabledLabel = isDisabled
+    ? intl.formatMessage(intlMessages.videoLocked) : sharingVideoLabel;
+
   return (
     <Button
-      label={isDisabled
-        ? intl.formatMessage(intlMessages.videoLocked)
-        : (isSharingVideo
-          ? intl.formatMessage(intlMessages.leaveVideo)
-          : intl.formatMessage(intlMessages.joinVideo)
-        )
-      }
+      label={disabledLabel}
       className={cx(styles.button, isSharingVideo || styles.btn)}
       onClick={isSharingVideo ? handleCloseVideo : verifyIOS}
       hideLabel

bigbluebutton-html5/private/locales/en.json

@@ -312,6 +312,7 @@
     "app.actionsBar.actionsDropdown.presentationLabel": "Upload a presentation",
     "app.actionsBar.actionsDropdown.initPollLabel": "Initiate a poll",
     "app.actionsBar.actionsDropdown.desktopShareLabel": "Share your screen",
+    "app.actionsBar.actionsDropdown.lockedDesktopShareLabel": "Screenshare locked",
     "app.actionsBar.actionsDropdown.stopDesktopShareLabel": "Stop sharing your screen",
     "app.actionsBar.actionsDropdown.presentationDesc": "Upload your presentation",
     "app.actionsBar.actionsDropdown.initPollDesc": "Initiate a poll",