diff --git a/app/app.ejs b/app/app.ejs index 087b6622..e829fa14 100644 --- a/app/app.ejs +++ b/app/app.ejs @@ -32,6 +32,7 @@ <%- include('welcome') %> <%- include('login') %> <%- include('waiting') %> + <%- include('loginOptions') %> <%- include('settings') %> <%- include('landing') %> diff --git a/app/assets/css/launcher.css b/app/assets/css/launcher.css index ba3de9a4..b57a8559 100644 --- a/app/assets/css/launcher.css +++ b/app/assets/css/launcher.css @@ -222,6 +222,7 @@ body, button { align-items: center; height: 100%; width: 100%; + background: rgba(0, 0, 0, 0.50); } #welcomeContent { @@ -951,6 +952,71 @@ body, button { } } +/******************************************************************************* + * * + * Login Options View (loginOptions.ejs) * + * * + ******************************************************************************/ + +#loginOptionsContainer { + position: relative; + display: flex; + justify-content: center; + align-items: center; + height: 100%; + width: 100%; + transition: filter 0.25s ease; + background: rgba(0, 0, 0, 0.50); +} + +#loginOptionsContent { + background: rgba(0, 0, 0, 0.50); + border-radius: 3px; + height: 450px; + width: 350px; +} + +.loginOptionsMainContent { + display: flex; + flex-direction: column; + align-items: center; + position: relative; + height: 100%; + padding-top: 25px; +} + +.loginOptionActions { + display: flex; + flex-direction: column; + row-gap: 10px; +} + +.loginOptionButtonContainer { + width: 16em; +} + +.loginOptionButton { + background: rgba(0, 0, 0, 0.25); + border: 1px solid rgba(126, 126, 126, 0.57); + border-radius: 3px; + height: 50px; + width: 100%; + text-align: left; + padding: 0px 25px; + cursor: pointer; + outline: none; + transition: 0.25s ease; + display: flex; + align-items: center; + column-gap: 5px; +} +.loginOptionButton:hover, +.loginOptionButton:focus { + background: rgba(54, 54, 54, 0.25); + text-shadow: 0px 0px 20px white; +} + + /******************************************************************************* * * * Settings View (sttings.ejs) * diff --git a/app/assets/js/scripts/loginOptions.js b/app/assets/js/scripts/loginOptions.js new file mode 100644 index 00000000..7ac40abb --- /dev/null +++ b/app/assets/js/scripts/loginOptions.js @@ -0,0 +1,24 @@ +const loginOptionMicrosoft = document.getElementById('loginOptionMicrosoft') +const loginOptionMojang = document.getElementById('loginOptionMojang') + +let loginOptionsViewOnLoginSuccess +let loginOptionsViewOnLoginCancel +let loginOptionsViewOnCancel + +loginOptionMicrosoft.onclick = (e) => { + switchView(getCurrentView(), VIEWS.waiting, 500, 500, () => { + ipcRenderer.send( + MSFT_OPCODE.OPEN_LOGIN, + loginOptionsViewOnLoginSuccess, + loginOptionsViewOnLoginCancel + ) + }) +} + +loginOptionMojang.onclick = (e) => { + switchView(getCurrentView(), VIEWS.login, 500, 500, () => { + loginViewOnSuccess = loginOptionsViewOnLoginSuccess + loginViewOnCancel = loginOptionsViewOnLoginCancel + loginCancelEnabled(true) + }) +} \ No newline at end of file diff --git a/app/assets/js/scripts/settings.js b/app/assets/js/scripts/settings.js index 55b02983..7cb8e6c1 100644 --- a/app/assets/js/scripts/settings.js +++ b/app/assets/js/scripts/settings.js @@ -330,16 +330,19 @@ document.getElementById('settingsAddMojangAccount').onclick = (e) => { // Bind the add microsoft account button. document.getElementById('settingsAddMicrosoftAccount').onclick = (e) => { switchView(getCurrentView(), VIEWS.waiting, 500, 500, () => { - ipcRenderer.send(MSFT_OPCODE.OPEN_LOGIN) + ipcRenderer.send(MSFT_OPCODE.OPEN_LOGIN, VIEWS.settings, VIEWS.settings) }) } // Bind reply for Microsoft Login. ipcRenderer.on(MSFT_OPCODE.REPLY_LOGIN, (_, ...arguments_) => { if (arguments_[0] === MSFT_REPLY_TYPE.ERROR) { - switchView(getCurrentView(), VIEWS.settings, 500, 500, () => { - if(arguments_.length > 1 && arguments_[1] === MSFT_ERROR.NOT_FINISHED) { + const viewOnClose = arguments_[2] + console.log(arguments_) + switchView(getCurrentView(), viewOnClose, 500, 500, () => { + + if(arguments_[1] === MSFT_ERROR.NOT_FINISHED) { // User cancelled. msftLoginLogger.info('Login cancelled by user.') return @@ -358,27 +361,31 @@ ipcRenderer.on(MSFT_OPCODE.REPLY_LOGIN, (_, ...arguments_) => { }) } else if(arguments_[0] === MSFT_REPLY_TYPE.SUCCESS) { const queryMap = arguments_[1] + const viewOnClose = arguments_[2] // Error from request to Microsoft. if (Object.prototype.hasOwnProperty.call(queryMap, 'error')) { - let error = queryMap.error - let errorDesc = queryMap.error_description - title = error - description = errorDesc - if (error === 'access_denied') { - // TODO Write custom error messages. + switchView(getCurrentView(), viewOnClose, 500, 500, () => { + let error = queryMap.error + let errorDesc = queryMap.error_description title = error description = errorDesc - } - setOverlayContent( - title, - description, - 'OK' - ) - setOverlayHandler(() => { - toggleOverlay(false) + if (error === 'access_denied') { + // TODO Write custom error messages. + title = error + description = errorDesc + } + setOverlayContent( + title, + description, + 'OK' + ) + setOverlayHandler(() => { + toggleOverlay(false) + }) + toggleOverlay(true) + }) - toggleOverlay(true) } else { msftLoginLogger.info('Acquired authCode, proceeding with authentication.') @@ -386,7 +393,7 @@ ipcRenderer.on(MSFT_OPCODE.REPLY_LOGIN, (_, ...arguments_) => { const authCode = queryMap.code AuthManager.addMicrosoftAccount(authCode).then(value => { updateSelectedAccount(value) - switchView(getCurrentView(), VIEWS.settings, 500, 500, () => { + switchView(getCurrentView(), viewOnClose, 500, 500, () => { prepareSettings() }) }) diff --git a/app/assets/js/scripts/uibinder.js b/app/assets/js/scripts/uibinder.js index d6eb792e..782d10c4 100644 --- a/app/assets/js/scripts/uibinder.js +++ b/app/assets/js/scripts/uibinder.js @@ -16,6 +16,7 @@ let fatalStartupError = false // Mapping of each view to their container IDs. const VIEWS = { landing: '#landingContainer', + loginOptions: '#loginOptionsContainer', login: '#loginContainer', settings: '#settingsContainer', welcome: '#welcomeContainer', diff --git a/app/assets/js/scripts/welcome.js b/app/assets/js/scripts/welcome.js index e6ff6297..75b7a74b 100644 --- a/app/assets/js/scripts/welcome.js +++ b/app/assets/js/scripts/welcome.js @@ -2,5 +2,7 @@ * Script for welcome.ejs */ document.getElementById('welcomeButton').addEventListener('click', e => { - switchView(VIEWS.welcome, VIEWS.login) + loginOptionsViewOnLoginSuccess = VIEWS.landing + loginOptionsViewOnLoginCancel = VIEWS.loginOptions + switchView(VIEWS.welcome, VIEWS.loginOptions) }) \ No newline at end of file diff --git a/app/loginOptions.ejs b/app/loginOptions.ejs new file mode 100644 index 00000000..89bcb97f --- /dev/null +++ b/app/loginOptions.ejs @@ -0,0 +1,31 @@ + \ No newline at end of file diff --git a/index.js b/index.js index a2c43226..91120ee9 100644 --- a/index.js +++ b/index.js @@ -95,12 +95,16 @@ const REDIRECT_URI_PREFIX = 'https://login.microsoftonline.com/common/oauth2/nat // Microsoft Auth Login let msftAuthWindow let msftAuthSuccess -ipcMain.on(MSFT_OPCODE.OPEN_LOGIN, (ipcEvent) => { +let msftAuthViewSuccess +let msftAuthViewOnClose +ipcMain.on(MSFT_OPCODE.OPEN_LOGIN, (ipcEvent, ...arguments_) => { if (msftAuthWindow) { - ipcEvent.reply(MSFT_OPCODE.REPLY_LOGIN, MSFT_REPLY_TYPE.ERROR, MSFT_ERROR.ALREADY_OPEN) + ipcEvent.reply(MSFT_OPCODE.REPLY_LOGIN, MSFT_REPLY_TYPE.ERROR, MSFT_ERROR.ALREADY_OPEN, msftAuthViewOnClose) return } msftAuthSuccess = false + msftAuthViewSuccess = arguments_[0] + msftAuthViewOnClose = arguments_[1] msftAuthWindow = new BrowserWindow({ title: 'Microsoft Login', backgroundColor: '#222222', @@ -116,7 +120,7 @@ ipcMain.on(MSFT_OPCODE.OPEN_LOGIN, (ipcEvent) => { msftAuthWindow.on('close', () => { if(!msftAuthSuccess) { - ipcEvent.reply(MSFT_OPCODE.REPLY_LOGIN, MSFT_REPLY_TYPE.ERROR, MSFT_ERROR.NOT_FINISHED) + ipcEvent.reply(MSFT_OPCODE.REPLY_LOGIN, MSFT_REPLY_TYPE.ERROR, MSFT_ERROR.NOT_FINISHED, msftAuthViewOnClose) } }) @@ -130,7 +134,7 @@ ipcMain.on(MSFT_OPCODE.OPEN_LOGIN, (ipcEvent) => { queryMap[name] = decodeURI(value) }) - ipcEvent.reply(MSFT_OPCODE.REPLY_LOGIN, MSFT_REPLY_TYPE.SUCCESS, queryMap) + ipcEvent.reply(MSFT_OPCODE.REPLY_LOGIN, MSFT_REPLY_TYPE.SUCCESS, queryMap, msftAuthViewSuccess) msftAuthSuccess = true msftAuthWindow.close()