From cee74f9b29f73095f912320dc93b3364e68cf901 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5var=20Aamb=C3=B8=20Fosstveit?= Date: Mon, 18 Jun 2018 13:33:56 +0200 Subject: [PATCH] Added login button. --- app/lib/RoomClient.js | 4 ++ app/lib/components/Room.jsx | 51 +++++++---------------- app/lib/redux/reducers/me.js | 8 ++++ app/lib/redux/requestActions.js | 7 ++++ app/lib/redux/roomClientMiddleware.js | 7 ++++ app/lib/redux/stateActions.js | 8 ++++ app/resources/images/icon_login_black.svg | 3 ++ app/resources/images/icon_login_white.svg | 3 ++ app/stylus/components/Room.styl | 16 ++----- 9 files changed, 59 insertions(+), 48 deletions(-) create mode 100644 app/resources/images/icon_login_black.svg create mode 100644 app/resources/images/icon_login_white.svg diff --git a/app/lib/RoomClient.js b/app/lib/RoomClient.js index 14a899c..8a474cc 100644 --- a/app/lib/RoomClient.js +++ b/app/lib/RoomClient.js @@ -125,6 +125,8 @@ export default class RoomClient login() { + this._dispatch(stateActions.setLoginInProgress(true)); + const url = `/login?roomId=${this._room.roomId}&peerName=${this._peerName}`; this._loginWindow = window.open(url, 'loginWindow'); @@ -998,6 +1000,8 @@ export default class RoomClient )); } this.closeLoginWindow(); + + this._dispatch(stateActions.setLoginInProgress(false)); break; } diff --git a/app/lib/components/Room.jsx b/app/lib/components/Room.jsx index 89b5077..f6f8acf 100644 --- a/app/lib/components/Room.jsx +++ b/app/lib/components/Room.jsx @@ -24,9 +24,8 @@ class Room extends React.Component amActiveSpeaker, screenProducer, onRoomLinkCopy, - onSetAudioMode, - onRestartIce, onToggleSettings, + onLogin, onShareScreen, onUnShareScreen, onNeedExtension, @@ -142,25 +141,6 @@ class Room extends React.Component }} /> -
onSetAudioMode(!me.audioOnly)} - /> - -
onRestartIce()} - /> -
onToggleSettings()} /> +
onLogin()} + /> +
@@ -245,17 +233,6 @@ const mapDispatchToProps = (dispatch) => text : 'Room link copied to the clipboard' })); }, - onSetAudioMode : (enable) => - { - if (enable) - dispatch(requestActions.enableAudioOnly()); - else - dispatch(requestActions.disableAudioOnly()); - }, - onRestartIce : () => - { - dispatch(requestActions.restartIce()); - }, onToggleSettings : () => { dispatch(stateActions.toggleSettings()); @@ -282,6 +259,10 @@ const mapDispatchToProps = (dispatch) => onNeedExtension : () => { dispatch(requestActions.installExtension()); + }, + onLogin : () => + { + dispatch(requestActions.userLogin()); } }; }; diff --git a/app/lib/redux/reducers/me.js b/app/lib/redux/reducers/me.js index ca47a7e..752ef6d 100644 --- a/app/lib/redux/reducers/me.js +++ b/app/lib/redux/reducers/me.js @@ -15,6 +15,7 @@ const initialState = webcamInProgress : false, audioInProgress : false, screenShareInProgress : false, + loginInProgress : false, audioOnly : false, audioOnlyInProgress : false, raiseHand : false, @@ -96,6 +97,13 @@ const me = (state = initialState, action) => return { ...state, screenShareInProgress: flag }; } + case 'SET_LOGIN_IN_PROGRESS': + { + const { flag } = action.payload; + + return { ...state, loginInProgress: flag }; + } + case 'SET_DISPLAY_NAME': { let { displayName } = action.payload; diff --git a/app/lib/redux/requestActions.js b/app/lib/redux/requestActions.js index 59ffb7a..ff865fa 100644 --- a/app/lib/redux/requestActions.js +++ b/app/lib/redux/requestActions.js @@ -119,6 +119,13 @@ export const resumePeerVideo = (peerName) => }; }; +export const userLogin = () => +{ + return { + type : 'USER_LOGIN' + }; +}; + export const raiseHand = () => { return { diff --git a/app/lib/redux/roomClientMiddleware.js b/app/lib/redux/roomClientMiddleware.js index 60a8502..64a1059 100644 --- a/app/lib/redux/roomClientMiddleware.js +++ b/app/lib/redux/roomClientMiddleware.js @@ -156,6 +156,13 @@ export default ({ dispatch, getState }) => (next) => break; } + case 'USER_LOGIN': + { + client.login(); + + break; + } + case 'LOWER_HAND': { client.sendRaiseHandState(false); diff --git a/app/lib/redux/stateActions.js b/app/lib/redux/stateActions.js index 72809f6..d6bf721 100644 --- a/app/lib/redux/stateActions.js +++ b/app/lib/redux/stateActions.js @@ -134,6 +134,14 @@ export const setMyRaiseHandState = (flag) => }; }; +export const setLoginInProgress = (flag) => +{ + return { + type : 'SET_LOGIN_IN_PROGRESS', + payload : { flag } + }; +}; + export const toggleSettings = () => { return { diff --git a/app/resources/images/icon_login_black.svg b/app/resources/images/icon_login_black.svg new file mode 100644 index 0000000..6f366fe --- /dev/null +++ b/app/resources/images/icon_login_black.svg @@ -0,0 +1,3 @@ + + + diff --git a/app/resources/images/icon_login_white.svg b/app/resources/images/icon_login_white.svg new file mode 100644 index 0000000..c7c190e --- /dev/null +++ b/app/resources/images/icon_login_white.svg @@ -0,0 +1,3 @@ + + + diff --git a/app/stylus/components/Room.styl b/app/stylus/components/Room.styl index 9186743..ec3e43c 100644 --- a/app/stylus/components/Room.styl +++ b/app/stylus/components/Room.styl @@ -216,19 +216,9 @@ opacity: 0.5; } - &.audio-only { - background-image: url('/resources/images/icon_audio_only_white.svg'); - - &.on { - background-image: url('/resources/images/icon_audio_only_black.svg'); - } - } - - &.restart-ice { - background-image: url('/resources/images/icon_restart_ice_white.svg'); - - &.on { - background-image: url('/resources/images/icon_restart_ice__black.svg'); + &.login { + &.off { + background-image: url('/resources/images/icon_login_white.svg'); } }