add "Waiting on microsoft..."
This commit is contained in:
parent
3ebb71b368
commit
731f00acc9
@ -688,6 +688,21 @@ body, button {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
.circle-loader-big {
|
||||
margin:auto;
|
||||
border: 5px solid rgba(255, 255, 255, 0.5);
|
||||
border-left-color: #ffffff;
|
||||
animation-name: loader-spin;
|
||||
animation-duration: 1s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
position: relative;
|
||||
display: block;
|
||||
align-self: center;
|
||||
border-radius: 50%;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
.load-complete {
|
||||
animation: none;
|
||||
border-color: #ffffff;
|
||||
|
@ -301,17 +301,23 @@ loginButton.addEventListener('click', () => {
|
||||
})
|
||||
|
||||
loginMSButton.addEventListener('click', (event) => {
|
||||
// Show loading stuff.
|
||||
toggleOverlay(true, false, 'msOverlay')
|
||||
loginMSButton.disabled = true
|
||||
ipcRenderer.send('openMSALoginWindow', 'open')
|
||||
})
|
||||
|
||||
ipcRenderer.on('MSALoginWindowReply', (event, ...args) => {
|
||||
if (args[0] === 'error') {
|
||||
|
||||
loginMSButton.disabled = false
|
||||
loginLoading(false)
|
||||
switch (args[1]){
|
||||
case 'AlreadyOpenException': {
|
||||
setOverlayContent('ERROR', 'There is already a login window open!', 'OK')
|
||||
setOverlayHandler(() => {
|
||||
toggleOverlay(false)
|
||||
toggleOverlay(false, false, 'msOverlay')
|
||||
})
|
||||
toggleOverlay(true)
|
||||
return
|
||||
@ -320,6 +326,7 @@ ipcRenderer.on('MSALoginWindowReply', (event, ...args) => {
|
||||
setOverlayContent('ERROR', 'You have to finish the login process to use Helios Launcher. The window will close by itself when you have successfully logged in.', 'OK')
|
||||
setOverlayHandler(() => {
|
||||
toggleOverlay(false)
|
||||
toggleOverlay(false, false, 'msOverlay')
|
||||
})
|
||||
toggleOverlay(true)
|
||||
return
|
||||
@ -327,7 +334,7 @@ ipcRenderer.on('MSALoginWindowReply', (event, ...args) => {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
toggleOverlay(false, false, 'msOverlay')
|
||||
const queryMap = args[0]
|
||||
if (queryMap.has('error')) {
|
||||
let error = queryMap.get('error')
|
||||
@ -348,9 +355,6 @@ ipcRenderer.on('MSALoginWindowReply', (event, ...args) => {
|
||||
// Disable form.
|
||||
formDisabled(true)
|
||||
|
||||
// Show loading stuff.
|
||||
loginLoading(true)
|
||||
|
||||
const authCode = queryMap.get('code')
|
||||
AuthManager.addMSAccount(authCode).then(account => {
|
||||
updateSelectedAccount(account)
|
||||
|
@ -9,7 +9,7 @@
|
||||
*
|
||||
* @returns {boolean} Whether or not the overlay is visible.
|
||||
*/
|
||||
function isOverlayVisible(){
|
||||
function isOverlayVisible() {
|
||||
return document.getElementById('main').hasAttribute('overlay')
|
||||
}
|
||||
|
||||
@ -20,8 +20,8 @@ let overlayHandlerContent
|
||||
*
|
||||
* @param {KeyboardEvent} e The keydown event.
|
||||
*/
|
||||
function overlayKeyHandler (e){
|
||||
if(e.key === 'Enter' || e.key === 'Escape'){
|
||||
function overlayKeyHandler(e) {
|
||||
if (e.key === 'Enter' || e.key === 'Escape') {
|
||||
document.getElementById(overlayHandlerContent).getElementsByClassName('overlayKeybindEnter')[0].click()
|
||||
}
|
||||
}
|
||||
@ -30,10 +30,10 @@ function overlayKeyHandler (e){
|
||||
*
|
||||
* @param {KeyboardEvent} e The keydown event.
|
||||
*/
|
||||
function overlayKeyDismissableHandler (e){
|
||||
if(e.key === 'Enter'){
|
||||
function overlayKeyDismissableHandler(e) {
|
||||
if (e.key === 'Enter') {
|
||||
document.getElementById(overlayHandlerContent).getElementsByClassName('overlayKeybindEnter')[0].click()
|
||||
} else if(e.key === 'Escape'){
|
||||
} else if (e.key === 'Escape') {
|
||||
document.getElementById(overlayHandlerContent).getElementsByClassName('overlayKeybindEsc')[0].click()
|
||||
}
|
||||
}
|
||||
@ -45,12 +45,12 @@ function overlayKeyDismissableHandler (e){
|
||||
* @param {string} content The overlay content which will be shown.
|
||||
* @param {boolean} dismissable Whether or not the overlay is dismissable
|
||||
*/
|
||||
function bindOverlayKeys(state, content, dismissable){
|
||||
function bindOverlayKeys(state, content, dismissable) {
|
||||
overlayHandlerContent = content
|
||||
document.removeEventListener('keydown', overlayKeyHandler)
|
||||
document.removeEventListener('keydown', overlayKeyDismissableHandler)
|
||||
if(state){
|
||||
if(dismissable){
|
||||
if (state) {
|
||||
if (dismissable) {
|
||||
document.addEventListener('keydown', overlayKeyDismissableHandler)
|
||||
} else {
|
||||
document.addEventListener('keydown', overlayKeyHandler)
|
||||
@ -65,22 +65,22 @@ function bindOverlayKeys(state, content, dismissable){
|
||||
* @param {boolean} dismissable Optional. True to show the dismiss option, otherwise false.
|
||||
* @param {string} content Optional. The content div to be shown.
|
||||
*/
|
||||
function toggleOverlay(toggleState, dismissable = false, content = 'overlayContent'){
|
||||
if(toggleState == null){
|
||||
function toggleOverlay(toggleState, dismissable = false, content = 'overlayContent') {
|
||||
if (toggleState == null) {
|
||||
toggleState = !document.getElementById('main').hasAttribute('overlay')
|
||||
}
|
||||
if(typeof dismissable === 'string'){
|
||||
if (typeof dismissable === 'string') {
|
||||
content = dismissable
|
||||
dismissable = false
|
||||
}
|
||||
bindOverlayKeys(toggleState, content, dismissable)
|
||||
if(toggleState){
|
||||
if (toggleState) {
|
||||
document.getElementById('main').setAttribute('overlay', true)
|
||||
// Make things untabbable.
|
||||
$('#main *').attr('tabindex', '-1')
|
||||
$('#' + content).parent().children().hide()
|
||||
$('#' + content).show()
|
||||
if(dismissable){
|
||||
if (dismissable) {
|
||||
$('#overlayDismiss').show()
|
||||
} else {
|
||||
$('#overlayDismiss').hide()
|
||||
@ -88,7 +88,7 @@ function toggleOverlay(toggleState, dismissable = false, content = 'overlayConte
|
||||
$('#overlayContainer').fadeIn({
|
||||
duration: 250,
|
||||
start: () => {
|
||||
if(getCurrentView() === VIEWS.settings){
|
||||
if (getCurrentView() === VIEWS.settings) {
|
||||
document.getElementById('settingsContainer').style.backgroundColor = 'transparent'
|
||||
}
|
||||
}
|
||||
@ -100,14 +100,14 @@ function toggleOverlay(toggleState, dismissable = false, content = 'overlayConte
|
||||
$('#overlayContainer').fadeOut({
|
||||
duration: 250,
|
||||
start: () => {
|
||||
if(getCurrentView() === VIEWS.settings){
|
||||
if (getCurrentView() === VIEWS.settings) {
|
||||
document.getElementById('settingsContainer').style.backgroundColor = 'rgba(0, 0, 0, 0.50)'
|
||||
}
|
||||
},
|
||||
complete: () => {
|
||||
$('#' + content).parent().children().hide()
|
||||
$('#' + content).show()
|
||||
if(dismissable){
|
||||
if (dismissable) {
|
||||
$('#overlayDismiss').show()
|
||||
} else {
|
||||
$('#overlayDismiss').hide()
|
||||
@ -117,7 +117,7 @@ function toggleOverlay(toggleState, dismissable = false, content = 'overlayConte
|
||||
}
|
||||
}
|
||||
|
||||
function toggleServerSelection(toggleState){
|
||||
function toggleServerSelection(toggleState) {
|
||||
prepareServerSelectionList()
|
||||
toggleOverlay(toggleState, true, 'serverSelectContent')
|
||||
}
|
||||
@ -130,7 +130,7 @@ function toggleServerSelection(toggleState){
|
||||
* @param {string} acknowledge Acknowledge button text.
|
||||
* @param {string} dismiss Dismiss button text.
|
||||
*/
|
||||
function setOverlayContent(title, description, acknowledge, dismiss = 'Dismiss'){
|
||||
function setOverlayContent(title, description, acknowledge, dismiss = 'Dismiss') {
|
||||
document.getElementById('overlayTitle').innerHTML = title
|
||||
document.getElementById('overlayDesc').innerHTML = description
|
||||
document.getElementById('overlayAcknowledge').innerHTML = acknowledge
|
||||
@ -143,8 +143,8 @@ function setOverlayContent(title, description, acknowledge, dismiss = 'Dismiss')
|
||||
*
|
||||
* @param {function} handler
|
||||
*/
|
||||
function setOverlayHandler(handler){
|
||||
if(handler == null){
|
||||
function setOverlayHandler(handler) {
|
||||
if (handler == null) {
|
||||
document.getElementById('overlayAcknowledge').onclick = () => {
|
||||
toggleOverlay(false)
|
||||
}
|
||||
@ -159,8 +159,8 @@ function setOverlayHandler(handler){
|
||||
*
|
||||
* @param {function} handler
|
||||
*/
|
||||
function setDismissHandler(handler){
|
||||
if(handler == null){
|
||||
function setDismissHandler(handler) {
|
||||
if (handler == null) {
|
||||
document.getElementById('overlayDismiss').onclick = () => {
|
||||
toggleOverlay(false)
|
||||
}
|
||||
@ -173,8 +173,8 @@ function setDismissHandler(handler){
|
||||
|
||||
document.getElementById('serverSelectConfirm').addEventListener('click', () => {
|
||||
const listings = document.getElementsByClassName('serverListing')
|
||||
for(let i=0; i<listings.length; i++){
|
||||
if(listings[i].hasAttribute('selected')){
|
||||
for (let i = 0; i < listings.length; i++) {
|
||||
if (listings[i].hasAttribute('selected')) {
|
||||
const serv = DistroManager.getDistribution().getServer(listings[i].getAttribute('servid'))
|
||||
updateSelectedServer(serv)
|
||||
refreshServerStatus(true)
|
||||
@ -183,7 +183,7 @@ document.getElementById('serverSelectConfirm').addEventListener('click', () => {
|
||||
}
|
||||
}
|
||||
// None are selected? Not possible right? Meh, handle it.
|
||||
if(listings.length > 0){
|
||||
if (listings.length > 0) {
|
||||
const serv = DistroManager.getDistribution().getServer(listings[i].getAttribute('servid'))
|
||||
updateSelectedServer(serv)
|
||||
toggleOverlay(false)
|
||||
@ -192,8 +192,8 @@ document.getElementById('serverSelectConfirm').addEventListener('click', () => {
|
||||
|
||||
document.getElementById('accountSelectConfirm').addEventListener('click', () => {
|
||||
const listings = document.getElementsByClassName('accountListing')
|
||||
for(let i=0; i<listings.length; i++){
|
||||
if(listings[i].hasAttribute('selected')){
|
||||
for (let i = 0; i < listings.length; i++) {
|
||||
if (listings[i].hasAttribute('selected')) {
|
||||
const authAcc = ConfigManager.setSelectedAccount(listings[i].getAttribute('uuid'))
|
||||
ConfigManager.save()
|
||||
updateSelectedAccount(authAcc)
|
||||
@ -203,7 +203,7 @@ document.getElementById('accountSelectConfirm').addEventListener('click', () =>
|
||||
}
|
||||
}
|
||||
// None are selected? Not possible right? Meh, handle it.
|
||||
if(listings.length > 0){
|
||||
if (listings.length > 0) {
|
||||
const authAcc = ConfigManager.setSelectedAccount(listings[0].getAttribute('uuid'))
|
||||
ConfigManager.save()
|
||||
updateSelectedAccount(authAcc)
|
||||
@ -223,16 +223,16 @@ document.getElementById('accountSelectCancel').addEventListener('click', () => {
|
||||
})
|
||||
})
|
||||
|
||||
function setServerListingHandlers(){
|
||||
function setServerListingHandlers() {
|
||||
const listings = Array.from(document.getElementsByClassName('serverListing'))
|
||||
listings.map((val) => {
|
||||
val.onclick = e => {
|
||||
if(val.hasAttribute('selected')){
|
||||
if (val.hasAttribute('selected')) {
|
||||
return
|
||||
}
|
||||
const cListings = document.getElementsByClassName('serverListing')
|
||||
for(let i=0; i<cListings.length; i++){
|
||||
if(cListings[i].hasAttribute('selected')){
|
||||
for (let i = 0; i < cListings.length; i++) {
|
||||
if (cListings[i].hasAttribute('selected')) {
|
||||
cListings[i].removeAttribute('selected')
|
||||
}
|
||||
}
|
||||
@ -242,16 +242,16 @@ function setServerListingHandlers(){
|
||||
})
|
||||
}
|
||||
|
||||
function setAccountListingHandlers(){
|
||||
function setAccountListingHandlers() {
|
||||
const listings = Array.from(document.getElementsByClassName('accountListing'))
|
||||
listings.map((val) => {
|
||||
val.onclick = e => {
|
||||
if(val.hasAttribute('selected')){
|
||||
if (val.hasAttribute('selected')) {
|
||||
return
|
||||
}
|
||||
const cListings = document.getElementsByClassName('accountListing')
|
||||
for(let i=0; i<cListings.length; i++){
|
||||
if(cListings[i].hasAttribute('selected')){
|
||||
for (let i = 0; i < cListings.length; i++) {
|
||||
if (cListings[i].hasAttribute('selected')) {
|
||||
cListings[i].removeAttribute('selected')
|
||||
}
|
||||
}
|
||||
@ -261,12 +261,12 @@ function setAccountListingHandlers(){
|
||||
})
|
||||
}
|
||||
|
||||
function populateServerListings(){
|
||||
function populateServerListings() {
|
||||
const distro = DistroManager.getDistribution()
|
||||
const giaSel = ConfigManager.getSelectedServer()
|
||||
const servers = distro.getServers()
|
||||
let htmlString = ''
|
||||
for(const serv of servers){
|
||||
for (const serv of servers) {
|
||||
htmlString += `<button class="serverListing" servid="${serv.getID()}" ${serv.getID() === giaSel ? 'selected' : ''}>
|
||||
<img class="serverListingImg" src="${serv.getIcon()}"/>
|
||||
<div class="serverListingDetails">
|
||||
@ -293,12 +293,12 @@ function populateServerListings(){
|
||||
|
||||
}
|
||||
|
||||
function populateAccountListings(){
|
||||
function populateAccountListings() {
|
||||
const accountsObj = ConfigManager.getAuthAccounts()
|
||||
const accounts = Array.from(Object.keys(accountsObj), v=>accountsObj[v])
|
||||
const accounts = Array.from(Object.keys(accountsObj), v => accountsObj[v])
|
||||
let htmlString = ''
|
||||
for(let i=0; i<accounts.length; i++){
|
||||
htmlString += `<button class="accountListing" uuid="${accounts[i].uuid}" ${i===0 ? 'selected' : ''}>
|
||||
for (let i = 0; i < accounts.length; i++) {
|
||||
htmlString += `<button class="accountListing" uuid="${accounts[i].uuid}" ${i === 0 ? 'selected' : ''}>
|
||||
<img src="https://crafatar.com/renders/head/${accounts[i].uuid}?scale=2&default=MHF_Steve&overlay">
|
||||
<div class="accountListingName">${accounts[i].displayName}</div>
|
||||
</button>`
|
||||
@ -307,12 +307,12 @@ function populateAccountListings(){
|
||||
|
||||
}
|
||||
|
||||
function prepareServerSelectionList(){
|
||||
function prepareServerSelectionList() {
|
||||
populateServerListings()
|
||||
setServerListingHandlers()
|
||||
}
|
||||
|
||||
function prepareAccountSelectionList(){
|
||||
function prepareAccountSelectionList() {
|
||||
populateAccountListings()
|
||||
setAccountListingHandlers()
|
||||
}
|
@ -28,6 +28,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id="overlayContent">
|
||||
<div class="circle-loader" style="display: none;"></div>
|
||||
<span id="overlayTitle">Lorem Ipsum:<br>Finis Illud</span>
|
||||
<span id="overlayDesc">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud..</span>
|
||||
<div id="overlayActionContainer">
|
||||
@ -37,5 +38,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="msOverlay" style="display: none;">
|
||||
<span><div class="circle-loader-big"></div></span><br>
|
||||
<span style="font-size: 2em;">Waiting on Microsoft...</span>
|
||||
</div>
|
||||
<script src="./assets/js/scripts/overlay.js"></script>
|
||||
</div>
|
Loading…
Reference in New Issue
Block a user