2018-07-10 03:04:24 +08:00
|
|
|
import React from 'react';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import { defineMessages, injectIntl, intlShape } from 'react-intl';
|
|
|
|
import browser from 'browser-detect';
|
|
|
|
import Button from '/imports/ui/components/button/component';
|
2018-08-23 02:10:08 +08:00
|
|
|
import logger from '/imports/startup/client/logger';
|
|
|
|
import { notify } from '/imports/ui/services/notification';
|
2018-11-28 20:59:03 +08:00
|
|
|
import cx from 'classnames';
|
2018-07-10 03:04:24 +08:00
|
|
|
import { styles } from '../styles';
|
|
|
|
|
|
|
|
const propTypes = {
|
|
|
|
intl: intlShape.isRequired,
|
|
|
|
isUserPresenter: PropTypes.bool.isRequired,
|
2018-07-25 05:49:40 +08:00
|
|
|
handleShareScreen: PropTypes.func.isRequired,
|
|
|
|
handleUnshareScreen: PropTypes.func.isRequired,
|
|
|
|
isVideoBroadcasting: PropTypes.bool.isRequired,
|
2018-09-14 02:09:30 +08:00
|
|
|
screenSharingCheck: PropTypes.bool.isRequired,
|
2018-07-10 03:04:24 +08:00
|
|
|
};
|
|
|
|
|
|
|
|
const intlMessages = defineMessages({
|
|
|
|
desktopShareLabel: {
|
|
|
|
id: 'app.actionsBar.actionsDropdown.desktopShareLabel',
|
|
|
|
description: 'Desktop Share option label',
|
|
|
|
},
|
|
|
|
stopDesktopShareLabel: {
|
|
|
|
id: 'app.actionsBar.actionsDropdown.stopDesktopShareLabel',
|
|
|
|
description: 'Stop Desktop Share option label',
|
|
|
|
},
|
|
|
|
desktopShareDesc: {
|
|
|
|
id: 'app.actionsBar.actionsDropdown.desktopShareDesc',
|
|
|
|
description: 'adds context to desktop share option',
|
|
|
|
},
|
|
|
|
stopDesktopShareDesc: {
|
|
|
|
id: 'app.actionsBar.actionsDropdown.stopDesktopShareDesc',
|
|
|
|
description: 'adds context to stop desktop share option',
|
|
|
|
},
|
2018-08-23 02:10:08 +08:00
|
|
|
iceConnectionStateError: {
|
|
|
|
id: 'app.deskshare.iceConnectionStateError',
|
|
|
|
description: 'Error message for ice connection state failure',
|
|
|
|
},
|
2018-07-10 03:04:24 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
const BROWSER_RESULTS = browser();
|
2018-08-01 23:10:21 +08:00
|
|
|
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);
|
2018-09-14 02:09:30 +08:00
|
|
|
|
2018-08-23 23:49:16 +08:00
|
|
|
const ICE_CONNECTION_FAILED = 'ICE connection failed';
|
2018-07-10 03:04:24 +08:00
|
|
|
|
|
|
|
const DesktopShare = ({
|
|
|
|
intl,
|
|
|
|
handleShareScreen,
|
|
|
|
handleUnshareScreen,
|
|
|
|
isVideoBroadcasting,
|
|
|
|
isUserPresenter,
|
2018-09-14 02:09:30 +08:00
|
|
|
screenSharingCheck,
|
2018-08-23 02:10:08 +08:00
|
|
|
}) => {
|
|
|
|
const onFail = (error) => {
|
2018-08-23 23:49:16 +08:00
|
|
|
switch (error) {
|
2018-08-23 02:10:08 +08:00
|
|
|
case ICE_CONNECTION_FAILED:
|
|
|
|
kurentoExitScreenShare();
|
|
|
|
logger.error('Ice connection state error');
|
|
|
|
notify(intl.formatMessage(intlMessages.iceConnectionStateError), 'error', 'desktop');
|
|
|
|
break;
|
|
|
|
default:
|
2018-08-23 23:49:16 +08:00
|
|
|
logger.error(error || 'Default error handler');
|
2018-08-23 02:10:08 +08:00
|
|
|
}
|
|
|
|
};
|
|
|
|
return (screenSharingCheck && !isMobileBrowser && isUserPresenter ?
|
2018-07-25 05:49:40 +08:00
|
|
|
<Button
|
2018-11-28 20:59:03 +08:00
|
|
|
className={cx(styles.button, isVideoBroadcasting || styles.btn)}
|
|
|
|
icon={isVideoBroadcasting ? 'desktop' : 'desktop_off'}
|
2018-07-25 05:49:40 +08:00
|
|
|
label={intl.formatMessage(isVideoBroadcasting ?
|
2018-07-10 03:04:24 +08:00
|
|
|
intlMessages.stopDesktopShareLabel : intlMessages.desktopShareLabel)}
|
2018-07-25 05:49:40 +08:00
|
|
|
description={intl.formatMessage(isVideoBroadcasting ?
|
2018-07-10 03:04:24 +08:00
|
|
|
intlMessages.stopDesktopShareDesc : intlMessages.desktopShareDesc)}
|
2018-11-28 20:59:03 +08:00
|
|
|
color={isVideoBroadcasting ? 'primary' : ''}
|
|
|
|
ghost={!isVideoBroadcasting}
|
2018-07-25 05:49:40 +08:00
|
|
|
hideLabel
|
|
|
|
circle
|
|
|
|
size="lg"
|
2018-08-23 02:10:08 +08:00
|
|
|
onClick={isVideoBroadcasting ? handleUnshareScreen : () => handleShareScreen(onFail)}
|
2018-07-25 05:10:30 +08:00
|
|
|
id={isVideoBroadcasting ? 'unshare-screen-button' : 'share-screen-button'}
|
2018-07-25 05:49:40 +08:00
|
|
|
/>
|
2018-08-23 23:49:16 +08:00
|
|
|
: null);
|
2018-08-23 02:10:08 +08:00
|
|
|
};
|
2018-07-10 03:04:24 +08:00
|
|
|
|
|
|
|
DesktopShare.propTypes = propTypes;
|
|
|
|
export default injectIntl(DesktopShare);
|