Fascinated/Minetrack
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Improved Mojang status indicators and better footer

Browse Source
This commit is contained in:
Cryptkeeper 2017-05-13 11:07:50 -05:00
parent 0955e8dbcd
commit bfcc896e28
4 changed files with 29 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
assets/css/main.css
View File

@ -27,6 +27,10 @@ a {
min-height: 100%;
}
strong {
font-weight: 700;
}
/* Constants */
#header, #footer, #tagline {
@ -47,7 +51,6 @@ a {
#header .column {
display: inline-block;
float: left;
padding: 20px;
}
#header .column h1 {
@ -85,7 +88,7 @@ a {
/* Footer */
#footer {
font-size: 14px;
font-size: 16px;
text-transform: uppercase;
background: #EBEBEB;
color: #3B3738;
@ -94,6 +97,15 @@ a {
margin-top: 15px;
}
#footer a {
font-weight: 700;
border-bottom: none !important;
}
#footer a:hover {
border-bottom: 1px dashed #000 !important;
}
/* Tagline */
#tagline-text {
padding-top: 20px;
@ -260,16 +272,19 @@ h3 {
/* Mojang Status */
.mojang-status {
width: 60px;
height: 60px;
width: 85px;
height: 106px;
display: inline-block;
border-radius: 2px;
text-align: center;
line-height: 20px;
font-size: 12px;
font-size: 14px;
}
.mojang-status > strong {
text-transform: uppercase;
}
.mojang-status > i {
margin-top: 8px;
margin-top: 20px;
font-size: 22px;
}

9
assets/html/index.html
View File

@ -23,7 +23,7 @@
<div id="header-wrapper">
<div class="column">
<div class="column" style="padding: 20px;">
<img src="/images/compass.png" width="28" height="28" style="display: inline-block; margin-right: 5px;">
<h1 style="display: inline-block;" class="text-uppercase">Minetrack</h1>
@ -33,10 +33,7 @@
<div id="mojang-status-list" class="column" style="float: right;">
<div class="mojang-status" title="Sessions" id="mojang-status_Sessions"><i class="fa fa-gamepad"></i><br />Sessions</div>
<div class="mojang-status" title="Skins" id="mojang-status_Skins"><i class="fa fa-user"></i><br />Skins</div>
<div class="mojang-status" title="Auth" id="mojang-status_Auth"><i class="fa fa-key"></i><br />Auth</div>
<div class="mojang-status" title="API" id="mojang-status_API"><i class="fa fa-wrench"></i><br />API</div>
<div class="mojang-status" title="Sessions" id="mojang-status_Sessions"><i class="fa fa-gamepad"></i><br /><strong>Sessions</strong><p class="mojang-status-text" id="mojang-status-text_Sessions"></p></div><div class="mojang-status" title="Skins" id="mojang-status_Skins"><i class="fa fa-user"></i><br /><strong>Skins</strong><p class="mojang-status-text" id="mojang-status-text_Skins"></p></div><div class="mojang-status" title="Auth" id="mojang-status_Auth"><i class="fa fa-key"></i><br /><strong>Auth</strong><p class="mojang-status-text" id="mojang-status-text_Auth"></p></div><div class="mojang-status" title="API" id="mojang-status_API"><i class="fa fa-wrench"></i><br /><strong>API</strong><p class="mojang-status-text" id="mojang-status-text_API"></p></div>
</div>
@ -81,7 +78,7 @@
<div id="footer">
<span style="padding-left: 20px;">Made with <span style="color: #e74c3c;">&#9829;</span> by <a href="http://cryptkpr.me">Cryptkeeper</a>. Read the source code on <a href="https://github.com/Cryptkeeper/Minetrack">Github</a>. Older records may not be reflected due to tracking behavior.</span>
<span style="padding-left: 20px;">Made with <span style="color: #e74c3c;">&#9829;</span> by <a href="http://cryptkpr.me">Cryptkeeper</a>. Source code available on <a href="https://github.com/Cryptkeeper/Minetrack"><i class="fa fa-github"></i> Github</a>. Older individual server records may not be reflected due to tracking behavior.</span>
</div>

3
assets/js/site.js
View File

@ -292,6 +292,7 @@ $(document).ready(function() {
$('#perc-bar').html('');
$('.mojang-status').css('background', 'transparent');
$('.mojang-status-text').text('');
$("#stat_totalPlayers").text(0);
$("#stat_networks").text(0);
@ -525,7 +526,7 @@ $(document).ready(function() {
var totalPlayers = getCurrentTotalPlayers();
var playerCount = lastPlayerEntries[currentServerHover];
renderTooltip(e.pageX + 10, e.pageY + 10, '<strong>' + currentServerHover + '</strong>: ' + roundToPoint(playerCount / totalPlayers * 100, 10) + '%<br />' + formatNumber(playerCount) + ' of ' + formatNumber(totalPlayers) + ' tracked players.');
renderTooltip(e.pageX + 10, e.pageY + 10, '<strong>' + currentServerHover + '</strong>: ' + roundToPoint(playerCount / totalPlayers * 100, 10) + '% of ' + formatNumber(totalPlayers) + ' tracked players.<br />(' + formatNumber(playerCount) + ' online.)');
}
});

4
assets/js/util.js
View File

@ -118,8 +118,8 @@ function updateMojangServices(currentUpdate) {
var key = keys[i];
var status = lastMojangServiceUpdate[key];
var div = $('#mojang-status_' + status.name);
div.css({background: colorsByStatus[status.title]});
$('#mojang-status_' + status.name).css({background: colorsByStatus[status.title]});
$('#mojang-status-text_' + status.name).text(status.title);
}
}