diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx index fb4a838e991e006e98a871b79588ee9499ead3ee..37880b7e931f3c67e845e30a0b3fdf2733fa998a 100755 --- a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx @@ -30,6 +30,7 @@ class ActionsBar extends React.PureComponent { currentSlidHasContent, parseCurrentSlideContent, isSharingVideo, + screenShareEndAlert, } = this.props; const { @@ -89,6 +90,7 @@ class ActionsBar extends React.PureComponent { isVideoBroadcasting, isUserPresenter, screenSharingCheck, + screenShareEndAlert, }} /> </div> diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx index 49775b3378163c2f586dcdca8179a83ae0cdc4f2..821fa91e5ce1a54c570cf47813774a16aae43e50 100644 --- a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx +++ b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx @@ -8,7 +8,9 @@ import PresentationService from '/imports/ui/components/presentation/service'; import ActionsBar from './component'; import Service from './service'; import VideoService from '../video-provider/service'; -import { shareScreen, unshareScreen, isVideoBroadcasting } from '../screenshare/service'; +import { + shareScreen, unshareScreen, isVideoBroadcasting, screenShareEndAlert, +} from '../screenshare/service'; import MediaService, { getSwapLayout } from '../media/service'; @@ -27,7 +29,6 @@ export default withTracker(() => { }, }); - return { isUserPresenter: Service.isUserPresenter(), isUserModerator: Service.isUserModerator(), @@ -46,5 +47,6 @@ export default withTracker(() => { currentSlidHasContent: PresentationService.currentSlidHasContent(), parseCurrentSlideContent: PresentationService.parseCurrentSlideContent, isSharingVideo: Service.isSharingVideo(), + screenShareEndAlert, }; })(injectIntl(ActionsBarContainer)); diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/desktop-share/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/desktop-share/component.jsx index 3981ee8a4a4466308b0aae99f95cf484eacf6751..09e8aec08309cbf3c1acb94b67ab13570a962c4f 100755 --- a/bigbluebutton-html5/imports/ui/components/actions-bar/desktop-share/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/actions-bar/desktop-share/component.jsx @@ -41,10 +41,10 @@ const intlMessages = defineMessages({ }); const BROWSER_RESULTS = browser(); -const isMobileBrowser = (BROWSER_RESULTS ? BROWSER_RESULTS.mobile : false) || - (BROWSER_RESULTS && BROWSER_RESULTS.os ? - BROWSER_RESULTS.os.includes('Android') : // mobile flag doesn't always work - false); +const isMobileBrowser = (BROWSER_RESULTS ? BROWSER_RESULTS.mobile : false) + || (BROWSER_RESULTS && BROWSER_RESULTS.os + ? BROWSER_RESULTS.os.includes('Android') // mobile flag doesn't always work + : false); const ICE_CONNECTION_FAILED = 'ICE connection failed'; @@ -55,6 +55,7 @@ const DesktopShare = ({ isVideoBroadcasting, isUserPresenter, screenSharingCheck, + screenShareEndAlert, }) => { const onFail = (error) => { switch (error) { @@ -66,23 +67,26 @@ const DesktopShare = ({ default: logger.error({ logCode: 'desktopshare_default_error' }, error || 'Default error handler'); } + screenShareEndAlert(); }; - 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)} - color={isVideoBroadcasting ? 'primary' : 'default'} - ghost={!isVideoBroadcasting} - hideLabel - circle - size="lg" - onClick={isVideoBroadcasting ? handleUnshareScreen : () => handleShareScreen(onFail)} - id={isVideoBroadcasting ? 'unshare-screen-button' : 'share-screen-button'} - /> + 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)} + color={isVideoBroadcasting ? 'primary' : 'default'} + ghost={!isVideoBroadcasting} + hideLabel + circle + size="lg" + onClick={isVideoBroadcasting ? handleUnshareScreen : () => handleShareScreen(onFail)} + id={isVideoBroadcasting ? 'unshare-screen-button' : 'share-screen-button'} + /> + ) : null); }; diff --git a/bigbluebutton-html5/imports/ui/components/screenshare/component.jsx b/bigbluebutton-html5/imports/ui/components/screenshare/component.jsx index 38fa8d9859b58483c61b3ee0e119cfb889cc41e2..01c57a045dfb7f58af01f5378e064ba53c4844a8 100755 --- a/bigbluebutton-html5/imports/ui/components/screenshare/component.jsx +++ b/bigbluebutton-html5/imports/ui/components/screenshare/component.jsx @@ -28,14 +28,18 @@ class ScreenshareComponent extends React.Component { } componentWillReceiveProps(nextProps) { - const { isPresenter, unshareScreen } = this.props; + const { + isPresenter, unshareScreen, + } = this.props; if (isPresenter && !nextProps.isPresenter) { unshareScreen(); } } componentWillUnmount() { - const { presenterScreenshareHasEnded, unshareScreen } = this.props; + const { + presenterScreenshareHasEnded, unshareScreen, + } = this.props; presenterScreenshareHasEnded(); unshareScreen(); } diff --git a/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx b/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx index 169fd0eb237a5904eae20c6be5a414ef5a7ee59e..5515c8fc9f6ce458ee57301506cd32ab8be3c729 100755 --- a/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx +++ b/bigbluebutton-html5/imports/ui/components/screenshare/container.jsx @@ -3,8 +3,10 @@ import { withTracker } from 'meteor/react-meteor-data'; import Users from '/imports/api/users/'; import Auth from '/imports/ui/services/auth'; import mapUser from '/imports/ui/services/user/mapUser'; -import { isVideoBroadcasting, presenterScreenshareHasEnded, unshareScreen, - presenterScreenshareHasStarted } from './service'; +import { + isVideoBroadcasting, presenterScreenshareHasEnded, unshareScreen, + presenterScreenshareHasStarted, +} from './service'; import ScreenshareComponent from './component'; class ScreenshareContainer extends React.Component { diff --git a/bigbluebutton-html5/imports/ui/components/screenshare/service.js b/bigbluebutton-html5/imports/ui/components/screenshare/service.js index 15410b05a25761a8646154a012724efc0fc80edc..b4c89dbcdd189867b729002b905ce5cd4749c1e4 100644 --- a/bigbluebutton-html5/imports/ui/components/screenshare/service.js +++ b/bigbluebutton-html5/imports/ui/components/screenshare/service.js @@ -34,12 +34,16 @@ const shareScreen = (onFail) => { const unshareScreen = () => { KurentoBridge.kurentoExitScreenShare(); + screenShareEndAlert(); }; +const screenShareEndAlert = () => new Audio(`${Meteor.settings.public.app.cdn + Meteor.settings.public.app.basename}/resources/sounds/ScreenshareOff.mp3`).play(); + export { isVideoBroadcasting, presenterScreenshareHasEnded, presenterScreenshareHasStarted, shareScreen, unshareScreen, + screenShareEndAlert, }; diff --git a/bigbluebutton-html5/public/resources/sounds/ScreenshareOff.mp3 b/bigbluebutton-html5/public/resources/sounds/ScreenshareOff.mp3 new file mode 100644 index 0000000000000000000000000000000000000000..9a64f01329ee0d8c92b7b16f331f7a3aecd46b68 Binary files /dev/null and b/bigbluebutton-html5/public/resources/sounds/ScreenshareOff.mp3 differ