Merge pull request #10424 from Tainan404/issue-10319-2.2

Add individual messages to video disable

bigbluebutton-html5/imports/ui/components/video-provider/service.js

@@ -543,10 +543,17 @@ class VideoService {
     this.exitVideo();
   }
 
-  isDisabled() {
+  disableReason() {
     const { viewParticipantsWebcams } = Settings.dataSaving;
-
-    return this.isUserLocked() || this.isConnecting || !viewParticipantsWebcams;
+    const locks = {
+      videoLocked: this.isUserLocked(),
+      videoConnecting: this.isConnecting,
+      dataSaving: !viewParticipantsWebcams,
+      meteorDisconnected: !Meteor.status().connected
+    };
+    const locksKeys = Object.keys(locks);
+    const disableReason = locksKeys.filter( i => locks[i]).shift();
+    return disableReason ? disableReason : false;
   }
 
   getRole(isLocal) {
@@ -734,7 +741,7 @@ export default {
   getAuthenticatedURL: () => videoService.getAuthenticatedURL(),
   isLocalStream: cameraId => videoService.isLocalStream(cameraId),
   hasVideoStream: () => videoService.hasVideoStream(),
-  isDisabled: () => videoService.isDisabled(),
+  disableReason: () => videoService.disableReason(),
   playStart: cameraId => videoService.playStart(cameraId),
   getCameraProfile: () => videoService.getCameraProfile(),
   addCandidateToPeer: (peer, candidate, cameraId) => videoService.addCandidateToPeer(peer, candidate, cameraId),

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

@@ -24,6 +24,18 @@ const intlMessages = defineMessages({
     id: 'app.video.videoLocked',
     description: 'video disabled label',
   },
+  videoConnecting: {
+    id: 'app.video.connecting',
+    description: 'video connecting label',
+  },
+  dataSaving: {
+    id: 'app.video.dataSaving',
+    description: 'video data saving label',
+  },
+  meteorDisconnected: {
+    id: 'app.video.clientDisconnected',
+    description: 'Meteor disconnected label',
+  },
   iOSWarning: {
     id: 'app.iOSWarning.label',
     description: 'message indicating to upgrade ios version',
@@ -33,14 +45,13 @@ const intlMessages = defineMessages({
 const propTypes = {
   intl: intlShape.isRequired,
   hasVideoStream: PropTypes.bool.isRequired,
-  isDisabled: PropTypes.bool.isRequired,
   mountVideoPreview: PropTypes.func.isRequired,
 };
 
 const JoinVideoButton = ({
   intl,
   hasVideoStream,
-  isDisabled,
+  disableReason,
   mountVideoPreview,
 }) => {
   const exitVideo = () => hasVideoStream && !VideoService.isMultipleCamerasEnabled();
@@ -63,7 +74,7 @@ const JoinVideoButton = ({
 
   return (
     <Button
-      label={isDisabled ? intl.formatMessage(intlMessages.videoLocked) : label}
+      label={disableReason ? intl.formatMessage(intlMessages[disableReason]) : label}
       className={cx(styles.button, hasVideoStream || styles.btn)}
       onClick={handleOnClick}
       hideLabel
@@ -73,7 +84,7 @@ const JoinVideoButton = ({
       ghost={!hasVideoStream}
       size="lg"
       circle
-      disabled={isDisabled}
+      disabled={!!disableReason}
     />
   );
 };

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

@@ -9,7 +9,7 @@ import VideoService from '../service';
 const JoinVideoOptionsContainer = (props) => {
   const {
     hasVideoStream,
-    isDisabled,
+    disableReason,
     intl,
     mountModal,
     ...restProps
@@ -19,7 +19,7 @@ const JoinVideoOptionsContainer = (props) => {
 
   return (
     <JoinVideoButton {...{
-      mountVideoPreview, hasVideoStream, isDisabled, ...restProps,
+      mountVideoPreview, hasVideoStream, disableReason, ...restProps,
     }}
     />
   );
@@ -27,5 +27,5 @@ const JoinVideoOptionsContainer = (props) => {
 
 export default withModalMounter(injectIntl(withTracker(() => ({
   hasVideoStream: VideoService.hasVideoStream(),
-  isDisabled: VideoService.isDisabled() || !Meteor.status().connected,
+  disableReason: VideoService.disableReason(),
 }))(JoinVideoOptionsContainer)));

bigbluebutton-html5/private/locales/en.json

@@ -562,6 +562,8 @@
     "app.videoPreview.webcamNotFoundLabel": "Webcam not found",
     "app.videoPreview.profileNotFoundLabel": "No supported camera profile",
     "app.video.joinVideo": "Share webcam",
+    "app.video.connecting": "Webcam sharing is starting",
+    "app.video.dataSaving": "Webcam sharing is disabled in Data Saving",
     "app.video.leaveVideo": "Stop sharing webcam",
     "app.video.iceCandidateError": "Error on adding ICE candidate",
     "app.video.iceConnectionStateError": "Connection failure (ICE error 1107)",
@@ -587,6 +589,7 @@
     "app.video.chromeExtensionErrorLink": "this Chrome extension",
     "app.video.pagination.prevPage": "See previous videos",
     "app.video.pagination.nextPage": "See next videos",
+    "app.video.clientDisconnected": "Webcam cannot be shared due to connection issues",
     "app.fullscreenButton.label": "Make {0} fullscreen",
     "app.deskshare.iceConnectionStateError": "Connection failed when sharing screen (ICE error 1108)",
     "app.sfu.mediaServerConnectionError2000": "Unable to connect to media server (error 2000)",