Many fixes and adjustments to the upper right landing UI.

The user_text span now displays the currently selected account.
This commit is contained in:
Daniel Scalzi 2018-04-29 18:05:59 -04:00
parent ea758aee1f
commit 4106b2b069
No known key found for this signature in database
GPG Key ID: 5CA2F145B63535F9
6 changed files with 35 additions and 23 deletions

View File

@ -911,12 +911,12 @@ p {
}
#landingContainer > #upper > #content {
display: inline-flex;
width: 59%;
width: 70%;
height: 100%;
}
#landingContainer > #upper > #right {
display: inline-flex;
width: 26%;
width: 15%;
height: 100%;
}
@ -1128,7 +1128,7 @@ p {
flex-direction: column;
position: relative;
top: 50px;
align-items: flex-end;
align-items: flex-start;
height: calc(100% - 50px);
}
@ -1139,18 +1139,22 @@ p {
justify-content: center;
box-sizing: border-box;
height: 75px;
position: relative;
}
/* User profile avatar container. */
#avatarContainer {
border-radius: 50%;
border: 2px solid #cad7e1;
box-sizing: border-box;
background: rgba(1, 2, 1, 0.5);
height: 70px;
width: 70px;
box-shadow: 0px 0px 10px 0px rgb(0, 0, 0);
overflow: hidden;
position: relative;
background-image: url('https://cdn.discordapp.com/avatars/169197209630277642/6650b5a50e1cb3d00a79b9b88b9a0cd4.png');
background-size: contain;
}
/* Avatar edit overlay. */
@ -1158,10 +1162,6 @@ p {
opacity: 0;
position: absolute;
z-index: 1;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: flex;
justify-content: center;
align-items: center;
@ -1173,28 +1173,25 @@ p {
background: linear-gradient(65deg, rgba(0, 0, 0, 0.4), rgba(136, 77, 77, 0.4) 60%);
-webkit-user-select: none;
cursor: pointer;
width: 100%;
height: 100%;
border-radius: 50%;
}
#avatarOverlay:hover {
opacity: 1;
}
/* User profile avater image. */
#avatarImage {
height: 100%;
width: auto;
}
/* User profile name text. */
#user_text {
font-family: 'Avenir Book';
font-size: 12px;
min-width: 112px;
min-width: 135px;
font-weight: 900;
letter-spacing: 1px;
color: white;
text-shadow: 0px 0px 20px black;
position: relative;
right: 25px;
position: absolute;
right: 95px;
text-align: right;
}
@ -1203,10 +1200,9 @@ p {
position: relative;
display: flex;
flex-direction: column;
right: 25px;
align-items: flex-end;
margin-top: 40px;
height: 100%;
margin-top: 25px;
height: calc(100% - 95px);
width: 70px;
align-items: center;
}

View File

@ -21,7 +21,7 @@ const Mojang = require('./mojang.js')
*
* @param {string} username The account username (email if migrated).
* @param {string} password The account password.
* @returns {Promise.<Object>} Promise which resolves to the Mojang authentication response.
* @returns {Promise.<Object>} Promise which resolves the resolved authenticated account object.
*/
exports.addAccount = async function(username, password){
try{

View File

@ -20,6 +20,7 @@ const launch_progress = document.getElementById('launch_progress')
const launch_progress_label = document.getElementById('launch_progress_label')
const launch_details_text = document.getElementById('launch_details_text')
const server_selection_button = document.getElementById('server_selection_button')
const user_text = document.getElementById('user_text')
/* Launch Progress Wrapper Functions */
@ -103,6 +104,16 @@ document.getElementById('launch_button').addEventListener('click', function(e){
}
})
// Bind selected account
function updateSelectedAccount(authUser){
let username = 'No Account Selected'
if(authUser != null && authUser.username != null){
username = authUser.displayName
}
user_text.innerHTML = username
}
updateSelectedAccount(ConfigManager.getSelectedAccount())
// Bind selected server
function updateSelectedServer(serverName){
if(serverName == null){

View File

@ -227,6 +227,7 @@ loginButton.addEventListener('click', () => {
loginLoading(true)
AuthManager.addAccount(loginUsername.value, loginPassword.value).then((value) => {
updateSelectedAccount(value)
loginButton.innerHTML = loginButton.innerHTML.replace('LOGGING IN', 'SUCCESS')
$('.circle-loader').toggleClass('load-complete')
$('.checkmark').toggle()

View File

@ -14,7 +14,6 @@
<span id="user_text">Username</span>
<div id="avatarContainer">
<div id="avatarOverlay">Edit</div>
<img id="avatarImage" src="https://cdn.discordapp.com/avatars/169197209630277642/6650b5a50e1cb3d00a79b9b88b9a0cd4.png"/>
</div>
</div>
<div id="mediaContent">

View File

@ -68,7 +68,8 @@ function createWindow() {
frame: false,
webPreferences: {
preload: path.join(__dirname, 'app', 'assets', 'js', 'preloader.js')
}
},
backgroundColor: '#2e2c29'
})
ejse.data('bkid', Math.floor((Math.random() * fs.readdirSync(path.join(__dirname, 'app', 'assets', 'images', 'backgrounds')).length)))
@ -79,6 +80,10 @@ function createWindow() {
slashes: true
}))
/*win.once('ready-to-show', () => {
win.show()
})*/
win.setMenu(null)
win.setResizable(true)