Added inline chrome extension install. Added screen sharing button. Added new actions to handle screen sharing.

app/lib/components/Room.jsx

@@ -20,12 +20,27 @@ class Room extends React.Component
 			room,
 			me,
 			amActiveSpeaker,
+			screenProducer,
 			onRoomLinkCopy,
 			onSetAudioMode,
 			onRestartIce,
-			onLeaveMeeting
+			onLeaveMeeting,
+			onShareScreen,
+			onUnShareScreen,
+			onNeedExtension
 		} = this.props;
 
+		let screenState;
+
+		if (me.needExtension)
+			screenState = 'need-extension';
+		else if (!me.canShareScreen)
+			screenState = 'unsupported';
+		else if (screenProducer)
+			screenState = 'on';
+		else
+			screenState = 'off';
+
 		return (
 			<Appear duration={300}>
 				<div data-component='Room'>
@@ -79,6 +94,37 @@ class Room extends React.Component
 					</div>
 
 					<div className='sidebar'>
+						<div
+							className={classnames('button', 'screen', screenState)}
+							data-tip='Toggle screen sharing'
+							data-type='dark'
+							onClick={() =>
+							{
+								switch (screenState)
+								{
+									case 'on':
+									{
+										onUnShareScreen();
+										break;
+									}
+									case 'off':
+									{
+										onShareScreen();
+										break;
+									}
+									case 'need-extension':
+									{
+										onNeedExtension();
+										break;
+									}
+									default:
+									{
+										break;
+									}
+								}
+							}}
+						/>
+
 						<div
 							className={classnames('button', 'audio-only', {
 								on       : me.audioOnly,
@@ -122,18 +168,27 @@ Room.propTypes =
 	room            : appPropTypes.Room.isRequired,
 	me              : appPropTypes.Me.isRequired,
 	amActiveSpeaker : PropTypes.bool.isRequired,
+	screenProducer  : appPropTypes.Producer,
 	onRoomLinkCopy  : PropTypes.func.isRequired,
 	onSetAudioMode  : PropTypes.func.isRequired,
 	onRestartIce    : PropTypes.func.isRequired,
-	onLeaveMeeting  : PropTypes.func.isRequired
+	onLeaveMeeting  : PropTypes.func.isRequired,
+	onShareScreen   : PropTypes.func.isRequired,
+	onUnShareScreen : PropTypes.func.isRequired,
+	onNeedExtension : PropTypes.func.isRequired
 };
 
 const mapStateToProps = (state) =>
 {
+	const producersArray = Object.values(state.producers);
+	const screenProducer =
+		producersArray.find((producer) => producer.source === 'screen');
+
 	return {
 		room            : state.room,
 		me              : state.me,
-		amActiveSpeaker : state.me.name === state.room.activeSpeakerName
+		amActiveSpeaker : state.me.name === state.room.activeSpeakerName,
+		screenProducer  : screenProducer
 	};
 };
 
@@ -161,6 +216,18 @@ const mapDispatchToProps = (dispatch) =>
 		onLeaveMeeting : () =>
 		{
 			dispatch(requestActions.leaveRoom());
+		},
+		onShareScreen : () =>
+		{
+			dispatch(requestActions.enableScreenSharing());
+		},
+		onUnShareScreen : () =>
+		{
+			dispatch(requestActions.disableScreenSharing());
+		},
+		onNeedExtension : () =>
+		{
+			dispatch(requestActions.installExtension());
 		}
 	};
 };