"Quick Jump" feature along with some European servers

This commit is contained in:
Cryptkeeper 2015-11-25 16:40:13 -06:00
parent 1daa20d5ab
commit f516bc9f15
5 changed files with 78 additions and 14 deletions

8
app.js

@ -42,11 +42,11 @@ function pingAll() {
server.io.sockets.emit('update', networkSnapshot);
// Log our response.
if (!networkHistory[network.ip]) {
networkHistory[network.ip] = [];
if (!networkHistory[network.name]) {
networkHistory[network.name] = [];
}
var _networkHistory = networkHistory[network.ip];
var _networkHistory = networkHistory[network.name];
// Remove our previous data that we don't need anymore.
for (var i = 0; i < _networkHistory.length; i++) {
@ -111,6 +111,8 @@ server.start(function() {
// Remap our associative array into just an array.
var networkHistoryKeys = Object.keys(networkHistory);
networkHistoryKeys.sort();
// Send each individually, this should look cleaner than waiting for one big array to transfer.
for (var i = 0; i < networkHistoryKeys.length; i++) {
client.emit('add', [networkHistory[networkHistoryKeys[i]]]);

@ -140,3 +140,23 @@ h3 {
.text-center-align {
text-align: center;
}
/* Icon Quick jump */
#quick-jump-container {
position: fixed;
top: 10px;
left: 10px;
overflow: auto;
}
.quick-jump-icon {
height: 24px;
width: 24px;
display: block;
margin-bottom: 2px;
border-radius: 2px;
}
.quick-jump-icon:hover {
cursor: pointer;
}

@ -32,6 +32,8 @@
<div id="server-container" class="container"></div>
<div id="quick-jump-container"></div>
<!-- External JS assets -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

@ -1,5 +1,3 @@
var lastMojangServiceUpdate;
var smallChartOptions = {
series: {
shadowSize: 0
@ -32,6 +30,8 @@ var smallChartOptions = {
]
};
var lastMojangServiceUpdate;
var graphs = {};
var lastLatencyEntries = {};
var lastPlayerEntries = {};
@ -156,12 +156,14 @@ function sortServers() {
}
function safeName(name) {
return name.replace(' ', '');
return name.replace(/ /g, '');
}
$(document).ready(function() {
var socket = io.connect();
var mojangServicesUpdater;
var sortServersTask;
socket.on('connect', function() {
$('#tagline-text').text('Loading...');
@ -172,6 +174,10 @@ $(document).ready(function() {
clearInterval(mojangServicesUpdater);
}
if (sortServersTask) {
clearInterval(sortServersTask);
}
$('#tagline').attr('class', 'status-offline');
$('#tagline-text').text('Disconnected! Refresh?');
@ -180,6 +186,7 @@ $(document).ready(function() {
graphs = {};
$('#server-container').html('');
$('#quick-jump-container').html('');
});
socket.on('add', function(servers) {
@ -211,7 +218,7 @@ $(document).ready(function() {
$('<div/>', {
id: safeName(info.name),
class: 'server',
html: '<div class="column" style="width: 80px;">\
html: '<div id="server-' + safeName(info.name) + '" class="column" style="width: 80px;">\
<img style="padding-top: 5px;" id="favicon_' + safeName(info.name) + '">\
<br />\
<p class="text-center-align" style="width: 64px; padding-top: 3px;" id="ranking_' + safeName(info.name) + '"></p>\
@ -234,6 +241,8 @@ $(document).ready(function() {
$('#favicon_' + safeName(info.name)).attr('src', favicon);
$('#quick-jump-container').append('<img id="quick-jump-' + safeName(info.name) + '" data-target-network="' + safeName(info.name) + '" class="quick-jump-icon" src="' + favicon + '">');
graphs[lastEntry.info.name] = {
listing: listing,
plot: $.plot('#chart_' + safeName(info.name), [listing], smallChartOptions)
@ -264,6 +273,7 @@ $(document).ready(function() {
// We have a new favicon, update the old one.
if (update.result && update.result.favicon) {
$('#favicon_' + safeName(update.info.name)).attr('src', update.result.favicon);
$('#quick-jump-' + safeName(update.info.name)).attr('src', update.result.favicon);
}
var graph = graphs[update.info.name];
@ -296,7 +306,17 @@ $(document).ready(function() {
updateMojangServices();
}, 1000);
setInterval(function() {
sortServersTask = setInterval(function() {
sortServers();
}, 30 * 1000);
// Our super fancy scrolly thing!
$(document).on('click', '.quick-jump-icon', function(e) {
var serverName = $(this).attr('data-target-network');
var target = $('#server-' + serverName);
$('html, body').animate({
scrollTop: target.offset().top
}, 100);
});
});

@ -91,8 +91,8 @@
"type": "PC"
},
{
"name": "MCBrawl",
"ip": "mcbrawl.com",
"name": "Brawl",
"ip": "brawl.com",
"type": "PC"
},
{
@ -111,8 +111,8 @@
"type": "PC"
},
{
"name": "DestinyMC",
"ip": "play.thedestinymc.com",
"name": "MCLegends",
"ip": "play.mc-legends.com",
"type": "PC"
},
{
@ -121,14 +121,34 @@
"type": "PC"
},
{
"name": "Minetime",
"ip": "minetime.com",
"name": "Arkham",
"ip": "mc.arkhamnetwork.org",
"type": "PC"
},
{
"name": "VikkCraft",
"ip": "hub.vikkcraft.com",
"type": "PC"
},
{
"name": "GommeHD",
"ip": "gommehd.net",
"type": "PC"
},
{
"name": "Jerry and Harry",
"ip": "play.itsjerryandharry.com",
"type": "PC"
},
{
"name": "Rewinside",
"ip": "mc.rewinside.tv",
"type": "PC"
},
{
"name": "Playminity",
"ip": "mc.playminity.com",
"type": "PC"
}
],
"routes": {